Add a new job view

PythonCoderAS · PythonCoderAS · commit 911655ec3859 · 2024-01-26T11:06:16.000-05:00
diff --git a/frontend/src/routes/batch/ViewBatch.tsx b/frontend/src/routes/batch/ViewBatch.tsx
@@ -6,13 +6,13 @@ import Error404 from "../404";
 import { SetTitleContext } from "../../AppFrame";
 import { Batch, GET, RepeatURL } from "../../api/api";
 import InlineSkeletonDisplay from "../../misc/InlineSkeletonDisplay";
+import ViewJobs from "../job/ViewJobs";
 
 const theme = createTheme();
 
 export default function ViewBatch() {
   const { batchId } = useParams<{ batchId: string }>();
 
-  const [counter, setCounter] = useState(0);
   const setTitle = useContext(SetTitleContext);
 
   const [batch, setBatch] = useState<Batch | null>(null);
@@ -24,17 +24,10 @@ export default function ViewBatch() {
     }
     GET("/batch/{batch_id}", {
       params: { path: { batch_id: Number(batchId) } },
-    })
-      .then(({ data }) => {
-        setBatch(data ?? null);
-        if (data?.repeat_url && repeatURL === null) {
-          // No-op
-          // To-do: GET the repeat URL
-        }
-      })
-      .finally(() => setTimeout(() => setCounter(counter + 1), 10000));
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- This is a clock function
-  }, [counter]);
+    }).then(({ data }) => {
+      setBatch(data ?? null);
+    });
+  }, [batchId]);
 
   useEffect(() => {
     setTitle("Batch " + batchId);
@@ -82,6 +75,7 @@ export default function ViewBatch() {
       </section>
       <section>
         <h2>Jobs</h2>
+        <ViewJobs url={`/job/grid_sort?batch_id=${batchId}`} height="75vh" />
       </section>
     </div>
   );
diff --git a/frontend/src/routes/job/ViewJobs.tsx b/frontend/src/routes/job/ViewJobs.tsx
@@ -11,29 +11,39 @@ import { DateTime } from "luxon";
 import { Job } from "../../api/api";
 import BatchChip from "../../misc/BatchChip";
 
-export default function ViewJobs() {
-  const retColDefs: [
-    ColDef<Job, number>,
-    ColDef<Job>,
-    ColDef<Job, string | null>,
-  ] = [
+export default function ViewJobs({ height = "80vh", url = "/job/grid_sort" }) {
+  const retColDefs: [ColDef<Job, number>, ColDef<Job, string | null>] = [
     {
       field: "retry",
       headerName: "Retries Used",
       sortable: true,
-      filter: true,
-    },
-    {
-      valueGetter: (params) => 4 - (params.data?.retry ?? 0),
-      headerName: "Retries Left",
-      sortable: true,
-      filter: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agNumberColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
     },
     {
       field: "delayed_until",
       headerName: "Delayed Until",
       sortable: true,
-      filter: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agDateColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
     },
   ];
   const colDefs: [
@@ -46,13 +56,53 @@ export default function ViewJobs() {
     ColDef<Job, string>,
     ColDef<Job, number>,
   ] = [
-    { field: "id", headerName: "ID", sortable: true, filter: true },
-    { field: "url", headerName: "URL", sortable: true, filter: true },
+    {
+      field: "id",
+      headerName: "ID",
+      sortable: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agNumberColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
+    },
+    {
+      field: "url",
+      headerName: "URL",
+      sortable: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agTextColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
+    },
     {
       field: "batches",
       headerName: "Batches",
-      sortable: true,
-      filter: true,
+      sortable: false,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agNumberColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
       cellRenderer(params: ICellRendererParams<Job, number[] | undefined>) {
         return (params.value ?? []).map((batchId) => (
           <>
@@ -66,7 +116,17 @@ export default function ViewJobs() {
       field: "completed",
       headerName: "Archive URL",
       sortable: true,
-      filter: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agDateColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
       cellRenderer(params: ICellRendererParams<Job, string | null>) {
         if (params.value === null || params.value === undefined) {
           return null;
@@ -78,7 +138,22 @@ export default function ViewJobs() {
         return <a href={archiveURLString}>{archiveURLString}</a>;
       },
     },
-    { field: "failed", headerName: "Failed At", sortable: true, filter: true },
+    {
+      field: "failed",
+      headerName: "Failed At",
+      sortable: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agDateColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
+    },
     {
       headerName: "Retries",
       children: retColDefs,
@@ -87,19 +162,44 @@ export default function ViewJobs() {
       field: "created_at",
       headerName: "Created At",
       sortable: true,
-      filter: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agDateColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
+    },
+    {
+      field: "priority",
+      headerName: "Priority",
+      sortable: true,
+      filter: "agMultiColumnFilter",
+      filterParams: {
+        filters: [
+          {
+            filter: "agNumberColumnFilter",
+          },
+          {
+            filter: "agSetColumnFilter",
+          },
+        ],
+      },
     },
-    { field: "priority", headerName: "Priority", sortable: true, filter: true },
   ];
 
   return (
-    <div className="ag-theme-quartz" style={{ height: "80vh" }}>
+    <div className="ag-theme-quartz" style={{ height }}>
       <AgGridReact
         rowModelType="serverSide"
         columnDefs={colDefs}
         serverSideDatasource={{
           getRows(params: IServerSideGetRowsParams<Job>) {
-            fetch("/job/grid_sort", {
+            fetch(url, {
               body: JSON.stringify(params.request),
               method: "POST",
               headers: {
diff --git a/src/routes/job/grid_sort.py b/src/routes/job/grid_sort.py
@@ -1,17 +1,19 @@
 from typing import Iterable
 from ...main import app, async_session
-from ...models import Job
+from ...models import URL, Batch, Job
 from sqlalchemy import select
 import sqlalchemy.orm
 
 from . import JobReturn
 
 from ...server_side_grid import IServerSideGetRowsRequest, LoadSuccessParams
 
+sort_map = {"url": URL.url}
+
 
 @app.post("/job/grid_sort")
 async def get_job_grid_sort(
-    request: IServerSideGetRowsRequest,
+    request: IServerSideGetRowsRequest, batch_id: int | None = None
 ) -> LoadSuccessParams[JobReturn]:
     """Get job grid sort."""
 
@@ -24,7 +26,17 @@ async def get_job_grid_sort(
         .offset(offset)
         .limit(limit)
     )
+    if request.sortModel:
+        for sort in request.sortModel:
+            sort_attribute = sort_map.get(sort.colId, None) or getattr(Job, sort.colId)
+            if sort.sort == "asc":
+                query = query.order_by(sort_attribute)
+            else:
+                query = query.order_by(sort_attribute.desc())
     count_query = select(sqlalchemy.func.count(Job.id))
+    if batch_id:
+        query = query.where(Job.batches.any(Batch.id == batch_id))
+        count_query = count_query.where(Job.batches.any(Batch.id == batch_id))
     async with async_session() as session, session.begin():
         data: Iterable[Job] = await session.scalars(query)
         result = [JobReturn.from_job(row) for row in data.unique()]
