Add toggle for search suggestions

src/renderer/components/general-settings/general-settings.js

@@ -552,6 +552,9 @@ export default Vue.extend({
     invidiousInstance: function () {
       return this.$store.getters.getInvidiousInstance
     },
+    enableSearchSuggestions: function () {
+      return this.$store.getters.getEnableSearchSuggestions
+    },
     backendFallback: function () {
       return this.$store.getters.getBackendFallback
     },
@@ -616,6 +619,7 @@ export default Vue.extend({
     },
 
     ...mapActions([
+      'updateEnableSearchSuggestions',
       'updateBackendFallback',
       'updateCheckForUpdates',
       'updateBarColor',

src/renderer/components/general-settings/general-settings.vue

@@ -12,6 +12,11 @@
         :default-value="backendFallback"
         @change="updateBackendFallback"
       />
+      <ft-toggle-switch
+        label="Enable Search Suggestions"
+        :default-value="enableSearchSuggestions"
+        @change="updateEnableSearchSuggestions"
+      />
       <ft-toggle-switch
         v-if="false"
         label="Check for Updates"

src/renderer/components/top-nav/top-nav.js

@@ -22,6 +22,10 @@ export default Vue.extend({
     }
   },
   computed: {
+    enableSearchSuggestions: function () {
+      return this.$store.getters.getEnableSearchSuggestions
+    },
+
     searchSettings: function () {
       return this.$store.getters.getSearchSettings
     },
@@ -103,7 +107,9 @@ export default Vue.extend({
     },
 
     getSearchSuggestionsDebounce: function (query) {
-      this.debounceSearchResults(query)
+      if (this.enableSearchSuggestions) {
+        this.debounceSearchResults(query)
+      }
     },
 
     getSearchSuggestions: function (query) {

src/renderer/store/modules/settings.js

@@ -37,6 +37,7 @@ const state = {
   thumbnailPreference: '',
   invidiousInstance: 'https://invidio.us',
   barColor: false,
+  enableSearchSuggestions: true,
   rememberHistory: true,
   autoplayVideos: true,
   autoplayPlaylists: true,
@@ -72,6 +73,10 @@ const getters = {
     return state.barColor
   },
 
+  getEnableSearchSuggestions: () => {
+    return state.enableSearchSuggestions
+  },
+
   getBackendPreference: () => {
     return state.backendPreference
   },
@@ -169,6 +174,9 @@ const actions = {
             case 'checkForUpdates':
               commit('setCheckForUpdates', result.value)
               break
+            case 'enableSearchSuggestions':
+              commit('setEnableSearchSuggestions', result.value)
+              break
             case 'backendPreference':
               commit('setBackendPreference', result.value)
               break
@@ -255,6 +263,14 @@ const actions = {
     })
   },
 
+  updateEnableSearchSuggestions ({ commit }, enableSearchSuggestions) {
+    settingsDb.update({ _id: 'enableSearchSuggestions' }, { _id: 'enableSearchSuggestions', value: enableSearchSuggestions }, { upsert: true }, (err, numReplaced) => {
+      if (!err) {
+        commit('setEnableSearchSuggestions', enableSearchSuggestions)
+      }
+    })
+  },
+
   updateBackendPreference ({ commit }, backendPreference) {
     settingsDb.update({ _id: 'backendPreference' }, { _id: 'backendPreference', value: backendPreference }, { upsert: true }, (err, numReplaced) => {
       if (!err) {
@@ -440,6 +456,9 @@ const mutations = {
   setBarColor (state, barColor) {
     state.barColor = barColor
   },
+  setEnableSearchSuggestions (state, enableSearchSuggestions) {
+    state.enableSearchSuggestions = enableSearchSuggestions
+  },
   setRememberHistory (state, rememberHistory) {
     state.rememberHistory = rememberHistory
   },