diff --git a/webapp/public/locales/en/main.json b/webapp/public/locales/en/main.json index 81b9935f03..b088d7e0cd 100644 --- a/webapp/public/locales/en/main.json +++ b/webapp/public/locales/en/main.json @@ -196,7 +196,9 @@ "study.postProcessing": "Post processing", "study.timeLimit": "Time limit (h)", "study.nbCpu": "Number of cores", - "study.clusterLoad": "Cluster load", + "study.allocatedCpuRate": "CPU usage", + "study.clusterLoadRate": "Cluster load", + "study.nbQueuedJobs": "Pending jobs", "study.synthesis": "Synthesis", "study.level": "Level", "study.years": "Years", diff --git a/webapp/public/locales/fr/main.json b/webapp/public/locales/fr/main.json index 0f1f06ad45..afa0f7bab6 100644 --- a/webapp/public/locales/fr/main.json +++ b/webapp/public/locales/fr/main.json @@ -196,7 +196,9 @@ "study.postProcessing": "Post-traitement", "study.timeLimit": "Limite de temps (h)", "study.nbCpu": "Nombre de coeurs", - "study.clusterLoad": "Charge du cluster", + "study.allocatedCpuRate": "Utilisation CPU", + "study.clusterLoadRate": "Charge du cluster", + "study.nbQueuedJobs": "Tâches en attente", "study.synthesis": "Synthèse", "study.level": "Niveau", "study.years": "Années", diff --git a/webapp/src/components/App/Tasks/JobTableView.tsx b/webapp/src/components/App/Tasks/JobTableView.tsx index 6a2003507e..6ddb3d3318 100644 --- a/webapp/src/components/App/Tasks/JobTableView.tsx +++ b/webapp/src/components/App/Tasks/JobTableView.tsx @@ -19,6 +19,7 @@ import { Checkbox, FormControlLabel, Typography, + Skeleton, } from "@mui/material"; import { useTranslation } from "react-i18next"; import RefreshIcon from "@mui/icons-material/Refresh"; @@ -27,8 +28,9 @@ import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown"; import { grey } from "@mui/material/colors"; import { TaskView, TaskType } from "../../../common/types"; import usePromiseWithSnackbarError from "../../../hooks/usePromiseWithSnackbarError"; -import { getLauncherLoad } from "../../../services/api/study"; +import { getLauncherMetrics } from "../../../services/api/study"; import LinearProgressWithLabel from "../../common/LinearProgressWithLabel"; +import UsePromiseCond from "../../common/utils/UsePromiseCond"; interface PropType { content: TaskView[]; @@ -44,11 +46,13 @@ function JobTableView(props: PropType) { useState(false); const [currentContent, setCurrentContent] = useState(content); - const { data: load, reload: reloadLauncherLoad } = - usePromiseWithSnackbarError(() => getLauncherLoad(), { + const laucherMetrics = usePromiseWithSnackbarError( + () => getLauncherMetrics(), + { errorMessage: t("study.error.launchLoad"), deps: [], - }); + }, + ); const applyFilter = useCallback( (taskList: TaskView[]) => { @@ -109,21 +113,38 @@ function JobTableView(props: PropType) { > - {t("study.clusterLoad")} - {load && ( - - )} + ( + <> + {t("study.allocatedCpuRate")} + + {t("study.clusterLoadRate")} + + + {t("study.nbQueuedJobs")}: {data.nbQueuedJobs} + + + )} + ifPending={() => } + /> @@ -131,7 +152,7 @@ function JobTableView(props: PropType) { color="primary" onClick={() => { refresh(); - reloadLauncherLoad(); + laucherMetrics.reload(); }} variant="outlined" > diff --git a/webapp/src/services/api/study.ts b/webapp/src/services/api/study.ts index 3b346e6d8d..9ee256d299 100644 --- a/webapp/src/services/api/study.ts +++ b/webapp/src/services/api/study.ts @@ -287,9 +287,11 @@ export const launchStudy = async ( return res.data; }; -interface LauncherLoadDTO { - slurm: number; - local: number; +interface LauncherMetrics { + allocatedCpuRate: number; + clusterLoadRate: number; + nbQueuedJobs: number; + status: string; } export const getLauncherVersions = async (): Promise => { @@ -302,7 +304,7 @@ export const getLauncherCores = async (): Promise> => { return res.data; }; -export const getLauncherLoad = async (): Promise => { +export const getLauncherMetrics = async (): Promise => { const res = await client.get("/v1/launcher/load"); return res.data; };