Merge pull request #1450 from EvanBldy/master

[search-filters] allow groups of filters to be shared
cgwire · May 30, 2024 · e060487 · e060487
2 parents 206dd62 + 49d4a98
commit e060487
Show file tree

Hide file tree

Showing 6 changed files with 69 additions and 28 deletions.
diff --git a/src/components/modals/EditSearchFilterGroupModal.vue b/src/components/modals/EditSearchFilterGroupModal.vue
@@ -29,6 +29,12 @@
             :label="$t('main.color')"
             v-model="form.color"
           />
+
+          <boolean-field
+            :label="$t('main.is_shared')"
+            v-model="form.is_shared"
+            v-if="isCurrentUserManager && currentProduction"
+          />
         </form>
 
         <modal-footer
@@ -47,15 +53,18 @@
 /*
  * Modal used to edit filter group information.
  */
+import { mapGetters } from 'vuex'
 import { modalMixin } from '@/components/modals/base_modal'
 import ModalFooter from '@/components/modals/ModalFooter'
 import ColorField from '@/components/widgets/ColorField'
 import TextField from '@/components/widgets/TextField'
+import BooleanField from '@/components/widgets/BooleanField'
 
 export default {
   name: 'edit-search-filter-group-modal',
   mixins: [modalMixin],
   components: {
+    BooleanField,
     ColorField,
     ModalFooter,
     TextField
@@ -84,11 +93,16 @@ export default {
     return {
       form: {
         color: '',
-        name: ''
+        name: '',
+        is_shared: 'false'
       }
     }
   },
 
+  computed: {
+    ...mapGetters(['currentProduction', 'isCurrentUserManager'])
+  },
+
   methods: {
     runConfirmation(event) {
       if (!this.form.name.length) {
@@ -97,7 +111,11 @@ export default {
       }
 
       if (!event || event.keyCode === 13 || !event.keyCode) {
-        this.$emit('confirm', this.form)
+        const data = {
+          ...this.form,
+          is_shared: this.form.is_shared === 'true'
+        }
+        this.$emit('confirm', data)
       }
     }
   },
@@ -107,12 +125,14 @@ export default {
       const {
         id,
         color = '',
-        name = ''
+        name = '',
+        is_shared = false
       } = this.groupToEdit?.id ? this.groupToEdit : {}
       this.form = {
         id,
         color,
-        name
+        name,
+        is_shared: is_shared ? 'true' : 'false'
       }
     },
 

diff --git a/src/components/modals/EditSearchFilterModal.vue b/src/components/modals/EditSearchFilterModal.vue
@@ -32,11 +32,12 @@
             :label="$t('main.is_shared')"
             v-model="form.is_shared"
             v-if="isCurrentUserManager && currentProduction"
+            @click="form.search_filter_group_id = null"
           />
 
           <combobox
             :label="$t('main.filter_group')"
-            :options="groupOptions"
+            :options="allowedGroups"
             v-model="form.search_filter_group_id"
             v-if="isGroupEnabled"
           />
@@ -111,14 +112,21 @@ export default {
         name: '',
         search_filter_group_id: null,
         search_query: '',
-        is_shared: 'false',
-        task_status_id: null
+        is_shared: 'false'
       }
     }
   },
 
   computed: {
-    ...mapGetters(['currentProduction', 'isCurrentUserManager'])
+    ...mapGetters(['currentProduction', 'isCurrentUserManager']),
+
+    allowedGroups() {
+      return this.groupOptions.filter(
+        group =>
+          group.is_shared === (this.form.is_shared === 'true') ||
+          group.value === null
+      )
+    }
   },
 
   methods: {
@@ -142,22 +150,20 @@ export default {
   watch: {
     searchQueryToEdit() {
       if (this.searchQueryToEdit?.id) {
-        this.form.id = this.searchQueryToEdit.id
-        this.form.name = this.searchQueryToEdit.name
-        this.form.search_filter_group_id =
-          this.searchQueryToEdit.search_filter_group_id
-        this.form.search_query = this.searchQueryToEdit.search_query
-        this.form.is_shared = this.searchQueryToEdit.is_shared
-          ? 'true'
-          : 'false'
+        this.form = {
+          id: this.searchQueryToEdit.id,
+          name: this.searchQueryToEdit.name,
+          search_filter_group_id: this.searchQueryToEdit.search_filter_group_id,
+          search_query: this.searchQueryToEdit.search_query,
+          is_shared: this.searchQueryToEdit.is_shared ? 'true' : 'false'
+        }
       } else {
         this.form = {
           id: null,
           name: '',
           search_filter_group_id: null,
           search_query: '',
-          is_shared: 'false',
-          task_status_id: null
+          is_shared: 'false'
         }
       }
     },

diff --git a/src/components/widgets/SearchQueryList.vue b/src/components/widgets/SearchQueryList.vue
@@ -10,7 +10,10 @@
     </span>
     <span
       class="tag group"
-      :class="{ open: toggleGroupId === group.id }"
+      :class="{
+        open: toggleGroupId === group.id,
+        'is-shared': group.is_shared
+      }"
       :key="`group-${group.id}`"
       :style="{
         backgroundColor: `${group.color}23`
@@ -31,14 +34,17 @@
           class="edit"
           :style="{ backgroundColor: `${group.color}53` }"
           @click.stop="editGroup(group)"
+          v-if="!group.is_shared || isCurrentUserManager"
         >
           <edit2-icon size="0.6x" />
         </button>
         <button
           class="del"
           :style="{ backgroundColor: `${group.color}53` }"
           @click.stop="removeGroup(group)"
-          v-if="!group.queries.length"
+          v-if="
+            !group.queries.length && (!group.is_shared || isCurrentUserManager)
+          "
         >
           <trash2-icon size="0.6x" />
         </button>
@@ -53,6 +59,9 @@
         </span>
         <span
           class="tag"
+          :class="{
+            'is-shared': searchQuery.is_shared
+          }"
           :key="searchQuery.id"
           :style="{ backgroundColor: `${group.color}23` }"
           @click="changeSearch(searchQuery)"
@@ -68,22 +77,24 @@
               backgroundColor: `${group.color}53`
             }"
             @click.stop="editSearch(searchQuery)"
+            v-if="!searchQuery.is_shared || isCurrentUserManager"
           >
             <edit2-icon size="0.6x" />
           </button>
           <button
             class="del"
             :style="{ backgroundColor: `${group.color}53` }"
             @click.stop="removeSearch(searchQuery)"
+            v-if="!searchQuery.is_shared || isCurrentUserManager"
           >
             <trash2-icon size="0.6x" />
           </button>
         </span>
       </div>
     </span>
     <span
+      class="tag"
       :class="{
-        tag: true,
         'is-shared': searchQuery.is_shared
       }"
       :key="searchQuery.id"
