Fix issues detected during review

Fix focus being lost for a second during searching of search history entry causing clear text button to phase away for a moment. Fix clear text button event not being noticed by the logic in top-nav. Fix spacebar error issue by adding check in updateVisibleDataList function.
kommunarr · Dec 20, 2024 · 1a06600 · 1a06600
1 parent 953ab80
commit 1a06600
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 8 deletions.
diff --git a/src/renderer/components/ft-input/ft-input.js b/src/renderer/components/ft-input/ft-input.js
@@ -240,15 +240,15 @@ export default defineComponent({
 
     handleOptionClick: function (index) {
       this.searchState.showOptions = false
-      if (this.visibleDataList[index].route) {
-        this.inputData = `ft:${this.visibleDataList[index].route}`
-        this.$emit('input', this.inputData)
+      const isSearchHistoryClick = this.visibleDataList[index].route
+      this.inputData = isSearchHistoryClick ? `ft:${this.visibleDataList[index].route}` : this.visibleDataList[index]
+      this.$emit('input', this.inputData)
+      this.handleClick()
+
+      // update displayed label to match name of the search history entry
+      if (isSearchHistoryClick) {
         this.inputData = this.$refs.input.value = this.visibleDataList[index].name
-      } else {
-        this.inputData = this.visibleDataList[index]
-        this.$emit('input', this.inputData)
       }
-      this.handleClick()
     },
 
     /**
@@ -321,6 +321,10 @@ export default defineComponent({
       const lowerCaseInputData = this.inputData.toLowerCase()
 
       this.visibleDataList = this.dataList.filter(x => {
+        if (x.name) {
+          return x.name.toLowerCase().indexOf(lowerCaseInputData) !== -1
+        }
+
         return x.toLowerCase().indexOf(lowerCaseInputData) !== -1
       })
     },

diff --git a/src/renderer/components/top-nav/top-nav.js b/src/renderer/components/top-nav/top-nav.js
@@ -167,10 +167,12 @@ export default defineComponent({
     goToSearch: async function (queryText, { event }) {
       const doCreateNewWindow = event && event.shiftKey
 
+      const isFreeTubeInternalQuery = queryText.startsWith('ft:')
+
       if (window.innerWidth <= MOBILE_WIDTH_THRESHOLD) {
         this.$refs.searchContainer.blur()
         this.showSearchContainer = false
-      } else {
+      } else if (!isFreeTubeInternalQuery) {
         this.$refs.searchInput.blur()
       }
 

diff --git a/src/renderer/components/top-nav/top-nav.vue b/src/renderer/components/top-nav/top-nav.vue
@@ -98,6 +98,7 @@
           :show-data-when-empty="true"
           @input="getSearchSuggestionsDebounce"
           @click="goToSearch"
+          @clear="lastSuggestionQuery = ''"
         />
         <font-awesome-icon
           class="navFilterIcon navIcon"