This commit is contained in:
estifanos
2026-08-11 11:48:09 +00:00
parent 18de7b1c1d
commit 7c3a25245f
9 changed files with 57 additions and 24 deletions

View File

@@ -75,7 +75,7 @@ export function CertificationPage() {
const locale = i18n.language as 'en' | 'am';
const { handleError } = useErrorHandler();
const { data, isFetching, isError, refetch } = useGetCertificationsQuery();
const { setPageIndex, pageSize, paginate } = useServerTable();
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable();
const [createCert, { isLoading: isCreating }] = useCreateCertificationMutation();
const [updateCert, { isLoading: isUpdating }] = useUpdateCertificationMutation();
const [deleteCert] = useDeleteCertificationMutation();
@@ -191,6 +191,7 @@ export function CertificationPage() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
refresh={refetch}
isLoading={isFetching}
emptyText={t('certification.noItems')}

View File

@@ -353,7 +353,7 @@ export function ExamPage() {
const locale = i18n.language as "en" | "am";
const { data: certRes } = useGetCertificationsQuery();
const { data, isFetching, isError, refetch } = useGetExamsQuery();
const { setPageIndex, pageSize, paginate } = useServerTable();
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable();
const [createExam, { isLoading: isCreating }] = useCreateExamMutation();
const [updateExam, { isLoading: isUpdating }] = useUpdateExamMutation();
const [deleteExam] = useDeleteExamMutation();
@@ -580,6 +580,7 @@ export function ExamPage() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
refresh={refetch}
isLoading={isFetching}
emptyText={t("exam.noItems")}

View File

@@ -130,6 +130,7 @@ export function LicenseQueuePage() {
() => (searchParams.get("view") as SavedViewId) || readLastView(),
);
const [page, setPage] = useState(() => Number(searchParams.get("page")) || 1);
const [pageSize, setPageSize] = useState(PAGE_SIZE);
const [selected, setSelected] = useState<string[]>([]);
const [searchInput, setSearchInput] = useState(searchParams.get("q") ?? "");
const [cursor, setCursor] = useState(0);
@@ -166,10 +167,10 @@ export function LicenseQueuePage() {
urlFilter.sortBy ??
(activeView.id === "mine" ? "submittedAt" : "submittedAt"),
sortDir: urlFilter.sortDir ?? "DESC",
take: PAGE_SIZE,
skip: (page - 1) * PAGE_SIZE,
take: pageSize,
skip: (page - 1) * pageSize,
}),
[activeView, urlFilter, debouncedSearch, pinnedTypeId, page],
[activeView, urlFilter, debouncedSearch, pinnedTypeId, page, pageSize],
);
// One query per source; the two inactive ones are skipped, so switching
@@ -688,8 +689,8 @@ export function LicenseQueuePage() {
<Group justify="flex-end" p="sm" pb={0}>
<Text size="sm" c="dimmed">
{t("queue.showing", {
from: (page - 1) * PAGE_SIZE + 1,
to: Math.min(page * PAGE_SIZE, total),
from: (page - 1) * pageSize + 1,
to: Math.min(page * pageSize, total),
total,
defaultValue: "Showing {{from}}{{to}} of {{total}}",
})}
@@ -706,7 +707,12 @@ export function LicenseQueuePage() {
setPage(next);
updateUrl({}, view, next);
}}
pageSize={PAGE_SIZE}
pageSize={pageSize}
onPageSizeChange={(next) => {
setPageSize(next);
setPage(1);
updateUrl({}, view, 1);
}}
refresh={() => active.refetch()}
isLoading={active.isFetching}
verticalSpacing={density === "compact" ? 4 : "sm"}

View File

