diff --git a/src/components/Filter/Filter.tsx b/src/components/Filter/Filter.tsx index e3f3bcf..3ed094f 100644 --- 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(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 index c8dc480..b4568e9 100644 --- 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 index efdd3b9..bef6e98 100644 --- 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,7 +40,7 @@ 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)); } @@ -48,9 +48,9 @@ export default function Employees() { 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 (
{ return fetch( `${BASE_URL}/api/v1/members/?${buildQueryString({ @@ -59,7 +59,7 @@ export const getMembersData = ( search, position, department, - citie, + city, })}`, { method: 'GET', diff --git a/src/store/features/slice/filterSlice.ts b/src/store/features/slice/filterSlice.ts index 82b71b5..319d0ee 100644 --- 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 index f9343cb..21f3d07 100644 --- 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 index 2a28c13..ceb4b9a 100644 --- 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 index 2912bf3..0166013 100644 --- a/src/ui/FilterList/FilterList.tsx +++ b/src/ui/FilterList/FilterList.tsx @@ -4,7 +4,7 @@ import { setCurrentPage } from 'src/store/features/slice/membersSlice'; import { fetchSelects, selectFilter, - setCitie, + setCity, setDepartment, setPosition, } from 'src/store/features/slice/filterSlice'; @@ -12,21 +12,20 @@ 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() {