Consolidate deleted and hidden attribute handling into filter text

client/src/components/History/CurrentHistory/HistoryFilters.vue

@@ -1,7 +1,7 @@
 <template>
     <div>
         <b-input-group>
-            <DebouncedInput v-model="filterText" v-slot="{ value, input }">
+            <DebouncedInput v-model="localFilter" v-slot="{ value, input }">
                 <b-form-input
                     size="sm"
                     :value="value"
@@ -10,14 +10,6 @@
                     data-description="filter text input" />
             </DebouncedInput>
             <b-input-group-append>
-                <b-button
-                    size="sm"
-                    :pressed="showDeleted"
-                    :variant="showDeleted ? 'info' : 'secondary'"
-                    @click="showDeleted = !showDeleted"
-                    data-description="show deleted filter toggle">
-                    <icon icon="trash" />
-                </b-button>
                 <b-button
                     size="sm"
                     :pressed="showAdvanced"
@@ -27,7 +19,7 @@
                     <icon v-if="showAdvanced" icon="angle-double-up" />
                     <icon v-else icon="angle-double-down" />
                 </b-button>
-                <b-button size="sm" @click="filterText = ''" data-description="show deleted filter toggle">
+                <b-button size="sm" @click="onReset" data-description="show deleted filter toggle">
                     <icon icon="times" />
                 </b-button>
             </b-input-group-append>
