lesson 3 in progress

src/router.tsx

@@ -1,14 +1,43 @@
-import { createBrowserRouter, RouteObject, RouterProvider } from 'react-router-dom'
+import {
+  createBrowserRouter,
+  Navigate,
+  Outlet,
+  RouteObject,
+  RouterProvider,
+} from 'react-router-dom'
 
-const routes: RouteObject[] = [
+import { useGetDecksQuery } from '@/services/base-api'
+
+const publicRoutes: RouteObject[] = [
+  {
+    path: '/login',
+    element: <div>login</div>,
+  },
+]
+
+const privateRoutes: RouteObject[] = [
   {
     path: '/',
     element: <div>hello</div>,
   },
 ]
-
-const router = createBrowserRouter(routes)
+const router = createBrowserRouter([
+  {
+    element: <PrivateRoutes />,
+    children: privateRoutes,
+  },
+  ...publicRoutes,
+])
 
 export const Router = () => {
+  const result = useGetDecksQuery()
+
+  console.log(result)
+
   return <RouterProvider router={router} />
 }
+function PrivateRoutes() {
+  const isAuthenticated = false
+
+  return isAuthenticated ? <Outlet /> : <Navigate to="/login" />
+}

src/services/auth/index.ts

@@ -1 +0,0 @@
-export * from './auth.ts'

src/services/base-api.ts

@@ -1,9 +1,9 @@
 import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
 
-export const api = createApi({
-  reducerPath: 'api',
+export const baseApi = createApi({
+  reducerPath: 'baseApi',
   baseQuery: fetchBaseQuery({
-    baseUrl: 'http://localhost:3333',
+    baseUrl: 'https://api.flashcards.andrii.es',
     credentials: 'include',
     prepareHeaders: headers => {
       headers.append('x-auth-skip', 'true')
@@ -11,11 +11,11 @@ export const api = createApi({
   }),
   endpoints: builder => {
     return {
-      getMe: builder.query<any, void>({
+      getDecks: builder.query<any, void>({
         query: () => `v1/decks`,
       }),
     }
   },
 })
 
-export const { useGetMeQuery } = api
+export const { useGetDecksQuery } = baseApi

src/services/store.ts

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