From 9655e7da41f718d84f32d6b122bb8ea43f21e0b0 Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Sun, 15 Sep 2024 17:13:37 +0300 Subject: [PATCH 1/2] fix search --- src/Components/DataTable/SearchField.tsx | 5 +++++ src/Components/Filter/PaginationColumn.tsx | 7 +++++++ src/Layout/Dashboard/usePagination.ts | 8 +++++++- src/Pages/Admin/QuestionBank/Table.tsx | 1 + src/Pages/Admin/question/Table.tsx | 1 + src/api/helper/useGetQuery.ts | 8 +++++--- 6 files changed, 26 insertions(+), 4 deletions(-) diff --git a/src/Components/DataTable/SearchField.tsx b/src/Components/DataTable/SearchField.tsx index fa5c5a8..c263c58 100644 --- a/src/Components/DataTable/SearchField.tsx +++ b/src/Components/DataTable/SearchField.tsx @@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef } from "react"; import { useTranslation } from "react-i18next"; import { useFilterStateState } from "../../zustand/Filter"; import { useDebounce } from "../../utils/useDebounce"; +import { PaginationParams } from "../../api/utils/PaginationParams"; interface Props { placeholder: string; @@ -14,12 +15,16 @@ const SearchField: React.FC = ({ placeholder, searchBy }) => { const inputRef = useRef(null); const { setFilter,Filter } = useFilterStateState(); + const { page } = PaginationParams(location); const handleInputChange = (value: string) => { setSearchQuery(value); }; const handleInputChangeWithDebounce = useDebounce((value: string) => { + if(Number(page) > 1){ + + } setFilter({ [searchBy]: value, }); diff --git a/src/Components/Filter/PaginationColumn.tsx b/src/Components/Filter/PaginationColumn.tsx index 34b39ac..ccdf4b8 100644 --- a/src/Components/Filter/PaginationColumn.tsx +++ b/src/Components/Filter/PaginationColumn.tsx @@ -3,13 +3,20 @@ import { useTranslation } from "react-i18next"; import { Divider, Select } from "antd"; import usePagination from "../../Layout/Dashboard/usePagination"; import { useNavigate } from "react-router-dom"; +import { useFilterStateState } from "../../zustand/Filter"; const PaginationColumn = () => { const { t } = useTranslation(); const navigate = useNavigate(); + const { Filter ,setFilter } = useFilterStateState(); + const handleChange = (value: string) => { navigate(`?per_page=${value}`); + + setFilter({ + per_page:value + }) }; return ( diff --git a/src/Layout/Dashboard/usePagination.ts b/src/Layout/Dashboard/usePagination.ts index 44375a1..0f50841 100644 --- a/src/Layout/Dashboard/usePagination.ts +++ b/src/Layout/Dashboard/usePagination.ts @@ -1,6 +1,7 @@ import { useState, useEffect } from "react"; import { useLocation, useNavigate } from "react-router-dom"; import { PaginationAntd, PaginationMeta } from "../../types/Table"; +import { useFilterStateState } from "../../zustand/Filter"; interface Data { meta: PaginationMeta; @@ -9,6 +10,7 @@ interface Data { const usePagination = (data: Data) => { const navigate = useNavigate(); const location = useLocation(); + const { Filter ,setFilter } = useFilterStateState(); const [pagination, setPagination] = useState({ current: data?.meta?.current_page || 1, @@ -27,7 +29,11 @@ const usePagination = (data: Data) => { }, [data]); const handlePageChange = (page: number) => { - navigate(`?page=${page}`); + // navigate(`?page=${page}`); + setFilter({ + ...Filter, + page:page + }) }; return { pagination, handlePageChange }; diff --git a/src/Pages/Admin/QuestionBank/Table.tsx b/src/Pages/Admin/QuestionBank/Table.tsx index fdb4446..44637a3 100644 --- a/src/Pages/Admin/QuestionBank/Table.tsx +++ b/src/Pages/Admin/QuestionBank/Table.tsx @@ -14,6 +14,7 @@ const App: React.FC = () => { console.log(filterState,"filterState"); const response = useGetAllQuestion({ + nullable_parent:"null", pagination: true, ...filterState, content:Filter?.content, diff --git a/src/Pages/Admin/question/Table.tsx b/src/Pages/Admin/question/Table.tsx index 72d5627..dc6f08e 100644 --- a/src/Pages/Admin/question/Table.tsx +++ b/src/Pages/Admin/question/Table.tsx @@ -15,6 +15,7 @@ const App: React.FC = () => { const content = Filter?.content ; const response = useGetAllQuestion({ + nullable_parent:"null", lessonsIds: [lesson_id], pagination: true, ...filterState, diff --git a/src/api/helper/useGetQuery.ts b/src/api/helper/useGetQuery.ts index da7bdb6..eb3bffd 100644 --- a/src/api/helper/useGetQuery.ts +++ b/src/api/helper/useGetQuery.ts @@ -3,6 +3,7 @@ import useAxios from "./useAxios"; import { useLocation } from "react-router-dom"; import { PaginationParams } from "../utils/PaginationParams"; import { filterParams } from "../utils/filterParams"; +import { useFilterStateState } from "../../zustand/Filter"; function useGetQuery( KEY: string | string[], url: string, @@ -13,10 +14,11 @@ function useGetQuery( const { show, pagination, ...remainingParams } = params; const location = useLocation(); - - const { page, per_page } = PaginationParams(location); + const { Filter ,setFilter } = useFilterStateState(); + const page = Filter?.page ; + const per_page = Filter?.per_page ; + // const { per_page } = PaginationParams(location); - console.log(remainingParams) const paramToSend = pagination From 448186c0256959d8839cf2376d2856f7cd5cc3d1 Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Mon, 16 Sep 2024 09:34:10 +0300 Subject: [PATCH 2/2] fix filter --- src/Layout/Dashboard/PageTitle.tsx | 5 +++-- src/Styles/DataTable/FillterNav.scss | 8 +++++--- src/Styles/Layout/PageHeader.scss | 6 ++++++ 3 files changed, 14 insertions(+), 5 deletions(-) diff --git a/src/Layout/Dashboard/PageTitle.tsx b/src/Layout/Dashboard/PageTitle.tsx index 12c991e..2f8a609 100644 --- a/src/Layout/Dashboard/PageTitle.tsx +++ b/src/Layout/Dashboard/PageTitle.tsx @@ -22,9 +22,10 @@ const PageTitleComponent = () => { return (
{(Array.isArray(PageTitle) ? PageTitle : [])?.map((item,index)=>{ + const lastItem = PageTitle?.length - 1 === index return ( -
handleNavigate(item?.path)}> - {item?.name} / +
handleNavigate(item?.path)}> + {item?.name} {lastItem ? "" : "/"}
) })} diff --git a/src/Styles/DataTable/FillterNav.scss b/src/Styles/DataTable/FillterNav.scss index 108604b..c116607 100644 --- a/src/Styles/DataTable/FillterNav.scss +++ b/src/Styles/DataTable/FillterNav.scss @@ -48,16 +48,18 @@ outline: none; border: none; min-width: 120px; - border-radius: 10px; - padding: 10px; + border-radius: 6px; + padding: 6px 10px; font-weight: bold; background: var(--primary); color: var(--white); display: flex; align-items: center; justify-content: center; - gap: 5px; + gap: 7px; + font-size: 14px; svg { font-size: 16px; + } } diff --git a/src/Styles/Layout/PageHeader.scss b/src/Styles/Layout/PageHeader.scss index 4368f36..e65020d 100644 --- a/src/Styles/Layout/PageHeader.scss +++ b/src/Styles/Layout/PageHeader.scss @@ -24,7 +24,13 @@ .PageTitle{ display: flex; gap: 10px; + margin-block: 10px; .PageTitleItems{ cursor: pointer; + color: #6A7287; } +} + +.PageTitleLastItem{ + color: #202C4B !important; } \ No newline at end of file