Further adaptions to new urql version

web/frontend/src/Node.root.svelte

@@ -22,10 +22,8 @@
 
     const ccconfig = getContext('cc-config')
     const clusters = getContext('clusters')
-
+    const client = getContextClient();
-    const nodesQuery = queryStore({
+    const query = gql`query($cluster: String!, $nodes: [String!], $from: Time!, $to: Time!) {
-        client: getContextClient(),
-        query: gql`query($cluster: String!, $nodes: [String!], $from: Time!, $to: Time!) {
         nodeMetrics(cluster: $cluster, nodes: $nodes, from: $from, to: $to) {
             host
             subCluster
@@ -42,15 +40,18 @@
                 }
             }
         }
-    }`,
+    }`;
+
+    $: nodesQuery = queryStore({
+        client: client,
+        query: query,
         variables: {
             cluster: cluster,
             nodes: [hostname],
             from: from.toISOString(),
-        to: to.toISOString() }
+            to: to.toISOString(),
-    })
+        }
-
+    });
-    $: $nodesQuery.variables = { cluster, nodes: [hostname], from: from.toISOString(), to: to.toISOString() }
 
     let metricUnits = {}
     $: if ($nodesQuery.data) {

web/frontend/src/PlotSelection.svelte

@@ -7,9 +7,11 @@
     export let metricsInHistograms
     export let metricsInScatterplots
 
-    const updateConfigurationMutation = ({ name, value }) => {
+    const client = getContextClient();
-    result = mutationStore({
+
-        client: getContextClient(),
+    $: updateConfigurationMutation = ({ name, value }) => {
+        mutationStore({
+            client: client,
             query: gql`mutation($name: String!, $value: String!) {
                 updateConfiguration(name: $name, value: $value)
             }`,
@@ -25,10 +27,6 @@
                 name: data.name,
                 value: JSON.stringify(data.value)
         })
-            .then(res => {
-                if (res.error)
-                    console.error(res.error)
-            });
     }
 </script>
 

web/frontend/src/Status.root.svelte

@@ -11,9 +11,9 @@
     export let cluster
 
     let plotWidths = [], colWidth1 = 0, colWidth2
-
     let from = new Date(Date.now() - 5 * 60 * 1000), to = new Date(Date.now())
-    const mainQuery = queryStore({
+
+    $: mainQuery = queryStore({
         client: getContextClient(),
         query: gql`query($cluster: String!, $filter: [JobFilter!]!, $metrics: [String!], $from: Time!, $to: Time!) {
         nodeMetrics(cluster: $cluster, metrics: $metrics, from: $from, to: $to) {
@@ -61,7 +61,6 @@
         }
     }
 
-    query(mainQuery)
 </script>
 
 <!-- Loading indicator & Refresh -->
@@ -81,13 +80,8 @@
     </Col>
     <Col xs="auto" style="margin-left: auto;">
         <Refresher initially={120} on:reload={() => {
-            console.log('reload...')
-
             from = new Date(Date.now() - 5 * 60 * 1000)
             to = new Date(Date.now())
-
-            $mainQuery.variables = { ...$mainQuery.variables, from: from, to: to }
-            $mainQuery.reexecute({ requestPolicy: 'network-only' })
         }} />
     </Col>
 </Row>

web/frontend/src/Systems.root.svelte

@@ -27,7 +27,7 @@
     let hostnameFilter = ''
     let selectedMetric = ccconfig.system_view_selectedMetric
 
-    const nodesQuery = queryStore({
+    $: nodesQuery = queryStore({
         client: getContextClient(),
         query: gql`query($cluster: String!, $metrics: [String!], $from: Time!, $to: Time!) {
         nodeMetrics(cluster: $cluster, metrics: $metrics, from: $from, to: $to) {
@@ -49,7 +49,7 @@
     }`,
     variables: {
         cluster: cluster,
-        metrics: [],
+        metrics: [selectedMetric],
         from: from.toISOString(),
         to: to.toISOString()}
     })
@@ -66,7 +66,6 @@
         }
     }
 
-    $: $nodesQuery.variables = { cluster, metrics: [selectedMetric], from: from.toISOString(), to: to.toISOString() }
 </script>
 
 <Row>