From b5a5def3a65fadddede883df0fa366abee40314c Mon Sep 17 00:00:00 2001
From: Christoph Kluge <christoph.kluge@fau.de>
Date: Mon, 8 May 2023 18:06:36 +0200
Subject: [PATCH] Adapt user jobview to new version, fix refresher

- add manually triggered refresh function to jobList
- Changing displayed metrics requires hard refresh (F5) to load data
-> Under investigation
---
 web/frontend/src/MetricSelection.svelte |  30 +++----
 web/frontend/src/joblist/JobList.svelte | 115 ++++++++++++------------
 2 files changed, 74 insertions(+), 71 deletions(-)

diff --git a/web/frontend/src/MetricSelection.svelte b/web/frontend/src/MetricSelection.svelte
index 56df34d..30b00b4 100644
--- a/web/frontend/src/MetricSelection.svelte
+++ b/web/frontend/src/MetricSelection.svelte
@@ -53,15 +53,19 @@
         }
     }
 
+    const client = getContextClient();
+    const query = gql`
+            mutation($name: String!, $value: String!) {
+                updateConfiguration(name: $name, value: $value)
+            }
+        `;
+
     const updateConfiguration = ({ name, value }) => {
-    result = mutationStore({
-        client: getContextClient(),
-        query: gql`mutation($name: String!, $value: String!) {
-            updateConfiguration(name: $name, value: $value)
-        }`,
-        variables: {name, value}
-    })
-    }
+        mutationStore({
+            client,
+            query,
+            variables: { name, value },
+    })}
 
     let columnHovering = null
 
@@ -89,13 +93,9 @@
         isOpen = false
 
         updateConfiguration({
-                name: cluster == null ? configName : `${configName}:${cluster}`,
-                value: JSON.stringify(metrics)
-            })
-            .then(res => {
-                if (res.error)
-                    console.error(res.error)
-            })
+            name: cluster == null ? configName : `${configName}:${cluster}`,
+            value: JSON.stringify(metrics)
+        })
     }
 </script>
 
diff --git a/web/frontend/src/joblist/JobList.svelte b/web/frontend/src/joblist/JobList.svelte
index 42635b7..6c9550c 100644
--- a/web/frontend/src/joblist/JobList.svelte
+++ b/web/frontend/src/joblist/JobList.svelte
@@ -34,62 +34,55 @@
     let paging = { itemsPerPage, page };
     let filter = [];
 
-    // $: {
-    //     console.log('CHANGED FILTERS IN JOBLIST TO')
-    //     console.log('filter:', ...filter.map(f => Object.entries(f)).flat(2))
-    // }
-
-    // $: {
-    //     console.log('CHANGED PAGING IN JOBLIST TO')
-    //     console.log(paging)
-    // }
+    const client = getContextClient();
+    const query = gql`
+        query (
+            $filter: [JobFilter!]!
+            $sorting: OrderByInput!
+            $paging: PageRequest!
+        ) {
+            jobs(filter: $filter, order: $sorting, page: $paging) {
+                items {
+                    id
+                    jobId
+                    user
+                    project
+                    jobName
+                    cluster
+                    subCluster
+                    startTime
+                    duration
+                    numNodes
+                    numHWThreads
+                    numAcc
+                    walltime
+                    resources {
+                        hostname
+                    }
+                    SMT
+                    exclusive
+                    partition
+                    arrayJobId
+                    monitoringStatus
+                    state
+                    tags {
+                        id
+                        type
+                        name
+                    }
+                    userData {
+                        name
+                    }
+                    metaData
+                }
+                count
+            }
+        }
+    `;
 
     $: jobs = queryStore({
-        client: getContextClient(),
-        query: gql`
-            query (
-                $filter: [JobFilter!]!
-                $sorting: OrderByInput!
-                $paging: PageRequest!
-            ) {
-                jobs(filter: $filter, order: $sorting, page: $paging) {
-                    items {
-                        id
-                        jobId
-                        user
-                        project
-                        jobName
-                        cluster
-                        subCluster
-                        startTime
-                        duration
-                        numNodes
-                        numHWThreads
-                        numAcc
-                        walltime
-                        resources {
-                            hostname
-                        }
-                        SMT
-                        exclusive
-                        partition
-                        arrayJobId
-                        monitoringStatus
-                        state
-                        tags {
-                            id
-                            type
-                            name
-                        }
-                        userData {
-                            name
-                        }
-                        metaData
-                    }
-                    count
-                }
-            }
-        `,
+        client,
+        query,
         variables: { paging, sorting, filter },
     });
 
@@ -109,8 +102,8 @@
     }
 
     const updateConfiguration = ({ value, page }) => {
-        configValue = value;
-        paging = { itemsPerPage: value, page: page };
+        configValue = value; // Trigger mutation
+        paging = { itemsPerPage: value, page: page }; // Trigger reload of jobList
     };
 
     // $: $jobs.variables = { ...$jobs.variables, sorting, paging }
@@ -131,6 +124,16 @@
         paging = paging = { page, itemsPerPage };
     }
 
+    // Force refresh list with existing unchanged variables (== usually would not trigger reactivity)
+    export function refresh() {
+        queryStore({
+                client,
+                query,
+                variables: { paging, sorting, filter },
+                requestPolicy: 'network-only'
+            });
+    }
+
     let tableWidth = null;
     let jobInfoColumnWidth = 250;
     $: plotWidth = Math.floor(