diff --git a/ui/src/pages/certificates/CertificateList.tsx b/ui/src/pages/certificates/CertificateList.tsx index af93f3544..665b14e0d 100644 --- a/ui/src/pages/certificates/CertificateList.tsx +++ b/ui/src/pages/certificates/CertificateList.tsx @@ -171,10 +171,10 @@ const CertificateList = () => { run: refreshData, } = useRequest( () => { + const { columnKey: sorterKey, order: sorterOrder } = sorter; let sort: string | undefined; - if (sorter.columnKey === "expiry") { - sort = sorter.order === "ascend" ? "expireAt" : sorter.order === "descend" ? "-expireAt" : ""; - } + sort = sorterKey === "expiry" ? "expireAt" : ""; + sort = sort && (sorterOrder === "ascend" ? `${sort}` : sorterOrder === "descend" ? `-${sort}` : undefined); return listCertificates({ keyword: filters["keyword"] as string, diff --git a/ui/src/pages/workflows/WorkflowList.tsx b/ui/src/pages/workflows/WorkflowList.tsx index d287c04f9..6a459ae63 100644 --- a/ui/src/pages/workflows/WorkflowList.tsx +++ b/ui/src/pages/workflows/WorkflowList.tsx @@ -27,6 +27,9 @@ const WorkflowList = () => { state: searchParams.get("state"), }; }); + const [sorter, setSorter] = useState["onChange"]>>[2]>>(() => { + return {}; + }); const [page, setPage] = useState(() => parseInt(+searchParams.get("page")! + "") || 1); const [pageSize, setPageSize] = useState(() => parseInt(+searchParams.get("perPage")! + "") || 15); @@ -94,6 +97,8 @@ const WorkflowList = () => { { key: "lastRun", title: t("workflow.props.last_run_at"), + sorter: true, + sortOrder: sorter.columnKey === "lastRun" ? sorter.order : undefined, render: (_, record) => { return ( @@ -165,15 +170,21 @@ const WorkflowList = () => { run: refreshData, } = useRequest( () => { + const { columnKey: sorterKey, order: sorterOrder } = sorter; + let sort: string | undefined; + sort = sorterKey === "lastRun" ? "lastRunTime" : ""; + sort = sort && (sorterOrder === "ascend" ? `${sort}` : sorterOrder === "descend" ? `-${sort}` : undefined); + return listWorkflows({ keyword: filters["keyword"] as string, enabled: (filters["state"] as string) === "enabled" ? true : (filters["state"] as string) === "disabled" ? false : undefined, + sort: sort, page: page, perPage: pageSize, }); }, { - refreshDeps: [filters, page, pageSize], + refreshDeps: [filters, sorter, page, pageSize], onSuccess: (res) => { setTableData(res.items); setTableTotal(res.totalItems); @@ -381,6 +392,9 @@ const WorkflowList = () => { rowClassName="cursor-pointer" rowKey={(record) => record.id} scroll={{ x: "max(100%, 960px)" }} + onChange={(_, __, sorter) => { + setSorter(Array.isArray(sorter) ? sorter[0] : sorter); + }} onRow={(record) => ({ onClick: () => { handleRecordDetailClick(record); diff --git a/ui/src/repository/certificate.ts b/ui/src/repository/certificate.ts index 5d7c1bb9a..bdfb28925 100644 --- a/ui/src/repository/certificate.ts +++ b/ui/src/repository/certificate.ts @@ -28,6 +28,7 @@ export const list = async (request: ListRequest) => { const page = request.page || 1; const perPage = request.perPage || 10; + return pb.collection(COLLECTION_NAME_CERTIFICATE).getList(page, perPage, { expand: "workflowId", filter: filters.join(" && "), diff --git a/ui/src/repository/workflow.ts b/ui/src/repository/workflow.ts index 5701927c1..37b3c21c3 100644 --- a/ui/src/repository/workflow.ts +++ b/ui/src/repository/workflow.ts @@ -6,6 +6,7 @@ import { COLLECTION_NAME_WORKFLOW, getPocketBase } from "./_pocketbase"; export type ListRequest = { keyword?: string; enabled?: boolean; + sort?: string; page?: number; perPage?: number; }; @@ -21,11 +22,14 @@ export const list = async (request: ListRequest) => { filters.push(pb.filter("enabled={:enabled}", { enabled: request.enabled })); } + const sort = request.sort || "-created"; + const page = request.page || 1; const perPage = request.perPage || 10; + return await pb.collection(COLLECTION_NAME_WORKFLOW).getList(page, perPage, { filter: filters.join(" && "), - sort: "-created", + sort: sort, requestKey: null, }); };