From 61bd3103a5edfa834cd014dcd0ed6e4d263471ba Mon Sep 17 00:00:00 2001
From: Rijk van Zanten <rijkvanzanten@me.com>
Date: Tue, 3 Aug 2021 16:45:21 +0200
Subject: [PATCH] Fix list-selection branch mode unselect bug (#7158)

* Fix list-selection branch mode unselect bug

* Remove debugger
---
 .../v-checkbox-tree/v-checkbox-tree-checkbox.vue    | 13 +++++++++----
 app/src/components/v-list/v-list-group.vue          |  9 +++++----
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/app/src/components/v-checkbox-tree/v-checkbox-tree-checkbox.vue b/app/src/components/v-checkbox-tree/v-checkbox-tree-checkbox.vue
index 9150dec789..8656b1a91f 100644
--- a/app/src/components/v-checkbox-tree/v-checkbox-tree-checkbox.vue
+++ b/app/src/components/v-checkbox-tree/v-checkbox-tree-checkbox.vue
@@ -258,15 +258,20 @@ export default defineComponent({
 		function emitBranch(rawValue: (string | number)[], { added, removed }: Delta) {
 			const allChildrenRecursive = getRecursiveChildrenValues('all');
 
+			// Note: Added/removed is a tad confusing here, as an item that gets added to the array of
+			// selected items can immediately be negated by the logic below, as it's potentially
+			// replaced by the parent item's value
+
 			// When clicking on an individual item in the enabled group
 			if (
 				(props.modelValue.includes(props.value) || props.checked === true) &&
 				added &&
-				childrenValues.value.includes(added?.[0])
+				added.length === 1 &&
+				childrenValues.value.includes(added[0])
 			) {
 				const newValue = [
-					...rawValue.filter((val) => val !== props.value && val !== added?.[0]),
-					...childrenValues.value.filter((childVal) => childVal !== added?.[0]),
+					...rawValue.filter((val) => val !== props.value && val !== added[0]),
+					...childrenValues.value.filter((childVal) => childVal !== added[0]),
 				];
 
 				return emitValue(newValue);
@@ -446,6 +451,6 @@ export default defineComponent({
 
 <style scoped>
 .item {
-	padding-left: 32px;
+	padding-left: 32px !important;
 }
 </style>
diff --git a/app/src/components/v-list/v-list-group.vue b/app/src/components/v-list/v-list-group.vue
index f5aacc1bc4..e4795de6a8 100644
--- a/app/src/components/v-list/v-list-group.vue
+++ b/app/src/components/v-list/v-list-group.vue
@@ -1,5 +1,5 @@
 <template>
-	<div class="v-list-group">
+	<li class="v-list-group">
 		<v-list-item
 			class="activator"
 			:active="active"
@@ -29,10 +29,10 @@
 			</v-list-item-icon>
 		</v-list-item>
 
-		<div v-if="groupActive" class="items">
+		<ul v-if="groupActive" class="items">
 			<slot />
-		</div>
-	</div>
+		</ul>
+	</li>
 </template>
 
 <script lang="ts">
@@ -134,6 +134,7 @@ export default defineComponent({
 
 	.items {
 		padding-left: 16px;
+		list-style: none;
 	}
 }
 </style>