diff --git a/.env.sample b/.env.sample
index 5b853d5..b75b811 100644
--- a/.env.sample
+++ b/.env.sample
@@ -10,3 +10,4 @@ DOCKER_BUILDKIT=1 #Build only stages required for target
COMPOSE_FILE=docker-compose.yml:docker-compose.dev.yml
VITE_AUTH_URL='https://ya-praktikum.tech/api/v2'
VITE_SRC_URL='https://ya-praktikum.tech/api/v2/resources'
+VITE_AUTH_PATHNAMES='/sign-in, /sign-up'
diff --git a/packages/client/src/components/hoc/withAuthUser.tsx b/packages/client/src/components/hoc/withAuthUser.tsx
index a92027e..596fc50 100644
--- a/packages/client/src/components/hoc/withAuthUser.tsx
+++ b/packages/client/src/components/hoc/withAuthUser.tsx
@@ -1,9 +1,10 @@
import { ComponentType, useEffect } from 'react'
-import { actions, getUser, UserType } from '@/store/reducers/auth-reducer'
+import { UserType } from '@/store/reducers/auth-reducer'
import { toast } from 'react-toastify'
import { useNavigate, useLocation } from 'react-router-dom'
import { RootState, useAppDispatch } from '@/store'
import { useSelector } from 'react-redux'
+import { userService } from '@/services/userService'
type WithAuthUserProps = {
userIsLogged: boolean
@@ -18,42 +19,36 @@ export default function withAuthUser
(
const user = useSelector(
state => state.authReducer.user
)
- const userIsLogged = window.sessionStorage.getItem('userIsLogged') === '1'
+ const userIsLogged = userService.isLoggedIn()
const navigate = useNavigate()
const dispatch = useAppDispatch()
- const location = useLocation()
- const { pathname } = location
+ const { pathname } = useLocation()
+ const isAuthPath = import.meta.env.VITE_AUTH_PATHNAMES.split(', ').includes(
+ pathname
+ )
+
+ const handleAuthentication = async () => {
+ const isAuthenticated = await userService.fetchUser(dispatch)
- const successAuth = (redirectTo: string) => {
- toast.success('Вы уже авторизованы')
- navigate(redirectTo)
+ if (!isAuthenticated && !isAuthPath) {
+ toast.error('Необходимо авторизоваться', { autoClose: 1500 })
+ navigate('/sign-in')
+ }
}
useEffect(() => {
if (!userIsLogged || user === null) {
- dispatch(getUser())
- .unwrap()
- .then(data => {
- dispatch(actions.setUser(data))
- window.sessionStorage.setItem('userIsLogged', '1') // 0
-
- if (redirectTo) {
- successAuth(redirectTo)
- }
- })
- .catch(() => {
- window.sessionStorage.setItem('userIsLogged', '0') // 1
-
- if (!['/sign-in', '/sign-up'].includes(pathname)) {
- toast.error('Необходимо авторизоваться')
- navigate('/sign-in')
- }
- })
+ handleAuthentication()
} else if (redirectTo) {
- successAuth(redirectTo)
+ toast.success('Вы уже авторизованы', { autoClose: 1500 })
+ navigate(redirectTo)
}
}, [user, userIsLogged])
- return
+ if (userIsLogged || isAuthPath) {
+ return
+ }
+
+ return Загрузка...
}
}
diff --git a/packages/client/src/layouts/PrivateLayout/PrivateLayout.tsx b/packages/client/src/layouts/PrivateLayout/PrivateLayout.tsx
index 55d6143..63aa846 100644
--- a/packages/client/src/layouts/PrivateLayout/PrivateLayout.tsx
+++ b/packages/client/src/layouts/PrivateLayout/PrivateLayout.tsx
@@ -3,19 +3,14 @@ import { Outlet } from 'react-router-dom'
import withAuthUser from '@/components/hoc/withAuthUser'
import './PrivateLayout.scss'
-const PrivateLayout = (props: any & { userIsLogged: boolean }) => {
- const { userIsLogged } = props
-
- if (userIsLogged) {
- return (
-
-
-
-
-
-
- )
- }
- return Загрузка...
+const PrivateLayout = () => {
+ return (
+
+
+
+
+
+
+ )
}
export default withAuthUser(PrivateLayout)
diff --git a/packages/client/src/services/userService.tsx b/packages/client/src/services/userService.tsx
new file mode 100644
index 0000000..926d3ed
--- /dev/null
+++ b/packages/client/src/services/userService.tsx
@@ -0,0 +1,20 @@
+import { actions, UserType, getUser } from '@/store/reducers/auth-reducer'
+import { useAppDispatch } from '@/store'
+
+export const userService = {
+ async fetchUser(dispatch: ReturnType) {
+ try {
+ const data: UserType = await dispatch(getUser()).unwrap()
+ dispatch(actions.setUser(data))
+ window.sessionStorage.setItem('userIsLogged', '1')
+ return true
+ } catch {
+ window.sessionStorage.setItem('userIsLogged', '0')
+ return false
+ }
+ },
+
+ isLoggedIn() {
+ return window.sessionStorage.getItem('userIsLogged') === '1'
+ },
+}
diff --git a/packages/client/src/store/reducers/auth-reducer.ts b/packages/client/src/store/reducers/auth-reducer.ts
index c02cb55..7f9cc30 100644
--- a/packages/client/src/store/reducers/auth-reducer.ts
+++ b/packages/client/src/store/reducers/auth-reducer.ts
@@ -1,5 +1,5 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit'
-import { AppDispatch, InferAppActions } from '@/store'
+import { InferAppActions } from '@/store'
import backendApi from '@/api/backendApi'
export type UserType = {