@@ -234,7 +245,8 @@ export default {
         { label: '', value: null },
         ...this.userFilterGroups.map(group => ({
           label: group.name,
-          value: group.id
+          value: group.id,
+          is_shared: group.is_shared
         }))
       ]
     }
@@ -268,7 +280,9 @@ export default {
       try {
         this.loading.group = true
         this.errors.group = false
-
+        filterGroup.project_id = this.currentProduction
+          ? this.currentProduction.id
+          : null
         if (!filterGroup.id) {
           await this[
             `save${stringHelpers.capitalize(this.type)}SearchFilterGroup`
@@ -391,9 +405,6 @@ export default {
   transform: scale(1.1);
 }
 
-.search-queries .group.tag .group-header:hover {
-}
-
 .search-queries .group.tag.open .tag:hover {
   transform: scale(1.03);
 }

diff --git a/src/store/api/people.js b/src/store/api/people.js
@@ -257,7 +257,9 @@ export default {
   updateFilterGroup(filterGroup) {
     const data = {
       name: filterGroup.name,
-      color: filterGroup.color
+      color: filterGroup.color,
+      is_shared: filterGroup.is_shared,
+      project_id: filterGroup.project_id
     }
     return client.pput(`/api/data/user/filter-groups/${filterGroup.id}`, data)
   },

diff --git a/src/store/modules/concepts.js b/src/store/modules/concepts.js
@@ -85,7 +85,6 @@ const actions = {
 
   async newConcept({ commit, dispatch, rootGetters }, form) {
     const production = rootGetters.currentProduction
-    console.log(form)
 
     // Create Entity
     const entity = {

diff --git a/src/store/modules/user.js b/src/store/modules/user.js
@@ -704,6 +704,9 @@ const mutations = {
         )
         if (filterGroup) {
           Object.assign(filterGroup, userFilterGroup)
+          state.userFilters?.[typeName]?.[projectId].forEach(filter => {
+            filter.is_shared = userFilterGroup.is_shared
+          })
         }
       })
     })