fix: more fixes

Author: aldbr

packages/diracx-web-components/package.json

@@ -99,6 +99,10 @@
     "./types": {
       "import": "./dist/types/index.js",
       "types": "./dist/types/index.d.ts"
+    },
+    "./services": {
+      "import": "./dist/services/index.js",
+      "types": "./dist/services/index.d.ts"
     }
   },
   "files": [

packages/diracx-web-components/src/components/DashboardLayout/Dashboard.tsx

@@ -8,10 +8,7 @@ import Menu from "@mui/icons-material/Menu";
 import Toolbar from "@mui/material/Toolbar";
 import Stack from "@mui/material/Stack";
 import { Typography, useMediaQuery, useTheme } from "@mui/material";
-import {
-  useApplicationTitle,
-  useApplicationType,
-} from "../../hooks/application";
+import { useCurrentApplication } from "../../hooks/application";
 import { ProfileButton } from "./ProfileButton";
 import { ThemeToggleButton } from "./ThemeToggleButton";
 import DashboardDrawer from "./DashboardDrawer";
@@ -42,8 +39,9 @@ export default function Dashboard({
   logoURL,
   documentationURL,
 }: DashboardProps) {
-  const appTitle = useApplicationTitle();
-  const appType = useApplicationType();
+  const currentApp = useCurrentApplication();
+  const appTitle = currentApp?.title ?? null;
+  const appType = currentApp?.type ?? null;
 
   /** Theme and media query */
   const theme = useTheme();

packages/diracx-web-components/src/components/JobMonitor/JobDataTable.tsx

@@ -14,7 +14,7 @@ import Delete from "@mui/icons-material/Delete";
 import Clear from "@mui/icons-material/Clear";
 import { useReactTable, getCoreRowModel } from "@tanstack/react-table";
 import { useOIDCContext } from "../../hooks/oidcConfiguration";
-import { DataTable, MenuItem } from "../shared/DataTable";
+import { DataTable, ContextMenuItem } from "../shared/DataTable";
 import type { ToolbarAction } from "../shared/DataTable/SplitActionButton";
 import { Job, JobHistory, SearchBody } from "../../types";
 import { useDiracxUrl } from "../../hooks/utils";
@@ -340,7 +340,7 @@ export const JobDataTable = memo(function JobDataTable({
   /**
    * The menu items
    */
-  const menuItems: MenuItem[] = useMemo(
+  const menuItems: ContextMenuItem[] = useMemo(
     () => [
       {
         label: "Get history",

packages/diracx-web-components/src/components/JobMonitor/jobDataService.ts

@@ -4,7 +4,7 @@ import useSWR from "swr";
 import dayjs from "dayjs";
 import utc from "dayjs/plugin/utc";
 
-import { fetcher } from "../../hooks/utils";
+import { fetcher } from "../../services/client";
 import type { JobSummary } from "../../types";
 import {
   Filter,
@@ -59,41 +59,6 @@ function processSearchBody(searchBody: SearchBody): SearchBody {
   };
 }
 
-/**
- * Deletes jobs with the specified IDs.
- *
- * @param diracxUrl - The base URL of the DiracX API.
- * @param selectedIds - An array of job IDs to delete.
- * @param accessToken - The authentication token.
- * @param accessTokenPayload - Information about the user.
- */
-export function deleteJobs(
-  diracxUrl: string | null,
-  selectedIds: readonly number[],
-  accessToken: string,
-  accessTokenPayload: Record<string, number | string>,
-) {
-  if (!diracxUrl) {
-    throw new Error("Invalid URL generated for deleting jobs.");
-  }
-
-  const deleteUrl = `${diracxUrl}/api/jobs/status`;
-
-  const currentDate = dayjs().utc().toISOString();
-
-  const body = selectedIds.reduce((acc: StatusBody, jobId) => {
-    acc[jobId] = {
-      [currentDate]: {
-        Status: "Deleted",
-        MinorStatus: "Marked for deletion",
-        Source: `User: ${accessTokenPayload["preferred_username"]}`,
-      },
-    };
-    return acc;
-  }, {});
-  return fetcher([deleteUrl, accessToken, "PATCH", body]);
-}
-
 type JobBulkResponse = {
   failed: {
     [jobId: number]: { detail: string };
@@ -114,45 +79,92 @@ type StatusBody = {
 };
 
 /**
- * Kills the specified jobs.
+ * Updates the status of jobs with the specified IDs.
  *
  * @param diracxUrl - The base URL of the DiracX API.
- * @param selectedIds - An array of job IDs to be killed.
+ * @param selectedIds - An array of job IDs to update.
  * @param accessToken - The authentication token.
  * @param accessTokenPayload - Information about the user.
+ * @param status - The new status to set (e.g. "Deleted", "Killed").
+ * @param minorStatus - The minor status message.
  * @returns A Promise that resolves to an object containing the response headers and data.
  */
-export function killJobs(
+function updateJobStatus(
   diracxUrl: string | null,
   selectedIds: readonly number[],
   accessToken: string,
   accessTokenPayload: Record<string, number | string>,
+  status: string,
+  minorStatus: string,
 ): Promise<{ headers: Headers; data: JobBulkResponse }> {
   if (!diracxUrl) {
-    throw new Error("Invalid URL generated for killing jobs.");
+    throw new Error(`Invalid URL generated for setting jobs to ${status}.`);
   }
-  const killUrl = `${diracxUrl}/api/jobs/status`;
+
   const currentDate = dayjs().utc().toISOString();
 
   const body = selectedIds.reduce((acc: StatusBody, jobId) => {
     acc[jobId] = {
       [currentDate]: {
-        Status: "Killed",
-        MinorStatus: "Marked for termination",
+        Status: status,
+        MinorStatus: minorStatus,
         Source: `User: ${accessTokenPayload["preferred_username"]}`,
       },
     };
     return acc;
   }, {});
-  return fetcher([killUrl, accessToken, "PATCH", body]);
+  return fetcher({
+    url: `${diracxUrl}/api/jobs/status`,
+    accessToken,
+    method: "PATCH",
+    body,
+  });
+}
+
+/**
+ * Deletes jobs with the specified IDs.
+ */
+export function deleteJobs(
+  diracxUrl: string | null,
+  selectedIds: readonly number[],
+  accessToken: string,
+  accessTokenPayload: Record<string, number | string>,
+) {
+  return updateJobStatus(
+    diracxUrl,
+    selectedIds,
+    accessToken,
+    accessTokenPayload,
+    "Deleted",
+    "Marked for deletion",
+  );
+}
+
+/**
+ * Kills the specified jobs.
+ */
+export function killJobs(
+  diracxUrl: string | null,
+  selectedIds: readonly number[],
+  accessToken: string,
+  accessTokenPayload: Record<string, number | string>,
+): Promise<{ headers: Headers; data: JobBulkResponse }> {
+  return updateJobStatus(
+    diracxUrl,
+    selectedIds,
+    accessToken,
+    accessTokenPayload,
+    "Killed",
+    "Marked for termination",
+  );
 }
 
 /**
  * Retrieves the job history for a given job ID.
  *
  * @param diracxUrl - The base URL of the DiracX API.
  * @param jobId - The ID of the job.
- * @param token - The authentication token.
+ * @param accessToken - The authentication token.
  * @returns A Promise that resolves to an object containing the headers and data of the job history.
  */
 export async function getJobHistory(
@@ -163,7 +175,6 @@ export async function getJobHistory(
   if (!diracxUrl) {
     throw new Error("Invalid URL generated for fetching job history.");
   }
-  const historyUrl = `${diracxUrl}/api/jobs/search`;
   const body = {
     parameters: ["LoggingInfo"],
     search: [
@@ -174,16 +185,21 @@ export async function getJobHistory(
       },
     ],
   };
-  // Expect the response to be an array of objects with JobID and LoggingInfo
   const { data } = await fetcher<
     Array<{ JobID: number; LoggingInfo: JobHistory[] }>
-  >([historyUrl, accessToken, "POST", body]);
+  >({
+    url: `${diracxUrl}/api/jobs/search`,
+    accessToken,
+    method: "POST",
+    body,
+  });
 
   return { data: data[0].LoggingInfo };
 }
 
 /**
  * Retrieves the sandbox information for a given job ID and sandbox type.
+ * @param diracxUrl - The base URL of the DiracX API.
  * @param jobId - The ID of the job.
  * @param sbType - The type of the sandbox (input or output).
  * @param accessToken - The authentication token.
@@ -195,12 +211,15 @@ export function getJobSandbox(
   sbType: "input" | "output",
   accessToken: string,
 ): Promise<{ headers: Headers; data: JobSandboxPFNResponse }> {
-  const url = `${diracxUrl}/api/jobs/${jobId}/sandbox/${sbType}`;
-  return fetcher([url, accessToken]);
+  return fetcher({
+    url: `${diracxUrl}/api/jobs/${jobId}/sandbox/${sbType}`,
+    accessToken,
+  });
 }
 
 /**
  * Retrieves the sandbox URL for a given PFN.
+ * @param diracxUrl - The base URL of the DiracX API.
  * @param pfn - The PFN of the job.
  * @param accessToken - The authentication token.
  * @returns A Promise that resolves to an object containing the headers and data of the sandbox URL.
@@ -216,8 +235,10 @@ export function getJobSandboxUrl(
       `Invalid PFN format: "${pfn}". Must start with / or a known protocol (http, https, s3, srm).`,
     );
   }
-  const url = `${diracxUrl}/api/jobs/sandbox?pfn=${encodeURIComponent(pfn)}`;
-  return fetcher([url, accessToken]);
+  return fetcher({
+    url: `${diracxUrl}/api/jobs/sandbox?pfn=${encodeURIComponent(pfn)}`,
+    accessToken,
+  });
 }
 
 /**
@@ -241,18 +262,16 @@ export async function getJobSummary(
 
   const processed = searchBody ? processSearchBody(searchBody) : searchBody;
 
-  const summaryUrl = `${diracxUrl}/api/jobs/summary`;
   const body = {
     grouping: grouping,
     search: processed?.search || [],
   };
-  // Expect the response to be an array of objects with all the grouping fields
-  const { data } = await fetcher<Array<JobSummary>>([
-    summaryUrl,
+  const { data } = await fetcher<Array<JobSummary>>({
+    url: `${diracxUrl}/api/jobs/summary`,
     accessToken,
-    "POST",
+    method: "POST",
     body,
-  ]);
+  });
 
   return { data };
 }
@@ -293,7 +312,12 @@ export function useJobSummary(
         search: processed.search || [],
       };
 
-      return await fetcher<JobSummary[]>([url, accessToken!, "POST", body]);
+      return await fetcher<JobSummary[]>({
+        url,
+        accessToken: accessToken!,
+        method: "POST",
+        body,
+      });
     },
     {
       revalidateOnMount: true,
@@ -351,7 +375,12 @@ export function useJobs(
         sort: processed.sort || [],
       };
 
-      return await fetcher<Job[]>([url, accessToken, "POST", body]);
+      return await fetcher<Job[]>({
+        url,
+        accessToken,
+        method: "POST",
+        body,
+      });
     },
     {
       revalidateOnMount: true,
@@ -380,14 +409,6 @@ export function useJobs(
   };
 }
 
-/**
- * Generates the URL for searching jobs.
- *
- * @param diracxUrl - The base URL of the DiracX API.
- * @param page - The page number for pagination.
- * @param rowsPerPage - The number of rows per page.
- * @returns The URL for the job search API endpoint.
- */
 /** Maximum number of IDs that can be fetched in a single request */
 const MAX_IDS_PER_PAGE = 10000;
 
@@ -409,7 +430,6 @@ export async function fetchMatchingJobIds(
     throw new Error("Invalid URL for fetching job IDs.");
   }
 
-  const url = `${diracxUrl}/api/jobs/search?page=1&per_page=${MAX_IDS_PER_PAGE}`;
   const body = {
     parameters: ["JobID"],
     search: searchBody.search || [],
@@ -422,12 +442,12 @@ export async function fetchMatchingJobIds(
     search: [...(body.search || [])],
   } as SearchBody);
 
-  const result = await fetcher<{ JobID: number }[]>([
-    url,
+  const result = await fetcher<{ JobID: number }[]>({
+    url: `${diracxUrl}/api/jobs/search?page=1&per_page=${MAX_IDS_PER_PAGE}`,
     accessToken,
-    "POST",
-    processedBody,
-  ]);
+    method: "POST",
+    body: processedBody,
+  });
 
   return (result.data as { JobID: number }[]).map((item) => item.JobID);
 }