From cd7a1de54856f1c0e8bec9857725bc62d06f036d Mon Sep 17 00:00:00 2001
From: Tamius Han <tamius.han@gmail.com>
Date: Sun, 14 Mar 2021 02:10:41 +0100
Subject: [PATCH] fix vue imports

---
 src/popup/App.vue                         |  6 ++----
 src/popup/js/PopupExec.ts                 |  2 +-
 src/popup/panels/AboutPanel.vue           |  6 +++---
 src/popup/panels/DefaultSettingsPanel.vue |  9 ++++----
 src/popup/panels/PerformancePanel.vue     | 25 -----------------------
 src/popup/panels/SiteDetailsPanel.vue     |  4 ++--
 src/popup/panels/VideoPanel.vue           | 11 +++++-----
 src/popup/panels/WhatsNewPanel.vue        |  4 ++--
 8 files changed, 21 insertions(+), 46 deletions(-)
 delete mode 100644 src/popup/panels/PerformancePanel.vue

diff --git a/src/popup/App.vue b/src/popup/App.vue
index b9b5dd9..0809cc3 100644
--- a/src/popup/App.vue
+++ b/src/popup/App.vue
@@ -195,8 +195,6 @@
                               :settings="settings"
                               :site="selectedSite"
         />
-        <PerformancePanel v-if="selectedTab === 'performance-metrics'" 
-                          :performance="performance" />
         <WhatsNewPanel v-if="selectedTab === 'whats-new'" />
         <AboutPanel v-if="selectedTab === 'about'" />
         <Donate v-if="selectedTab === 'donate'" />
@@ -223,9 +221,9 @@ import ExtensionMode from '../common/enums/ExtensionMode.enum';
 import Logger from '../ext/lib/Logger';
 import {ChromeShittinessMitigations as CSM} from '../common/js/ChromeShittinessMitigations';
 import { browser } from 'webextension-polyfill-ts';
+import { defineComponent } from 'vue';
 
-import Vue from '*.vue';
-export default Vue.extend({
+export default defineComponent({
   data () {
     return {
       selectedTab: 'video',
diff --git a/src/popup/js/PopupExec.ts b/src/popup/js/PopupExec.ts
index 020f249..61dcf6c 100644
--- a/src/popup/js/PopupExec.ts
+++ b/src/popup/js/PopupExec.ts
@@ -5,7 +5,7 @@ class PopupExec {
   settings: Settings;
   site: any;
   
-  constructor(settings, site) {
+  constructor(settings?, site?) {
     this.settings = settings;
     this.site = site;
   }
diff --git a/src/popup/panels/AboutPanel.vue b/src/popup/panels/AboutPanel.vue
index c53b95f..231f11e 100644
--- a/src/popup/panels/AboutPanel.vue
+++ b/src/popup/panels/AboutPanel.vue
@@ -42,11 +42,11 @@ import ShortcutButton from '../../common/components/ShortcutButton.vue';
 import BrowserDetect from '../../ext/conf/BrowserDetect';
 import { browser } from 'webextension-polyfill-ts';
 
-import Vue from 'vue'
-export default Vue.extend({
+import { defineComponent } from 'vue'
+export default defineComponent({
   components: {
     ShortcutButton,
- },
+  },
   data() {
     return {
       // reminder — webextension-polyfill doesn't seem to work in vue!
diff --git a/src/popup/panels/DefaultSettingsPanel.vue b/src/popup/panels/DefaultSettingsPanel.vue
index acbe043..ed3fc68 100644
--- a/src/popup/panels/DefaultSettingsPanel.vue
+++ b/src/popup/panels/DefaultSettingsPanel.vue
@@ -126,10 +126,11 @@
 import KeyboardShortcutParser from '../../common/js/KeyboardShortcutParser';
 import ShortcutButton from '../../common/components/ShortcutButton.vue';
 import ComputeActionsMixin from '../../common/mixins/ComputeActionsMixin';
-
-import Vue from 'vue'
 import PopupExec from '../js/PopupExec';
-export default Vue.extend({
+import { defineComponent } from 'vue';
+
+
+export default defineComponent({
   data() {
     return {
     }
@@ -143,7 +144,7 @@ export default Vue.extend({
     site: String,
   },
   created() {
-    this.exec = new ExecAction(this.settings, this.site);
+    this.exec = new PopupExec(this.settings, this.site);
   },
   components: {
     ShortcutButton,
diff --git a/src/popup/panels/PerformancePanel.vue b/src/popup/panels/PerformancePanel.vue
deleted file mode 100644
index 09fc02e..0000000
--- a/src/popup/panels/PerformancePanel.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<template>
-  <div>
-    PERFORMANCE PANEL :: This is here for debugging purposes.
-
-    <pre>{{performance}}</pre>
-  </div>
-</template>
-
-<script lang="ts">
-import Vue from 'vue'
-export default Vue.extend({
-  props: {
-    performance: Object,
-  },
-  watch: {
-    performance: {
-      deep: true,
-    }
-  }
-})
-</script>
-
-<style>
-
-</style>
diff --git a/src/popup/panels/SiteDetailsPanel.vue b/src/popup/panels/SiteDetailsPanel.vue
index 7bfacda..b59282b 100644
--- a/src/popup/panels/SiteDetailsPanel.vue
+++ b/src/popup/panels/SiteDetailsPanel.vue
@@ -134,8 +134,8 @@ import ExtensionMode from '../../common/enums/ExtensionMode.enum';
 import VideoAlignmentType from '../../common/enums/VideoAlignmentType.enum';
 import StretchType from '../../common/enums/StretchType.enum';
 
-import Vue from 'vue'
-export default Vue.extend({
+import { defineComponent } from 'vue'
+export default defineComponent({
   components: {
     QuerySelectorSetting,
     ShortcutButton,
diff --git a/src/popup/panels/VideoPanel.vue b/src/popup/panels/VideoPanel.vue
index ea36e3b..55efd69 100644
--- a/src/popup/panels/VideoPanel.vue
+++ b/src/popup/panels/VideoPanel.vue
@@ -120,15 +120,16 @@
   </div>
 </template>
 
-<script>
+<script lang="ts">
 import PopupExec from '../js/PopupExec';
 import KeyboardShortcutParser from '../../common/js/KeyboardShortcutParser';
-import ShortcutButton from '../../common/components/ShortcutButton';
+import ShortcutButton from '../../common/components/ShortcutButton.vue';
 import ComputeActionsMixin from '../../common/mixins/ComputeActionsMixin';
 import CropModePersistence from '../../common/enums/CropModePersistence.enum';
+import { defineComponent } from 'vue';
 
-export default {
-  data() {
+export default defineComponent({
+   data() {
     return {
       scope: 'page',
       CropModePersistence: CropModePersistence,
@@ -181,7 +182,7 @@ export default {
       );
     }
   }
-}
+})
 </script>
 
 <style>
diff --git a/src/popup/panels/WhatsNewPanel.vue b/src/popup/panels/WhatsNewPanel.vue
index bb6cfcc..8b2f868 100644
--- a/src/popup/panels/WhatsNewPanel.vue
+++ b/src/popup/panels/WhatsNewPanel.vue
@@ -18,10 +18,10 @@
 </template>
 
 <script lang="ts">
+import { defineComponent } from 'vue';
 import BrowserDetect from '../../ext/conf/BrowserDetect';
 
-import Vue from 'vue'
-export default Vue.extend({
+export default defineComponent({
   data () {
     return {
       BrowserDetect: BrowserDetect