Added event queue,

Added example to share buttons

src/renderer/App.vue

@@ -14,7 +14,7 @@
       />
       <!-- </keep-alive> -->
     </Transition>
-    <ft-toast ref="toast" message="hello world" :action="toastAction" />
+    <ft-toast />
   </div>
 </template>
 

src/renderer/components/ft-toast/ft-toast-events.js

@@ -0,0 +1,4 @@
+import Vue from 'vue';
+
+const events = new Vue();
+export default events;

src/renderer/components/ft-toast/ft-toast.js

@@ -1,22 +1,19 @@
 import Vue from 'vue'
+import FtToastEvents from './ft-toast-events.js'
 
 export default Vue.extend({
   name: 'FtToast',
-  props: {
-    message: {
-      type: String,
-      required: true,
-    },
-    action: {
-      type: Function,
-      default: function () {},
-    },
-  },
   data: function () {
     return {
       isOpen: false,
+      message: '',
+      action: () => {},
+      queue: [],
     }
   },
+  mounted: function () {
+    FtToastEvents.$on('toast.open', this.open)
+  },
   methods: {
     performAction: function () {
       this.action()
@@ -24,10 +21,23 @@ export default Vue.extend({
     },
     close: function () {
       this.isOpen = false
+      if(this.queue.length !== 0) {
+        const toast = this.queue.shift()
+        this.open(toast.message, toast.action)
+      }
     },
-    open: function () {
+    open: function (message, action) {
+      if (this.isOpen) {
+        this.queue.push({ message: message, action: action })
+        return
+      }
+      this.message = message
+      this.action = action || (() => {});
       this.isOpen = true
       setTimeout(this.close, 2000)
     },
   },
+  beforeDestroy: function () {
+    FtToastEvents.$off('toast.open', this.open)
+  },
 })

src/renderer/components/watch-video-info/watch-video-info.js

@@ -4,6 +4,7 @@ import FtButton from '../ft-button/ft-button.vue'
 import FtListDropdown from '../ft-list-dropdown/ft-list-dropdown.vue'
 import FtFlexBox from '../ft-flex-box/ft-flex-box.vue'
 import FtIconButton from '../ft-icon-button/ft-icon-button.vue'
+import FtToastEvents from '../ft-toast/ft-toast-events'
 // import { shell } from 'electron'
 
 export default Vue.extend({
@@ -146,6 +147,7 @@ export default Vue.extend({
 
       switch (method) {
         case 'copyYoutube':
+          FtToastEvents.$emit('toast.open', "YouTube URL copied to clipboard")
           navigator.clipboard.writeText(this.youtubeUrl)
           break
         case 'openYoutube':
@@ -155,6 +157,7 @@ export default Vue.extend({
           }
           break
         case 'copyYoutubeEmbed':
+          FtToastEvents.$emit('toast.open', "YouTube Embed URL copied to clipboard")
           navigator.clipboard.writeText(this.youtubeEmbedUrl)
           break
         case 'openYoutubeEmbed':
@@ -164,6 +167,7 @@ export default Vue.extend({
           }
           break
         case 'copyInvidious':
+          FtToastEvents.$emit('toast.open', "Invidious URL copied to clipboard")
           navigator.clipboard.writeText(this.invidiousUrl)
           break
         case 'openInvidious':