split statsTable data from jobMetrics query, initial commit

- mainly backend changes
- statstable changes only for prototyping

web/frontend/src/Job.root.svelte

@@ -127,28 +127,17 @@
     let job = $initq.data.job;
     if (!job) return;
 
-    const pendingMetrics = [
-      ...(
-        (
-          ccconfig[`job_view_selectedMetrics:${job.cluster}:${job.subCluster}`] ||
-          ccconfig[`job_view_selectedMetrics:${job.cluster}`]
-        ) ||
-        $initq.data.globalMetrics
-          .reduce((names, gm) => {
-            if (gm.availability.find((av) => av.cluster === job.cluster && av.subClusters.includes(job.subCluster))) {
-              names.push(gm.name);
-            }
-            return names;
-          }, [])
-      ),
-      ...(
-        (
-          ccconfig[`job_view_nodestats_selectedMetrics:${job.cluster}:${job.subCluster}`] ||
-          ccconfig[`job_view_nodestats_selectedMetrics:${job.cluster}`]
-        ) ||
-        ccconfig[`job_view_nodestats_selectedMetrics`]
-      ),
-    ];
+    const pendingMetrics = (
+      ccconfig[`job_view_selectedMetrics:${job.cluster}:${job.subCluster}`] ||
+      ccconfig[`job_view_selectedMetrics:${job.cluster}`]
+    ) ||
+    $initq.data.globalMetrics
+      .reduce((names, gm) => {
+        if (gm.availability.find((av) => av.cluster === job.cluster && av.subClusters.includes(job.subCluster))) {
+          names.push(gm.name);
+        }
+        return names;
+      }, [])
 
     // Select default Scopes to load: Check before if any metric has accelerator scope by default
     const accScopeDefault = [...pendingMetrics].some(function (m) {
@@ -343,7 +332,6 @@
         {#if item.data}
           <Metric
             bind:this={plots[item.metric]}
-            on:more-loaded={({ detail }) => statsTable.moreLoaded(detail)}
             job={$initq.data.job}
             metricName={item.metric}
             metricUnit={$initq.data.globalMetrics.find((gm) => gm.name == item.metric)?.unit}
@@ -404,15 +392,7 @@
             class="overflow-x-auto"
             active={!somethingMissing}
           >
-            {#if $jobMetrics?.data?.jobMetrics}
-              {#key $jobMetrics.data.jobMetrics}
-                <StatsTable
-                  bind:this={statsTable}
-                  job={$initq.data.job}
-                  jobMetrics={$jobMetrics.data.jobMetrics}
-                />
-              {/key}
-            {/if}
+            <StatsTable job={$initq.data.job}/>
           </TabPane>
           <TabPane tabId="job-script" tab="Job Script">
             <div class="pre-wrapper">

web/frontend/src/job/Metric.svelte

@@ -150,11 +150,6 @@
 
         // On additional scope request
         if (selectedScope == "load-all") {
-          // Push scope to statsTable (Needs to be in this case, else newly selected 'Metric.svelte' renders cause statsTable race condition)
-          const statsTableData = $metricData.data.singleUpdate.filter((x) => x.scope !== "node")
-          if (statsTableData.length > 0) {
-            dispatch("more-loaded", statsTableData);
-          }
           // Set selected scope to min of returned scopes
           selectedScope = minScope(scopes)
           nodeOnly = (selectedScope == "node") // "node" still only scope after load-all

web/frontend/src/job/StatsTable.svelte

@@ -3,13 +3,14 @@
 
     Properties:
     - `job Object`: The job object
-    - `jobMetrics [Object]`: The jobs metricdata
-
-    Exported:
-    - `moreLoaded`: Adds additional scopes requested from Metric.svelte in Job-View
  -->
 
 <script>
+  import { 
+    queryStore,
+    gql,
+    getContextClient 
+  } from "@urql/svelte";
   import { getContext } from "svelte";
   import {
     Button,
@@ -26,11 +27,6 @@
   import MetricSelection from "../generic/select/MetricSelection.svelte";
 
   export let job;
-  export let jobMetrics;
-
-  const sortedJobMetrics = [...new Set(jobMetrics.map((m) => m.name))].sort()
-  const scopesForMetric = (metric) =>
-      jobMetrics.filter((jm) => jm.name == metric).map((jm) => jm.scope);
 
   let hosts = job.resources.map((r) => r.hostname).sort(),
     selectedScopes = {},
@@ -42,29 +38,63 @@
       getContext("cc-config")[`job_view_nodestats_selectedMetrics:${job.cluster}`]
     ) || getContext("cc-config")["job_view_nodestats_selectedMetrics"];
 
-  for (let metric of sortedJobMetrics) {
-    // Not Exclusive or Multi-Node: get maxScope directly (mostly: node)
-    //   -> Else: Load smallest available granularity as default as per availability
-    const availableScopes = scopesForMetric(metric);
-    if (job.exclusive != 1 || job.numNodes == 1) {
-      if (availableScopes.includes("accelerator")) {
-        selectedScopes[metric] = "accelerator";
-      } else if (availableScopes.includes("core")) {
-        selectedScopes[metric] = "core";
-      } else if (availableScopes.includes("socket")) {
-        selectedScopes[metric] = "socket";
-      } else {
-        selectedScopes[metric] = "node";
+  const client = getContextClient();
+  const query = gql`
+    query ($dbid: ID!, $selectedMetrics: [String!]!, $selectedScopes: [MetricScope!]!) {
+      scopedJobStats(id: $dbid, metrics: $selectedMetrics, scopes: $selectedScopes) {
+        name
+        scope
+        stats {
+          hostname
+          id
+          data {
+            min
+            avg
+            max
+          }
+        }
       }
-    } else {
-      selectedScopes[metric] = maxScope(availableScopes);
     }
+  `;
 
-    sorting[metric] = {
-      min: { dir: "up", active: false },
-      avg: { dir: "up", active: false },
-      max: { dir: "up", active: false },
-    };
+  $: scopedStats = queryStore({
+    client: client,
+    query: query,
+    variables: { dbid: job.id, selectedMetrics, selectedScopes: ["node"] },
+  });
+
+  $: console.log(">>>> RESULT:", $scopedStats?.data?.scopedJobStats)
+
+  $: jobMetrics = $scopedStats?.data?.scopedJobStats || [];
+
+  const scopesForMetric = (metric) =>
+      jobMetrics.filter((jm) => jm.name == metric).map((jm) => jm.scope);
+
+  $: if ($scopedStats?.data) {
+    for (let metric of selectedMetrics) {
+      // Not Exclusive or Multi-Node: get maxScope directly (mostly: node)
+      //   -> Else: Load smallest available granularity as default as per availability
+      const availableScopes = scopesForMetric(metric);
+      if (job.exclusive != 1 || job.numNodes == 1) {
+        if (availableScopes.includes("accelerator")) {
+          selectedScopes[metric] = "accelerator";
+        } else if (availableScopes.includes("core")) {
+          selectedScopes[metric] = "core";
+        } else if (availableScopes.includes("socket")) {
+          selectedScopes[metric] = "socket";
+        } else {
+          selectedScopes[metric] = "node";
+        }
+      } else {
+        selectedScopes[metric] = maxScope(availableScopes);
+      }
+
+      sorting[metric] = {
+        min: { dir: "up", active: false },
+        avg: { dir: "up", active: false },
+        max: { dir: "up", active: false },
+      };
+    }
   }
 
   function sortBy(metric, stat) {
@@ -90,13 +120,6 @@
     });
   }
 
-  export function moreLoaded(moreJobMetrics) {
-    moreJobMetrics.forEach(function (newMetric) {
-      if (!jobMetrics.some((m) => m.scope == newMetric.scope)) {
-        jobMetrics = [...jobMetrics, newMetric]
-      }
-    });
-  };
 </script>
 
 <Row>

web/frontend/src/job/StatsTableEntry.svelte

@@ -37,8 +37,8 @@
         return s.dir != "up" ? a[field] - b[field] : b[field] - a[field];
       } else {
         return s.dir != "up"
-          ? a.statistics[field] - b.statistics[field]
-          : b.statistics[field] - a.statistics[field];
+          ? a.data[field] - b.data[field]
+          : b.data[field] - a.data[field];
       }
     });
   }
@@ -52,7 +52,7 @@
 
   $: series = jobMetrics
     .find((jm) => jm.name == metric && jm.scope == scope)
-    ?.metric.series.filter((s) => s.hostname == host && s.statistics != null)
+    ?.stats.filter((s) => s.hostname == host && s.data != null)
     ?.sort(compareNumbers);
 </script>
 
@@ -60,13 +60,13 @@
   <td colspan={scope == "node" ? 3 : 4}><i>No data</i></td>
 {:else if series.length == 1 && scope == "node"}
   <td>
-    {series[0].statistics.min}
+    {series[0].data.min}
   </td>
   <td>
-    {series[0].statistics.avg}
+    {series[0].data.avg}
   </td>
   <td>
-    {series[0].statistics.max}
+    {series[0].data.max}
   </td>
 {:else}
   <td colspan="4">
@@ -86,9 +86,9 @@
       {#each series as s, i}
         <tr>
           <th>{s.id ?? i}</th>
-          <td>{s.statistics.min}</td>
-          <td>{s.statistics.avg}</td>
-          <td>{s.statistics.max}</td>
+          <td>{s.data.min}</td>
+          <td>{s.data.avg}</td>
+          <td>{s.data.max}</td>
         </tr>
       {/each}
     </table>

web/frontend/src/job/jobsummary/JobFootprintPolar.svelte

@@ -40,14 +40,14 @@
     const client = getContextClient();
     const polarQuery = gql`
     query ($dbid: ID!, $selectedMetrics: [String!]!) {
-        jobMetricStats(id: $dbid, metrics: $selectedMetrics) {
+      jobStats(id: $dbid, metrics: $selectedMetrics) {
         name
         stats {
-            min
-            avg
-            max
-        }
+          min
+          avg
+          max
         }
+      }
     }
     `;
 
@@ -66,7 +66,7 @@
   {:else}
     <Polar
       {polarMetrics}
-      polarData={$polarData.data.jobMetricStats}
+      polarData={$polarData.data.jobStats}
     />
   {/if}
 </CardBody>