From d49cf5635b3b869ada5091047814ed7eb5f61887 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Sat, 27 Jun 2020 23:12:33 +0200
Subject: [PATCH] Show namespace name in list search field

Resolves #169
---
 src/components/tasks/partials/listSearch.vue | 11 +++++++++++
 src/store/modules/namespaces.js              | 10 +++++++++-
 src/styles/components/list.scss              |  4 ++++
 src/views/tasks/TaskDetailView.vue           |  2 +-
 4 files changed, 25 insertions(+), 2 deletions(-)

diff --git a/src/components/tasks/partials/listSearch.vue b/src/components/tasks/partials/listSearch.vue
index ed4826fc2..9f518a6c3 100644
--- a/src/components/tasks/partials/listSearch.vue
+++ b/src/components/tasks/partials/listSearch.vue
@@ -18,6 +18,10 @@
 		<template slot="clear" slot-scope="props">
 			<div class="multiselect__clear" v-if="list !== null && list.id !== 0" @mousedown.prevent.stop="clearAll(props.search)"></div>
 		</template>
+		<template slot="option" slot-scope="props">
+			<span class="list-namespace-title">{{ namespace(props.option.namespaceId) }} ></span>
+			{{ props.option.title }}
+		</template>
 		<span slot="noResult">No list found. Consider changing the search query.</span>
 	</multiselect>
 </template>
@@ -64,6 +68,13 @@
 			select(list) {
 				this.$emit('selected', list)
 			},
+			namespace(namespaceId) {
+				const namespace = this.$store.getters['namespaces/getNamespaceById'](namespaceId)
+				if (namespace !== null) {
+					return namespace.title
+				}
+				return 'Shared Lists'
+			},
 		},
 	}
 </script>
diff --git a/src/store/modules/namespaces.js b/src/store/modules/namespaces.js
index 7e480f0b1..0c60d62e2 100644
--- a/src/store/modules/namespaces.js
+++ b/src/store/modules/namespaces.js
@@ -60,6 +60,14 @@ export default {
 			}
 			return null
 		},
+		getNamespaceById: state => namespaceId => {
+			for (const n in state.namespaces) {
+				if (state.namespaces[n].id === namespaceId) {
+					return state.namespaces[n]
+				}
+			}
+			return null
+		},
 	},
 	actions: {
 		loadNamespaces(ctx) {
@@ -77,7 +85,7 @@ export default {
 						})
 					})
 
-					ctx.commit('lists/addLists', lists, {root:true})
+					ctx.commit('lists/addLists', lists, {root: true})
 
 					return Promise.resolve()
 				})
diff --git a/src/styles/components/list.scss b/src/styles/components/list.scss
index 2bbcb5094..cb470bcf4 100644
--- a/src/styles/components/list.scss
+++ b/src/styles/components/list.scss
@@ -142,3 +142,7 @@
     }
   }
 }
+
+.list-namespace-title {
+  color: $grey;
+}
diff --git a/src/views/tasks/TaskDetailView.vue b/src/views/tasks/TaskDetailView.vue
index ef200868a..727a5b582 100644
--- a/src/views/tasks/TaskDetailView.vue
+++ b/src/views/tasks/TaskDetailView.vue
@@ -229,7 +229,7 @@
 						</h3>
 						<div class="field has-addons">
 							<div class="control is-expanded">
-								<list-search @selected="changeList"/>
+								<list-search @selected="changeList" ref="moveList"/>
 							</div>
 						</div>
 					</div>