From 8522a0164eff7e16c342b833c727d7bea433d27c Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Fri, 8 Mar 2024 16:01:52 -0600
Subject: [PATCH 1/5] [24.0] Fix history filters taking up space in `GridList`

Add a popover version of the `FilterMenu` component. This can be enabled via the `isPopover` prop. Fixes https://github.com/galaxyproject/galaxy/issues/17618
---
 client/src/components/Common/FilterMenu.vue   | 180 +++++++++++-------
 .../components/Common/FilterMenuBoolean.vue   |   7 +-
 .../src/components/Common/FilterMenuInput.vue |   8 +-
 .../components/Common/FilterMenuRanged.vue    |   8 +-
 .../src/components/Workflow/WorkflowList.vue  |   1 +
 client/src/utils/filtering.ts                 |   8 +
 6 files changed, 123 insertions(+), 89 deletions(-)

diff --git a/client/src/components/Common/FilterMenu.vue b/client/src/components/Common/FilterMenu.vue
index f3deb4ee9894..cffb6aae40e4 100644
--- a/client/src/components/Common/FilterMenu.vue
+++ b/client/src/components/Common/FilterMenu.vue
@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { library } from "@fortawesome/fontawesome-svg-core";
-import { faAngleDoubleUp, faQuestion, faRedo, faSearch } from "@fortawesome/free-solid-svg-icons";
+import { faAngleDoubleUp, faQuestion, faSearch } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
-import { BButton, BModal } from "bootstrap-vue";
+import { BButton, BModal, BPopover } from "bootstrap-vue";
 import { kebabCase } from "lodash";
 import { computed, ref } from "vue";
 
 import type Filtering from "@/utils/filtering";
-import { type Alias, getOperatorForAlias } from "@/utils/filtering";
+import { type Alias, type ErrorType, getOperatorForAlias, type ValidFilter } from "@/utils/filtering";
 
 import DelayedInput from "@/components/Common/DelayedInput.vue";
 import FilterMenuBoolean from "@/components/Common/FilterMenuBoolean.vue";
@@ -17,7 +17,7 @@ import FilterMenuObjectStore from "@/components/Common/FilterMenuObjectStore.vue
 import FilterMenuQuotaSource from "@/components/Common/FilterMenuQuotaSource.vue";
 import FilterMenuRanged from "@/components/Common/FilterMenuRanged.vue";
 
