Merge pull request #42 from exortme1ster/hotfix/frontend-cleaning

Hotfix/frontend cleaning
nmashchenko · May 23, 2023 · 199cb6e · 199cb6e
2 parents 9555af4 + 06ca1b2
commit 199cb6e
Show file tree

Hide file tree

Showing 311 changed files with 2,560 additions and 4,316 deletions.
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/package.json b/client/package.json
@@ -30,6 +30,7 @@
     "react-country-flag": "^3.0.2",
     "react-dom": "^18.2.0",
     "react-dropzone": "^14.2.3",
+    "react-hot-toast": "^2.4.1",
     "react-loader-spinner": "^5.3.4",
     "react-loading-skeleton": "^3.1.0",
     "react-query": "^3.39.2",

diff --git a/client/public/index.html b/client/public/index.html
@@ -26,7 +26,7 @@
     -->
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet">
     <title>Teameights</title>
   </head>
   <body>

diff --git a/client/src/App.js b/client/src/App.js
@@ -1,5 +1,6 @@
 // * Routes
 // * Modules
+import { Toaster } from 'react-hot-toast'
 import { BrowserRouter as Router } from 'react-router-dom'
 import { GoogleOAuthProvider } from '@react-oauth/google'
 
@@ -11,6 +12,7 @@ function App() {
   return (
     <>
       <GoogleOAuthProvider clientId={process.env.REACT_APP_GOOGLE_API_OAUTH_TOKEN}>
+        <Toaster />
         <Router>{routes}</Router>
       </GoogleOAuthProvider>
     </>

diff --git a/client/src/api/hooks/auth/useCheckAuth.js b/client/src/api/hooks/auth/useCheckAuth.js
@@ -3,6 +3,7 @@ import { useQuery } from 'react-query'
 import { useDispatch } from 'react-redux'
 
 import http from '../../../http'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
 import { userAuth } from '../../../store/reducers/UserAuth'
 
 const { api } = http
@@ -22,7 +23,8 @@ export const useCheckAuth = () => {
       }
     },
     onError: (error) => {
-      dispatch(userAuth.actions.authUserError(error.response?.data?.message))
+      // set error message
+      errorToaster(error)
     },
     refetchOnMount: false,
     refetchOnWindowFocus: false,

diff --git a/client/src/api/hooks/auth/useEditUserDetails.js b/client/src/api/hooks/auth/useEditUserDetails.js
@@ -1,16 +1,11 @@
-import React from 'react'
 import { useMutation, useQueryClient } from 'react-query'
-import { useDispatch } from 'react-redux'
 
 import http from '../../../http'
-import { registrationAuth } from '../../../store/reducers/RegistrationAuth'
-
-import { useUpdateAvatar } from './useUpdateAvatar'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
 
 const { api } = http
 
 export const useEditUserDetails = (successHandler) => {
-  const dispatch = useDispatch()
   const queryClient = useQueryClient()
 
   const finishRegistration = async (userData) => {
@@ -25,7 +20,7 @@ export const useEditUserDetails = (successHandler) => {
     },
     onError: (error) => {
       // set error message
-      dispatch(registrationAuth.actions.finishRegistrationError(error.response?.data?.message))
+      errorToaster(error)
     },
   })
 }
diff --git a/client/src/api/hooks/auth/useLoginUser.js b/client/src/api/hooks/auth/useLoginUser.js
@@ -5,6 +5,7 @@ import { useNavigate } from 'react-router-dom'
 
 import ROUTES from '../../../constants/routes'
 import http from '../../../http'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
 import { setIsFinishRegistrationStarted } from '../../../store/reducers/RegistrationAuth'
 import { userAuth } from '../../../store/reducers/UserAuth'
 
@@ -45,7 +46,7 @@ export const useLoginUser = (type) => {
     },
     onError: (error) => {
       // set error message
-      dispatch(userAuth.actions.authUserError(error.response?.data?.message))
+      errorToaster(error)
     },
   })
 }
diff --git a/client/src/api/hooks/auth/useLogoutUser.js b/client/src/api/hooks/auth/useLogoutUser.js
@@ -1,8 +1,8 @@
-import React from 'react'
 import { useMutation, useQueryClient } from 'react-query'
 import { useDispatch } from 'react-redux'
 
 import http from '../../../http'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
 import { userAuth } from '../../../store/reducers/UserAuth'
 
 const { api } = http
