From 781adb7c4d09f9e1fc2c3b6f7bbedd796d65ef33 Mon Sep 17 00:00:00 2001 From: jeffvli Date: Mon, 24 Oct 2022 22:30:49 -0700 Subject: [PATCH] Update libs --- src/renderer/lib/axios.ts | 43 ++++++++++++++------- src/renderer/lib/index.ts | 2 - src/renderer/lib/queryClient.ts | 33 ---------------- src/renderer/lib/react-query.ts | 68 +++++++++++++++++++++++++++++++++ 4 files changed, 98 insertions(+), 48 deletions(-) delete mode 100644 src/renderer/lib/index.ts delete mode 100644 src/renderer/lib/queryClient.ts create mode 100644 src/renderer/lib/react-query.ts diff --git a/src/renderer/lib/axios.ts b/src/renderer/lib/axios.ts index f9c8a9020..7a7090529 100644 --- a/src/renderer/lib/axios.ts +++ b/src/renderer/lib/axios.ts @@ -1,23 +1,23 @@ /* eslint-disable no-underscore-dangle */ import Axios from 'axios'; -import { authApi } from '../api/authApi'; +import { authApi } from '../api/auth.api'; -export const api = Axios.create({ +export const ax = Axios.create({ headers: { 'Content-Type': 'application/json', }, withCredentials: false, }); -api.interceptors.request.use( +ax.interceptors.request.use( (config) => { - const { serverUrl, accessToken } = JSON.parse( + const { state } = JSON.parse( localStorage.getItem('authentication') || '{}' ); - config.baseURL = `${serverUrl}/api`; + config.baseURL = `${state.serverUrl}/api`; config.headers = { - Authorization: `Bearer ${accessToken}`, + Authorization: `Bearer ${state.accessToken}`, 'Content-Type': 'application/json', }; return config; @@ -26,27 +26,28 @@ api.interceptors.request.use( return Promise.reject(error); } ); -api.interceptors.response.use( + +ax.interceptors.response.use( (res) => { return res; }, async (err) => { if (err.response && err.response.status === 401) { const { config } = err; + const auth = JSON.parse(localStorage.getItem('authentication') || '{}'); + if (err.response.data.error.message === 'jwt expired' && !config.sent) { config.sent = true; - const auth = JSON.parse(localStorage.getItem('authentication') || '{}'); - const { accessToken } = ( - await authApi.refresh(auth.serverUrl, { + await authApi.refresh(auth.state.serverUrl, { refreshToken: auth.refreshToken, }) ).data; localStorage.setItem( 'authentication', - JSON.stringify({ ...auth, accessToken }) + JSON.stringify({ ...auth, state: { ...auth.state, accessToken } }) ); config.headers = { @@ -57,8 +58,24 @@ api.interceptors.response.use( return Axios(config); } - localStorage.setItem('authentication', '{}'); - window.location.reload(); + localStorage.setItem( + 'authentication', + JSON.stringify({ + ...auth, + state: { ...auth.state, accessToken: '', refreshToken: '' }, + }) + ); + + if (err.response.data.error.message === 'No auth token') { + localStorage.setItem( + 'authentication', + JSON.stringify({ + ...auth, + state: { ...auth.state, accessToken: '', refreshToken: '' }, + }) + ); + // window.location.reload(); + } } return Promise.reject(err); } diff --git a/src/renderer/lib/index.ts b/src/renderer/lib/index.ts deleted file mode 100644 index 7c4d75c2f..000000000 --- a/src/renderer/lib/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from './axios'; -export * from './queryClient'; diff --git a/src/renderer/lib/queryClient.ts b/src/renderer/lib/queryClient.ts deleted file mode 100644 index 7c38f955c..000000000 --- a/src/renderer/lib/queryClient.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { AxiosError } from 'axios'; -import { - QueryClient, - UseQueryOptions, - UseMutationOptions, - DefaultOptions, -} from 'react-query'; -import { PromiseValue } from 'type-fest'; - -const queryConfig: DefaultOptions = { - queries: { - refetchOnWindowFocus: false, - retry: false, - useErrorBoundary: true, - }, -}; - -export const queryClient = new QueryClient({ defaultOptions: queryConfig }); - -export type ExtractFnReturnType any> = - PromiseValue>; - -export type QueryConfig any> = Omit< - UseQueryOptions>, - 'queryKey' | 'queryFn' ->; - -export type MutationConfig any> = - UseMutationOptions< - ExtractFnReturnType, - AxiosError, - Parameters[0] - >; diff --git a/src/renderer/lib/react-query.ts b/src/renderer/lib/react-query.ts new file mode 100644 index 000000000..387596b1c --- /dev/null +++ b/src/renderer/lib/react-query.ts @@ -0,0 +1,68 @@ +import { + QueryClient, + UseQueryOptions, + UseMutationOptions, + DefaultOptions, + QueryCache, +} from '@tanstack/react-query'; +import { AxiosError } from 'axios'; +import { PromiseValue } from 'type-fest'; +import { toast } from '@/renderer/components'; + +const queryCache = new QueryCache({ + onError: (error: any, query) => { + if (query.state.data !== undefined) { + toast.show({ message: `${error.message}`, type: 'error' }); + } + }, +}); + +const queryConfig: DefaultOptions = { + mutations: { + retry: process.env.NODE_ENV === 'production', + }, + queries: { + cacheTime: 1000 * 60 * 15, + onError: (err) => { + console.error(err); + }, + refetchOnWindowFocus: process.env.NODE_ENV === 'production', + retry: process.env.NODE_ENV === 'production', + staleTime: 1000 * 5, + useErrorBoundary: true, + }, +}; + +export const queryClient = new QueryClient({ + defaultOptions: queryConfig, + queryCache, +}); + +export type ExtractFnReturnType any> = + PromiseValue>; + +export type QueryConfig any> = Omit< + UseQueryOptions>, + 'queryKey' | 'queryFn' +>; + +export type MutationConfig any> = + UseMutationOptions< + ExtractFnReturnType, + AxiosError, + Parameters[0] + >; + +export type QueryOptions = { + cacheTime?: UseQueryOptions['cacheTime']; + enabled?: UseQueryOptions['enabled']; + onError?: (err: any) => void; + onSuccess?: (data: TResponse) => void; + refetchInterval?: number; + refetchIntervalInBackground?: UseQueryOptions['refetchIntervalInBackground']; + refetchOnWindowFocus?: boolean; + retry?: UseQueryOptions['retry']; + retryDelay?: UseQueryOptions['retryDelay']; + staleTime?: UseQueryOptions['staleTime']; + useErrorBoundary?: any; +};