Fix infinite update with timeline

dodona-edu · Jun 29, 2023 · 899d0a0 · 899d0a0
1 parent 8a73c2b
commit 899d0a0
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 10 deletions.
diff --git a/web/src/components/clustering/ClusterTimeSeries.vue b/web/src/components/clustering/ClusterTimeSeries.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="timeseries" ref="timeseriesElement">
-    <graph-legend :legend.sync="legend" />
+    <graph-legend :legend="legend" readonly />
   </div>
 </template>
 
@@ -226,11 +226,6 @@ watch(
   }
 );
 
-// Update the internal legend object when the legend changes.
-watch(legend, (l) => {
-  legend.value = l;
-});
-
 // Watch width changes & update the size.
 watch(width, () => {
   draw();

diff --git a/web/src/components/graph/GraphLegend.vue b/web/src/components/graph/GraphLegend.vue
@@ -6,6 +6,7 @@
     >
       <label>
         <input
+          :disabled="readonly"
           type="checkbox"
           v-model="legendDatum.selected"
           class="legend-checkbox"
@@ -31,9 +32,10 @@ import { useVModel } from "@vueuse/core";
 
 interface Props {
   legend: Legend;
+  readonly?: boolean;
 }
 
-const props = withDefaults(defineProps<Props>(), {});
+const props = withDefaults(defineProps<Props>(), { readonly: false });
 const emit = defineEmits(["update:legend"]);
 const legendValue = useVModel(props, "legend", emit);
 

diff --git a/web/src/views/analysis/cluster.vue b/web/src/views/analysis/cluster.vue
@@ -98,7 +98,7 @@
                 node-clickable
                 @click:node="onNodeClick"
               >
-                <graph-legend :legend.sync="legend" />
+                <graph-legend :legend="legend" readonly />
               </graph>
             </v-card-text>
           </v-card>
@@ -175,4 +175,4 @@ const showHeatmap = computed(() => {
     height: 350px;
   }
 }
-</style>
+</style>
diff --git a/web/src/views/analysis/submission.vue b/web/src/views/analysis/submission.vue
@@ -126,7 +126,7 @@
                     node-clickable
                     @click:node="onNodeClick"
                   >
-                    <graph-legend :legend.sync="legend" />
+                    <graph-legend :legend="legend" readonly />
                   </graph>
                 </div>
               </v-card-text>