@@ -33,7 +33,7 @@ export const useLogoutUser = () => {
     },
     onError: (error) => {
       // set error message
-      dispatch(userAuth.actions.authUserError(error.response?.data?.message))
+      errorToaster(error)
     },
   })
 }
diff --git a/client/src/api/hooks/auth/useRegister.js b/client/src/api/hooks/auth/useRegister.js
@@ -5,6 +5,7 @@ import { useNavigate } from 'react-router-dom'
 
 import ROUTES from '../../../constants/routes'
 import http from '../../../http'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
 import { userAuth } from '../../../store/reducers/UserAuth'
 
 const { api } = http
@@ -30,7 +31,7 @@ export const useRegister = () => {
     },
     onError: (error) => {
       // set error message
-      dispatch(userAuth.actions.authUserError(error.response?.data?.message))
+      errorToaster(error)
     },
   })
 }
diff --git a/client/src/api/hooks/auth/useUpdateAvatar.js b/client/src/api/hooks/auth/useUpdateAvatar.js
@@ -1,14 +1,12 @@
-import React from 'react'
 import { useMutation, useQueryClient } from 'react-query'
 import { useDispatch } from 'react-redux'
 
 import http from '../../../http'
-import { registrationAuth } from '../../../store/reducers/RegistrationAuth'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
 
 const { api } = http
 
 export const useUpdateAvatar = (type) => {
-  const dispatch = useDispatch()
   const queryClient = useQueryClient()
 
   const updateUserAvatar = async (userData) => {
@@ -21,8 +19,9 @@ export const useUpdateAvatar = (type) => {
       queryClient.invalidateQueries('checkAuth', { refetchInactive: true })
     },
     onError: (error) => {
+      console.log(error)
       // set error message
-      dispatch(registrationAuth.actions.finishRegistrationError(error.response?.data?.message))
+      errorToaster(error)
     },
   })
 }
diff --git a/client/src/api/hooks/auth/useValidateUsername.js b/client/src/api/hooks/auth/useValidateUsername.js
@@ -1,32 +1,27 @@
-import React from 'react'
-import { useQuery } from 'react-query'
-import { useDispatch } from 'react-redux'
+import { useMutation, useQuery, useQueryClient } from 'react-query'
 
 import http from '../../../http'
-import {
-  finishRegistrationError,
-  setActiveState,
-  setStageOneCompleted,
-  setStep,
-} from '../../../store/reducers/RegistrationAuth'
+import { errorToaster } from '../../../shared/components/Toasters/Error.toaster'
+import { successToaster } from '../../../shared/components/Toasters/Success.toaster'
 
 const { api } = http
 
-export const useValidateUsername = (username, email) => {
-  const dispatch = useDispatch()
-  const validateUsername = async () => {
-    return await api.get('/check-username', { params: { username, email } })
+export const useValidateUsername = () => {
+  const queryClient = useQueryClient()
+
+  const validateUsername = async (username) => {
+    return await api.get(`/users/get-by-username/${username}`)
   }
 
-  return useQuery('validateUsername', validateUsername, {
-    onSuccess: () => {
-      dispatch(setActiveState('UserConcentration'))
-      dispatch(setStep(2))
-      dispatch(setStageOneCompleted(true))
-    },
-    onError: (error) => {
-      dispatch(finishRegistrationError(error.response?.data?.message))
+  return useMutation(validateUsername, {
+    mutationKey: 'validateUsername',
+    onSuccess: async (response) => {
+      console.log(response)
+      if (response?.data) {
+        errorToaster('Username is already taken by another user, please change it!')
+      } else {
+        successToaster('Username is available!')
+      }
     },
-    enabled: false,
   })
 }
diff --git a/client/src/api/hooks/sidebar/useChangeMessageStatus.js b/client/src/api/hooks/sidebar/useChangeMessageStatus.js
@@ -25,7 +25,7 @@ export const useChangeMessageStatus = (teamId) => {
       queryClient.invalidateQueries('checkAuth', { refetchInactive: true })
       if (decision === 'accept') {
         queryClient.invalidateQueries(['getTeamById', teamId], { refetchInactive: true })
-        navigate('/myteam')
+        navigate(`/team/${teamId}`)
       }
     },
     onError: (error) => {