@@ -75,7 +67,7 @@ export default {
         DebouncedInput,
     },
     props: {
-        params: { type: Object, required: true },
+        filterText: { type: String, default: null },
         showAdvanced: { type: Boolean, default: false },
     },
     data() {
@@ -93,40 +85,20 @@ export default {
         };
     },
     computed: {
-        filterText: {
+        localFilter: {
             get() {
-                return this.params.filterText;
+                return this.filterText;
             },
             set(newVal) {
-                const newParams = Object.assign({}, this.params);
-                newParams.filterText = newVal;
-                this.updateParams(newParams);
-            },
-        },
-        showDeleted: {
-            get() {
-                return this.params.showDeleted;
-            },
-            set(newFlag) {
-                const newParams = Object.assign({}, this.params);
-                newParams.showDeleted = newFlag;
-                this.updateParams(newParams);
-            },
-        },
-        showHidden: {
-            get() {
-                return this.params.showHidden;
-            },
-            set(newFlag) {
-                const newParams = Object.assign({}, this.params);
-                newParams.showHidden = newFlag;
-                this.updateParams(newParams);
+                this.updateFilter(newVal);
             },
         },
     },
     methods: {
+        onReset() {
+            this.updateFilter("");
+        },
         onSearch() {
-            const newParams = Object.assign({}, this.params);
             let newFilterText = "";
             Object.entries(this.filterAdvanced).filter(([key, value]) => {
                 if (value) {
@@ -136,15 +108,14 @@ export default {
                     newFilterText += `${key}'${value}'`;
                 }
             });
-            newParams.filterText = newFilterText;
-            this.updateParams(newParams);
             this.onToggle();
+            this.updateFilter(newFilterText);
         },
         onToggle() {
             this.$emit("update:show-advanced", !this.showAdvanced);
         },
-        updateParams(newParams) {
-            this.$emit("update:params", newParams);
+        updateFilter(newFilterText) {
+            this.$emit("update:filter-text", newFilterText);
         },
     },
 };

client/src/components/History/CurrentHistory/HistoryOperations.vue

@@ -33,19 +33,19 @@
                     <b-dropdown-text>
                         <span v-localize>With {{ numSelected }} selected...</span>
                     </b-dropdown-text>
-                    <b-dropdown-item v-if="params.showHidden" v-b-modal:show-selected-content>
+                    <b-dropdown-item v-if="showHidden" v-b-modal:show-selected-content>
                         <span v-localize>Unhide</span>
                     </b-dropdown-item>
                     <b-dropdown-item v-else v-b-modal:hide-selected-content>
                         <span v-localize>Hide</span>
                     </b-dropdown-item>
-                    <b-dropdown-item v-if="params.showDeleted" v-b-modal:restore-selected-content>
+                    <b-dropdown-item v-if="showDeleted" v-b-modal:restore-selected-content>
                         <span v-localize>Undelete</span>
                     </b-dropdown-item>
                     <b-dropdown-item v-else v-b-modal:delete-selected-content>
                         <span v-localize>Delete</span>
                     </b-dropdown-item>
-                    <b-dropdown-item v-if="!params.showDeleted" v-b-modal:purge-selected-content>
+                    <b-dropdown-item v-if="!showDeleted" v-b-modal:purge-selected-content>
                         <span v-localize>Delete (permanently)</span>
                     </b-dropdown-item>
                     <b-dropdown-item v-if="showBuildOptions" @click="buildDatasetList" data-description="build list">
@@ -146,23 +146,21 @@ import { buildCollectionModal } from "components/History/adapters/buildCollectio
 export default {
     props: {
         history: { type: History, required: true },
-        params: { type: Object, required: true },
+        filterText: { type: String, default: null },
         contentSelection: { type: Map, required: true },
         showSelection: { type: Boolean, required: true },
         hasMatches: { type: Boolean, required: true },
         expandedCount: { type: Number, required: false, default: 0 },
     },
     computed: {
-        showBuildOptions() {
-            return !this.params.showHidden && !this.params.showDeleted;
+        showHidden() {
+            return this.filterText.includes("hidden=true");
         },
-        localParams: {
-            get() {
-                return this.params;
-            },
-            set(newVal) {
-                this.$emit("update:params", Object.assign({}, newVal));
-            },
+        showDeleted() {
+            return this.filterText.includes("deleted=true");
+        },
+        showBuildOptions() {
+            return !this.showHidden && !this.showDeleted;
         },
         numSelected() {
             return this.contentSelection.size || 0;

client/src/components/History/CurrentHistory/HistoryPanel.vue

@@ -3,9 +3,7 @@
         :key="history.id"
         :history-id="historyId"
         :offset="offset"
-        :filter-text="params.filterText"
-        :show-deleted="params.showDeleted"
-        :show-hidden="params.showHidden"
+        :filter-text="filterText"
         v-slot="{ loading, result: payload }">
         <ExpandedItems
             :scope-key="history.id"
@@ -27,14 +25,14 @@
                     <slot name="navigation" :history="history" />
                     <HistoryFilters
                         class="content-operations-filters mx-3"
-                        :params.sync="params"
+                        :filter-text.sync="filterText"
                         :showAdvanced.sync="showAdvanced" />
                     <section v-if="!showAdvanced">
                         <HistoryDetails :history="history" v-on="$listeners" />
                         <HistoryMessages class="m-2" :history="history" />
                         <HistoryOperations
                             :history="history"
-                            :params.sync="params"
+                            :filter-text.sync="filterText"
                             :content-selection="selectedItems"
                             :show-selection="showSelection"
                             :expanded-count="expandedCount"
@@ -124,14 +122,10 @@ export default {
     },
     data() {
         return {
+            filterText: "",
             invisible: {},
             offset: 0,
             showAdvanced: false,
-            params: {
-                filterText: "",
-                showDeleted: false,
-                showHidden: false,
-            },
         };
     },
     watch: {
@@ -145,10 +139,10 @@ export default {
             return this.history.id;
         },
         queryKey() {
-            return `${this.historyId}-${this.params.showDeleted}-${this.params.showHidden}-${this.params.filterText}`;
+            return `${this.historyId}-${this.filterText}`;
         },
         queryDefault() {
-            return !this.params.showDeleted && !this.params.showHidden && !this.params.filterText;
+            return !this.filterText;
         },
     },
     methods: {

client/src/store/historyStore/historyItemsStore.js

@@ -20,19 +20,19 @@ const state = {
 const getters = {
     getHistoryItems:
         (state) =>
-        ({ historyId, filterText, showDeleted, showHidden }) => {
+        ({ historyId, filterText }) => {
             const itemArray = state.items[historyId] || [];
             const filters = getFilters(filterText);
             const filtered = itemArray.filter((item) => {
                 if (!item) {
                     return false;
                 }
-                if (showDeleted != item.deleted) {
+                /*if (showDeleted != item.deleted) {
                     return false;
                 }
                 if (showHidden == item.visible) {
                     return false;
-                }
+                }*/
                 if (!testFilters(filters, item)) {
                     return false;
                 }
@@ -42,13 +42,13 @@ const getters = {
         },
 };
 
-const getQueryString = (filterText, showDeleted, showHidden) => {
-    const deleted = showDeleted ? "True" : "False";
-    const visible = showHidden ? "False" : "True";
+const getQueryString = (filterText) => {
+    //const deleted = showDeleted ? "True" : "False";
+    //const visible = showHidden ? "False" : "True";
     const filterDict = {
         ...getQueryDict(filterText),
-        deleted: deleted,
-        visible: visible,
+        //deleted: deleted,
+        //visible: visible,
     };
     const queryString = Object.entries(filterDict)
         .map(([f, v]) => `q=${f}&qv=${v}`)
@@ -57,9 +57,9 @@ const getQueryString = (filterText, showDeleted, showHidden) => {
 };
 
 const actions = {
-    fetchHistoryItems: async ({ commit, dispatch }, { historyId, offset, filterText, showDeleted, showHidden }) => {
+    fetchHistoryItems: async ({ commit, dispatch }, { historyId, offset, filterText }) => {
         dispatch("startHistoryChangedItems", { historyId: historyId });
-        const queryString = getQueryString(filterText, showDeleted, showHidden);
+        const queryString = getQueryString(filterText);
         const params = `v=dev&order=hid&offset=${offset}&limit=${limit}`;
         const url = `api/histories/${historyId}/contents?${params}&${queryString}`;
         await queue.enqueue(urlData, { url }).then((payload) => {