diff --git a/src/main.tsx b/src/main.tsx
index f27e98f..3738b69 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,5 +1,3 @@
-import { StrictMode } from 'react'
-
import { createRoot } from 'react-dom/client'
import './styles/index.scss'
@@ -8,8 +6,4 @@ import '@fontsource/roboto/700.css'
import { App } from './App'
-createRoot(document.getElementById('root')!).render(
-
-
-
-)
+createRoot(document.getElementById('root')!).render()
diff --git a/src/services/auth/auth.service.ts b/src/services/auth/auth.service.ts
index da53d40..f0226e5 100644
--- a/src/services/auth/auth.service.ts
+++ b/src/services/auth/auth.service.ts
@@ -1,7 +1,7 @@
-import { baseApi } from '..'
+import { flashcardsApi } from '..'
import { LoginArgs, User } from './auth.types'
-export const authService = baseApi.injectEndpoints({
+export const authService = flashcardsApi.injectEndpoints({
endpoints: builder => ({
login: builder.mutation({
invalidatesTags: ['Me'],
diff --git a/src/services/base-api.ts b/src/services/base-api.ts
deleted file mode 100644
index b78e007..0000000
--- a/src/services/base-api.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { baseQueryWithReauth } from '@/services/base-query-with-reauth'
-import { createApi } from '@reduxjs/toolkit/query/react'
-
-export const baseApi = createApi({
- baseQuery: baseQueryWithReauth,
- endpoints: () => ({}),
- reducerPath: 'baseApi',
- tagTypes: ['Decks', 'Me'],
-})
diff --git a/src/services/base-query-with-reauth.ts b/src/services/base-query-with-reauth.ts
deleted file mode 100644
index 2fa97fb..0000000
--- a/src/services/base-query-with-reauth.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import {
- BaseQueryFn,
- FetchArgs,
- FetchBaseQueryError,
- fetchBaseQuery,
-} from '@reduxjs/toolkit/query/react'
-import { Mutex } from 'async-mutex'
-
-const mutex = new Mutex()
-
-const baseQuery = fetchBaseQuery({
- baseUrl: 'https://api.flashcards.andrii.es',
- credentials: 'include',
-})
-
-export const baseQueryWithReauth: BaseQueryFn<
- FetchArgs | string,
- unknown,
- FetchBaseQueryError
-> = async (args, api, extraOptions) => {
- await mutex.waitForUnlock()
- let result = await baseQuery(args, api, extraOptions)
-
- if (result.error && result.error.status === 401) {
- if (!mutex.isLocked()) {
- const release = await mutex.acquire()
- // try to get a new token
- const refreshResult = await baseQuery(
- { method: 'POST', url: '/v1/auth/refresh-token' },
- api,
- extraOptions
- )
-
- if (refreshResult.meta?.response?.status === 204) {
- // retry the initial query
- result = await baseQuery(args, api, extraOptions)
- }
- release()
- } else {
- // wait until the mutex is available without locking it
- await mutex.waitForUnlock()
- result = await baseQuery(args, api, extraOptions)
- }
- }
-
- return result
-}
diff --git a/src/services/decks/decks.service.ts b/src/services/decks/decks.service.ts
index 43184ec..c014266 100644
--- a/src/services/decks/decks.service.ts
+++ b/src/services/decks/decks.service.ts
@@ -5,32 +5,15 @@ import {
DecksResponse,
GetDecksArgs,
UpdateDeckArgs,
- baseApi,
} from '@/services'
-import { RootState } from '@/services/store'
import { getValuable } from '@/utils'
-const decksService = baseApi.injectEndpoints({
+import { flashcardsApi } from '../flashcardsApi'
+
+const decksService = flashcardsApi.injectEndpoints({
endpoints: builder => ({
createDeck: builder.mutation({
invalidatesTags: ['Decks'],
- async onQueryStarted(_, { dispatch, getState, queryFulfilled }) {
- const res = await queryFulfilled
-
- for (const { endpointName, originalArgs } of decksService.util.selectInvalidatedBy(
- getState(),
- [{ type: 'Decks' }]
- )) {
- if (endpointName !== 'getDecks') {
- continue
- }
- dispatch(
- decksService.util.updateQueryData(endpointName, originalArgs, draft => {
- draft.items.unshift(res.data)
- })
- )
- }
- },
query: body => ({
body,
method: 'POST',
@@ -61,42 +44,6 @@ const decksService = baseApi.injectEndpoints({
}),
updateDeck: builder.mutation({
invalidatesTags: ['Decks'],
- async onQueryStarted({ id, ...patch }, { dispatch, getState, queryFulfilled }) {
- const state = getState() as RootState
-
- const minCardsCount = state.decks.minCards
- const search = state.decks.search
- const currentPage = state.decks.currentPage
- const maxCardsCount = state.decks.maxCards
- const authorId = state.decks.authorId
-
- const patchResult = dispatch(
- decksService.util.updateQueryData(
- 'getDecks',
- {
- authorId,
- currentPage,
- maxCardsCount,
- minCardsCount,
- name: search,
- },
- draft => {
- const deck = draft.items.find(deck => deck.id === id)
-
- if (!deck) {
- return
- }
- Object.assign(deck, patch)
- }
- )
- )
-
- try {
- await queryFulfilled
- } catch {
- patchResult.undo()
- }
- },
query: ({ id, ...body }) => ({
body,
method: 'PATCH',
diff --git a/src/services/flashcardsApi.ts b/src/services/flashcardsApi.ts
new file mode 100644
index 0000000..f6dc786
--- /dev/null
+++ b/src/services/flashcardsApi.ts
@@ -0,0 +1,14 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+
+export const flashcardsApi = createApi({
+ baseQuery: fetchBaseQuery({
+ baseUrl: 'https://api.flashcards.andrii.es',
+ credentials: 'include',
+ prepareHeaders: headers => {
+ headers.append('x-auth-skip', 'true')
+ },
+ }),
+ endpoints: () => ({}),
+ reducerPath: 'flashcardsApi',
+ tagTypes: ['Decks', 'Me'],
+})
diff --git a/src/services/index.ts b/src/services/index.ts
index a857025..5a2fbf9 100644
--- a/src/services/index.ts
+++ b/src/services/index.ts
@@ -1,2 +1,2 @@
-export * from './base-api'
export * from './decks'
+export { flashcardsApi } from './flashcardsApi'
diff --git a/src/services/store.ts b/src/services/store.ts
index 7e3e2ef..98f62b0 100644
--- a/src/services/store.ts
+++ b/src/services/store.ts
@@ -1,24 +1,18 @@
-import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
-
import { decksSlice } from '@/services/decks/decks.slice'
import { configureStore } from '@reduxjs/toolkit'
import { setupListeners } from '@reduxjs/toolkit/query/react'
-import { baseApi } from './base-api'
+import { flashcardsApi } from './flashcardsApi'
export const store = configureStore({
- middleware: getDefaultMiddleware => getDefaultMiddleware().concat(baseApi.middleware),
+ middleware: getDefaultMiddleware => getDefaultMiddleware().concat(flashcardsApi.middleware),
reducer: {
- [baseApi.reducerPath]: baseApi.reducer,
[decksSlice.name]: decksSlice.reducer,
+ [flashcardsApi.reducerPath]: flashcardsApi.reducer,
},
})
export type AppDispatch = typeof store.dispatch
export type RootState = ReturnType
-// Use throughout your app instead of plain `useDispatch` and `useSelector`
-export const useAppDispatch: () => AppDispatch = useDispatch
-export const useAppSelector: TypedUseSelectorHook = useSelector
-
setupListeners(store.dispatch)