Переписываю спорные решения

src/components/Candidate/Candidate.js

@@ -4,7 +4,6 @@ import {useSelector, useDispatch} from 'react-redux'
 import {
   currentCandidate,
   selectCurrentCandidate,
-  auth
 } from '../../redux/outstaffingSlice'
 import {getRole} from '../../redux/roleSlice'
 import {useState} from 'react'
@@ -16,10 +15,11 @@ import SkillSection from '../SkillSection/SkillSection'
 import front from '../../images/front_end.png'
 import back from '../../images/back_end.png'
 import design from '../../images/design.png'
-import {fetchGet} from '../../server/server'
+
 import {Footer} from '../Footer/Footer'
 
 import './candidate.scss'
+import {useRequest} from "../../hooks/useRequest";
 
 const Candidate = () => {
   const {id: candidateId} = useParams();
@@ -28,16 +28,15 @@ const Candidate = () => {
   const role = useSelector(getRole);
   const [activeSnippet, setActiveSnippet] = useState(true);
 
+  const {apiRequest} = useRequest();
+
   useEffect(() => {
     window.scrollTo(0, 0)
   }, []);
 
   useEffect(() => {
-    fetchGet({
+    apiRequest(`/profile/${candidateId}`,{
-      link: `${process.env.REACT_APP_API_URL}/api/profile/${candidateId}`,
       params: Number(candidateId),
-      role,
-      logout: () => dispatch(auth(false))
     }).then((el) => dispatch(currentCandidate(el)))
   }, [dispatch, candidateId]);
 

src/components/Home/Home.js

@@ -12,23 +12,20 @@ import {getRole} from '../../redux/roleSlice'
 import {useRequest} from "../../hooks/useRequest";
 
 
+
 const Home = () => {
 
   const [isLoadingMore, setIsLoadingMore] = useState(false);
   const [index, setIndex] = useState(4);
 
   const dispatch = useDispatch();
-  const role = useSelector(getRole);
 
   const {apiRequest} = useRequest();
 
   useEffect(() => {
     setIsLoadingMore(true);
     apiRequest('/profile', {
-      //Корс блокирует все фильтры в гет параметрах
+      params: {limit: 1000},
-      params: {"offset": 1000},
-      role,
-      // logout: () => dispatch(auth(false))
     }).then((profileArr) => {
 
       dispatch(profiles(profileArr));
@@ -36,9 +33,6 @@ const Home = () => {
     });
 
     apiRequest('/skills/skills-on-main-page', {
-
-      role,
-      // logout: () => dispatch(auth(false))
     }).then((skills) => {
       if (!skills) {
         return []

src/components/Loader/loader.scss

@@ -4,7 +4,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-
+  position: relative;
   &:hover {
     path {
       fill: #6aaf5c;

src/components/OutstaffingBlock/OutstaffingBlock.js

@@ -5,39 +5,34 @@ import {
   selectItems,
   selectedItems,
   filteredCandidates,
-  auth
 } from '../../redux/outstaffingSlice'
 
-import { fetchGet } from '../../server/server'
+import {useRequest} from "../../hooks/useRequest";
-
-import { getRole } from '../../redux/roleSlice'
 
 import './outstaffingBlock.scss'
 
-const handlePositionClick = ({
+
+const handlePositionClick = (
+    {
       dispatch,
       positionId,
       isSelected,
       onSelect,
-  role
+      apiRequest
     }) => {
   if (isSelected) {
-    fetchGet({
+    apiRequest('/profile', {
-      link: `${process.env.REACT_APP_API_URL}/api/profile?limit=`,
+      params: {limit: 1000},
-      params: 4,
-      role,
-      logout: () => dispatch(auth(false))
     }).then((profileArr) => {
       dispatch(filteredCandidates(profileArr));
       dispatch(selectedItems([]));
       onSelect(positionId)
     })
   } else {
-    fetchGet({
+    apiRequest('/profile', {
-      link: `${process.env.REACT_APP_API_URL}/api/profile?position_id=`,
+      params: {
-      params: positionId,
+        limit: '1000',
-      role,
+        position_id: positionId},
-      logout: () => dispatch(auth(false))
     }).then((el) => {
       dispatch(filteredCandidates(el));
       dispatch(selectedItems([]));
@@ -46,7 +41,8 @@ const handlePositionClick = ({
   }
 };
 
-const OutstaffingBlock = ({
+const OutstaffingBlock = (
+    {
       dataTags = [],
       selected,
       img,
@@ -56,12 +52,13 @@ const OutstaffingBlock = ({
       onSelect
     }) => {
 
-  const role = useSelector(getRole);
 
   const dispatch = useDispatch();
 
   const itemsArr = useSelector(selectItems);
 
+  const {apiRequest} = useRequest();
+
   const handleBlockClick = (item, id) => {
     if (!itemsArr.find((el) => item === el.value)) {
       dispatch(selectedItems([...itemsArr, {id, value: item, label: item}]))
@@ -101,7 +98,7 @@ const OutstaffingBlock = ({
                     positionId,
                     isSelected,
                     onSelect,
-              role
+                    apiRequest
                   })
               }
           >

src/components/ProfileCalendar/ProfileCalendar.js

@@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react'
 import {useDispatch, useSelector} from 'react-redux'
 import { getProfileInfo } from '../../redux/outstaffingSlice'
 import { setReportDate } from '../../redux/reportSlice';
-import {fetchGet} from "../../server/server";
 import arrow from "../../images/right-arrow.png";
 import { Link } from 'react-router-dom'
 import moment from "moment";
@@ -12,40 +11,42 @@ import {ProfileCalendarComponent} from "./ProfileCalendarComponent";
 import { Footer } from '../Footer/Footer'
 
 import './profileCalendar.scss'
+import {useRequest} from "../../hooks/useRequest";
 export const ProfileCalendar = () => {
     const dispatch = useDispatch();
-    const profileInfo = useSelector(getProfileInfo)
+    const profileInfo = useSelector(getProfileInfo);
-    const [month, setMonth] = useState('')
+    const [month, setMonth] = useState('');
-    const [reports, setReports] = useState([])
+    const [reports, setReports] = useState([]);
-    const [totalHours, setTotalHours] = useState(0)
+    const [totalHours, setTotalHours] = useState(0);
-    const [value, setValue] = useState(moment())
+    const [value, setValue] = useState(moment());
-    const [requestDates, setRequestDates] = useState('')
+    const [requestDates, setRequestDates] = useState('');
+
+    const {apiRequest} = useRequest();
 
     useEffect(() => {
         setRequestDates(getReports(value))
-    })
+    });
 
     useEffect(async () => {
         if (!requestDates) {
             return
         }
-        const response = await fetchGet({
+        apiRequest(`/reports/reports-by-date?${requestDates}&user_id=${localStorage.getItem('id')}`)
-            link: `${process.env.REACT_APP_API_URL}/api/reports/reports-by-date?${requestDates}&user_id=${localStorage.getItem('id')}`,
+            .then((reports) => {
-        }).then((reports) => {
+                let spendTime = 0;
-            let spendTime = 0
                 reports.map((report) => {
                     if (report.spendTime) {
                         spendTime += Number(report.spendTime)
                     }
-            })
+                });
-            setTotalHours(spendTime)
+                setTotalHours(spendTime);
                 setReports(reports)
             })
-    },[requestDates])
+    }, [requestDates]);
 
     useEffect(() => {
         setMonth(currentMonth)
-    }, [month])
+    }, [month]);
 
     return (
         <section className='calendar'>

src/components/ReportForm/ReportForm.js

@@ -28,7 +28,6 @@ const getCreatedDate = (day) => {
 
 const ReportForm = () => {
   const dispatch = useDispatch();
-  const navigate = useNavigate();
   const reportDate = useSelector(getReportDate);
   const role = useSelector(getRole);
 

src/components/Select/TagSelect.js

@@ -2,27 +2,26 @@ import React, { useState } from 'react'
 import {useSelector, useDispatch} from 'react-redux'
 import Select from 'react-select'
 import {Loader} from '../Loader/Loader'
-import style from './TagSelect.module.css'
+import {useRequest} from "../../hooks/useRequest";
 import {
   selectedItems,
   selectItems,
   selectTags,
   filteredCandidates,
-  setPositionId,
+  setPositionId
-  auth
 } from '../../redux/outstaffingSlice'
-import { fetchGet } from '../../server/server'
 
-import { getRole } from '../../redux/roleSlice'
+import style from './TagSelect.module.css'
+
 
 const TagSelect = () => {
 
-  const role = useSelector(getRole);
   const [searchLoading, setSearchLoading] = useState(false);
   const dispatch = useDispatch();
 
-  const itemsArr = useSelector(selectItems);
+  const {apiRequest} = useRequest();
 
+  const itemsArr = useSelector(selectItems);
   const tagsArr = useSelector(selectTags);
 
   const handleSubmit = ({dispatch, setSearchLoading}) => {
@@ -30,12 +29,11 @@ const TagSelect = () => {
 
     dispatch(setPositionId(null));
     const filterItemsId = itemsArr.map((item) => item.id).join();
+    const params = filterItemsId ?  {skill: filterItemsId} : '';
 
-    fetchGet({
+
-      link: `${process.env.REACT_APP_API_URL}/api/profile?skills=`,
+    apiRequest('/profile', {
-      params: filterItemsId,
+      params: {...params, limit: 1000},
-      role,
-      logout: () => dispatch(auth(false))
     }).then((el) => {
       dispatch(filteredCandidates(el));
       setSearchLoading(false)
@@ -55,7 +53,7 @@ const TagSelect = () => {
               <div className={style.search__box}>
                 <Select
                     value={itemsArr}
-                onChange={(value) => dispatch(selectedItems(value))}
+                    onChange={(value) => {console.log(value) ;return dispatch(selectedItems(value))}}
                     isMulti
                     name='tags'
                     className={style.select}

src/components/features/bookkeeping/ActContent/ActContent.js

@@ -1,40 +1,35 @@
 import React, {useEffect, useState} from 'react';
+import {Link} from "react-router-dom"
 import {ContentTitle} from "../ContentTitle/ContentTitle"
 import {ContentButton} from "../ContentButton/ContentButton"
 import {BookkeepingFormField} from "../BookkeepingFormField/BookkeepingFormField"
 import {BookkepingSelect} from '../BookkepingSelect/BookkepingSelect';
 import {BookkepingInput} from '../BookkepingInput/BookkepingInput';
-import { fetchGet } from '../../../../server/server'
+
-import { Link } from "react-router-dom"
+import {useRequest} from "../../../../hooks/useRequest";
+
 import "./actContent.css"
 
 export const ActContent = () => {
 
-    const [templates, setTemplates] = useState([])
+  const [templates, setTemplates] = useState([]);
-    const [selectedTemplate, setSelectedTemplate] = useState()
+  const [selectedTemplate, setSelectedTemplate] = useState();
-    const [templatedFields, setTemplatedFields] = useState([])
+  const [templatedFields, setTemplatedFields] = useState([]);
+
+  const {apiRequest} = useRequest();
 
   useEffect(() => {
-        fetchGet({
+    apiRequest('/template/get-template-list')
-          link: `${process.env.REACT_APP_API_URL}/api/template/get-template-list`,
+        .then(res => setTemplates(res))
-        }).then((res) => {
+  }, []);
-            setTemplates(res)
-        })
-      }, [])
 
   useEffect(() => {
     if (selectedTemplate === undefined) {
       return
     }
-        fetchGet({
+    apiRequest(`/template/get-template-fields?template_id=${selectedTemplate}`)
-            link: `${process.env.REACT_APP_API_URL}/api/template/get-template-fields?template_id=${selectedTemplate}`,
+        .then(res => setTemplatedFields(res[0].templateDocumentFields))
-          })
+  }, [selectedTemplate]);
-          .then((res) => {
-            setTemplatedFields(res[0].templateDocumentFields)
-          })
-      }, [selectedTemplate])
-
-
 
 
   return (
@@ -50,7 +45,8 @@ export const ActContent = ()=> {
                 <input type="date" className="contract__date"/>
               </div>
 
-                    <BookkeepingFormField title="Шаблон документа"
+              <BookkeepingFormField
+                  title="Шаблон документа"
                   Component={BookkepingSelect}
                   innerComponentProps={{
                     onSelect: setSelectedTemplate,
@@ -60,12 +56,14 @@ export const ActContent = ()=> {
                   }}
                   action={{
                     text: "Добавить свой шаблон",
-                            method: () => {}
+                    method: () => {
+                    }
                   }}
               />
 
               {templatedFields.map((field, index) =>
-                            <BookkeepingFormField title={field.field.title} key={index}
+                  <BookkeepingFormField
+                      title={field.field.title} key={index}
                       Component={BookkepingInput}
                       innerComponentProps={{
                         placeholder: "Введите данные",
@@ -74,9 +72,9 @@ export const ActContent = ()=> {
               )}
 
 
-
               <div className="content__btn-list">
-                        <ContentButton styles={{ width: "290px",
+                <ContentButton styles={{
+                  width: "290px",
                   height: "75px",
                   boxShadow: "6px 5px 20px rgba(182, 75, 62, 0.21)",
                   borderRadius: "38px",
@@ -86,7 +84,8 @@ export const ActContent = ()=> {
                 }}>Сохранить</ContentButton>
                 <Link to="/documents" className="link-act-button">
                   <div className='act-Button'>
-                                <ContentButton styles={{color: "#282828",
+                    <ContentButton styles={{
+                      color: "#282828",
                       marginLeft: "40px",
                       background: "none",
                       border: "none"
@@ -99,4 +98,4 @@ export const ActContent = ()=> {
         </div>
       </div>
   )
-}
+};

src/components/features/bookkeeping/ContractContent/ContractContent.js

@@ -4,34 +4,30 @@ import { ContentButton } from "../ContentButton/ContentButton"
 import {BookkeepingFormField} from "../BookkeepingFormField/BookkeepingFormField"
 import {BookkepingSelect} from '../BookkepingSelect/BookkepingSelect';
 import {BookkepingInput} from '../BookkepingInput/BookkepingInput';
-import { fetchGet } from '../../../../server/server'
 import {Link} from "react-router-dom"
+import {useRequest} from "../../../../hooks/useRequest";
 
 export const ContractContent = () => {
 
-    const [templates, setTemplates] = useState([])
+  const [templates, setTemplates] = useState([]);
-    const [selectedTemplate, setSelectedTemplate] = useState()
+  const [selectedTemplate, setSelectedTemplate] = useState();
-    const [templatedFields, setTemplatedFields] = useState([])
+  const [templatedFields, setTemplatedFields] = useState([]);
+
+  const {apiRequest} = useRequest();
 
   useEffect(() => {
-        fetchGet({
+    apiRequest(`/document/get-document-list`)
-          link: `${process.env.REACT_APP_API_URL}/api/document/get-document-list`,
+        .then(res => setTemplates(res))
-        }).then((res) => {
+  }, []);
-            setTemplates(res)
-        })
-      }, [])
 
   useEffect(() => {
     if (selectedTemplate === undefined) {
       return
     }
-        fetchGet({
+    apiRequest(`/document/get-document?document_id=${selectedTemplate}`)
-            link: `${process.env.REACT_APP_API_URL}/api/document/get-document?document_id=${selectedTemplate}`,
+        .then(res => setTemplatedFields(res[0].templateDocumentFields)
-          })
+        )
-          .then((res) => {
+  }, [selectedTemplate]);
-            setTemplatedFields(res[0].templateDocumentFields)
-          })
-      }, [selectedTemplate])
 
   return (
       <div>
@@ -47,7 +43,8 @@ export const ContractContent = () => {
                 <span>от</span>
                 <input type="date" className="contract__date"/>
               </div>
-                    <BookkeepingFormField title="Шаблон документа"
+              <BookkeepingFormField
+                  title="Шаблон документа"
                   Component={BookkepingSelect}
                   innerComponentProps={{
                     onSelect: setSelectedTemplate,
@@ -57,12 +54,14 @@ export const ContractContent = () => {
                   }}
                   action={{
                     text: "Добавить свой шаблон",
-                            method: () => {}
+                    method: () => {
+                    }
                   }}
               />
 
               {templatedFields.map((field, index) =>
-                            <BookkeepingFormField title={field.field.title} key={index}
+                  <BookkeepingFormField
+                      title={field.field.title} key={index}
                       Component={BookkepingInput}
                       innerComponentProps={{
                         placeholder: "Введите данные",
@@ -71,7 +70,8 @@ export const ContractContent = () => {
               )}
 
               <div className="content__btn-list">
-                        <ContentButton styles={{ width: "290px",
+                <ContentButton styles={{
+                  width: "290px",
                   height: "75px",
                   boxShadow: "6px 5px 20px rgba(182, 75, 62, 0.21)",
                   borderRadius: "38px",
@@ -81,7 +81,8 @@ export const ContractContent = () => {
                 }}>Сохранить</ContentButton>
                 <Link to="/documents" className="link-act-button">
                   <div className='act-Button'>
-                                <ContentButton styles={{color: "#282828",
+                    <ContentButton styles={{
+                      color: "#282828",
                       marginLeft: "40px",
                       background: "none",
                       border: "none"
@@ -94,4 +95,4 @@ export const ContractContent = () => {
         </div>
       </div>
   )
-} 
+};

src/components/features/quiz/HeaderQuiz.js

@@ -1,29 +1,25 @@
-import {useEffect} from 'react'
+import React, {useEffect} from 'react'
-import {useDispatch} from 'react-redux'
+import {useDispatch, useSelector} from 'react-redux'
-import {useSelector} from 'react-redux'
+import {selectUserInfo, setQuestionnairesList, setUserInfo} from "../../../redux/quizSlice";
-import {fetchGet} from '../../../server/server'
+import {useRequest} from "../../../hooks/useRequest";
 import './quiz.scss'
-import {selectUserInfo, setQuestionnairesList, setUserInfo,} from "../../../redux/quizSlice";
 
 export const HeaderQuiz = ({header}) => {
 
-   const dispatch = useDispatch()
+  const dispatch = useDispatch();
   const userId = localStorage.getItem('id');
   const userInfo = useSelector(selectUserInfo);
 
-   useEffect(() => {
+  const {apiRequest} = useRequest();
-      dispatch(setUserInfo(userId))
-   }, [dispatch])
 
   useEffect(() => {
-      fetchGet({
+    dispatch(setUserInfo(userId))
-           link: `${process.env.REACT_APP_API_URL}/api/user-questionnaire/questionnaires-list?user_id=${userId}`,
+  }, [dispatch]);
-           Origin: `${process.env.REACT_APP_BASE_URL}`,
+
-        }
+  useEffect(() => {
-      ).then(response => {
+    apiRequest(`/user-questionnaire/questionnaires-list?user_id=${userId}`)
-         dispatch(setQuestionnairesList(response))
+        .then(res => dispatch(setQuestionnairesList(res)))
-      })
+  }, [dispatch]);
-   }, [dispatch])
 
   return (
       <div>
@@ -47,4 +43,4 @@ export const HeaderQuiz = ({header}) => {
         }
       </div>
   )
-}
+};

src/components/features/quiz/Instructions.js

@@ -5,23 +5,26 @@ import './quiz.scss'
 import {useEffect, useState} from "react";
 import {useSelector} from "react-redux";
 import {selectedTest} from "../../../redux/quizSlice";
-import {fetchGet} from "../../../server/server";
+
+import {useRequest} from "../../../hooks/useRequest";
 
 export const Instruction = () => {
 
-   const [countQuestions, setCountQuestions] = useState(null)
+   const [countQuestions, setCountQuestions] = useState(null);
-   const test = useSelector(selectedTest)
+   const test = useSelector(selectedTest);
 
-   useEffect(async () => {
+  const {apiRequest} = useRequest();
+
+   useEffect( () => {
+
+     apiRequest('/user-questionnaire/get-question-number', {
+           params: {user_questionnaire_uuid: test.uuid},
 
-      const response = await fetchGet({
-           link: `${process.env.REACT_APP_API_URL}/api/user-questionnaire/get-question-number?user_questionnaire_uuid=${test.uuid}`,
-           Origin: `${process.env.REACT_APP_BASE_URL}`,
          }
-      )
+     ).then((res)=> setCountQuestions(res.question_number))
-      setCountQuestions(response.question_number)
 
-   }, [])
+
+   }, []);
 
    return (
      <div className="instruction">
@@ -49,5 +52,5 @@ export const Instruction = () => {
         </div>
      </div>
    )
-}
+};
 

src/components/features/quiz/Results.js

@@ -1,7 +1,7 @@
 import React, {useEffect, useState} from 'react';
 import {useDispatch, useSelector} from "react-redux";
 import {fetchResultTest, selectedTest, selectResult} from "../../../redux/quizSlice";
-import {fetchGet} from "../../../server/server";
+import {useRequest} from "../../../hooks/useRequest";
 
 
 export const Results = () => {
@@ -9,15 +9,13 @@ export const Results = () => {
   const test = useSelector(selectedTest);
   const [maxScore, setMaxScore] = useState('');
   const dispatch = useDispatch();
+  const {apiRequest} = useRequest();
 
   useEffect(async () => {
     dispatch(fetchResultTest(test.uuid));
-      const response = await fetchGet({
+    apiRequest(`/user-questionnaire/get-points-number?user_questionnaire_uuid=${test.uuid}`)
-           link: `${process.env.REACT_APP_API_URL}/api/user-questionnaire/get-points-number?user_questionnaire_uuid=${test.uuid}`,
+        .then((res) => setMaxScore(res.sum_point));
-           Origin: `${process.env.REACT_APP_BASE_URL}`,
+
-        }
-      );
-      setMaxScore(response.sum_point)
   }, []);
 
   return (

src/components/features/quiz/Task.js

@@ -13,9 +13,9 @@ import {GetOptionTask} from './GetOptionTask'
 
 import {fetchUserAnswersMany, fetchUserAnswerOne} from './../../../redux/quizSlice'
 
-import {fetchGet} from "../../../server/server";
 
 import './quiz.scss'
+import {useRequest} from "../../../hooks/useRequest";
 
 export const TaskQuiz = () => {
 
@@ -31,17 +31,17 @@ export const TaskQuiz = () => {
   const [inputValue, setInputValue] = useState('');
   const [questions, setQuestions] = useState([]);
 
+  const {apiRequest} = useRequest();
+
   const id = localStorage.getItem('id');
 
   useEffect(() => {
-      const response = fetchGet({
+    apiRequest(`/question/get-questions?uuid=${dataTest.uuid}`)
-           link: `${process.env.REACT_APP_API_URL}/api/question/get-questions?uuid=${dataTest.uuid}`,
+        .then((response) => {
-           Origin: `${process.env.REACT_APP_BASE_URL}`,
-        }
-      );
           setQuestions(response);
           dispatch(fetchGetAnswers(response[0].id));
           setStripValue((+index + 1) * 100 / response.length)
+        })
   }, [dispatch]);
 
   const nextQuestion = async (e) => {
@@ -139,7 +139,8 @@ export const TaskQuiz = () => {
                       {questions.length !== index + 1 &&
                       <button type='submit' className='quiz-btn'
                               onClick={(e) => nextQuestion(e)}>Далее</button>}
-                         {questions.length === index + 1 && <button onClick={(e) => nextQuestion(e)}
+                      {questions.length === index + 1 &&
+                      <button onClick={(e) => nextQuestion(e)}
                               className='quiz-btn quiz-btn_dark-green'>Завершить</button>}
                     </div>
                   </form>

src/hooks/useLogout.js

@@ -1,4 +1,3 @@
-import React from "react";
 import {useDispatch, useSelector} from "react-redux";
 import {getRole} from "../redux/roleSlice";
 import {useNavigate} from "react-router-dom";
@@ -12,7 +11,6 @@ export const useLogout = () => {
   const logout = () => {
     localStorage.clear();
     dispatch(auth(false));
-    console.log('logout')
     navigate(userRole === 'ROLE_DEV' ? '/authdev' : '/auth')
   };
 

src/hooks/useRequest.js

@@ -1,7 +1,5 @@
-import React from "react";
 import axios from 'axios';
 import {getToken, urlHasParams} from "../helper";
-import {useNavigate} from "react-router";
 import {useLogout} from "./useLogout";
 
 
@@ -38,7 +36,6 @@ export const useRequest = () => {
         })
         .then(response => new Promise(resolve => {
           if (response.data.redirect || response.status === 401) {
-            console.log(response, 'LOGUTATAT')
             logout()
           }
           return resolve(response)

src/pages/FormPage.js

@@ -4,13 +4,11 @@ import {useParams, useNavigate} from 'react-router-dom'
 import {
   currentCandidate,
   selectCurrentCandidate,
-  auth
 } from '../redux/outstaffingSlice'
 import SVG from 'react-inlinesvg'
 import {WithLogout} from '../hoc/withLogout'
 import Form from '../components/Form/Form'
 import {LEVELS, SKILLS} from '../components/constants/constants'
-import {fetchGet} from '../server/server'
 import {Footer} from '../components/Footer/Footer'
 
 import arrow from '../images/right-arrow.png'
@@ -18,7 +16,7 @@ import rectangle from '../images/rectangle_secondPage.png'
 import telegramIcon from '../images/telegram-icon.svg'
 
 import './formPage.scss'
-import {getRole} from '../redux/roleSlice'
+import {useRequest} from "../hooks/useRequest";
 
 
 const FormPage = () => {
@@ -26,20 +24,19 @@ const FormPage = () => {
   const navigate = useNavigate();
   const dispatch = useDispatch();
   const candidate = useSelector(selectCurrentCandidate);
-  const role = useSelector(getRole);
+
+
+  const {apiRequest} = useRequest();
 
   const goBack = () => {
     navigate(-1)
   };
 
   if (!candidate.id) {
-    fetchGet({
+    apiRequest('/api/profile', {
-      link: `${process.env.REACT_APP_API_URL}/api/profile/`,
+      params: Number(params.id)
-      params: Number(params.id),
+    })
-      navigate,
+        .then((el) => dispatch(currentCandidate(el)))
-      role,
-      logout: () => dispatch(auth(false))
-    }).then((el) => dispatch(currentCandidate(el)))
   }
 
   return (

src/pages/Summary/Summary.js

@@ -1,31 +1,28 @@
 import React, {useEffect, useState} from 'react';
+import {useSelector} from "react-redux";
 import {ProfileHeader} from "../../components/ProfileHeader/ProfileHeader";
 import {getProfileInfo} from "../../redux/outstaffingSlice";
-import {useSelector} from "react-redux";
-import {transformHtml} from "../../helper";
 import {Footer} from '../../components/Footer/Footer'
+import {transformHtml} from "../../helper";
+
+import {useRequest} from "../../hooks/useRequest";
 
 import arrow from "../../images/right-arrow.png";
 import rightArrow from "../../images/arrowRight.png"
 import gitImgItem from "../../images/gitItemImg.png"
 
-import {fetchGet} from "../../server/server";
-
 import './summary.scss'
 
-
-
 export const Summary = () => {
   const profileInfo = useSelector(getProfileInfo);
   const [openGit, setOpenGit] = useState(false);
   const [gitInfo, setGitInfo] = useState([]);
+
+  const {apiRequest} = useRequest();
   useEffect(() => {
-        fetchGet({
+    apiRequest(`/profile/portfolio-projects?card_id=${localStorage.getItem('cardId')}`)
-            link: `${process.env.REACT_APP_API_URL}/api/profile/portfolio-projects?card_id=${localStorage.getItem('cardId')}`,
+        .then(responseGit => setGitInfo(responseGit))
-        }).then((responseGit) => {
+  }, [apiRequest]);
-            setGitInfo(responseGit)
-        })
-    }, []);
   return (
       <div className='summary'>
         <ProfileHeader/>
@@ -54,9 +51,9 @@ export const Summary = () => {
             </div>
             <div className='skills__section__items'>
               <div className='skills__section__items__wrapper'>
-                                {profileInfo.skillValues && profileInfo.skillValues.map((skill) => {
+                {profileInfo.skillValues && profileInfo.skillValues.map((skill) =>
-                                    return <span key={skill.id} className='skill_item'>{skill.skill.name}</span>
+                    <span key={skill.id} className='skill_item'>{skill.skill.name}</span>
-                                })}
+                )}
               </div>
             </div>
           </div>