remove conflicting variable layer in metric histo select

web/frontend/src/Status.root.svelte

@@ -75,7 +75,7 @@
     );
 
   let isHistogramSelectionOpen = false;
-  $: metricsInHistograms = cluster
+  $: selectedHistograms = cluster
     ? ccconfig[`user_view_histogramMetrics:${cluster}`] || ( ccconfig['user_view_histogramMetrics'] || [] )
     : ccconfig['user_view_histogramMetrics'] || [];
 
@@ -90,7 +90,7 @@
         $metrics: [String!]
         $from: Time!
         $to: Time!
-        $metricsInHistograms: [String!]
+        $selectedHistograms: [String!]
       ) {
         nodeMetrics(
           cluster: $cluster
@@ -116,7 +116,7 @@
           }
         }
 
-        stats: jobsStatistics(filter: $filter, metrics: $metricsInHistograms) {
+        stats: jobsStatistics(filter: $filter, metrics: $selectedHistograms) {
           histDuration {
             count
             value
@@ -157,7 +157,7 @@
       from: from.toISOString(),
       to: to.toISOString(),
       filter: [{ state: ["running"] }, { cluster: { eq: cluster } }],
-      metricsInHistograms: metricsInHistograms,
+      selectedHistograms: selectedHistograms,
     },
   });
 
@@ -653,7 +653,7 @@
 
   <!-- Selectable Stats as Histograms : Average Values of Running Jobs -->
 
-  {#if metricsInHistograms}
+  {#if selectedHistograms}
     {#key $mainQuery.data.stats[0].histMetrics}
       <PlotGrid
         let:item
@@ -676,6 +676,6 @@
 
 <HistogramSelection
   bind:cluster
-  bind:metricsInHistograms
+  bind:selectedHistograms
   bind:isOpen={isHistogramSelectionOpen}
 />

web/frontend/src/User.root.svelte

@@ -68,7 +68,7 @@
   let durationBinOptions = ["1m","10m","1h","6h","12h"];
   let metricBinOptions = [10, 20, 50, 100];
 
-  $: metricsInHistograms = selectedCluster
+  $: selectedHistograms = selectedCluster
     ? ccconfig[`user_view_histogramMetrics:${selectedCluster}`] || ( ccconfig['user_view_histogramMetrics'] || [] )
     : ccconfig['user_view_histogramMetrics'] || [];
 
@@ -76,8 +76,8 @@
   $: stats = queryStore({
     client: client,
     query: gql`
-      query ($jobFilters: [JobFilter!]!, $metricsInHistograms: [String!], $numDurationBins: String, $numMetricBins: Int) {
+      query ($jobFilters: [JobFilter!]!, $selectedHistograms: [String!], $numDurationBins: String, $numMetricBins: Int) {
-        jobsStatistics(filter: $jobFilters, metrics: $metricsInHistograms, numDurationBins: $numDurationBins , numMetricBins: $numMetricBins ) {
+        jobsStatistics(filter: $jobFilters, metrics: $selectedHistograms, numDurationBins: $numDurationBins , numMetricBins: $numMetricBins ) {
           totalJobs
           shortJobs
           totalWalltime
@@ -104,7 +104,7 @@
         }
       }
     `,
-    variables: { jobFilters, metricsInHistograms, numDurationBins, numMetricBins },
+    variables: { jobFilters, selectedHistograms, numDurationBins, numMetricBins },
   });
 
   onMount(() => filterComponent.updateFilters());
@@ -290,7 +290,7 @@
     </InputGroup>
   </Col>
 </Row>
-{#if metricsInHistograms?.length > 0}
+{#if selectedHistograms?.length > 0}
   {#if $stats.error}
     <Row>
       <Col>
@@ -357,6 +357,6 @@
 
 <HistogramSelection
   bind:cluster={selectedCluster}
-  bind:metricsInHistograms
+  bind:selectedHistograms
   bind:isOpen={isHistogramSelectionOpen}
 />

web/frontend/src/generic/select/HistogramSelection.svelte

@@ -3,7 +3,7 @@
 
     Properties:
     - `cluster String`: Currently selected cluster
-    - `metricsInHistograms [String]`: The currently selected metrics to display as histogram
+    - `selectedHistograms [String]`: The currently selected metrics to display as histogram
     - ìsOpen Bool`: Is selection opened
  -->
 
@@ -21,13 +21,12 @@
   import { gql, getContextClient, mutationStore } from "@urql/svelte";
 
   export let cluster;
-  export let metricsInHistograms;
+  export let selectedHistograms;
   export let isOpen;
 
   const client = getContextClient();
   const initialized = getContext("initialized");
 
-
   function loadHistoMetrics(isInitialized, thisCluster) {
     if (!isInitialized) return [];
 
@@ -43,8 +42,6 @@
     }
   }
 
-  $: pendingMetrics = [...metricsInHistograms]; // Copy on change from above
-
   const updateConfigurationMutation = ({ name, value }) => {
     return mutationStore({
       client: client,
@@ -69,13 +66,12 @@
   }
 
   function closeAndApply() {
-    metricsInHistograms = [...pendingMetrics]; // Set for parent
     isOpen = !isOpen;
     updateConfiguration({
       name: cluster
         ? `user_view_histogramMetrics:${cluster}`
         : "user_view_histogramMetrics",
-      value: metricsInHistograms,
+      value: selectedHistograms,
     });
   }
 
@@ -89,7 +85,7 @@
     <ListGroup>
       {#each availableMetrics as metric (metric)}
         <ListGroupItem>
-          <input type="checkbox" bind:group={pendingMetrics} value={metric} />
+          <input type="checkbox" bind:group={selectedHistograms} value={metric} />
           {metric}
         </ListGroupItem>
       {/each}