diff --git a/src/components/App/App.jsx b/src/components/App/App.jsx
index c17cd92..caa3f8e 100644
--- a/src/components/App/App.jsx
+++ b/src/components/App/App.jsx
@@ -6,13 +6,14 @@ import LoginPage from '../../pages/LoginPage/LoginPage';
import RegistrationPage from '../../pages/RegistrationPage/RegistrationPage';
import PrivateRoute from '../../routes/PrivateRoute';
import PublicRoute from '../../routes/PublicRoute';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
import { useEffect } from 'react';
import { currentThunk } from '../../store/auth/thunks';
-
+import Loader from '../Loader/Loader';
import ErrorPage from '../Loader/ErrorPage';
import ForgotPassword from '../../pages/ForgotPassword/ForgotPassword';
import UpdatePassword from '../../pages/UpdatePassword/UpdatePassword';
+import { selectorLoadingSelectorsSlise } from '../../store/loading/LoadingSelectorsSlise';
function App() {
const dispatch = useDispatch();
@@ -20,10 +21,12 @@ function App() {
useEffect(() => {
dispatch(currentThunk());
}, [dispatch]);
- // const loading = useSelector((state) => state.auth.isLoading);
+
+ const loading = useSelector(selectorLoadingSelectorsSlise);
+
return (
<>
- {/* {loading && } */}
+ {loading && }
{/* */}
diff --git a/src/components/Header/Header.jsx b/src/components/Header/Header.jsx
index f00546e..1e0aed6 100644
--- a/src/components/Header/Header.jsx
+++ b/src/components/Header/Header.jsx
@@ -7,13 +7,13 @@ import {
HeaderLink,
} from './Header.styled';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link } from 'react-router-dom';
import HeaderModal from './HeaderModal';
-import { useDispatch, useSelector } from 'react-redux';
+import { useSelector } from 'react-redux';
import { selectUser } from '../../store/auth/selectors';
import { HeaderUserName } from './HeaderModalStyled';
import { useEffect, useState } from 'react';
-import DivSetting from './language/DivSetting';
+import DivSetting from './language/languageSelectorComponent';
import { useTranslation } from 'react-i18next';
import Switch from './ThemeStyled/SwitchTheme/Switch';
import { useMediaQuery } from 'react-responsive';
diff --git a/src/components/Header/HeaderModal.jsx b/src/components/Header/HeaderModal.jsx
index 0789089..b206879 100644
--- a/src/components/Header/HeaderModal.jsx
+++ b/src/components/Header/HeaderModal.jsx
@@ -28,7 +28,7 @@ import { useNavigate } from 'react-router';
import { toast } from 'react-toastify';
import { selectUser } from '../../store/auth/selectors';
import { useTranslation } from 'react-i18next';
-import DivSetting from './language/DivSetting';
+import DivSetting from './language/languageSelectorComponent';
import { useMediaQuery } from 'react-responsive';
const HeaderModal = () => {
diff --git a/src/components/Header/language/Jsonlanguage/italian.json b/src/components/Header/language/Jsonlanguage/italian.json
index 965969f..8891b71 100644
--- a/src/components/Header/language/Jsonlanguage/italian.json
+++ b/src/components/Header/language/Jsonlanguage/italian.json
@@ -2,7 +2,7 @@
"chooseAvalue": "Scegli un valore:",
"today": "Oggi",
"yourPhoto": "La tua foto",
- "yourGenderIdentity": "La tua identità di genere",
+ "yourGenderIdentity": "Seleziona il tuo sesso",
"woman": "Donna",
"man": "Uomo",
"yourName": "Il tuo nome",
diff --git a/src/components/Header/language/DivSetting.jsx b/src/components/Header/language/languageSelectorComponent.jsx
similarity index 100%
rename from src/components/Header/language/DivSetting.jsx
rename to src/components/Header/language/languageSelectorComponent.jsx
diff --git a/src/components/Layout/Layout.jsx b/src/components/Layout/Layout.jsx
index 97651db..3a833a3 100644
--- a/src/components/Layout/Layout.jsx
+++ b/src/components/Layout/Layout.jsx
@@ -12,7 +12,6 @@ import {
import { ThemeProvider } from 'styled-components';
import { useEffect, useState } from 'react';
-import Switch from '../Header/ThemeStyled/SwitchTheme/Switch.jsx';
const Layout = () => {
const storedTheme = localStorage.getItem('theme');
diff --git a/src/components/Loader/ErrorPage.jsx b/src/components/Loader/ErrorPage.jsx
index bf4ea41..276100e 100644
--- a/src/components/Loader/ErrorPage.jsx
+++ b/src/components/Loader/ErrorPage.jsx
@@ -72,9 +72,11 @@ const TextSpan2 = styled.span`
`;
const ContainerErrorDiv = styled.div`
+ width: 100%;
+ height: 100%;
+ background-color: #020311;
display: flex;
justify-content: center;
- padding-top: 50px;
`;
const ErrorPage = () => {
@@ -98,39 +100,43 @@ const ErrorPage = () => {
return (
<>
-
- You will be redirected to the main page in {redirectTimer} seconds
-
+ {/* You will be redirected to the main page in 15 seconds
*/}
-
-
-
-
-
-
-
-
-
-
- Sorry
- This page is temporarily unavailable
-
-
-
+ >
+
+
+
+
+ Sorry
+
+ This page is temporarily unavailable {setRedirectTimer}
+
+
+
+
+
+
);
};
diff --git a/src/images/AuthImg/BottleSVG.jsx b/src/images/AuthImg/BottleSVG.jsx
index 391cc2e..30fbcc9 100644
--- a/src/images/AuthImg/BottleSVG.jsx
+++ b/src/images/AuthImg/BottleSVG.jsx
@@ -1,4 +1,3 @@
-import * as React from 'react';
import { useTheme } from 'styled-components';
const BottleSVG = (props) => {
diff --git a/src/store/loading/LoadingSelectorsSlise.js b/src/store/loading/LoadingSelectorsSlise.js
new file mode 100644
index 0000000..bdc794b
--- /dev/null
+++ b/src/store/loading/LoadingSelectorsSlise.js
@@ -0,0 +1 @@
+export const selectorLoadingSelectorsSlise = (state) => state.loader.loading;
diff --git a/src/store/loading/loadingSlice.js b/src/store/loading/loadingSlice.js
new file mode 100644
index 0000000..980c775
--- /dev/null
+++ b/src/store/loading/loadingSlice.js
@@ -0,0 +1,60 @@
+import { createSlice, isAnyOf } from '@reduxjs/toolkit';
+import {
+ currentThunk,
+ logoutThunk,
+ updateAvatarThunk,
+ updateUserThunk,
+ forgotThunk,
+ updatePasswordThunk,
+} from '../auth/thunks.js';
+
+const loadingSlice = createSlice({
+ name: 'loader',
+ initialState: {
+ loading: false,
+ },
+ extraReducers: (builder) => {
+ builder
+ .addMatcher(
+ isAnyOf(
+ currentThunk.pending,
+ logoutThunk.pending,
+ updateAvatarThunk.pending,
+ updateUserThunk.pending,
+ forgotThunk.pending,
+ updatePasswordThunk.pending
+ ),
+ (state) => {
+ state.loading = true;
+ }
+ )
+ .addMatcher(
+ isAnyOf(
+ currentThunk.rejected,
+ logoutThunk.rejected,
+ updateAvatarThunk.rejected,
+ updateUserThunk.rejected,
+ forgotThunk.rejected,
+ updatePasswordThunk.rejected
+ ),
+ (state) => {
+ state.loading = false;
+ }
+ )
+ .addMatcher(
+ isAnyOf(
+ currentThunk.fulfilled,
+ logoutThunk.fulfilled,
+ updateAvatarThunk.fulfilled,
+ updateUserThunk.fulfilled,
+ forgotThunk.fulfilled,
+ updatePasswordThunk.fulfilled
+ ),
+ (state) => {
+ state.loading = false;
+ }
+ );
+ },
+});
+
+export const loadingReducer = loadingSlice.reducer;
diff --git a/src/store/store.js b/src/store/store.js
index 1542835..649cc74 100644
--- a/src/store/store.js
+++ b/src/store/store.js
@@ -13,7 +13,7 @@ import {
} from 'redux-persist';
import storage from 'redux-persist/lib/storage'; // defaults to localStorage for web
import { waterReducer } from './water/waterSlice';
-
+import { loadingReducer } from './loading/loadingSlice';
const persistConfig = {
key: 'root',
storage,
@@ -27,6 +27,7 @@ export const store = configureStore({
auth: persistedReducer,
//Добавляем сюда свои редьюсеры!)
waterSlice: waterReducer,
+ loader: loadingReducer,
},
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({