fixup! geturl

Author: zmc

src/components/JobList/index.tsx

@@ -225,14 +225,14 @@ type JobListProps = {
 }
 
 export default function JobList({ sortMode }: JobListProps) {
-  const run: Run = useData();
+  const data_: Run = useData();
   const options = useDefaultTableOptions<Job>();
   const data = useMemo(() => {
-    return (run?.jobs || []).filter(item => {
+    return (data_?.jobs || []).filter(item => {
       item.id = String(item.job_id);
       return !! item.id;
     });
-  }, [run, sortMode]);
+  }, [data_, sortMode]);
   const table = useMaterialReactTable({
     ...options,
     columns,

src/components/RunList/index.tsx

@@ -16,7 +16,11 @@ import {
 import { type Theme } from "@mui/material/styles";
 import { parse } from "date-fns";
 
-import { formatDate, formatDay, formatDuration } from "../../lib/utils";
+import {
+  formatDate,
+  formatDuration,
+  getUrl,
+} from "../../lib/utils";
 import IconLink from "../../components/IconLink";
 import type {
   Run,
@@ -27,15 +31,12 @@ import {
   RunResultKeys,
   RunStatuses,
 } from "../../lib/paddles.d";
+import {
+  DEFAULT_PAGE_SIZE
+} from "#src/lib/paddles";
 import useDefaultTableOptions from "../../lib/table";
 
 
-const DEFAULT_PAGE_SIZE = 25;
-const NON_FILTER_PARAMS = [
-  "page",
-  "pageSize",
-];
-
 const _columns: MRT_ColumnDef<Run>[] = [
   {
     accessorKey: "name",
@@ -191,22 +192,6 @@ type RunListProps = {
   tableOptions?: Partial<MRT_TableOptions<Run>>;
 }
 
-function getUrl(path: string, filters: MRT_ColumnFiltersState, pagination: MRT_PaginationState) {
-  const newUrl = new URL(path, window.location.origin);
-  filters.forEach(item => {
-    if ( ! item.id ) return;
-    if ( item.value instanceof Function ) return;
-    if ( item.value instanceof Date ) {
-      newUrl.searchParams.set("date", formatDay(item.value));
-    } else {
-      newUrl.searchParams.set(String(item.id), String(item.value));
-    }
-  });
-  if ( pagination.pageIndex ) newUrl.searchParams.set("page", String(pagination.pageIndex));
-  if ( pagination.pageSize != DEFAULT_PAGE_SIZE ) newUrl.searchParams.set("pageSize", String(pagination.pageSize));
-  return newUrl;
-}
-
 export default function RunList(props: RunListProps) {
   const context = usePageContext();
   const { params, tableOptions } = props;
@@ -215,7 +200,7 @@ export default function RunList(props: RunListProps) {
   const columnFilters: MRT_ColumnFiltersState = [];
   Object.entries(debouncedParams).forEach(param => {
     const [id, value] = param;
-    if ( NON_FILTER_PARAMS.includes(id) ) return;
+    if ( ["page", "pageSize"].includes(id) ) return;
     if ( id === "date" && !!value ) {
       columnFilters.push({
         id: "scheduled",

src/lib/paddles.ts

@@ -13,6 +13,9 @@ import type {
 const PADDLES_SERVER =
   import.meta.env.VITE_PADDLES_SERVER || "https://paddles.front.sepia.ceph.com";
 
+// for queries which mention 'page', use this default page size if another is not specified.
+const DEFAULT_PAGE_SIZE = 25;
+
 async function queryFn (params: QueryOptions) {
   const queryKey = params.queryKey as [string, { url: string}];
   return axios.get(queryKey[1].url).then((resp) => resp.data);
@@ -42,6 +45,9 @@ function getURL(endpoint: string, params?: Record<string, string>) {
         url.pathname += `/${key}/${value}/`;
     }
   });
+  if ( ! url.searchParams.get("pageSize") ) {
+    url.searchParams.set("count", String(DEFAULT_PAGE_SIZE));
+  };
   return url;
 }
 
@@ -232,6 +238,7 @@ function useStatuses() {
 }
 
 export {
+  DEFAULT_PAGE_SIZE,
   getURL,
   queryFn,
   useBranches,