From e28de93f42736d61f9334aaf32fb2f1c2f10f50a Mon Sep 17 00:00:00 2001 From: rahul_g Date: Tue, 20 Aug 2024 13:00:25 +0530 Subject: [PATCH 1/4] fixed userName issue in profile --- src/components/layouts/header/Profile.tsx | 107 +++++++++++----------- 1 file changed, 56 insertions(+), 51 deletions(-) diff --git a/src/components/layouts/header/Profile.tsx b/src/components/layouts/header/Profile.tsx index 452e06b2..f71b41ee 100644 --- a/src/components/layouts/header/Profile.tsx +++ b/src/components/layouts/header/Profile.tsx @@ -27,7 +27,7 @@ const Profile = () => { const adminInformation = useSubmittedButtonStore( (state: any) => state?.adminInformation ); - console.log(adminInformation) + console.log(adminInformation); const [submitValue, setSubmitValue] = React.useState(false); const [role, setRole] = React.useState(""); @@ -41,7 +41,7 @@ const Profile = () => { (state: any) => state.setAdminInformation ); const router = useRouter(); - + const handleClick4 = (event: React.MouseEvent) => { setAnchorEl4(event.currentTarget); setProfileClick(true); @@ -141,25 +141,26 @@ const Profile = () => { try { const fieldValue = true; - const response = await getUserDetailsInfo(adminInformation?.userId, fieldValue); - // console.log(role); + const response = await getUserDetailsInfo( + adminInformation?.userId, + fieldValue + ); + // console.log(role); let formFields; if (Role.STUDENT === adminInformation?.role) { formFields = await getFormRead("USERS", "STUDENT"); setFormData(mapFields(formFields, response)); console.log("mapped formdata", formdata); - } else if (Role.TEACHER === adminInformation?.role) { + } else if (Role.TEACHER === adminInformation?.role) { console.log("mapped formdata", formdata); formFields = await getFormRead("USERS", "TEACHER"); setFormData(mapFields(formFields, response)); - } else if (Role.TEAM_LEADER === adminInformation?.role) { + } else if (Role.TEAM_LEADER === adminInformation?.role) { formFields = await getFormRead("USERS", "TEAM LEADER"); setFormData(mapFields(formFields, response)); - } - else - { + } else { formFields = await getFormRead("USERS", "ADMIN"); setFormData(mapFields(formFields, response)); } @@ -189,10 +190,8 @@ const Profile = () => { }, [formdata]); useEffect(() => { if (typeof window !== "undefined" && window.localStorage) { - const admin = localStorage.getItem("adminInfo"); - if(admin) - setAdminInfo(JSON.parse(admin)) - + const admin = localStorage.getItem("adminInfo"); + if (admin) setAdminInfo(JSON.parse(admin)); } }, []); @@ -211,13 +210,13 @@ const Profile = () => { return FormContextType.TEAM_LEADER; } })(); - + return ( <> -{console.log(adminInfo?.role)} - { openEditModal && ( - ) -} + {console.log(adminInfo?.role)} + {openEditModal && ( + + )} ); }; From 7f8036514185c7fc0e60fb25ece840812165d21f Mon Sep 17 00:00:00 2001 From: rahul_g Date: Tue, 20 Aug 2024 13:02:57 +0530 Subject: [PATCH 2/4] removed actions from state admin --- src/pages/state.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/state.tsx b/src/pages/state.tsx index 7e0aef48..6749220f 100644 --- a/src/pages/state.tsx +++ b/src/pages/state.tsx @@ -79,7 +79,7 @@ const State: React.FC = () => { { key: "updatedBy", title: t("MASTER.UPDATED_BY"), width: "130" }, { key: "createdAt", title: t("MASTER.CREATED_AT"), width: "160" }, { key: "updatedAt", title: t("MASTER.UPDATED_AT"), width: "160" }, - { key: "actions", title: t("MASTER.ACTIONS"), width: "130" }, + // { key: "actions", title: t("MASTER.ACTIONS"), width: "130" }, ]; const handleEdit = (rowData: StateDetail) => { @@ -289,7 +289,7 @@ const State: React.FC = () => { PageSizeSelector={PageSizeSelectorFunction} pageSizes={pageSizeArray} onEdit={handleEdit} - onDelete={handleDelete} + // onDelete={handleDelete} noDataMessage={ stateData.length === 0 ? t("COMMON.STATE_NOT_FOUND") : "" } From 253d70db606735593acd739dda60eefda5975fee Mon Sep 17 00:00:00 2001 From: rahul_g Date: Tue, 20 Aug 2024 14:54:22 +0530 Subject: [PATCH 3/4] resolved pagination count and removed table column when no data found --- public/locales/en/common.json | 2 +- src/pages/block.tsx | 90 +++++++++++------ src/pages/district.tsx | 182 ++++++++++++++++++---------------- src/pages/state.tsx | 75 +++++++------- 4 files changed, 192 insertions(+), 157 deletions(-) diff --git a/public/locales/en/common.json b/public/locales/en/common.json index 3b266f0e..fdb5981d 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -55,7 +55,7 @@ "BLOCK_CODE": "Block Code", "BLOCKS_NOT_FOUND": "Blocks not found", "STATE_NOT_FOUND": "States not found", - "DISTRICT_NOT_FOUND": "Districts not found", + "DISTRICT_NOT_FOUND": "District not found", "USERS_EMAIL": "Users Email", "STATE_NAME_REQUIRED": "State Name is Required", "DISTRICT_NAME_REQUIRED": "District Name is Required", diff --git a/src/pages/block.tsx b/src/pages/block.tsx index a7b0dd5d..ee375cba 100644 --- a/src/pages/block.tsx +++ b/src/pages/block.tsx @@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react"; import KaTableComponent from "../components/KaTableComponent"; import { DataType } from "ka-table/enums"; import HeaderComponent from "@/components/HeaderComponent"; -import { Chip, Pagination } from "@mui/material"; +import { Chip, Pagination, Typography } from "@mui/material"; import Box from "@mui/material/Box"; import FormControl from "@mui/material/FormControl"; import InputLabel from "@mui/material/InputLabel"; @@ -85,6 +85,7 @@ const Block: React.FC = () => { const [cohortId, setCohortId] = useState(); const [stateFieldId, setStateFieldId] = useState(""); const [searchKeyword, setSearchKeyword] = useState(""); + const [pagination, setPagination] = useState(true); useEffect(() => { const fetchUserDetail = async () => { @@ -221,8 +222,15 @@ const Block: React.FC = () => { const totalCount = response?.result?.totalCount || 0; setPaginationCount(totalCount); + setPagination(totalCount > 10); setPageSizeArray( - totalCount >= 15 ? [5, 10, 15, 20] : totalCount >= 10 ? [5, 10] : [5] + totalCount > 15 + ? [5, 10, 15] + : totalCount > 10 + ? [5, 10] + : totalCount > 5 + ? [5] + : [] ); setPageCount(Math.ceil(totalCount / limit)); @@ -356,14 +364,19 @@ const Block: React.FC = () => { setPageOffset(value - 1); }; const PagesSelector = () => ( - - - + <> + + + + ); const PageSizeSelectorFunction = () => ( @@ -560,29 +573,40 @@ const Block: React.FC = () => { - ({ - block: transformLabel(block.label), - createdAt: block.createdAt, - updatedAt: block.updatedAt, - createdBy: block.createdBy, - updatedBy: block.updatedBy, - value: block.value, - }))} - limit={pageLimit} - offset={pageOffset} - paginationEnable={paginationCount >= Numbers.FIVE} - PagesSelector={PagesSelector} - PageSizeSelector={PageSizeSelectorFunction} - pageSizes={pageSizeArray} - onEdit={handleEdit} - onDelete={handleDelete} - extraActions={[]} - noDataMessage={ - blockData.length === 0 ? t("COMMON.BLOCKS_NOT_FOUND") : "" - } - /> + {blockData.length > 0 ? ( + ({ + block: transformLabel(block.label), + createdAt: block.createdAt, + updatedAt: block.updatedAt, + createdBy: block.createdBy, + updatedBy: block.updatedBy, + value: block.value, + }))} + limit={pageLimit} + offset={pageOffset} + paginationEnable={paginationCount >= Numbers.FIVE} + PagesSelector={PagesSelector} + PageSizeSelector={PageSizeSelectorFunction} + pageSizes={pageSizeArray} + onEdit={handleEdit} + pagination={pagination} + onDelete={handleDelete} + extraActions={[]} + /> + ) : ( + + + {t("COMMON.BLOCKS_NOT_FOUND")} + + + )} )} diff --git a/src/pages/district.tsx b/src/pages/district.tsx index 685cca0a..d7faeb70 100644 --- a/src/pages/district.tsx +++ b/src/pages/district.tsx @@ -20,7 +20,7 @@ import { showToastMessage } from "@/components/Toastify"; import ConfirmationModal from "@/components/ConfirmationModal"; import Loader from "@/components/Loader"; import AddDistrictModal from "@/components/AddDistrictModal"; -import { Chip, Pagination } from "@mui/material"; +import { Chip, Pagination, Typography } from "@mui/material"; import PageSizeSelector from "@/components/PageSelector"; import { Numbers, SORT, Storage } from "@/utils/app.constant"; import { @@ -73,6 +73,7 @@ const District: React.FC = () => { const [cohortStatus, setCohortStatus] = useState(); const [cohortId, setCohortId] = useState(); const [stateFieldId, setStateFieldId] = useState(""); + const [pagination, setPagination] = useState(true); useEffect(() => { const fetchUserDetail = async () => { @@ -164,8 +165,15 @@ const District: React.FC = () => { const totalCount = districtData?.result?.totalCount || 0; setPaginationCount(totalCount); + setPagination(totalCount > 10); setPageSizeArray( - totalCount >= 15 ? [5, 10, 15, 20] : totalCount >= 10 ? [5, 10] : [5] + totalCount > 15 + ? [5, 10, 15] + : totalCount > 10 + ? [5, 10] + : totalCount > 5 + ? [5] + : [] ); setPageCount(Math.ceil(totalCount / limit)); @@ -292,14 +300,19 @@ const District: React.FC = () => { }; const PagesSelector = () => ( - - - + <> + + + + ); const PageSizeSelectorFunction = () => ( @@ -352,9 +365,6 @@ const District: React.FC = () => { state.value)} - // districts={districtData.map((district) => district.label)} - // selectedState={selectedState} showStateDropdown={false} handleSortChange={handleSortChange} showSort={true} @@ -376,84 +386,86 @@ const District: React.FC = () => { sx={{ minWidth: 220, marginTop: 2 }} > {stateValue} - {transformLabel(stateValue)} - ({ - label: transformLabel(districtDetail.label), - createdAt: districtDetail.createdAt, - updatedAt: districtDetail.updatedAt, - createdBy: districtDetail.createdBy, - updatedBy: districtDetail.updatedBy, - value: districtDetail.value, - }))} - limit={pageLimit} - offset={pageOffset} - paginationEnable={paginationCount >= Numbers.FIVE} - PagesSelector={PagesSelector} - PageSizeSelector={PageSizeSelectorFunction} - pageSizes={pageSizeArray} - onEdit={handleEdit} - onDelete={handleDelete} - noDataMessage={ - !districtData.length ? t("COMMON.DISTRICT_NOT_FOUND") : "" - } - extraActions={[]} - /> + {districtData.length > 0 ? ( + ({ + label: transformLabel(districtDetail.label), + createdAt: districtDetail.createdAt, + updatedAt: districtDetail.updatedAt, + createdBy: districtDetail.createdBy, + updatedBy: districtDetail.updatedBy, + value: districtDetail.value, + }))} + limit={pageLimit} + offset={pageOffset} + paginationEnable={paginationCount >= Numbers.FIVE} + PagesSelector={PagesSelector} + PageSizeSelector={PageSizeSelectorFunction} + pageSizes={pageSizeArray} + pagination={pagination} + onEdit={handleEdit} + onDelete={handleDelete} + extraActions={[]} + /> + ) : ( + + + {t("COMMON.DISTRICT_NOT_FOUND")} + + + )} )} diff --git a/src/pages/state.tsx b/src/pages/state.tsx index 6749220f..d65c5d72 100644 --- a/src/pages/state.tsx +++ b/src/pages/state.tsx @@ -13,7 +13,13 @@ import { AddStateModal } from "@/components/AddStateModal"; import ConfirmationModal from "@/components/ConfirmationModal"; import { showToastMessage } from "@/components/Toastify"; import { SORT, Numbers, Storage } from "@/utils/app.constant"; -import { Box, Chip, Pagination, SelectChangeEvent } from "@mui/material"; +import { + Box, + Chip, + Pagination, + SelectChangeEvent, + Typography, +} from "@mui/material"; import PageSizeSelector from "@/components/PageSelector"; import { createCohort, @@ -69,6 +75,7 @@ const State: React.FC = () => { const [paginationCount, setPaginationCount] = useState(Numbers.ZERO); const [userName, setUserName] = React.useState(""); const [statesProfilesData, setStatesProfilesData] = useState([]); + const [pagination, setPagination] = useState(true); const setPid = useStore((state) => state.setPid); @@ -188,14 +195,20 @@ const State: React.FC = () => { }; const PagesSelector = () => ( - - - + <> + + + + ); const PageSizeSelectorFunction = () => ( @@ -236,8 +249,15 @@ const State: React.FC = () => { console.log("totalCount", totalCount); + setPagination(totalCount > 10); setPageSizeArray( - totalCount >= 15 ? [5, 10, 15, 20] : totalCount >= 10 ? [5, 10] : [5] + totalCount > 15 + ? [5, 10, 15] + : totalCount > 10 + ? [5, 10] + : totalCount > 5 + ? [5] + : [] ); setPageCount(Math.ceil(totalCount / limit)); @@ -270,6 +290,12 @@ const State: React.FC = () => { > {loading ? ( + ) : stateData.length === 0 ? ( + + + {t("COMMON.STATE_NOT_FOUND")} + + ) : (
{ offset={pageOffset} paginationEnable={paginationCount >= Numbers.FIVE} PagesSelector={PagesSelector} + pagination={pagination} PageSizeSelector={PageSizeSelectorFunction} pageSizes={pageSizeArray} onEdit={handleEdit} @@ -295,34 +322,6 @@ const State: React.FC = () => { } extraActions={[]} /> - setAddStateModalOpen(false)} - onSubmit={(name, value) => - handleAddStateSubmit(name, value, selectedStateForEdit?.value) - } - fieldId={fieldId} - initialValues={ - selectedStateForEdit - ? { - name: selectedStateForEdit.label, - value: selectedStateForEdit.value, - } - : {} - } - /> - setConfirmationDialogOpen(false)} - />
)} From 8a82e39e542e5d344ff67ffc851124af478fbd9a Mon Sep 17 00:00:00 2001 From: rahul_g Date: Tue, 20 Aug 2024 15:18:20 +0530 Subject: [PATCH 4/4] Added inline loaders --- src/pages/block.tsx | 25 ++++++++++++++--- src/pages/district.tsx | 43 ++++++++++++++++++----------- src/pages/state.tsx | 61 +++++++++++++++++++++++------------------- 3 files changed, 84 insertions(+), 45 deletions(-) diff --git a/src/pages/block.tsx b/src/pages/block.tsx index ee375cba..6b5d5fbe 100644 --- a/src/pages/block.tsx +++ b/src/pages/block.tsx @@ -505,7 +505,14 @@ const Block: React.FC = () => { showSort={true} > {loading ? ( - + + + ) : ( <> { - {blockData.length > 0 ? ( + {loading ? ( + + + + ) : blockData.length > 0 ? ( ({ @@ -594,13 +610,16 @@ const Block: React.FC = () => { pagination={pagination} onDelete={handleDelete} extraActions={[]} + noDataMessage={ + blockData.length === 0 ? t("COMMON.BLOCKS_NOT_FOUND") : "" + } /> ) : ( {t("COMMON.BLOCKS_NOT_FOUND")} diff --git a/src/pages/district.tsx b/src/pages/district.tsx index d7faeb70..3f0f37d4 100644 --- a/src/pages/district.tsx +++ b/src/pages/district.tsx @@ -141,9 +141,9 @@ const District: React.FC = () => { fetchCohortSearch(); }, [stateCode]); - const fetchDistrictData = async (searchKeyword: string) => { + const fetchDistrictData = async (stateCode: string) => { + setLoading(true); try { - setLoading(true); const limit = pageLimit; const offset = pageOffset * limit; @@ -180,12 +180,13 @@ const District: React.FC = () => { } catch (error) { console.error("Error fetching district data:", error); setDistrictData([]); + } finally { + setLoading(false); } - setLoading(false); }; useEffect(() => { - fetchDistrictData(searchKeyword); + fetchDistrictData(stateCode); }, [searchKeyword, stateCode, sortBy, pageLimit, pageOffset]); const handleEdit = (rowData: DistrictDetail) => { @@ -376,8 +377,16 @@ const District: React.FC = () => { setSelectedStateForEdit(null); }} > + {/* Show loader if loading is true */} {loading ? ( - + + + ) : ( <> @@ -393,6 +402,7 @@ const District: React.FC = () => { + {districtData.length > 0 ? ( { onEdit={handleEdit} onDelete={handleDelete} extraActions={[]} + noDataMessage={t("COMMON.DISTRICT_NOT_FOUND")} /> ) : ( - - - {t("COMMON.DISTRICT_NOT_FOUND")} - - + !loading && ( + + + {t("COMMON.DISTRICT_NOT_FOUND")} + + + ) )} )} diff --git a/src/pages/state.tsx b/src/pages/state.tsx index d65c5d72..e2d00ecf 100644 --- a/src/pages/state.tsx +++ b/src/pages/state.tsx @@ -288,9 +288,8 @@ const State: React.FC = () => { handleSearch={handleSearch} handleAddUserClick={handleAddStateClick} > - {loading ? ( - - ) : stateData.length === 0 ? ( + {/* Check if stateData is empty */} + {stateData.length === 0 && !loading ? ( {t("COMMON.STATE_NOT_FOUND")} @@ -298,30 +297,38 @@ const State: React.FC = () => { ) : (
- ({ - label: stateDetail.label ?? "", - value: stateDetail.value ?? "", - createdAt: stateDetail.createdAt, - updatedAt: stateDetail.updatedAt, - createdBy: stateDetail.createdBy, - updatedBy: stateDetail.updatedBy, - }))} - limit={pageLimit} - offset={pageOffset} - paginationEnable={paginationCount >= Numbers.FIVE} - PagesSelector={PagesSelector} - pagination={pagination} - PageSizeSelector={PageSizeSelectorFunction} - pageSizes={pageSizeArray} - onEdit={handleEdit} - // onDelete={handleDelete} - noDataMessage={ - stateData.length === 0 ? t("COMMON.STATE_NOT_FOUND") : "" - } - extraActions={[]} - /> + {/* Show loader only for the table when loading */} + {loading ? ( + + + + ) : ( + ({ + label: stateDetail.label ?? "", + value: stateDetail.value ?? "", + createdAt: stateDetail.createdAt, + updatedAt: stateDetail.updatedAt, + createdBy: stateDetail.createdBy, + updatedBy: stateDetail.updatedBy, + }))} + limit={pageLimit} + offset={pageOffset} + paginationEnable={paginationCount >= Numbers.FIVE} + PagesSelector={PagesSelector} + pagination={pagination} + PageSizeSelector={PageSizeSelectorFunction} + pageSizes={pageSizeArray} + onEdit={handleEdit} + extraActions={[]} + /> + )}
)}