Split SnippetsContext into separate files

Author: pawelmalak

client/src/store/SnippetsContext.tsx

@@ -0,0 +1,33 @@
+import { User, UserWithRole, Response } from '../../../typescript/interfaces';
+import React from 'react';
+import axios from 'axios';
+import { authErrorHandler } from '../../../utils';
+
+interface Params {
+  token: string;
+  setIsAuthenticated: (v: React.SetStateAction<boolean>) => void;
+  setUser: (v: React.SetStateAction<UserWithRole | null>) => void;
+}
+
+export const getUserProfile = async (params: Params) => {
+  const { token, setIsAuthenticated, setUser } = params;
+
+  try {
+    const res = await axios.get<Response<User>>('/api/auth/me', {
+      headers: {
+        Authorization: `Bearer ${token}`
+      }
+    });
+
+    const { ...user } = res.data.data;
+
+    setUser({
+      ...user,
+      isAdmin: user.role === 'admin'
+    });
+
+    setIsAuthenticated(true);
+  } catch (err) {
+    authErrorHandler({ err, setIsAuthenticated, setUser });
+  }
+};

client/src/store/auth/actions/getUserProfile.ts

@@ -1,3 +1,4 @@
 export * from './registerUser';
 export * from './loginUser';
 export * from './logoutUser';
+export * from './getUserProfile';

client/src/store/auth/actions/index.ts

@@ -1,5 +1,5 @@
 import { User, Response, UserWithRole } from '../../../typescript/interfaces';
-import { errorHandler } from '../../../utils';
+import { authErrorHandler } from '../../../utils';
 import axios from 'axios';
 import React from 'react';
 
@@ -31,9 +31,7 @@ export const loginUser = async (params: Params) => {
     localStorage.setItem('token', resToken);
 
     setIsAuthenticated(true);
-
-    // redirect to snippets? / home?
   } catch (err) {
-    errorHandler(err);
+    authErrorHandler({ err, setIsAuthenticated, setUser });
   }
 };

client/src/store/auth/actions/loginUser.ts

@@ -1,5 +1,5 @@
 import { User, Response, UserWithRole } from '../../../typescript/interfaces';
-import { errorHandler } from '../../../utils';
+import { authErrorHandler } from '../../../utils';
 import axios from 'axios';
 import React from 'react';
 
@@ -32,6 +32,6 @@ export const registerUser = async (params: Params) => {
 
     setIsAuthenticated(true);
   } catch (err) {
-    errorHandler(err);
+    authErrorHandler({ err, setIsAuthenticated, setUser });
   }
 };

client/src/store/auth/actions/registerUser.ts

@@ -1,24 +1,12 @@
-import { createContext, ReactNode, useState } from 'react';
-import axios from 'axios';
+import { ReactNode, useState } from 'react';
+import { AuthContext } from '..';
 
-import { loginUser, logoutUser, registerUser } from './actions';
+import { getUserProfile, loginUser, logoutUser, registerUser } from './actions';
 
 import {
   AuthContext as Context,
-  Response,
-  User,
   UserWithRole
 } from '../../typescript/interfaces';
-import { errorHandler } from '../../utils';
-
-export const AuthContext = createContext<Context>({
-  isAuthenticated: false,
-  user: null,
-  autoLogin: () => {},
-  login: () => {},
-  logout: () => {},
-  register: () => {}
-});
 
 interface Props {
   children: ReactNode;
@@ -47,17 +35,7 @@ export const AuthContextProvider = (props: Props): JSX.Element => {
   };
 
   const getProfile = async (token: string) => {
-    try {
-      const res = await axios.get<Response<User>>('/api/auth/me', {
-        headers: {
-          Authorization: `Bearer ${token}`
-        }
-      });
-
-      console.log(res.data.data);
-    } catch (err) {
-      errorHandler(err);
-    }
+    await getUserProfile({ token, setIsAuthenticated, setUser });
   };
 
   const context: Context = {

client/src/store/auth/index.tsx

@@ -0,0 +1,33 @@
+import { createContext } from 'react';
+
+import {
+  SnippetsContext as SnippetsContextInterface,
+  AuthContext as AuthContextInterface,
+  NewSnippet,
+  SearchQuery
+} from '../typescript/interfaces';
+
+export const SnippetsContext = createContext<SnippetsContextInterface>({
+  snippets: [],
+  searchResults: [],
+  currentSnippet: null,
+  tagCount: [],
+  getSnippets: () => {},
+  getSnippetById: (id: number) => {},
+  setSnippet: (id: number) => {},
+  createSnippet: (snippet: NewSnippet) => {},
+  updateSnippet: (snippet: NewSnippet, id: number, isLocal?: boolean) => {},
+  deleteSnippet: (id: number) => {},
+  toggleSnippetPin: (id: number) => {},
+  countTags: () => {},
+  searchSnippets: (query: SearchQuery) => {}
+});
+
+export const AuthContext = createContext<AuthContextInterface>({
+  isAuthenticated: false,
+  user: null,
+  autoLogin: () => {},
+  login: () => {},
+  logout: () => {},
+  register: () => {}
+});

client/src/store/contexts.ts

@@ -1,2 +1,3 @@
-export * from './SnippetsContext';
+export * from './snippets';
 export * from './auth';
+export * from './contexts';

client/src/store/index.ts

@@ -0,0 +1,29 @@
+import { SetStateAction } from 'react';
+import { errorHandler } from '../../../utils';
+import { Response, TagCount } from '../../../typescript/interfaces';
+import axios from 'axios';
+
+interface Params {
+  setTagCount: (v: SetStateAction<TagCount[]>) => void;
+}
+
+export const countTagsAction = async (params: Params) => {
+  const { setTagCount } = params;
+
+  const token = `Bearer ${localStorage.token}`;
+
+  try {
+    const res = await axios.get<Response<TagCount[]>>(
+      '/api/snippets/statistics/count',
+      {
+        headers: {
+          Authorization: token
+        }
+      }
+    );
+
+    setTagCount(res.data.data);
+  } catch (err) {
+    errorHandler(err);
+  }
+};