From b13d56eadc5235480ea297798abcf5ac73f51764 Mon Sep 17 00:00:00 2001
From: Mario Buikhuizen <mariobuikhuizen@gmail.com>
Date: Tue, 2 Mar 2021 17:22:08 +0100
Subject: [PATCH 1/2] Revert "fix: prevent update loop when (de)selecting data
 checkboxes quickly"

These lines is are necessary when changing the selection from the
back-end.
This reverts commit 95f3e8e201ee105cf436a3a1f69543b6e2003d41.
---
 jdaviz/app.py | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/jdaviz/app.py b/jdaviz/app.py
index ee21c7573e..e314e670b7 100644
--- a/jdaviz/app.py
+++ b/jdaviz/app.py
@@ -884,10 +884,12 @@ def vue_save_figure(self, event):
 
     def _update_selected_data_items(self, viewer_id, selected_items):
         # Find the active viewer
+        viewer_item = self._viewer_item_by_id(viewer_id)
         viewer = self._viewer_by_id(viewer_id)
 
         # Update the stored selected data items
-        data_ids = selected_items
+        viewer_item['selected_data_items'] = selected_items
+        data_ids = viewer_item['selected_data_items']
 
         active_data_labels = []
 

From a0875d8dc7621e5dfae5caa72133134d8068e7e9 Mon Sep 17 00:00:00 2001
From: Mario Buikhuizen <mariobuikhuizen@gmail.com>
Date: Tue, 2 Mar 2021 18:18:14 +0100
Subject: [PATCH 2/2] fix: prevent GUI update loop by replacing v-treeview

Due to https://github.com/vuetifyjs/vuetify/issues/13181 v-treeview
causes the update loop
---
 jdaviz/app.py        |  9 ++++++++-
 jdaviz/container.vue | 20 ++++++++++----------
 2 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/jdaviz/app.py b/jdaviz/app.py
index e314e670b7..0cf8bf9d64 100644
--- a/jdaviz/app.py
+++ b/jdaviz/app.py
@@ -866,7 +866,14 @@ def vue_data_item_selected(self, event):
         event : dict
             Traitlet event provided the 'old' and 'new' values.
         """
-        viewer_id, selected_items = event['id'], event['selected_items']
+        viewer_id, item_id, checked = event['id'], event['item_id'], event['checked']
+        viewer_item = self._viewer_item_by_id(viewer_id)
+
+        if checked:
+            selected_items = [*viewer_item['selected_data_items'], item_id]
+        else:
+            selected_items = list(filter(
+                lambda id: id != item_id, viewer_item['selected_data_items']))
 
         self._update_selected_data_items(viewer_id, selected_items)
 
diff --git a/jdaviz/container.vue b/jdaviz/container.vue
index 308c9bc937..5b8292dd4d 100644
--- a/jdaviz/container.vue
+++ b/jdaviz/container.vue
@@ -75,16 +75,16 @@
 
               <v-tabs-items v-model="viewer.tab" style="max-height: 500px; width: 350px;">
                 <v-tab-item key="0" class="overflow-y-auto" style="height: 450px">
-                  <v-treeview
-                    dense
-                    selectable
-                    :items="dataItems"
-                    hoverable
-                    v-model="viewer.selected_data_items"
-                    activatable
-                    item-disabled="locked"
-                    @input="$emit('data-item-selected', {'id': viewer.id, 'selected_items': $event})"
-                  ></v-treeview>
+                  <v-checkbox
+                    v-for="item in dataItems" :key="item.id" :label="item.name" dense hide-details
+                    :input-value="viewer.selected_data_items.includes(item.id)"
+                    @change="$emit('data-item-selected', {
+                      id: viewer.id,
+                      item_id: item.id,
+                      checked: $event
+                    })"
+                    class="pl-4"
+                  />
                 </v-tab-item>
 
                 <v-tab-item key="1" eager class="overflow-y-auto" style="height: 100%">