fix engram rtk

frontend/src/App.tsx

@@ -0,0 +1,22 @@
+import { useGetPromocionesQuery } from './app/api/promocionesApi';
+
+export default function App() {
+  const { data: promociones, isLoading, isError, error } = useGetPromocionesQuery();
+
+  if (isLoading) return <div>Cargando promociones...</div>;
+  if (isError) return <div>Error: {JSON.stringify(error)}</div>;
+
+  console.log('Promociones:', promociones);
+
+  return (
+    <div>
+      <h1>Django Core Base</h1>
+      <h2>Promociones</h2>
+      <ul>
+        {promociones?.map((p) => (
+          <li key={p.id}>{p.nombre}</li>
+        ))}
+      </ul>
+    </div>
+  );
+}

frontend/src/app/api/baseApi.ts

@@ -0,0 +1,19 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+
+export const baseApi = createApi({
+  reducerPath: 'baseApi',
+  baseQuery: fetchBaseQuery({
+    baseUrl: 'http://localhost:8000/api/',
+    credentials: 'include',
+    prepareHeaders: (headers) => {
+      const token = localStorage.getItem('token');
+      if (token) {
+        headers.set('Authorization', `Bearer ${token}`);
+      }
+      headers.set('Content-Type', 'application/json');
+      return headers;
+    },
+  }),
+  tagTypes: ['Promociones'],
+  endpoints: () => ({}),
+});

frontend/src/app/api/promocionesApi.ts

@@ -0,0 +1,25 @@
+import { baseApi } from './baseApi';
+
+export interface Promocion {
+  id: number;
+  nombre: string;
+  [key: string]: unknown;
+}
+
+export const promocionesApi = baseApi.injectEndpoints({
+  endpoints: (builder) => ({
+    getPromociones: builder.query<Promocion[], void>({
+      query: () => 'promociones/',
+      providesTags: (result) =>
+        result
+          ? [
+              ...result.map(({ id }) => ({ type: 'Promociones' as const, id })),
+              { type: 'Promociones' as const, id: 'LIST' },
+            ]
+          : [{ type: 'Promociones' as const, id: 'LIST' }],
+    }),
+  }),
+  overrideExisting: false,
+});
+
+export const { useGetPromocionesQuery } = promocionesApi;

frontend/src/app/store.ts

@@ -0,0 +1,16 @@
+import { configureStore } from '@reduxjs/toolkit';
+import { setupListeners } from '@reduxjs/toolkit/query';
+import { baseApi } from './api/baseApi';
+
+export const store = configureStore({
+  reducer: {
+    [baseApi.reducerPath]: baseApi.reducer,
+  },
+  middleware: (getDefaultMiddleware) =>
+    getDefaultMiddleware().concat(baseApi.middleware),
+});
+
+setupListeners(store.dispatch);
+
+export type RootState = ReturnType<typeof store.getState>;
+export type AppDispatch = typeof store.dispatch;

frontend/src/main.tsx

@@ -0,0 +1,13 @@
+import { StrictMode } from 'react';
+import { createRoot } from 'react-dom/client';
+import { Provider } from 'react-redux';
+import { store } from './app/store';
+import App from './App';
+
+createRoot(document.getElementById('root')!).render(
+  <StrictMode>
+    <Provider store={store}>
+      <App />
+    </Provider>
+  </StrictMode>
+);