@@ -218,6 +218,8 @@ export function MedicalVerificationPage() {
const [medicalPage, setMedicalPage] = useState(0);
const [seaServicePage, setSeaServicePage] = useState(0);
const [medicalPageSize, setMedicalPageSize] = useState(PAGE_SIZE);
const [seaServicePageSize, setSeaServicePageSize] = useState(PAGE_SIZE);
const rule = useCallback(
async (run: () => Promise<unknown>, done: string): Promise<void> => {
@@ -241,14 +243,24 @@ export function MedicalVerificationPage() {
);
const pagedMedical = useMemo(() => {
const start = medicalPage * PAGE_SIZE;
return pendingMedicalList.slice(start, start + PAGE_SIZE);
}, [pendingMedicalList, medicalPage]);
const start = medicalPage * medicalPageSize;
return pendingMedicalList.slice(start, start + medicalPageSize);
}, [pendingMedicalList, medicalPage, medicalPageSize]);
const pagedSeaService = useMemo(() => {
const start = seaServicePage * PAGE_SIZE;
return pendingSeaServiceList.slice(start, start + PAGE_SIZE);
}, [pendingSeaServiceList, seaServicePage]);
const start = seaServicePage * seaServicePageSize;
return pendingSeaServiceList.slice(start, start + seaServicePageSize);
}, [pendingSeaServiceList, seaServicePage, seaServicePageSize]);
const handleMedicalPageSizeChange = useCallback((size: number) => {
setMedicalPageSize(size);
setMedicalPage(0);
}, []);
const handleSeaServicePageSizeChange = useCallback((size: number) => {
setSeaServicePageSize(size);
setSeaServicePage(0);
}, []);
const medicalColumns: AdvancedColumn<MedicalCertificate>[] = useMemo(
() => [
@@ -491,7 +503,8 @@ export function MedicalVerificationPage() {
itemCount={pendingMedicalList.length}
pageIndex={medicalPage}
onPageChange={setMedicalPage}
pageSize={PAGE_SIZE}
pageSize={medicalPageSize}
onPageSizeChange={handleMedicalPageSizeChange}
refresh={refetchMedical}
isLoading={loadingMedical || fetchingMedical}
emptyText="Nothing awaiting verification."
@@ -506,7 +519,8 @@ export function MedicalVerificationPage() {
itemCount={pendingSeaServiceList.length}
pageIndex={seaServicePage}
onPageChange={setSeaServicePage}
pageSize={PAGE_SIZE}
pageSize={seaServicePageSize}
onPageSizeChange={handleSeaServicePageSizeChange}
refresh={refetchSeaService}
isLoading={loadingSeaService || fetchingSeaService}
emptyText="Nothing awaiting verification."

View File

@@ -123,7 +123,7 @@ export function QuestionPage() {
const { handleError } = useErrorHandler();
const { data: certRes } = useGetCertificationsQuery();
const { data, isFetching, isError, refetch } = useGetQuestionsQuery();
const { setPageIndex, pageSize, paginate } = useServerTable();
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable();
const [createQ, { isLoading: isCreating }] = useCreateQuestionMutation();
const [updateQ, { isLoading: isUpdating }] = useUpdateQuestionMutation();
const [deleteQ] = useDeleteQuestionMutation();
@@ -341,6 +341,7 @@ export function QuestionPage() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
refresh={refetch}
isLoading={isFetching}
emptyText={t('question.noQuestions')}

View File

@@ -120,7 +120,7 @@ export function ResultPage() {
const { handleError } = useErrorHandler();
const { data: examRes } = useGetExamsQuery();
const { data, isFetching, isError, refetch } = useGetResultsQuery();
const { setPageIndex, pageSize, paginate } = useServerTable();
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable();
const [fetchDetail, { data: detailResult, isFetching: isDetailLoading }] = useLazyGetResultQuery();
const exams = examRes?.items ?? [];
@@ -452,6 +452,7 @@ export function ResultPage() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
refresh={refetch}
isLoading={isFetching}
emptyText={t('result.noItems')}

View File

@@ -334,7 +334,7 @@ export function SeafarerRegistryPage() {
method: 'GET',
params: { q: 'i=profession,address&t=200' },
});
const { setPageIndex, pageSize, paginate } = useServerTable();
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable();
const items = (data?.items ?? []).filter((p) => {
if (!search.trim()) return true;
@@ -446,6 +446,7 @@ export function SeafarerRegistryPage() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
refresh={refetch}
isLoading={isLoading}
emptyText={search ? 'No profiles match that search.' : 'No seafarers registered yet.'}

View File

@@ -104,8 +104,12 @@ export function MyApplicationsPage() {
const items = data?.items ?? [];
const licenceItems = licences?.items ?? [];
const { setPageIndex: setLicencePage, pageSize: licencePageSize, paginate: paginateLicences } =
useServerTable({ pageSize: 10 });
const {
setPageIndex: setLicencePage,
pageSize: licencePageSize,
setPageSize: setLicencePageSize,
paginate: paginateLicences,
} = useServerTable({ pageSize: 10 });
const licencePage = paginateLicences(licenceItems);
const licenceColumns: AdvancedColumn<IssuedLicense>[] = [
@@ -154,7 +158,7 @@ export function MyApplicationsPage() {
},
];
const { setPageIndex, pageSize, paginate } = useServerTable({ pageSize: 10 });
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable({ pageSize: 10 });
const page = paginate(items);
const applicationColumns: AdvancedColumn<LicenseApplication>[] = [
@@ -284,6 +288,7 @@ export function MyApplicationsPage() {
pageIndex={licencePage.pageIndex}
onPageChange={setLicencePage}
pageSize={licencePageSize}
onPageSizeChange={setLicencePageSize}
refresh={refetchLicences}
isLoading={isFetchingLicences}
/>
@@ -324,6 +329,7 @@ export function MyApplicationsPage() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
refresh={refetch}
isLoading={isFetching}
/>

View File

@@ -237,7 +237,7 @@ function SeaServiceTab() {
form.dischargeDate &&
form.engagementDate < form.dischargeDate;
const { setPageIndex, pageSize, paginate } = useServerTable({ pageSize: 10 });
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable({ pageSize: 10 });
const page = paginate(records ?? []);
const columns: AdvancedColumn<SeaServiceRecord>[] = [
@@ -348,6 +348,7 @@ function SeaServiceTab() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
isLoading={isLoading}
refresh={refetch}
/>
@@ -537,7 +538,7 @@ function MedicalTab() {
const today = new Date().toISOString().slice(0, 10);
const { setPageIndex, pageSize, paginate } = useServerTable({ pageSize: 10 });
const { setPageIndex, pageSize, setPageSize, paginate } = useServerTable({ pageSize: 10 });
const page = paginate(certificates ?? []);
const columns: AdvancedColumn<MedicalCertificate>[] = [
@@ -654,6 +655,7 @@ function MedicalTab() {
pageIndex={page.pageIndex}
onPageChange={setPageIndex}
pageSize={pageSize}
onPageSizeChange={setPageSize}
isLoading={isLoading}
refresh={refetch}
/>