fix/add finish

hackathon-Gazprom · Aug 23, 2024 · 9ae82ee · 9ae82ee
1 parent ff4c481
commit 9ae82ee
Show file tree

Hide file tree

Showing 8 changed files with 32 additions and 33 deletions.
diff --git a/src/components/Filter/Filter.tsx b/src/components/Filter/Filter.tsx
@@ -28,7 +28,7 @@ export default function Filter({ droppedCards }: FilterProps) {
     useAppSelector(selectMembers);
   const modalRef = useRef<HTMLDivElement>(null);
   const dispatch = useAppDispatch();
-  const { department, position, citie } = useAppSelector(selectFilter);
+  const { department, position, city } = useAppSelector(selectFilter);
   const [currentPageFilter, setCurrentPageFilter] = useState(1);
 
   const currentPageRef = useRef(currentPageFilter);
@@ -39,7 +39,7 @@ export default function Filter({ droppedCards }: FilterProps) {
     setCurrentPageFilter(1);
     currentPageRef.current = 1;
     await dispatch(
-      fetchGetMembers({ page: 1, search: value, position, department, citie })
+      fetchGetMembers({ page: 1, search: value, position, department, city })
     );
   };
 
@@ -58,7 +58,7 @@ export default function Filter({ droppedCards }: FilterProps) {
           search: search ? search : '',
           position,
           department,
-          citie,
+          city,
         })
       );
     }
@@ -87,10 +87,10 @@ export default function Filter({ droppedCards }: FilterProps) {
         search: search ? search : '',
         position,
         department,
-        citie,
+        city,
       })
     );
