Clear search input when user clicks navbar logo (#539)

* Clear search input when user clicks navbar logo * Reset filter state
thinkst · Jul 23, 2024 · 886df6b · 886df6b
1 parent 89207a8
commit 886df6b
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 2 deletions.
diff --git a/frontend_vue/src/components/SearchFilterTokensHeader.vue b/frontend_vue/src/components/SearchFilterTokensHeader.vue
@@ -4,6 +4,7 @@
   >
     <ul class="flex flex-row flex-wrap gap-8 list-none justify-left">
       <FilterButton
+        id="filterAll"
         category="All"
         :selected="!filterValue"
         @click="filterValue = ''"

diff --git a/frontend_vue/src/components/base/BaseSwitch.vue b/frontend_vue/src/components/base/BaseSwitch.vue
@@ -69,8 +69,8 @@ function handleToggle(event: Event) {
 input[type='checkbox'].toggle {
   opacity: 0;
   position: absolute;
-  left: -9000px;
-  top: -9000px;
+  left: 0px;
+  top: 0px;
 }
 
 label {

diff --git a/frontend_vue/src/components/ui/AppLogo.vue b/frontend_vue/src/components/ui/AppLogo.vue
@@ -19,5 +19,7 @@ const router = useRouter();
 function handleLinkClick(path: string) {
   //@ts-ignore
   addViewTransition(() => router.push(path));
+  document.getElementById('filterAll')?.click();
+  document.getElementById('clearSearchInput')?.click();
 }
 </script>
diff --git a/frontend_vue/src/components/ui/SearchBar.vue b/frontend_vue/src/components/ui/SearchBar.vue
@@ -22,6 +22,7 @@
       v-if="value && value.length > 0"
       class="absolute top-[.25rem] right-16 text-grey-300 duration-150 cursor-pointer hover:text-green-500"
       @click="clearInput"
+      id="clearSearchInput"
     >
       <font-awesome-icon
         icon="close"