-library.add(faAngleDoubleUp, faQuestion, faRedo, faSearch);
+library.add(faAngleDoubleUp, faQuestion, faSearch);
 
 interface BackendFilterError {
     err_msg: string;
@@ -54,6 +54,8 @@ interface Props {
     searchError?: BackendFilterError;
     /** Whether the advanced menu is currently expanded */
     showAdvanced?: boolean;
+    /** Whether to use a popover for the menu options */
+    isPopover?: boolean;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -64,6 +66,7 @@ const props = withDefaults(defineProps<Props>(), {
     menuType: "linked",
     showAdvanced: false,
     searchError: undefined,
+    isPopover: false,
 });
 
 const emit = defineEmits<{
@@ -78,10 +81,17 @@ const filters = computed(() => Object.fromEntries(props.filterClass.getFiltersFo
 
 const identifier = kebabCase(props.name);
 
+const advancedMenu = ref<HTMLElement | null>(null);
+const delayedInputField = ref<InstanceType<typeof DelayedInput> | null>(null);
+const toggleMenuButton = computed(() => {
+    const element = delayedInputField.value?.$el.querySelector(`[data-description='toggle advanced search']`);
+    return element;
+});
+
 // Boolean for showing the help modal for the whole filter menu (if provided)
 const showHelp = ref(false);
 
-const formattedSearchError = computed(() => {
+const formattedSearchError = computed<ErrorType | null>(() => {
     if (props.searchError) {
         const { column, col, operation, op, value, val, err_msg, ValueError } = props.searchError;
         const alias = operation || op;
@@ -99,6 +109,25 @@ const formattedSearchError = computed(() => {
     }
 });
 
+// computed ref with a get and set function
+const localAdvancedToggle = computed({
+    get: () => props.showAdvanced,
+    set: (value: boolean) => {
+        emit("update:show-advanced", value);
+    },
+});
+
+/** Returns the `ValidFilter<any>` for given `filter`
+ *
+ * This non-null asserts the output because where it's used, the filter is guaranteed
+ * to exist because of the `<span v-if="validFilters[filter]?.menuItem">` condition
+ * @param filter the filter to get
+ * @returns the _defined_ `ValidFilter<any>` for the given `filter`
+ */
+function getValidFilter(filter: string): ValidFilter<any> {
+    return validFilters.value[filter]!;
+}
+
 /** Explicitly sets a filter: value
  * (also closes help modal for this filter if it exists)
  * @param filter the filter to set
@@ -108,6 +137,14 @@ function onOption(filter: string, value: any) {
     filters.value[filter] = value;
 }
 
+function onPopoverShown() {
+    advancedMenu.value?.querySelector("input")?.focus();
+}
+
+function onPopoverHidden() {
+    (toggleMenuButton.value as any)?.focus();
+}
+
 function onSearch() {
     const newFilterText = props.filterClass.getFilterText(filters.value);
     const newBackendFilter = props.filterClass.getFilterText(filters.value, true);
@@ -133,6 +170,7 @@ function updateFilterText(newFilterText: string) {
         <DelayedInput
             v-if="props.menuType !== 'standalone'"
             v-show="props.menuType == 'linked' || (props.menuType == 'separate' && !props.showAdvanced)"
+            ref="delayedInputField"
             :query="props.filterText"
             :delay="props.debounceDelay"
             :loading="props.loading"
@@ -155,66 +193,74 @@ function updateFilterText(newFilterText: string) {
             <FontAwesomeIcon fixed-width :icon="faAngleDoubleUp" />
         </BButton>
 
-        <div
-            v-if="props.menuType == 'standalone' || props.showAdvanced"
+        <component
+            :is="!props.isPopover ? 'div' : BPopover"
+            v-if="(props.isPopover && toggleMenuButton) || props.menuType == 'standalone' || props.showAdvanced"
             class="mt-2"
-            data-description="advanced filters">
-            <div v-for="filter in Object.keys(validFilters)" :key="filter">
-                <span v-if="validFilters[filter]?.menuItem">
-                    <FilterMenuBoolean
-                        v-if="validFilters[filter]?.type == Boolean"
-                        :name="filter"
-                        :filter="validFilters[filter]"
-                        :filters="filters"
-                        @change="onOption"
-                        @on-enter="onSearch"
-                        @on-esc="onToggle" />
-                    <FilterMenuRanged
-                        v-else-if="validFilters[filter]?.isRangeInput"
-                        class="m-0"
-                        :name="filter"
-                        :filter="validFilters[filter]"
-                        :filters="filters"
-                        :error="formattedSearchError"
-                        :identifier="identifier"
-                        @change="onOption"
-                        @on-enter="onSearch"
-                        @on-esc="onToggle" />
-                    <FilterMenuMultiTags
-                        v-else-if="validFilters[filter]?.type == 'MultiTags'"
-                        :name="filter"
-                        :filter="validFilters[filter]"
-                        :filters="filters"
-                        :identifier="identifier"
-                        @change="onOption" />
-                    <FilterMenuObjectStore
-                        v-else-if="validFilters[filter]?.type == 'ObjectStore'"
-                        :name="filter"
-                        :filter="validFilters[filter]"
-                        :filters="filters"
-                        @change="onOption" />
-                    <FilterMenuQuotaSource
-                        v-else-if="validFilters[filter]?.type == 'QuotaSource'"
-                        :name="filter"
-                        :filter="validFilters[filter]"
-                        :filters="filters"
-                        :identifier="identifier"
-                        @change="onOption" />
-                    <FilterMenuInput
-                        v-else
-                        :name="filter"
-                        :filter="validFilters[filter]"
-                        :filters="filters"
-                        :error="formattedSearchError"
-                        :identifier="identifier"
-                        @change="onOption"
-                        @on-enter="onSearch"
-                        @on-esc="onToggle" />
-                </span>
-            </div>
+            :show.sync="localAdvancedToggle"
+            :target="toggleMenuButton"
+            placement="bottomleft"
+            data-description="advanced filters"
+            @hidden="onPopoverHidden"
+            @shown="onPopoverShown">
+            <span ref="advancedMenu">
+                <div v-for="filter in Object.keys(validFilters)" :key="filter">
+                    <span v-if="validFilters[filter]?.menuItem">
+                        <FilterMenuBoolean
+                            v-if="validFilters[filter]?.type == Boolean"
+                            :name="filter"
+                            :filter="getValidFilter(filter)"
+                            :filters="filters"
+                            @change="onOption"
+                            @on-enter="onSearch"
+                            @on-esc="onToggle" />
+                        <FilterMenuRanged
+                            v-else-if="validFilters[filter]?.isRangeInput"
+                            class="m-0"
+                            :name="filter"
+                            :filter="getValidFilter(filter)"
+                            :filters="filters"
+                            :error="formattedSearchError || undefined"
+                            :identifier="identifier"
+                            @change="onOption"
+                            @on-enter="onSearch"
+                            @on-esc="onToggle" />
+                        <FilterMenuMultiTags
+                            v-else-if="validFilters[filter]?.type == 'MultiTags'"
+                            :name="filter"
+                            :filter="getValidFilter(filter)"
+                            :filters="filters"
+                            :identifier="identifier"
+                            @change="onOption" />
+                        <FilterMenuObjectStore
+                            v-else-if="validFilters[filter]?.type == 'ObjectStore'"
+                            :name="filter"
+                            :filter="getValidFilter(filter)"
+                            :filters="filters"
+                            @change="onOption" />
+                        <FilterMenuQuotaSource
+                            v-else-if="validFilters[filter]?.type == 'QuotaSource'"
+                            :name="filter"
+                            :filter="getValidFilter(filter)"
+                            :filters="filters"
+                            :identifier="identifier"
+                            @change="onOption" />
+                        <FilterMenuInput
+                            v-else
+                            :name="filter"
+                            :filter="getValidFilter(filter)"
+                            :filters="filters"
+                            :error="formattedSearchError || undefined"
+                            :identifier="identifier"
+                            @change="onOption"
+                            @on-enter="onSearch"
+                            @on-esc="onToggle" />
+                    </span>
+                </div>
+            </span>
 
             <!-- Perform search or cancel out (or open help modal for whole Menu if exists) -->
-            <div class="mb-3 mt-1">
+            <div class="mb-3 mt-2">
                 <BButton
                     :id="`${identifier}-advanced-filter-submit`"
                     class="mr-1"
@@ -227,23 +273,15 @@ function updateFilterText(newFilterText: string) {
                     <span v-localize>Search</span>
                 </BButton>
 
-                <BButton v-if="props.menuType !== 'standalone'" size="sm" @click="onToggle">
-                    <FontAwesomeIcon :icon="faRedo" />
-
-                    <span v-localize>Cancel</span>
-                </BButton>
-
                 <BButton v-if="props.hasHelp" title="Search Help" size="sm" @click="showHelp = true">
                     <FontAwesomeIcon :icon="faQuestion" />
                 </BButton>
 
-                <span> </span>
-
                 <BModal v-if="props.hasHelp" v-model="showHelp" :title="`${props.name} Advanced Search Help`" ok-only>
                     <!-- Slot for Menu help section -->
                     <slot name="menu-help-text"></slot>
                 </BModal>
             </div>
-        </div>
+        </component>
     </div>
 </template>
diff --git a/client/src/components/Common/FilterMenuBoolean.vue b/client/src/components/Common/FilterMenuBoolean.vue
index 0fcdb2d76b95..eb936d14663b 100644
--- a/client/src/components/Common/FilterMenuBoolean.vue
+++ b/client/src/components/Common/FilterMenuBoolean.vue
@@ -2,14 +2,13 @@
 import { BFormGroup, BFormRadioGroup } from "bootstrap-vue";
 import { computed } from "vue";
 
+import type { ValidFilter } from "@/utils/filtering";
+
 type FilterType = string | boolean | undefined;
 
 interface Props {
     name: string;
-    filter: {
-        boolType?: string;
-        placeholder: string;
-    };
+    filter: ValidFilter<any>;
     filters: {
         [k: string]: FilterType;
     };
diff --git a/client/src/components/Common/FilterMenuInput.vue b/client/src/components/Common/FilterMenuInput.vue
index a1d13fb0eeb5..7cf541a4c314 100644
--- a/client/src/components/Common/FilterMenuInput.vue
+++ b/client/src/components/Common/FilterMenuInput.vue
@@ -14,18 +14,12 @@ import {
 import { capitalize } from "lodash";
 import { computed, ref, watch } from "vue";
 
-import { ValidFilter } from "@/utils/filtering";
+import { type ErrorType, type ValidFilter } from "@/utils/filtering";
 
 library.add(faQuestion);
 
 type FilterType = string | boolean | undefined;
 
-type ErrorType = {
-    index: string;
-    typeError: boolean;
-    msg: string;
-};
-
 interface Props {
     name: string;
     identifier: any;
diff --git a/client/src/components/Common/FilterMenuRanged.vue b/client/src/components/Common/FilterMenuRanged.vue
index ae1d2527112b..91e362bad359 100644
--- a/client/src/components/Common/FilterMenuRanged.vue
+++ b/client/src/components/Common/FilterMenuRanged.vue
@@ -2,16 +2,10 @@
 import { BFormDatepicker, BFormInput, BInputGroup, BInputGroupAppend } from "bootstrap-vue";
 import { computed, ref, watch } from "vue";
 
-import { ValidFilter } from "@/utils/filtering";
+import { type ErrorType, type ValidFilter } from "@/utils/filtering";
 
 type FilterType = string | boolean | undefined;
 
-type ErrorType = {
-    index: string;
-    typeError: boolean;
-    msg: string;
-};
-
 interface Props {
     name: string;
     identifier: any;
diff --git a/client/src/components/Workflow/WorkflowList.vue b/client/src/components/Workflow/WorkflowList.vue
index 45a1b9dee14d..8fb59edb8ea1 100644
--- a/client/src/components/Workflow/WorkflowList.vue
+++ b/client/src/components/Workflow/WorkflowList.vue
@@ -218,6 +218,7 @@ onMounted(() => {
                 :filter-text.sync="filterText"
                 :loading="loading || overlay"
                 has-help
+                is-popover
                 :placeholder="searchPlaceHolder"
                 :show-advanced.sync="showAdvanced">
                 <template v-slot:menu-help-text>
diff --git a/client/src/utils/filtering.ts b/client/src/utils/filtering.ts
index fa4d859978e0..3556f89b2da3 100644
--- a/client/src/utils/filtering.ts
+++ b/client/src/utils/filtering.ts
@@ -29,6 +29,14 @@ const operatorForAlias = {
     eq: ":",
 } as const satisfies Record<string, string>;
 
+export type ErrorType = {
+    filter: string;
+    index?: string;
+    value?: string;
+    typeError?: string;
+    msg: string;
+};
+
 type OperatorForAlias = typeof operatorForAlias;
 export type Alias = keyof OperatorForAlias;
 type Operator = OperatorForAlias[Alias];

From e8fc80330b1dbbf50b6fa972fc2198082a58f600 Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Wed, 20 Mar 2024 14:59:26 -0500
Subject: [PATCH 2/5] trim `filterText` before validating it

---
 client/src/utils/filtering.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/client/src/utils/filtering.ts b/client/src/utils/filtering.ts
index 3556f89b2da3..9f6ceeee6ddc 100644
--- a/client/src/utils/filtering.ts
+++ b/client/src/utils/filtering.ts
@@ -399,6 +399,7 @@ export default class Filtering<T> {
      * @returns Filters as 2D array of of [field, value] pairs
      * */
     getFiltersForText(filterText: string, removeAny = true, validate = true): [string, T][] {
+        filterText = filterText.trim();
         const pairSplitRE = this.quoteStrings
             ? /[^\s'"]+(?:['"][^'"]*['"][^\s'"]*)*|(?:['"][^'"]*['"][^\s'"]*)+/g
             : /(\S+):(.*?)(?=\s+\S+:|$)/g;

From 7996b03747ce8246309c59d291b74987d5e468cd Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Wed, 20 Mar 2024 15:01:14 -0500
Subject: [PATCH 3/5] shorten placeholders for grid boolean `is` filters

---
 client/src/components/Grid/configs/adminForms.ts     | 2 +-
 client/src/components/Grid/configs/adminGroups.ts    | 2 +-
 client/src/components/Grid/configs/adminQuotas.ts    | 2 +-
 client/src/components/Grid/configs/adminRoles.ts     | 2 +-
 client/src/components/Grid/configs/adminUsers.ts     | 4 ++--
 client/src/components/Grid/configs/histories.ts      | 8 ++++----
 client/src/components/Grid/configs/pages.ts          | 6 +++---
 client/src/components/Grid/configs/visualizations.ts | 6 +++---
 8 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/client/src/components/Grid/configs/adminForms.ts b/client/src/components/Grid/configs/adminForms.ts
index f48ac87fe2f4..a94e16fc308d 100644
--- a/client/src/components/Grid/configs/adminForms.ts
+++ b/client/src/components/Grid/configs/adminForms.ts
@@ -126,7 +126,7 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
     name: { placeholder: "name", type: String, handler: contains("name"), menuItem: true },
     description: { placeholder: "description", type: String, handler: contains("desc"), menuItem: true },
     deleted: {
-        placeholder: "Filter on deleted entries",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
diff --git a/client/src/components/Grid/configs/adminGroups.ts b/client/src/components/Grid/configs/adminGroups.ts
index 495d73f2fb42..e4f143d997b0 100644
--- a/client/src/components/Grid/configs/adminGroups.ts
+++ b/client/src/components/Grid/configs/adminGroups.ts
@@ -154,7 +154,7 @@ const fields: FieldArray = [
 const validFilters: Record<string, ValidFilter<string | boolean | undefined>> = {
     name: { placeholder: "name", type: String, handler: contains("name"), menuItem: true },
     deleted: {
-        placeholder: "Filter on deleted entries",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
diff --git a/client/src/components/Grid/configs/adminQuotas.ts b/client/src/components/Grid/configs/adminQuotas.ts
index 878c1231049f..67f0d6162fac 100644
--- a/client/src/components/Grid/configs/adminQuotas.ts
+++ b/client/src/components/Grid/configs/adminQuotas.ts
@@ -191,7 +191,7 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
     name: { placeholder: "name", type: String, handler: contains("name"), menuItem: true },
     description: { placeholder: "description", type: String, handler: contains("description"), menuItem: true },
     deleted: {
-        placeholder: "Filter on deleted entries",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
diff --git a/client/src/components/Grid/configs/adminRoles.ts b/client/src/components/Grid/configs/adminRoles.ts
index f1f08012c326..fe913e7fc41e 100644
--- a/client/src/components/Grid/configs/adminRoles.ts
+++ b/client/src/components/Grid/configs/adminRoles.ts
@@ -165,7 +165,7 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
     name: { placeholder: "name", type: String, handler: contains("name"), menuItem: true },
     description: { placeholder: "description", type: String, handler: contains("description"), menuItem: true },
     deleted: {
-        placeholder: "Filter on deleted entries",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
diff --git a/client/src/components/Grid/configs/adminUsers.ts b/client/src/components/Grid/configs/adminUsers.ts
index 7d085d4fbe37..50accb257125 100644
--- a/client/src/components/Grid/configs/adminUsers.ts
+++ b/client/src/components/Grid/configs/adminUsers.ts
@@ -310,14 +310,14 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
     email: { placeholder: "email", type: String, handler: contains("email"), menuItem: true },
     username: { placeholder: "username", type: String, handler: contains("username"), menuItem: true },
     deleted: {
-        placeholder: "Filter on deleted users",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
         menuItem: true,
     },
     purged: {
-        placeholder: "Filter on purged users",
+        placeholder: "Purged",
         type: Boolean,
         boolType: "is",
         handler: equals("purged", "purged", toBool),
diff --git a/client/src/components/Grid/configs/histories.ts b/client/src/components/Grid/configs/histories.ts
index 20cbbeef6496..3a6479b3975e 100644
--- a/client/src/components/Grid/configs/histories.ts
+++ b/client/src/components/Grid/configs/histories.ts
@@ -293,28 +293,28 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
         menuItem: true,
     },
     published: {
-        placeholder: "Filter on published entries",
+        placeholder: "Published",
         type: Boolean,
         boolType: "is",
         handler: equals("published", "published", toBool),
         menuItem: true,
     },
     importable: {
-        placeholder: "Filter on importable entries",
+        placeholder: "Importable",
         type: Boolean,
         boolType: "is",
         handler: equals("importable", "importable", toBool),
         menuItem: true,
     },
     deleted: {
-        placeholder: "Filter on deleted entries",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
         menuItem: true,
     },
     purged: {
-        placeholder: "Filter on purged entries",
+        placeholder: "Purged entries",
         type: Boolean,
         boolType: "is",
         handler: equals("purged", "purged", toBool),
diff --git a/client/src/components/Grid/configs/pages.ts b/client/src/components/Grid/configs/pages.ts
index 68abfb70e196..4aa803d0d6c1 100644
--- a/client/src/components/Grid/configs/pages.ts
+++ b/client/src/components/Grid/configs/pages.ts
@@ -163,21 +163,21 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
     title: { placeholder: "title", type: String, handler: contains("title"), menuItem: true },
     slug: { handler: contains("slug"), menuItem: false },
     published: {
-        placeholder: "Filter on published pages",
+        placeholder: "Published",
         type: Boolean,
         boolType: "is",
         handler: equals("published", "published", toBool),
         menuItem: true,
     },
     importable: {
-        placeholder: "Filter on importable pages",
+        placeholder: "Importable",
         type: Boolean,
         boolType: "is",
         handler: equals("importable", "importable", toBool),
         menuItem: true,
     },
     deleted: {
-        placeholder: "Filter on deleted pages",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),
diff --git a/client/src/components/Grid/configs/visualizations.ts b/client/src/components/Grid/configs/visualizations.ts
index 65eaec80e328..27ad0a4ffc76 100644
--- a/client/src/components/Grid/configs/visualizations.ts
+++ b/client/src/components/Grid/configs/visualizations.ts
@@ -205,21 +205,21 @@ const validFilters: Record<string, ValidFilter<string | boolean | undefined>> =
         menuItem: true,
     },
     published: {
-        placeholder: "Filter on published visualizations",
+        placeholder: "Published",
         type: Boolean,
         boolType: "is",
         handler: equals("published", "published", toBool),
         menuItem: true,
     },
     importable: {
-        placeholder: "Filter on importable visualizations",
+        placeholder: "Importable",
         type: Boolean,
         boolType: "is",
         handler: equals("importable", "importable", toBool),
         menuItem: true,
     },
     deleted: {
-        placeholder: "Filter on deleted visualizations",
+        placeholder: "Deleted",
         type: Boolean,
         boolType: "is",
         handler: equals("deleted", "deleted", toBool),

From 008b652c620450a6d80cce56ddc237d5bcc59f6d Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Wed, 20 Mar 2024 15:34:54 -0500
Subject: [PATCH 4/5] add a `compact` version of `FilterMenu`; no collapse on
 search

It groups `is` type boolean filters on one line, and in checkboxes.
Adding filters applies them immediately, and there is no search button.
---
 client/src/components/Common/FilterMenu.vue   | 49 +++++++++++++++----
 .../components/Common/FilterMenuBoolean.vue   | 15 ++++--
 client/src/components/Grid/GridList.vue       |  4 +-
 .../components/Workflow/WorkflowFilters.js    | 12 ++---
 .../src/components/Workflow/WorkflowList.vue  |  2 +-
 5 files changed, 59 insertions(+), 23 deletions(-)

diff --git a/client/src/components/Common/FilterMenu.vue b/client/src/components/Common/FilterMenu.vue
index cffb6aae40e4..f33bdb70960c 100644
--- a/client/src/components/Common/FilterMenu.vue
+++ b/client/src/components/Common/FilterMenu.vue
@@ -54,8 +54,8 @@ interface Props {
     searchError?: BackendFilterError;
     /** Whether the advanced menu is currently expanded */
     showAdvanced?: boolean;
-    /** Whether to use a popover for the menu options */
-    isPopover?: boolean;
+    /** What view to use for the menu */
+    view?: "dropdown" | "popover" | "compact";
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -66,7 +66,7 @@ const props = withDefaults(defineProps<Props>(), {
     menuType: "linked",
     showAdvanced: false,
     searchError: undefined,
-    isPopover: false,
+    view: "dropdown",
 });
 
 const emit = defineEmits<{
@@ -135,6 +135,11 @@ function getValidFilter(filter: string): ValidFilter<any> {
  */
 function onOption(filter: string, value: any) {
     filters.value[filter] = value;
+
+    // for the compact view, we want to immediately search
+    if (props.view === "compact") {
+        onSearch();
+    }
 }
 
 function onPopoverShown() {
@@ -152,7 +157,11 @@ function onSearch() {
         emit("on-search", filters.value, newFilterText, newBackendFilter);
     } else {
         updateFilterText(newFilterText);
-        onToggle();
+
+        // for the compact view, we do not want to close the advanced menu
+        if (props.view !== "compact") {
+            onToggle();
+        }
     }
 }
 
@@ -194,8 +203,10 @@ function updateFilterText(newFilterText: string) {
         </BButton>
 
         <component
-            :is="!props.isPopover ? 'div' : BPopover"
-            v-if="(props.isPopover && toggleMenuButton) || props.menuType == 'standalone' || props.showAdvanced"
+            :is="props.view !== 'popover' ? 'div' : BPopover"
+            v-if="
+                (props.view === 'popover' && toggleMenuButton) || props.menuType == 'standalone' || props.showAdvanced
+            "
             class="mt-2"
             :show.sync="localAdvancedToggle"
             :target="toggleMenuButton"
@@ -206,11 +217,13 @@ function updateFilterText(newFilterText: string) {
             <span ref="advancedMenu">
                 <div v-for="filter in Object.keys(validFilters)" :key="filter">
                     <span v-if="validFilters[filter]?.menuItem">
+                        <!-- Boolean filters go in another section in compact view -->
                         <FilterMenuBoolean
-                            v-if="validFilters[filter]?.type == Boolean"
+                            v-if="props.view !== 'compact' && validFilters[filter]?.type == Boolean"
                             :name="filter"
                             :filter="getValidFilter(filter)"
                             :filters="filters"
+                            :view="props.view"
                             @change="onOption"
                             @on-enter="onSearch"
                             @on-esc="onToggle" />
@@ -246,7 +259,7 @@ function updateFilterText(newFilterText: string) {
                             :identifier="identifier"
                             @change="onOption" />
                         <FilterMenuInput
-                            v-else
+                            v-else-if="validFilters[filter]?.type !== Boolean"
                             :name="filter"
                             :filter="getValidFilter(filter)"
                             :filters="filters"
@@ -259,9 +272,26 @@ function updateFilterText(newFilterText: string) {
                 </div>
             </span>
 
+            <!-- Compact view: Boolean filters go side by side -->
+            <div v-if="props.view === 'compact'" class="d-flex">
+                <span v-for="filter in Object.keys(validFilters)" :key="filter">
+                    <FilterMenuBoolean
+                        v-if="validFilters[filter]?.menuItem && validFilters[filter]?.type == Boolean"
+                        class="mr-2 mt-1"
+                        :name="filter"
+                        :filter="getValidFilter(filter)"
+                        :filters="filters"
+                        :view="props.view"
+                        @change="onOption"
+                        @on-enter="onSearch"
+                        @on-esc="onToggle" />
+                </span>
+            </div>
+
             <!-- Perform search or cancel out (or open help modal for whole Menu if exists) -->
-            <div class="mb-3 mt-2">
+            <div class="mt-2">
                 <BButton
+                    v-if="props.view !== 'compact'"
                     :id="`${identifier}-advanced-filter-submit`"
                     class="mr-1"
                     size="sm"
@@ -282,6 +312,7 @@ function updateFilterText(newFilterText: string) {
                     <slot name="menu-help-text"></slot>
                 </BModal>
             </div>
+            <hr v-if="props.showAdvanced" class="w-100" />
         </component>
     </div>
 </template>
diff --git a/client/src/components/Common/FilterMenuBoolean.vue b/client/src/components/Common/FilterMenuBoolean.vue
index eb936d14663b..28f55941f0a6 100644
--- a/client/src/components/Common/FilterMenuBoolean.vue
+++ b/client/src/components/Common/FilterMenuBoolean.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { BFormGroup, BFormRadioGroup } from "bootstrap-vue";
+import { BFormCheckbox, BFormGroup, BFormRadioGroup } from "bootstrap-vue";
 import { computed } from "vue";
 
 import type { ValidFilter } from "@/utils/filtering";
@@ -12,11 +12,15 @@ interface Props {
     filters: {
         [k: string]: FilterType;
     };
+    view?: "dropdown" | "popover" | "compact";
 }
 
-const props = defineProps<Props>();
+const props = withDefaults(defineProps<Props>(), {
+    view: "dropdown",
+});
 
 const boolType = computed(() => props.filter.boolType || "default");
+const isCheckbox = computed(() => boolType.value === "is" && props.view === "compact");
 
 const options =
     boolType.value == "default"
@@ -50,10 +54,11 @@ const value = computed({
 
 <template>
     <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->
-    <div @keyup.enter="emit('on-enter')" @keyup.esc="emit('on-esc')">
-        <small>{{ props.filter.placeholder }}:</small>
+    <div :class="{ 'd-flex': isCheckbox }" @keyup.enter="emit('on-enter')" @keyup.esc="emit('on-esc')">
+        <small :class="{ 'mr-1': isCheckbox }">{{ props.filter.placeholder }}:</small>
 
-        <BFormGroup class="m-0">
+        <BFormCheckbox v-if="isCheckbox" v-model="value" :data-description="`filter ${props.name}`" />
+        <BFormGroup v-else class="m-0">
             <BFormRadioGroup
                 v-model="value"
                 :options="options"
diff --git a/client/src/components/Grid/GridList.vue b/client/src/components/Grid/GridList.vue
index 8c73ba0e5d44..5669e46481c3 100644
--- a/client/src/components/Grid/GridList.vue
+++ b/client/src/components/Grid/GridList.vue
@@ -292,8 +292,8 @@ watch(operationMessage, () => {
                 :filter-class="filterClass"
                 :filter-text.sync="filterText"
                 :loading="initDataLoading || resultsLoading"
-                :show-advanced.sync="showAdvanced" />
-            <hr v-if="showAdvanced" />
+                :show-advanced.sync="showAdvanced"
+                view="compact" />
         </div>
         <LoadingSpan v-if="initDataLoading" />
         <span v-else-if="!isAvailable || hasInvalidFilters" variant="info" show>
diff --git a/client/src/components/Workflow/WorkflowFilters.js b/client/src/components/Workflow/WorkflowFilters.js
index 1c184ff0d4c8..1280b6e450a5 100644
--- a/client/src/components/Workflow/WorkflowFilters.js
+++ b/client/src/components/Workflow/WorkflowFilters.js
@@ -89,28 +89,28 @@ export function WorkflowFilters(activeList = "my") {
             {
                 ...commonFilters,
                 published: {
-                    placeholder: "Filter on published workflows",
+                    placeholder: "Published",
                     type: Boolean,
                     boolType: "is",
                     handler: equals("published", "published", toBool),
                     menuItem: true,
                 },
                 importable: {
-                    placeholder: "Filter on importable workflows",
+                    placeholder: "Importable",
                     type: Boolean,
                     boolType: "is",
                     handler: equals("importable", "importable", toBool),
                     menuItem: true,
                 },
                 shared_with_me: {
-                    placeholder: "Filter on workflows shared with me",
+                    placeholder: "Shared with me",
                     type: Boolean,
                     boolType: "is",
                     handler: equals("shared_with_me", "shared_with_me", toBool),
                     menuItem: true,
                 },
                 deleted: {
-                    placeholder: "Filter on deleted workflows",
+                    placeholder: "Deleted",
                     type: Boolean,
                     boolType: "is",
                     handler: equals("deleted", "deleted", toBool),
@@ -133,7 +133,7 @@ export function WorkflowFilters(activeList = "my") {
                 },
                 u: { handler: contains("u"), menuItem: false },
                 published: {
-                    placeholder: "Filter on published workflows",
+                    placeholder: "Published",
                     type: Boolean,
                     boolType: "is",
                     handler: equals("published", "published", toBool),
@@ -156,7 +156,7 @@ export function WorkflowFilters(activeList = "my") {
                 },
                 u: { handler: contains("u"), menuItem: false },
                 shared_with_me: {
-                    placeholder: "Filter on workflows shared with me",
+                    placeholder: "Shared with me",
                     type: Boolean,
                     boolType: "is",
                     handler: equals("shared_with_me", "shared_with_me", toBool),
diff --git a/client/src/components/Workflow/WorkflowList.vue b/client/src/components/Workflow/WorkflowList.vue
index 8fb59edb8ea1..8a0f770c88a2 100644
--- a/client/src/components/Workflow/WorkflowList.vue
+++ b/client/src/components/Workflow/WorkflowList.vue
@@ -218,7 +218,7 @@ onMounted(() => {
                 :filter-text.sync="filterText"
                 :loading="loading || overlay"
                 has-help
-                is-popover
+                view="compact"
                 :placeholder="searchPlaceHolder"
                 :show-advanced.sync="showAdvanced">
                 <template v-slot:menu-help-text>

From 20e442265672f547ddd50596810703e187fe5908 Mon Sep 17 00:00:00 2001
From: Ahmed Awan <qe66653@umbc.edu>
Date: Wed, 20 Mar 2024 20:12:17 -0500
Subject: [PATCH 5/5] fix seleniums and add jest for `compact` `FilterMenu`s

---
 .../src/components/Common/FilterMenu.test.ts  | 56 ++++++++++++++-----
 .../components/Common/FilterMenuBoolean.vue   |  4 +-
 client/src/utils/navigation/navigation.yml    |  4 --
 client/src/utils/navigation/schema.ts         |  1 -
 lib/galaxy/selenium/navigates_galaxy.py       |  6 ++
 .../selenium/test_histories_list.py           | 19 ++-----
 .../selenium/test_histories_published.py      |  1 -
 .../selenium/test_workflow_management.py      |  3 -
 8 files changed, 54 insertions(+), 40 deletions(-)

diff --git a/client/src/components/Common/FilterMenu.test.ts b/client/src/components/Common/FilterMenu.test.ts
index c9955acee309..8474981948dc 100644
--- a/client/src/components/Common/FilterMenu.test.ts
+++ b/client/src/components/Common/FilterMenu.test.ts
@@ -1,7 +1,9 @@
+import { createTestingPinia } from "@pinia/testing";
 import { getLocalVue } from "@tests/jest/helpers";
 import { mount, Wrapper } from "@vue/test-utils";
 
 import { HistoryFilters } from "@/components/History/HistoryFilters";
+import { WorkflowFilters } from "@/components/Workflow/WorkflowFilters";
 import Filtering, { compare, contains, equals, toBool, toDate } from "@/utils/filtering";
 
 import FilterMenu from "./FilterMenu.vue";
@@ -80,6 +82,7 @@ describe("FilterMenu", () => {
             stubs: {
                 icon: { template: "<div></div>" },
             },
+            pinia: createTestingPinia(),
         });
     }
 
@@ -89,11 +92,13 @@ describe("FilterMenu", () => {
         await searchButton.trigger("click");
     }
 
-    async function expectCorrectEmits(showAdvanced: boolean, filterText: string, filterClass: Filtering<unknown>) {
+    async function expectCorrectEmits(filterText: string, filterClass: Filtering<unknown>, showAdvanced?: boolean) {
+        if (showAdvanced !== undefined) {
+            const toggleEmit = (wrapper.emitted()?.["update:show-advanced"]?.length ?? 0) - 1;
+            expect(wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0]).toEqual(showAdvanced);
+            await wrapper.setProps({ showAdvanced: wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0] });
+        }
         const filterEmit = (wrapper.emitted()["update:filter-text"]?.length ?? 0) - 1;
-        const toggleEmit = (wrapper.emitted()?.["update:show-advanced"]?.length ?? 0) - 1;
-        expect(wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0]).toEqual(showAdvanced);
-        await wrapper.setProps({ showAdvanced: wrapper.emitted()["update:show-advanced"]?.[toggleEmit]?.[0] });
         const receivedText = wrapper.emitted()["update:filter-text"]?.[filterEmit]?.[0];
         const receivedDict = filterClass.getQueryDict(receivedText);
         const parsedDict = filterClass.getQueryDict(filterText);
@@ -185,11 +190,11 @@ describe("FilterMenu", () => {
         // perform search
         await performSearch();
         await expectCorrectEmits(
-            false,
             "create_time>'January 1, 2022' create_time<'January 1, 2023' " +
                 "filter_key:item-filter has_help:has-help-filter list_item:1234 " +
                 "number>1234 number<5678 name:name-filter radio:true bool_def:true",
-            TestFilters
+            TestFilters,
+            false
         );
     });
 
@@ -209,17 +214,17 @@ describe("FilterMenu", () => {
         // -------- Test keyup.enter key:  ---------
         // toggles view out and performs a search
         await filterName.trigger("keyup.enter");
-        await expectCorrectEmits(false, "name:'sample name'", TestFilters);
+        await expectCorrectEmits("name:'sample name'", TestFilters, false);
 
         // Test: clearing the filterText
         const clearButton = wrapper.find("[data-description='reset query']");
         await clearButton.trigger("click");
-        await expectCorrectEmits(false, "", TestFilters);
+        await expectCorrectEmits("", TestFilters, false);
 
         // Test: toggling view back in
         const toggleButton = wrapper.find("[data-description='toggle advanced search']");
         await toggleButton.trigger("click");
-        await expectCorrectEmits(true, "", TestFilters);
+        await expectCorrectEmits("", TestFilters, true);
 
         // -------- Test keyup.esc key:  ---------
         // toggles view out only (doesn't cause a new search / doesn't emulate enter)
@@ -232,7 +237,7 @@ describe("FilterMenu", () => {
 
         // press esc key from name field (should not change emitted filterText unlike enter key)
         await filterName.trigger("keyup.esc");
-        await expectCorrectEmits(false, "", TestFilters);
+        await expectCorrectEmits("", TestFilters, false);
     });
 
     /**
@@ -260,13 +265,13 @@ describe("FilterMenu", () => {
 
         // expect "deleted = any" filter to be applied
         await performSearch();
-        await expectCorrectEmits(false, "visible:true", HistoryFilters);
+        await expectCorrectEmits("visible:true", HistoryFilters, false);
 
         // -------- Testing visible filter now:  ---------
 
         const toggleButton = wrapper.find("[data-description='toggle advanced search']");
         await toggleButton.trigger("click");
-        await expectCorrectEmits(true, "visible:true", HistoryFilters);
+        await expectCorrectEmits("visible:true", HistoryFilters, true);
         const visibleFilterBtnGrp = wrapper.find("[data-description='filter visible']");
         const visibleFilterAnyBtn = visibleFilterBtnGrp.find(".btn-secondary");
         expect(visibleFilterAnyBtn.text()).toBe("Any");
@@ -283,13 +288,34 @@ describe("FilterMenu", () => {
 
         // expect "visible = any" filter to be applied
         await performSearch();
-        await expectCorrectEmits(false, "deleted:any visible:any", HistoryFilters);
+        await expectCorrectEmits("deleted:any visible:any", HistoryFilters, false);
 
         // -------- Testing repeated search if it prevents bug:  ---------
         // (bug reported here: https://github.com/galaxyproject/galaxy/issues/16211)
         await toggleButton.trigger("click");
-        await expectCorrectEmits(true, "deleted:any visible:any", HistoryFilters);
+        await expectCorrectEmits("deleted:any visible:any", HistoryFilters, true);
         await performSearch();
-        await expectCorrectEmits(false, "deleted:any visible:any", HistoryFilters);
+        await expectCorrectEmits("deleted:any visible:any", HistoryFilters, false);
+    });
+
+    /**
+     * Testing the default values of the filters defined in the HistoryFilters: Filtering
+     * class, ensuring the default values are reflected in the radio-group buttons
+     */
+    it("test compact menu with checkbox filters on WorkflowFilters", async () => {
+        const myWorkflowFilters = WorkflowFilters("my");
+        setUpWrapper("Workflows", "search workflows", myWorkflowFilters);
+        // a compact `FilterMenu` only needs to be opened once (doesn't toggle out automatically)
+        await wrapper.setProps({ showAdvanced: true, view: "compact" });
+
+        // -------- Testing auto search on value change:  ---------
+        const nameFilterInput = wrapper.find("#workflows-advanced-filter-name");
+        await nameFilterInput.setValue("myworkflow");
+        await expectCorrectEmits("name:myworkflow", myWorkflowFilters);
+
+        // -------- Testing deleted filter first:  ---------
+        const deletedFilterCheckbox = wrapper.find("[data-description='filter deleted'] input");
+        await deletedFilterCheckbox.setChecked();
+        await expectCorrectEmits("name:myworkflow is:deleted", myWorkflowFilters);
     });
 });
diff --git a/client/src/components/Common/FilterMenuBoolean.vue b/client/src/components/Common/FilterMenuBoolean.vue
index 28f55941f0a6..f8043b5e24ec 100644
--- a/client/src/components/Common/FilterMenuBoolean.vue
+++ b/client/src/components/Common/FilterMenuBoolean.vue
@@ -57,7 +57,9 @@ const value = computed({
     <div :class="{ 'd-flex': isCheckbox }" @keyup.enter="emit('on-enter')" @keyup.esc="emit('on-esc')">
         <small :class="{ 'mr-1': isCheckbox }">{{ props.filter.placeholder }}:</small>
 
-        <BFormCheckbox v-if="isCheckbox" v-model="value" :data-description="`filter ${props.name}`" />
+        <div v-if="isCheckbox" :data-description="`filter ${props.name}`">
+            <BFormCheckbox v-model="value" />
+        </div>
         <BFormGroup v-else class="m-0">
             <BFormRadioGroup
                 v-model="value"
diff --git a/client/src/utils/navigation/navigation.yml b/client/src/utils/navigation/navigation.yml
index e7b864596c0a..19b06e79e49e 100644
--- a/client/src/utils/navigation/navigation.yml
+++ b/client/src/utils/navigation/navigation.yml
@@ -403,7 +403,6 @@ published_histories:
     advanced_search_tag_area: '#histories-advanced-filter-tag .stateless-tags button'
     advanced_search_tag_input: '#histories-advanced-filter-tag .stateless-tags input'
     advanced_search_toggle: '#histories-published-grid [data-description="toggle advanced search"]'
-    advanced_search_submit: '#histories-advanced-filter-submit'
     search_input: '#histories-published-grid input.search-query[data-description="filter text input"]'
     tab: '#histories-published-tab'
 
@@ -435,8 +434,6 @@ histories:
   selectors:
     advanced_search_toggle: '#histories-grid [data-description="toggle advanced search"]'
     advanced_search_name_input: '#histories-advanced-filter-name'
-    advanced_search_filter: '#histories-grid [data-description="filter ${filter}"] .btn'
-    advanced_search_submit: '#histories-advanced-filter-submit'
     advanced_search_tag_area: '#histories-advanced-filter-tag .stateless-tags button'
     advanced_search_tag_input: '#histories-advanced-filter-tag .stateless-tags input'
     histories: '.grid-table tr'
@@ -588,7 +585,6 @@ workflows:
     advanced_search_toggle: '.workflows-list [data-description="toggle advanced search"]'
     advanced_search_name_input: '#workflows-advanced-filter-name'
     advanced_search_tag_input: '#workflows-advanced-filter-tag .stateless-tags'
-    advanced_search_submit: '#workflows-advanced-filter-submit'
     workflow_rows: "#workflow-table > tbody > tr:not(.b-table-empty-row, [style*='display: none'])"
     workflows_list: '#workflows-list'
     workflows_list_empty: '#workflow-list-empty'
diff --git a/client/src/utils/navigation/schema.ts b/client/src/utils/navigation/schema.ts
index fa08c84ba19e..8fe3a0b8a4df 100644
--- a/client/src/utils/navigation/schema.ts
+++ b/client/src/utils/navigation/schema.ts
@@ -262,7 +262,6 @@ interface Rootpublished_histories extends Component {
     advanced_search_toggle: SelectorTemplate;
     advanced_search_name_input: SelectorTemplate;
     advanced_search_tag_input: SelectorTemplate;
-    advanced_search_submit: SelectorTemplate;
     tag_content: SelectorTemplate;
     column_header: SelectorTemplate;
 }
diff --git a/lib/galaxy/selenium/navigates_galaxy.py b/lib/galaxy/selenium/navigates_galaxy.py
index bbd3378162be..dca758b952c0 100644
--- a/lib/galaxy/selenium/navigates_galaxy.py
+++ b/lib/galaxy/selenium/navigates_galaxy.py
@@ -600,6 +600,12 @@ def check_grid_rows(self, grid_name, item_names):
                 # bootstrap vue checkbox seems to be hidden by label, but the label is not interactable
                 self.driver.execute_script("$(arguments[0]).click();", checkbox)
 
+    def check_advanced_search_filter(self, filter_name):
+        filter_div = self.wait_for_selector(f"[data-description='filter {filter_name}']")
+        checkbox = filter_div.find_element(self.by.CSS_SELECTOR, "input")
+        # bootstrap vue checkbox seems to be hidden by label, but the label is not interactable
+        self.driver.execute_script("$(arguments[0]).click();", checkbox)
+
     def published_grid_search_for(self, search_term=None):
         return self._inline_search_for(
             self.navigation.grids.free_text_search,
diff --git a/lib/galaxy_test/selenium/test_histories_list.py b/lib/galaxy_test/selenium/test_histories_list.py
index 7d516ae0ede3..0b6d2ad869d5 100644
--- a/lib/galaxy_test/selenium/test_histories_list.py
+++ b/lib/galaxy_test/selenium/test_histories_list.py
@@ -47,8 +47,7 @@ def test_history_publish(self):
 
         self.navigate_to_histories_page()
         self.components.histories.advanced_search_toggle.wait_for_and_click()
-        self.components.histories.advanced_search_filter(filter="published").wait_for_and_click()
-        self.components.histories.advanced_search_submit.wait_for_and_click()
+        self.check_advanced_search_filter("published")
         self.sleep_for(self.wait_types.UX_RENDER)
 
         self.assert_histories_in_grid([self.history2_name])
@@ -85,8 +84,7 @@ def test_delete_and_undelete_history(self):
         self.assert_histories_in_grid([self.history2_name], False)
 
         self.components.histories.advanced_search_toggle.wait_for_and_click()
-        self.components.histories.advanced_search_filter(filter="deleted").wait_for_and_click()
-        self.components.histories.advanced_search_submit.wait_for_and_click()
+        self.check_advanced_search_filter("deleted")
         self.sleep_for(self.wait_types.UX_RENDER)
 
         # Restore the history
@@ -113,8 +111,7 @@ def test_permanently_delete_history(self):
         self.assert_histories_in_grid([self.history4_name], False)
 
         self.components.histories.advanced_search_toggle.wait_for_and_click()
-        self.components.histories.advanced_search_filter(filter="purged").wait_for_and_click()
-        self.components.histories.advanced_search_submit.wait_for_and_click()
+        self.check_advanced_search_filter("purged")
         self.sleep_for(self.wait_types.UX_RENDER)
 
         self.assert_histories_in_grid([self.history4_name])
@@ -137,8 +134,7 @@ def test_delete_and_undelete_multiple_histories(self):
 
         # Display deleted histories
         self.components.histories.advanced_search_toggle.wait_for_and_click()
-        self.components.histories.advanced_search_filter(filter="deleted").wait_for_and_click()
-        self.components.histories.advanced_search_submit.wait_for_and_click()
+        self.check_advanced_search_filter("deleted")
 
         # Select multiple histories
         self.sleep_for(self.wait_types.UX_RENDER)
@@ -188,33 +184,26 @@ def test_advanced_search(self):
         # search by name
         self.components.histories.advanced_search_toggle.wait_for_and_click()
         self.components.histories.advanced_search_name_input.wait_for_and_send_keys(self.history3_name)
-        self.components.histories.advanced_search_submit.wait_for_and_click()
         self.assert_histories_present([self.history3_name])
 
         self.components.histories.reset_input.wait_for_and_click()
 
-        self.components.histories.advanced_search_toggle.wait_for_and_click()
         self.components.histories.advanced_search_name_input.wait_for_and_send_keys(self.history2_name)
-        self.components.histories.advanced_search_submit.wait_for_and_click()
         self.assert_histories_present([self.history2_name])
 
         self.components.histories.reset_input.wait_for_and_click()
 
-        self.components.histories.advanced_search_toggle.wait_for_and_click()
         self.components.histories.advanced_search_name_input.wait_for_and_send_keys(self.history4_name)
-        self.components.histories.advanced_search_submit.wait_for_and_click()
         self.assert_histories_present([])
 
         self.components.histories.reset_input.wait_for_and_click()
 
         # search by tags
-        self.components.histories.advanced_search_toggle.wait_for_and_click()
         self.components.histories.advanced_search_tag_area.wait_for_and_click()
         input_element = self.components.histories.advanced_search_tag_input.wait_for_visible()
         input_element.send_keys(self.history3_tags[0])
         self.send_enter(input_element)
         self.sleep_for(self.wait_types.UX_RENDER)
-        self.components.histories.advanced_search_submit.wait_for_and_click()
         self.assert_histories_present([self.history3_name])
 
     @retry_assertion_during_transitions
diff --git a/lib/galaxy_test/selenium/test_histories_published.py b/lib/galaxy_test/selenium/test_histories_published.py
index 392991ad1813..a2f1ddc362ed 100644
--- a/lib/galaxy_test/selenium/test_histories_published.py
+++ b/lib/galaxy_test/selenium/test_histories_published.py
@@ -80,7 +80,6 @@ def test_published_histories_search_advanced(self):
         self.send_escape(input_element)
         self.sleep_for(self.wait_types.UX_RENDER)
 
-        self.components.published_histories.advanced_search_submit.wait_for_and_click()
         self.assert_histories_present([self.history3_name])
 
     @retry_assertion_during_transitions
diff --git a/lib/galaxy_test/selenium/test_workflow_management.py b/lib/galaxy_test/selenium/test_workflow_management.py
index 7ce0aac51245..86df5b3831d0 100644
--- a/lib/galaxy_test/selenium/test_workflow_management.py
+++ b/lib/galaxy_test/selenium/test_workflow_management.py
@@ -183,7 +183,6 @@ def test_index_advanced_search(self):
         self.components.workflows.advanced_search_name_input.wait_for_and_send_keys("searchforthis")
         self.components.workflows.advanced_search_tag_input.wait_for_and_click()
         self.tagging_add(["mytag"])
-        self.components.workflows.advanced_search_submit.wait_for_and_click()
         self._assert_showing_n_workflows(1)
         curr_value = self.workflow_index_get_current_filter()
         assert curr_value == "name:searchforthis tag:mytag", curr_value
@@ -193,11 +192,9 @@ def test_index_advanced_search(self):
         curr_value = self.workflow_index_get_current_filter()
         assert curr_value == "", curr_value
 
-        self.components.workflows.advanced_search_toggle.wait_for_and_click()
         # search by 2 tags, one of which is not present
         self.components.workflows.advanced_search_tag_input.wait_for_and_click()
         self.tagging_add(["'mytag'", "'DNEtag'"])
-        self.components.workflows.advanced_search_submit.wait_for_and_click()
         curr_value = self.workflow_index_get_current_filter()
         assert curr_value == "tag:'mytag' tag:'DNEtag'", curr_value
         self.components.workflows.workflow_not_found_message.wait_for_visible()