decouple channel hidden from tags

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

@@ -6,6 +6,7 @@ import FtInputTags from '../../components/ft-input-tags/ft-input-tags.vue'
 import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
 import { invidiousGetChannelInfo } from '../../helpers/api/invidious'
 import { getLocalChannel } from '../../helpers/api/local'
+import { showToast } from '../../helpers/utils'
 
 export default defineComponent({
   name: 'PlayerSettings',
@@ -142,6 +143,9 @@ export default defineComponent({
     handleChannelsHidden: function (value) {
       this.updateChannelsHidden(JSON.stringify(value))
     },
+    handleChannelsExists: function () {
+      showToast(this.$t('Settings.Distraction Free Settings.Hide Channels Already Exists'))
+    },
     findChannelById: async function (id) {
       try {
         if (this.backendPreference === 'invidious') {

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

@@ -247,6 +247,7 @@
         :find-secondary-name="findChannelNameById"
         :find-icon="findChannelIconById"
         @change="handleChannelsHidden"
+        @already-exists="handleChannelsExists"
       />
     </ft-flex-box>
   </ft-settings-section>

src/renderer/components/ft-input-tags/ft-input-tags.js

@@ -2,7 +2,6 @@ import { defineComponent } from 'vue'
 import FtButton from '../ft-button/ft-button.vue'
 import FtInput from '../ft-input/ft-input.vue'
 import FtTooltip from '../ft-tooltip/ft-tooltip.vue'
-import { showToast } from '../../helpers/utils'
 
 export default defineComponent({
   name: 'FtInputTags',
@@ -42,28 +41,28 @@ export default defineComponent({
     },
     findSecondaryName: {
       type: Function,
-      default: async (_) => '',
+      default: (_) => '',
     },
     findIcon: {
       type: Function,
-      default: async (_) => '',
+      default: (_) => '',
     }
   },
   methods: {
-    updateTags: async function (text, _) {
+    updateTags: async function (text, _e) {
       // text entered add tag and update tag list
       const name = text.trim()
 
       if (!this.tagList.some((tag) => tag.name === name)) {
-        // secondary name and icon assumes an api call may be used
+        // secondary name and icon searching allow api calls to be used
         const secondaryName = await this.findSecondaryName(name) ?? ''
         const icon = await this.findIcon(name) ?? ''
 
         const newList = this.tagList.slice(0)
         newList.push({ name, secondaryName, icon })
         this.$emit('change', newList)
       } else {
-        showToast(this.$t('Settings.Distraction Free Settings.Hide Channels Already Exists'))
+        this.$emit('already-exists')
       }
 
       // clear input boxes