Update libs

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);
   }

src/renderer/lib/index.ts

@@ -1,2 +0,0 @@
-export * from './axios';
-export * from './queryClient';

src/renderer/lib/queryClient.ts

@@ -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<FnType extends (...args: any) => any> =
-  PromiseValue<ReturnType<FnType>>;
-
-export type QueryConfig<QueryFnType extends (...args: any) => any> = Omit<
-  UseQueryOptions<ExtractFnReturnType<QueryFnType>>,
-  'queryKey' | 'queryFn'
->;
-
-export type MutationConfig<MutationFnType extends (...args: any) => any> =
-  UseMutationOptions<
-    ExtractFnReturnType<MutationFnType>,
-    AxiosError,
-    Parameters<MutationFnType>[0]
-  >;

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<FnType extends (...args: any) => any> =
+  PromiseValue<ReturnType<FnType>>;
+
+export type QueryConfig<QueryFnType extends (...args: any) => any> = Omit<
+  UseQueryOptions<ExtractFnReturnType<QueryFnType>>,
+  'queryKey' | 'queryFn'
+>;
+
+export type MutationConfig<MutationFnType extends (...args: any) => any> =
+  UseMutationOptions<
+    ExtractFnReturnType<MutationFnType>,
+    AxiosError,
+    Parameters<MutationFnType>[0]
+  >;
+
+export type QueryOptions<TResponse> = {
+  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;
+};