-  }, [dispatch, currentPageFilter, search, position, department, citie]);
+  }, [dispatch, currentPageFilter, search, position, department, city]);
 
   useEffect(() => {
     if (modalRef.current) {

diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
@@ -46,7 +46,7 @@ export default function Header({ droppedCards }: HeaderProps) {
         search: value,
         position: '',
         department: '',
-        citie: '',
+        city: '',
       })
     );
     navigate('/employees');

diff --git a/src/pages/Employees/Employees.tsx b/src/pages/Employees/Employees.tsx
@@ -20,7 +20,7 @@ export default function Employees() {
   const { members, membersAmount, currentPage, search } =
     useAppSelector(selectMembers);
   const { isProfileOpen } = useAppSelector(selectUsers);
-  const { department, position, citie } = useAppSelector(selectFilter);
+  const { department, position, city } = useAppSelector(selectFilter);
   const cx = cn.bind(styles);
   const dispatch = useAppDispatch();
 
@@ -31,7 +31,7 @@ export default function Employees() {
   function nextPage() {
     if (currentPage < maxPages) {
       dispatch(
-        fetchGetMembers({ page: currentPage + 1, search, position, department, citie })
+        fetchGetMembers({ page: currentPage + 1, search, position, department, city })
       );
       dispatch(setCurrentPage(currentPage + 1));
     }
@@ -40,17 +40,17 @@ export default function Employees() {
   function previousPage() {
     if (currentPage > 1) {
       dispatch(
-        fetchGetMembers({ page: currentPage - 1, search, position, department, citie })
+        fetchGetMembers({ page: currentPage - 1, search, position, department, city })
       );
       dispatch(setCurrentPage(currentPage - 1));
     }
   }
 
   useEffect(() => {
     dispatch(
-      fetchGetMembers({ page: currentPage, search, position, department, citie })
+      fetchGetMembers({ page: currentPage, search, position, department, city })
     );
-  }, [dispatch, currentPage, search, position, department, citie]);
+  }, [dispatch, currentPage, search, position, department, city]);
 
   return (
     <section

diff --git a/src/store/api.ts b/src/store/api.ts
@@ -51,15 +51,15 @@ export const getMembersData = (
   search: string,
   position: string,
   department: string,
-  citie: string,
+  city: string,
 ) => {
   return fetch(
     `${BASE_URL}/api/v1/members/?${buildQueryString({
       page,
       search,
       position,
       department,
-      citie,
+      city,
     })}`,
     {
       method: 'GET',

diff --git a/src/store/features/slice/filterSlice.ts b/src/store/features/slice/filterSlice.ts
@@ -9,7 +9,7 @@ export interface StateType {
   error: string | null | unknown;
   position: string,
   department: string,
-  citie: string,
+  city: string,
 }
 
 const initialState: StateType = {
@@ -20,7 +20,7 @@ const initialState: StateType = {
   },
   position: '',
   department: '',
-  citie: '',
+  city: '',
   isLoading: false,
   error: null,
 };
@@ -43,8 +43,8 @@ const filterSlice = createSlice({
     setDepartment(state, action) {
       state.department = action.payload;
     },
-    setCitie(state, action) {
-      state.citie = action.payload;
+    setCity(state, action) {
+      state.city = action.payload;
     },
   },
   extraReducers: (builder) => {
@@ -66,6 +66,6 @@ const filterSlice = createSlice({
   },
 });
 
-export const {setPosition, setDepartment, setCitie} = filterSlice.actions;
+export const {setPosition, setDepartment, setCity} = filterSlice.actions;
 export const filterReducer = filterSlice.reducer;
 export const selectFilter = (state: RootStore) => state.filter;
diff --git a/src/store/features/slice/membersSlice.ts b/src/store/features/slice/membersSlice.ts
@@ -16,7 +16,7 @@ export interface StateType {
   search: string;
   position: string;
   department: string;
-  citie: string;
+  city: string;
 }
 
 const initialState: StateType = {
@@ -32,7 +32,7 @@ const initialState: StateType = {
   search: '',
   position: '',
   department: '',
-  citie: '',
+  city: '',
 };
 
 export const fetchGetMembers = createAsyncThunk(
@@ -42,15 +42,15 @@ export const fetchGetMembers = createAsyncThunk(
     search,
     position,
     department,
-    citie,
+    city,
   }: {
     page: number;
     search: string;
     position: string;
     department: string;
-    citie: string;
+    city: string;
   }) => {
-    const response = await getMembersData(page, search, position, department, citie);
+    const response = await getMembersData(page, search, position, department, city);
     return response;
   }
 );

diff --git a/src/ui/EmployeesList/EmployeesList.tsx b/src/ui/EmployeesList/EmployeesList.tsx
@@ -27,7 +27,7 @@ export default function EmployeesList() {
     dispatch(setSearch(value));
     dispatch(setCurrentPage(1));
     await dispatch(
-      fetchGetMembers({ page: 1, search: value, position, department, citie: '' })
+      fetchGetMembers({ page: 1, search: value, position, department, city: '' })
     );
   };
 

diff --git a/src/ui/FilterList/FilterList.tsx b/src/ui/FilterList/FilterList.tsx
@@ -4,29 +4,28 @@ import { setCurrentPage } from 'src/store/features/slice/membersSlice';
 import {
   fetchSelects,
   selectFilter,
-  setCitie,
+  setCity,
   setDepartment,
   setPosition,
 } from 'src/store/features/slice/filterSlice';
 import { useEffect } from 'react';
 import Select from 'src/ui/Select/Select';
 
 export default function FilterList() {
-  const { selects, department, position, citie } = useAppSelector(selectFilter);
+  const { selects, department, position, city } = useAppSelector(selectFilter);
 
   const dispatch = useAppDispatch();
 
   const handleSelectChange = (
     value: string,
-    type: 'position' | 'department' | 'citie'
+    type: 'position' | 'department' | 'city'
   ) => {
     if (type === 'position') {
       dispatch(setPosition(value));
     } else if (type === 'department') {
       dispatch(setDepartment(value));
-    } else if (type === 'citie') {
-      console.log(value) 
-      dispatch(setCitie(value));
+    } else if (type === 'city') {
+      dispatch(setCity(value));
     }
     dispatch(setCurrentPage(1));
   };
@@ -35,7 +34,7 @@ export default function FilterList() {
     return () => {
       dispatch(setPosition(''));
       dispatch(setDepartment(''));
-      dispatch(setCitie(''));
+      dispatch(setCity(''));
       dispatch(setCurrentPage(1));
     };
   }, [location.pathname, dispatch]);
@@ -66,8 +65,8 @@ export default function FilterList() {
         <Select
           text='Город'
           options={selects.cities}
-          value={citie}
-          setValue={(value) => handleSelectChange(value, 'citie')}
+          value={city}
+          setValue={(value) => handleSelectChange(value, 'city')}
         />
       </li>
     </ul>