From 433ea02a18c0328b8079a40657220633c09e363a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 18 Apr 2021 14:58:02 +0300
Subject: [PATCH 001/113] Changed some of TabSwitcher's internals for easier
 Vue3 migration

---
 .../settings_modal/settings_modal_content.js  |  2 +-
 .../tabs/mutes_and_blocks_tab.js              |  2 +-
 .../tabs/theme_tab/theme_tab.js               |  2 +-
 .../sticker_picker/sticker_picker.js          |  2 +-
 .../{tab_switcher.js => tab_switcher.jsx}     | 57 ++++++++++++-------
 src/components/user_profile/user_profile.js   |  2 +-
 6 files changed, 41 insertions(+), 26 deletions(-)
 rename src/components/tab_switcher/{tab_switcher.js => tab_switcher.jsx} (68%)

diff --git a/src/components/settings_modal/settings_modal_content.js b/src/components/settings_modal/settings_modal_content.js
index 9dcf1b5a..7e366580 100644
--- a/src/components/settings_modal/settings_modal_content.js
+++ b/src/components/settings_modal/settings_modal_content.js
@@ -1,4 +1,4 @@
-import TabSwitcher from 'src/components/tab_switcher/tab_switcher.js'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 
 import DataImportExportTab from './tabs/data_import_export_tab.vue'
 import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue'
diff --git a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
index 40a87b81..6cfeea35 100644
--- a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
+++ b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
@@ -2,7 +2,7 @@ import get from 'lodash/get'
 import map from 'lodash/map'
 import reject from 'lodash/reject'
 import Autosuggest from 'src/components/autosuggest/autosuggest.vue'
-import TabSwitcher from 'src/components/tab_switcher/tab_switcher.js'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import BlockCard from 'src/components/block_card/block_card.vue'
 import MuteCard from 'src/components/mute_card/mute_card.vue'
 import DomainMuteCard from 'src/components/domain_mute_card/domain_mute_card.vue'
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
index 8960c566..727513f4 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
@@ -34,7 +34,7 @@ import OpacityInput from 'src/components/opacity_input/opacity_input.vue'
 import ShadowControl from 'src/components/shadow_control/shadow_control.vue'
 import FontControl from 'src/components/font_control/font_control.vue'
 import ContrastRatio from 'src/components/contrast_ratio/contrast_ratio.vue'
-import TabSwitcher from 'src/components/tab_switcher/tab_switcher.js'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 
 import Preview from './preview.vue'
diff --git a/src/components/sticker_picker/sticker_picker.js b/src/components/sticker_picker/sticker_picker.js
index 8daf3f07..3a2d3914 100644
--- a/src/components/sticker_picker/sticker_picker.js
+++ b/src/components/sticker_picker/sticker_picker.js
@@ -1,6 +1,6 @@
 /* eslint-env browser */
 import statusPosterService from '../../services/status_poster/status_poster.service.js'
-import TabSwitcher from '../tab_switcher/tab_switcher.js'
+import TabSwitcher from '../tab_switcher/tab_switcher.jsx'
 
 const StickerPicker = {
   components: {
diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.jsx
similarity index 68%
rename from src/components/tab_switcher/tab_switcher.js
rename to src/components/tab_switcher/tab_switcher.jsx
index 12aac8e6..68eee122 100644
--- a/src/components/tab_switcher/tab_switcher.js
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -1,10 +1,12 @@
-import Vue from 'vue'
 import { mapState } from 'vuex'
 import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
 
 import './tab_switcher.scss'
 
-export default Vue.component('tab-switcher', {
+// TODO VUE3: change data to props
+const findFirstUsable = (slots) => slots.findIndex(_ => _.data && _.data.attrs)
+
+export default {
   name: 'TabSwitcher',
   props: {
     renderOnlyFocused: {
@@ -34,11 +36,17 @@ export default Vue.component('tab-switcher', {
     }
   },
   data () {
+    console.log(this.$slots.default)
     return {
-      active: this.$slots.default.findIndex(_ => _.tag)
+      // TODO VUE3: add () after 'default'
+      active: findFirstUsable(this.$slots.default)
     }
   },
   computed: {
+    slots () {
+      // TODO VUE3: add () at the end
+      return this.$slots.default
+    },
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
@@ -55,9 +63,11 @@ export default Vue.component('tab-switcher', {
     })
   },
   beforeUpdate () {
-    const currentSlot = this.$slots.default[this.active]
-    if (!currentSlot.tag) {
-      this.active = this.$slots.default.findIndex(_ => _.tag)
+    console.log(this.slots, this.active)
+    const currentSlot = this.slots[this.active]
+    // TODO VUE3: change data to props
+    if (!currentSlot.data) {
+      this.active = findFirstUsable(this.slots)
     }
   },
   methods: {
@@ -69,7 +79,7 @@ export default Vue.component('tab-switcher', {
     },
     setTab (index) {
       if (typeof this.onSwitch === 'function') {
-        this.onSwitch.call(null, this.$slots.default[index].key)
+        this.onSwitch.call(null, this.slots[index].key)
       }
       this.active = index
       if (this.scrollableTabs) {
@@ -77,27 +87,30 @@ export default Vue.component('tab-switcher', {
       }
     }
   },
+  // TODO VUE3: remove 'h' here
   render (h) {
-    const tabs = this.$slots.default
+    const tabs = this.slots
       .map((slot, index) => {
-        if (!slot.tag) return
+        // TODO VUE3 change to slot.props
+        const props = slot.data && slot.data.attrs
+        if (!props) return
         const classesTab = ['tab', 'button-default']
         const classesWrapper = ['tab-wrapper']
         if (this.activeIndex === index) {
           classesTab.push('active')
           classesWrapper.push('active')
         }
-        if (slot.data.attrs.image) {
+        if (props.image) {
           return (
             <div class={classesWrapper.join(' ')}>
               <button
-                disabled={slot.data.attrs.disabled}
+                disabled={props.disabled}
                 onClick={this.clickTab(index)}
                 class={classesTab.join(' ')}
                 type="button"
               >
-                <img src={slot.data.attrs.image} title={slot.data.attrs['image-tooltip']}/>
-                {slot.data.attrs.label ? '' : slot.data.attrs.label}
+                <img src={props.image} title={props['image-tooltip']}/>
+                {props.label ? '' : props.label}
               </button>
             </div>
           )
@@ -105,25 +118,27 @@ export default Vue.component('tab-switcher', {
         return (
           <div class={classesWrapper.join(' ')}>
             <button
-              disabled={slot.data.attrs.disabled}
+              disabled={props.disabled}
               onClick={this.clickTab(index)}
               class={classesTab.join(' ')}
               type="button"
             >
-              {!slot.data.attrs.icon ? '' : (<FAIcon class="tab-icon" size="2x" fixed-width icon={slot.data.attrs.icon}/>)}
+              {!props.icon ? '' : (<FAIcon class="tab-icon" size="2x" fixed-width icon={props.icon}/>)}
               <span class="text">
-                {slot.data.attrs.label}
+                {props.label}
               </span>
             </button>
           </div>
         )
       })
 
-    const contents = this.$slots.default.map((slot, index) => {
-      if (!slot.tag) return
+    const contents = this.slots.map((slot, index) => {
+      // TODO VUE3 change to slot.props
+      const props = slot.data && slot.data.attrs
+      if (!props) return
       const active = this.activeIndex === index
       const classes = [ active ? 'active' : 'hidden' ]
-      if (slot.data.attrs.fullHeight) {
+      if (props.fullHeight) {
         classes.push('full-height')
       }
       const renderSlot = (!this.renderOnlyFocused || active)
@@ -134,7 +149,7 @@ export default Vue.component('tab-switcher', {
         <div class={classes}>
           {
             this.sideTabBar
-              ? <h1 class="mobile-label">{slot.data.attrs.label}</h1>
+              ? <h1 class="mobile-label">{props.label}</h1>
               : ''
           }
           {renderSlot}
@@ -153,4 +168,4 @@ export default Vue.component('tab-switcher', {
       </div>
     )
   }
-})
+}
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index c0b55a6c..c5ccf747 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -3,7 +3,7 @@ import UserCard from '../user_card/user_card.vue'
 import FollowCard from '../follow_card/follow_card.vue'
 import Timeline from '../timeline/timeline.vue'
 import Conversation from '../conversation/conversation.vue'
-import TabSwitcher from 'src/components/tab_switcher/tab_switcher.js'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import List from '../list/list.vue'
 import withLoadMore from '../../hocs/with_load_more/with_load_more'
 import { library } from '@fortawesome/fontawesome-svg-core'

From b0789fd6fd280a3dc8cefb4cb2410abec4be9ae6 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 18 Apr 2021 15:03:28 +0300
Subject: [PATCH 002/113] fix theme tab, remove console.logs

---
 src/components/tab_switcher/tab_switcher.jsx | 21 ++++++++++----------
 1 file changed, 10 insertions(+), 11 deletions(-)

diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index 68eee122..44221d50 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -36,17 +36,12 @@ export default {
     }
   },
   data () {
-    console.log(this.$slots.default)
     return {
       // TODO VUE3: add () after 'default'
       active: findFirstUsable(this.$slots.default)
     }
   },
   computed: {
-    slots () {
-      // TODO VUE3: add () at the end
-      return this.$slots.default
-    },
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
@@ -63,11 +58,10 @@ export default {
     })
   },
   beforeUpdate () {
-    console.log(this.slots, this.active)
-    const currentSlot = this.slots[this.active]
+    const currentSlot = this.slots()[this.active]
     // TODO VUE3: change data to props
     if (!currentSlot.data) {
-      this.active = findFirstUsable(this.slots)
+      this.active = findFirstUsable(this.slots())
     }
   },
   methods: {
@@ -77,9 +71,14 @@ export default {
         this.setTab(index)
       }
     },
+    // DO NOT put it to computed, it doesn't work (caching?)
+    slots () {
+      // TODO VUE3: add () at the end
+      return this.$slots.default
+    },
     setTab (index) {
       if (typeof this.onSwitch === 'function') {
-        this.onSwitch.call(null, this.slots[index].key)
+        this.onSwitch.call(null, this.slots()[index].key)
       }
       this.active = index
       if (this.scrollableTabs) {
@@ -89,7 +88,7 @@ export default {
   },
   // TODO VUE3: remove 'h' here
   render (h) {
-    const tabs = this.slots
+    const tabs = this.slots()
       .map((slot, index) => {
         // TODO VUE3 change to slot.props
         const props = slot.data && slot.data.attrs
@@ -132,7 +131,7 @@ export default {
         )
       })
 
-    const contents = this.slots.map((slot, index) => {
+    const contents = this.slots().map((slot, index) => {
       // TODO VUE3 change to slot.props
       const props = slot.data && slot.data.attrs
       if (!props) return

From 33777fab47b65975d343d219c0b1866ba6849b3f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 18 Apr 2021 15:39:06 +0300
Subject: [PATCH 003/113] small refactoring to uncouple tab-switcher from
 settings modal

---
 .../settings_modal/settings_modal_content.js       |  3 +++
 .../settings_modal/settings_modal_content.vue      |  1 +
 src/components/tab_switcher/tab_switcher.jsx       | 14 ++++++++++----
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/components/settings_modal/settings_modal_content.js b/src/components/settings_modal/settings_modal_content.js
index 7e366580..deb77298 100644
--- a/src/components/settings_modal/settings_modal_content.js
+++ b/src/components/settings_modal/settings_modal_content.js
@@ -53,6 +53,9 @@ const SettingsModalContent = {
     },
     open () {
       return this.$store.state.interface.settingsModalState !== 'hidden'
+    },
+    bodyLock () {
+      return this.$store.state.interface.settingsModalState === 'visible'
     }
   },
   methods: {
diff --git a/src/components/settings_modal/settings_modal_content.vue b/src/components/settings_modal/settings_modal_content.vue
index c9ed2a38..0be76d22 100644
--- a/src/components/settings_modal/settings_modal_content.vue
+++ b/src/components/settings_modal/settings_modal_content.vue
@@ -4,6 +4,7 @@
     class="settings_tab-switcher"
     :side-tab-bar="true"
     :scrollable-tabs="true"
+    :body-scroll-lock="bodyLock"
   >
     <div
       :label="$t('settings.general')"
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index 44221d50..2869e59c 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -33,6 +33,11 @@ export default {
       required: false,
       type: Boolean,
       default: false
+    },
+    bodyScrollLock: {
+      required: false,
+      type: Boolean,
+      default: false
     }
   },
   data () {
@@ -50,9 +55,6 @@ export default {
         return this.active
       }
     },
-    settingsModalVisible () {
-      return this.settingsModalState === 'visible'
-    },
     ...mapState({
       settingsModalState: state => state.interface.settingsModalState
     })
@@ -161,7 +163,11 @@ export default {
         <div class="tabs">
           {tabs}
         </div>
-        <div ref="contents" class={'contents' + (this.scrollableTabs ? ' scrollable-tabs' : '')} v-body-scroll-lock={this.settingsModalVisible}>
+        <div
+          ref="contents"
+          class={'contents' + (this.scrollableTabs ? ' scrollable-tabs' : '')}
+          v-body-scroll-lock={this.bodyScrollLock}
+        >
           {contents}
         </div>
       </div>

From ced9c0fa7ef18d81d68a6833299c89582e0e749e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sat, 24 Apr 2021 17:56:00 +0300
Subject: [PATCH 004/113] some bare minimum to get vue3 boot (no UI yet)

---
 .babelrc                   |   2 +-
 build/webpack.base.conf.js |   8 +-
 package.json               |  23 +-
 src/App.js                 |   2 +-
 src/boot/after_store.js    |  41 +-
 src/main.js                |  26 +-
 yarn.lock                  | 799 +++++++++++++++++++++++++------------
 7 files changed, 585 insertions(+), 316 deletions(-)

diff --git a/.babelrc b/.babelrc
index 3c732dd1..373d2c59 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,5 +1,5 @@
 {
   "presets": ["@babel/preset-env"],
-  "plugins": ["@babel/plugin-transform-runtime", "lodash", "@vue/babel-plugin-transform-vue-jsx"],
+  "plugins": ["@babel/plugin-transform-runtime", "lodash", "@vue/babel-plugin-jsx"],
   "comments": false
 }
diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js
index d987eff1..f7ed8b52 100644
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@@ -3,6 +3,7 @@ var config = require('../config')
 var utils = require('./utils')
 var projectRoot = path.resolve(__dirname, '../')
 var ServiceWorkerWebpackPlugin = require('serviceworker-webpack-plugin')
+var { VueLoaderPlugin } = require('vue-loader')
 
 var env = process.env.NODE_ENV
 // check env & config/index.js to decide weither to enable CSS Sourcemaps for the
@@ -28,12 +29,12 @@ module.exports = {
     }
   },
   resolve: {
-    extensions: ['.js', '.vue'],
+    extensions: ['.js', '.vue', '.jsx'],
     modules: [
       path.join(__dirname, '../node_modules')
     ],
     alias: {
-      'vue$': 'vue/dist/vue.runtime.common',
+      vue: "@vue/runtime-dom",
       'static': path.resolve(__dirname, '../static'),
       'src': path.resolve(__dirname, '../src'),
       'assets': path.resolve(__dirname, '../src/assets'),
@@ -93,6 +94,7 @@ module.exports = {
     new ServiceWorkerWebpackPlugin({
       entry: path.join(__dirname, '..', 'src/sw.js'),
       filename: 'sw-pleroma.js'
-    })
+    }),
+    new VueLoaderPlugin()
   ]
 }
diff --git a/package.json b/package.json
index 8dbf2503..2370d699 100644
--- a/package.json
+++ b/package.json
@@ -17,11 +17,12 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.7.6",
-    "@chenfengyuan/vue-qrcode": "^1.0.0",
+    "@chenfengyuan/vue-qrcode": "^2.0.0-beta",
     "@fortawesome/fontawesome-svg-core": "^1.2.32",
     "@fortawesome/free-regular-svg-icons": "^5.15.1",
     "@fortawesome/free-solid-svg-icons": "^5.15.1",
-    "@fortawesome/vue-fontawesome": "^2.0.0",
+    "@fortawesome/vue-fontawesome": "^3.0.0-3",
+    "@vue/compiler-sfc": "^3.0.7",
     "body-scroll-lock": "^2.6.4",
     "chromatism": "^3.0.0",
     "cropperjs": "^1.4.3",
@@ -30,15 +31,14 @@
     "localforage": "^1.5.0",
     "parse-link-header": "^1.0.1",
     "phoenix": "^1.3.0",
-    "portal-vue": "^2.1.4",
     "punycode.js": "^2.1.0",
+    "qrcode": "^1.4.4",
     "v-click-outside": "^2.1.1",
-    "vue": "^2.6.11",
-    "vue-i18n": "^7.3.2",
-    "vue-router": "^3.0.1",
-    "vue-template-compiler": "^2.6.11",
-    "vuelidate": "^0.7.4",
-    "vuex": "^3.0.1"
+    "vue": "^3.0.7",
+    "vue-i18n": "^9.0.0-beta.18",
+    "vue-router": "^4.0.5",
+    "vuelidate": "^0.7.6",
+    "vuex": "^4.0.0"
   },
   "devDependencies": {
     "@babel/core": "^7.7.5",
@@ -47,8 +47,9 @@
     "@babel/register": "^7.7.4",
     "@ungap/event-target": "^0.1.0",
     "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0",
+    "@vue/babel-plugin-jsx": "^1.0.3",
     "@vue/babel-plugin-transform-vue-jsx": "^1.1.2",
-    "@vue/test-utils": "^1.0.0-beta.26",
+    "@vue/test-utils": "^2.0.0-beta.8",
     "autoprefixer": "^6.4.0",
     "babel-eslint": "^7.0.0",
     "babel-loader": "^8.0.6",
@@ -109,7 +110,7 @@
     "stylelint-config-standard": "^20.0.0",
     "stylelint-rscss": "^0.4.0",
     "url-loader": "^1.1.2",
-    "vue-loader": "^14.0.0",
+    "vue-loader": "^16.1.2",
     "vue-style-loader": "^4.0.0",
     "webpack": "^4.0.0",
     "webpack-dev-middleware": "^3.6.0",
diff --git a/src/App.js b/src/App.js
index 1ca029b6..f886d7cb 100644
--- a/src/App.js
+++ b/src/App.js
@@ -46,7 +46,7 @@ export default {
     this.$store.dispatch('setOption', { name: 'interfaceLanguage', value: val })
     window.addEventListener('resize', this.updateMobileState)
   },
-  destroyed () {
+  unmounted () {
     window.removeEventListener('resize', this.updateMobileState)
   },
   computed: {
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 45090e5d..6f84f686 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -1,7 +1,13 @@
-import Vue from 'vue'
-import VueRouter from 'vue-router'
-import routes from './routes'
+import { createApp } from 'vue'
+import { createRouter, createWebHistory } from 'vue-router'
+import VueClickOutside from 'v-click-outside'
+
+import { FontAwesomeIcon, FontAwesomeLayers } from '@fortawesome/vue-fontawesome'
+
 import App from '../App.vue'
+import routes from './routes'
+import VBodyScrollLock from 'src/directives/body_scroll_lock'
+
 import { windowWidth } from '../services/window_utils/window_utils'
 import { getOrCreateApp, getClientToken } from '../services/new_api/oauth.js'
 import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
@@ -366,25 +372,32 @@ const afterStoreSetup = async ({ store, i18n }) => {
   getTOS({ store })
   getStickers({ store })
 
-  const router = new VueRouter({
-    mode: 'history',
+  const router = createRouter({
+    history: createWebHistory(),
     routes: routes(store),
     scrollBehavior: (to, _from, savedPosition) => {
       if (to.matched.some(m => m.meta.dontScroll)) {
         return false
       }
-      return savedPosition || { x: 0, y: 0 }
+      return savedPosition || { left: 0, top: 0 }
     }
   })
 
-  /* eslint-disable no-new */
-  return new Vue({
-    router,
-    store,
-    i18n,
-    el: '#app',
-    render: h => h(App)
-  })
+  const app = createApp(App)
+
+  app.use(router)
+  app.use(store)
+  app.use(i18n)
+
+  app.use(VueClickOutside)
+  app.use(VBodyScrollLock)
+
+  app.component('FAIcon', FontAwesomeIcon)
+  app.component('FALayers', FontAwesomeLayers)
+
+  app.mount('#app')
+
+  return app
 }
 
 export default afterStoreSetup
diff --git a/src/main.js b/src/main.js
index e1cac748..b7232c2e 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,6 +1,4 @@
-import Vue from 'vue'
-import VueRouter from 'vue-router'
-import Vuex from 'vuex'
+import { createStore } from 'vuex'
 
 import 'custom-event-polyfill'
 import './lib/event_target_polyfill.js'
@@ -21,34 +19,18 @@ import pollsModule from './modules/polls.js'
 import postStatusModule from './modules/postStatus.js'
 import chatsModule from './modules/chats.js'
 
-import VueI18n from 'vue-i18n'
+import { createI18n } from 'vue-i18n'
 
 import createPersistedState from './lib/persisted_state.js'
 import pushNotifications from './lib/push_notifications_plugin.js'
 
 import messages from './i18n/messages.js'
 
-import VueClickOutside from 'v-click-outside'
-import PortalVue from 'portal-vue'
-import VBodyScrollLock from './directives/body_scroll_lock'
-
-import { FontAwesomeIcon, FontAwesomeLayers } from '@fortawesome/vue-fontawesome'
-
 import afterStoreSetup from './boot/after_store.js'
 
 const currentLocale = (window.navigator.language || 'en').split('-')[0]
 
-Vue.use(Vuex)
-Vue.use(VueRouter)
-Vue.use(VueI18n)
-Vue.use(VueClickOutside)
-Vue.use(PortalVue)
-Vue.use(VBodyScrollLock)
-
-Vue.component('FAIcon', FontAwesomeIcon)
-Vue.component('FALayers', FontAwesomeLayers)
-
-const i18n = new VueI18n({
+const i18n = createI18n({
   // By default, use the browser locale, we will update it if neccessary
   locale: 'en',
   fallbackLocale: 'en',
@@ -75,7 +57,7 @@ const persistedStateOptions = {
     console.error(e)
     storageError = true
   }
-  const store = new Vuex.Store({
+  const store = createStore({
     modules: {
       i18n: {
         getters: {
diff --git a/yarn.lock b/yarn.lock
index 80c09312..3895f637 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -15,6 +15,13 @@
   dependencies:
     "@babel/highlight" "^7.10.4"
 
+"@babel/code-frame@^7.12.13":
+  version "7.12.13"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.12.13.tgz#dcfc826beef65e75c50e21d3837d7d95798dd658"
+  integrity sha512-HV1Cm0Q3ZrpCR93tkWOYiuYIgLxZXZFVG2VgK+MBWjUqZTundupbfx2aXarXuw5Ko5aMcjtJgbSs4vUGBS5v6g==
+  dependencies:
+    "@babel/highlight" "^7.12.13"
+
 "@babel/code-frame@^7.5.5":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.5.5.tgz#bc0782f6d69f7b7d49531219699b988f669a8f9d"
@@ -73,6 +80,15 @@
     jsesc "^2.5.1"
     source-map "^0.5.0"
 
+"@babel/generator@^7.13.16":
+  version "7.13.16"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.13.16.tgz#0befc287031a201d84cdfc173b46b320ae472d14"
+  integrity sha512-grBBR75UnKOcUWMp8WoDxNsWCFl//XCK6HWTrBQKTr5SV9f5g0pNOjdyzi/DTBv12S9GnYPInIXQBTky7OXEMg==
+  dependencies:
+    "@babel/types" "^7.13.16"
+    jsesc "^2.5.1"
+    source-map "^0.5.0"
+
 "@babel/generator@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.7.4.tgz#db651e2840ca9aa66f327dcec1dc5f5fa9611369"
@@ -141,6 +157,15 @@
     "@babel/template" "^7.10.4"
     "@babel/types" "^7.10.4"
 
+"@babel/helper-function-name@^7.12.13":
+  version "7.12.13"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.12.13.tgz#93ad656db3c3c2232559fd7b2c3dbdcbe0eb377a"
+  integrity sha512-TZvmPn0UOqmvi5G4vvw0qZTpVptGkB1GL61R6lKvrSdIxGm5Pky7Q3fpKiIkQCAtRCBUwB0PaThlx9vebCDSwA==
+  dependencies:
+    "@babel/helper-get-function-arity" "^7.12.13"
+    "@babel/template" "^7.12.13"
+    "@babel/types" "^7.12.13"
+
 "@babel/helper-function-name@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.7.4.tgz#ab6e041e7135d436d8f0a3eca15de5b67a341a2e"
@@ -157,6 +182,13 @@
   dependencies:
     "@babel/types" "^7.10.4"
 
+"@babel/helper-get-function-arity@^7.12.13":
+  version "7.12.13"
+  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.12.13.tgz#bc63451d403a3b3082b97e1d8b3fe5bd4091e583"
+  integrity sha512-DjEVzQNz5LICkzN0REdpD5prGoidvbdYk1BVgRUOINaWJP2t6avB27X1guXK1kXNrX0WMfsrm1A/ZBthYuIMQg==
+  dependencies:
+    "@babel/types" "^7.12.13"
+
 "@babel/helper-get-function-arity@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.7.4.tgz#cb46348d2f8808e632f0ab048172130e636005f0"
@@ -249,6 +281,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.0.0.tgz#bbb3fbee98661c569034237cc03967ba99b4f250"
   integrity sha512-CYAOUCARwExnEixLdB6sDm2dIJ/YgEAKDM1MOeMeZu9Ld/bDgVo8aiWrXwcY7OBh+1Ea2uUcVRcxKk0GJvW7QA==
 
+"@babel/helper-plugin-utils@^7.12.13":
+  version "7.13.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.13.0.tgz#806526ce125aed03373bc416a828321e3a6a33af"
+  integrity sha512-ZPafIPSwzUlAoWT8DKs1W2VyF2gOWthGd5NGFMsBcMMol+ZhK+EQY/e6V96poa6PA/Bh+C9plWN0hXO1uB8AfQ==
+
 "@babel/helper-regex@^7.0.0", "@babel/helper-regex@^7.4.4":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.5.5.tgz#0aa6824f7100a2e0e89c1527c23936c152cab351"
@@ -310,6 +347,13 @@
   dependencies:
     "@babel/types" "^7.10.4"
 
+"@babel/helper-split-export-declaration@^7.12.13":
+  version "7.12.13"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.12.13.tgz#e9430be00baf3e88b0e13e6f9d4eaf2136372b05"
+  integrity sha512-tCJDltF83htUtXx5NLcaDqRmknv652ZWCHyoTETf1CXYJdPC7nohZohjUgieXhv0hTJdRf2FjDueFehdNucpzg==
+  dependencies:
+    "@babel/types" "^7.12.13"
+
 "@babel/helper-split-export-declaration@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.7.4.tgz#57292af60443c4a3622cf74040ddc28e68336fd8"
@@ -322,6 +366,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz#a78c7a7251e01f616512d31b10adcf52ada5e0d2"
   integrity sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw==
 
+"@babel/helper-validator-identifier@^7.12.11":
+  version "7.12.11"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.12.11.tgz#c9a1f021917dcb5ccf0d4e453e399022981fc9ed"
+  integrity sha512-np/lG3uARFybkoHokJUmf1QfEvRVCPbmQeUQpKow5cQ3xWrV9i3rUHodKDJPQfTVX61qKi+UdYk8kik84n7XOw==
+
 "@babel/helper-wrap-function@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.7.4.tgz#37ab7fed5150e22d9d7266e830072c0cdd8baace"
@@ -367,11 +416,25 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.12.13":
+  version "7.13.10"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.13.10.tgz#a8b2a66148f5b27d666b15d81774347a731d52d1"
+  integrity sha512-5aPpe5XQPzflQrFwL1/QoeHkP2MsA4JCntcXHRhEsdsfPVkvPi2w7Qix4iV7t5S/oC9OodGrggd8aco1g3SZFg==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.12.11"
+    chalk "^2.0.0"
+    js-tokens "^4.0.0"
+
 "@babel/parser@^7.10.4", "@babel/parser@^7.10.5":
   version "7.10.5"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.10.5.tgz#e7c6bf5a7deff957cec9f04b551e2762909d826b"
   integrity sha512-wfryxy4bE1UivvQKSQDU4/X6dr+i8bctjUjj8Zyt3DQy7NtPizJXT8M52nqpNKL+nq2PW8lxk4ZqLj0fD4B4hQ==
 
+"@babel/parser@^7.12.0", "@babel/parser@^7.12.13", "@babel/parser@^7.13.16", "@babel/parser@^7.13.9":
+  version "7.13.16"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.13.16.tgz#0f18179b0448e6939b1f3f5c4c355a3a9bcdfd37"
+  integrity sha512-6bAg36mCwuqLO0hbR+z7PHuqWiCeP7Dzg73OpQwsAB1Eb8HnGEz5xYBzCfbu+YjoaJsJs+qheDxVAuqbt3ILEw==
+
 "@babel/parser@^7.7.4", "@babel/parser@^7.7.5":
   version "7.7.5"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.7.5.tgz#cbf45321619ac12d83363fcf9c94bb67fa646d71"
@@ -447,6 +510,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-jsx@^7.0.0":
+  version "7.12.13"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.12.13.tgz#044fb81ebad6698fe62c478875575bcbb9b70f15"
+  integrity sha512-d4HM23Q1K7oq/SLNmG6mRt85l2csmQ0cHRaxRXjKW0YFdEXqlZ5kzFQKH5Uc3rDJECgu+yCRgPkG04Mm98R/1g==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.12.13"
+
 "@babel/plugin-syntax-jsx@^7.2.0":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.7.4.tgz#dab2b56a36fb6c3c222a1fbc71f7bf97f327a9ec"
@@ -804,6 +874,15 @@
   dependencies:
     regenerator-runtime "^0.13.2"
 
+"@babel/template@^7.0.0", "@babel/template@^7.12.13":
+  version "7.12.13"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.12.13.tgz#530265be8a2589dbb37523844c5bcb55947fb327"
+  integrity sha512-/7xxiGA57xMo/P2GVvdEumr8ONhFOhfgq2ihK3h1e6THqzTAkHbkXgB0xI9yeTfIUoH3+oAeHhqm/I43OTbbjA==
+  dependencies:
+    "@babel/code-frame" "^7.12.13"
+    "@babel/parser" "^7.12.13"
+    "@babel/types" "^7.12.13"
+
 "@babel/template@^7.10.4":
   version "7.10.4"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.10.4.tgz#3251996c4200ebc71d1a8fc405fba940f36ba278"
@@ -822,6 +901,20 @@
     "@babel/parser" "^7.7.4"
     "@babel/types" "^7.7.4"
 
+"@babel/traverse@^7.0.0":
+  version "7.13.17"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.13.17.tgz#c85415e0c7d50ac053d758baec98b28b2ecfeea3"
+  integrity sha512-BMnZn0R+X6ayqm3C3To7o1j7Q020gWdqdyP50KEoVqaCO2c/Im7sYZSmVgvefp8TTMQ+9CtwuBp0Z1CZ8V3Pvg==
+  dependencies:
+    "@babel/code-frame" "^7.12.13"
+    "@babel/generator" "^7.13.16"
+    "@babel/helper-function-name" "^7.12.13"
+    "@babel/helper-split-export-declaration" "^7.12.13"
+    "@babel/parser" "^7.13.16"
+    "@babel/types" "^7.13.17"
+    debug "^4.1.0"
+    globals "^11.1.0"
+
 "@babel/traverse@^7.10.4", "@babel/traverse@^7.10.5":
   version "7.10.5"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.10.5.tgz#77ce464f5b258be265af618d8fddf0536f20b564"
@@ -869,6 +962,14 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.12.0", "@babel/types@^7.12.13", "@babel/types@^7.13.0", "@babel/types@^7.13.16", "@babel/types@^7.13.17":
+  version "7.13.17"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.13.17.tgz#48010a115c9fba7588b4437dd68c9469012b38b4"
+  integrity sha512-RawydLgxbOPDlTLJNtoIypwdmAy//uQIzlKt2+iBiJaRlVuI6QLUxVAyWGNfOzp8Yu4L4lLIacoCyTNtpb4wiA==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.12.11"
+    to-fast-properties "^2.0.0"
+
 "@babel/types@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.7.4.tgz#516570d539e44ddf308c07569c258ff94fde9193"
@@ -878,11 +979,10 @@
     lodash "^4.17.13"
     to-fast-properties "^2.0.0"
 
-"@chenfengyuan/vue-qrcode@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@chenfengyuan/vue-qrcode/-/vue-qrcode-1.0.0.tgz#07103fe2048ce0160cddde836fb5378cc7951d6f"
-  dependencies:
-    qrcode "^1.3.0"
+"@chenfengyuan/vue-qrcode@^2.0.0-beta":
+  version "2.0.0-beta"
+  resolved "https://registry.yarnpkg.com/@chenfengyuan/vue-qrcode/-/vue-qrcode-2.0.0-beta.tgz#eebd3bdcd057b1635ddef1839bfdb04f642d7e21"
+  integrity sha512-z3BYPdXT6pvha2aGhWQ5E/0PBEUVcxEfcG1S4VEIKNYTv1rrmbWD02RDOC0JnB1LrLd+cDt9J0MtVOJB0TVfvw==
 
 "@fortawesome/fontawesome-common-types@^0.2.32":
   version "0.2.32"
@@ -910,10 +1010,66 @@
   dependencies:
     "@fortawesome/fontawesome-common-types" "^0.2.32"
 
-"@fortawesome/vue-fontawesome@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-2.0.0.tgz#63da3e459147cebb0a8d58eed81d6071db9f5973"
-  integrity sha512-N3VKw7KzRfOm8hShUVldpinlm13HpvLBQgT63QS+aCrIRLwjoEUXY5Rcmttbfb6HkzZaeqjLqd/aZCQ53UjQpg==
+"@fortawesome/vue-fontawesome@^3.0.0-3":
+  version "3.0.0-3"
+  resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.0-3.tgz#b658a7c1f35d4eb04ac85749da693be483442b25"
+  integrity sha512-fCM7+R9M7Y/ipKC5n9hukGpJHhe53JOENGqtku/KWtpXsnbGik3AS5zfJYEupV2uXOw/5S0RSSfttQ2hNIrmFA==
+
+"@intlify/core-base@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.1.6.tgz#887fbeafe37d955bac50318f30ac589839f0d9fb"
+  integrity sha512-d5GDPpsQbqPkisSJA5b6nJFEkalY/IHAd7vOLNd/Sj4YaNRzXtInu2FoqKiOv8e/lQnXGTpurdCZg5Jxq1Gsxw==
+  dependencies:
+    "@intlify/devtools-if" "9.1.6"
+    "@intlify/message-compiler" "9.1.6"
+    "@intlify/message-resolver" "9.1.6"
+    "@intlify/runtime" "9.1.6"
+    "@intlify/shared" "9.1.6"
+    "@intlify/vue-devtools" "9.1.6"
+
+"@intlify/devtools-if@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/devtools-if/-/devtools-if-9.1.6.tgz#739b195e430e24fbf8f864ec8a51e243e3347385"
+  integrity sha512-m8Api+kh+BtFa2FZ/JjIdr1ibsGGqBjdKCzWo5BZecEUxBquIeOQZwpokPh/0K5j+/PZleFXkVAMC5mNt+9WdA==
+  dependencies:
+    "@intlify/shared" "9.1.6"
+
+"@intlify/message-compiler@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.1.6.tgz#e3e99165c1e6ecc496211017799ae59e15b05a18"
+  integrity sha512-DR8645VOrVK6x/8tkaCpHnckMAIcoOgeNS5j0wB12RfZoXYQp7vAXMaOP511KMll2mXCREgIB0ojpajiof7yzQ==
+  dependencies:
+    "@intlify/message-resolver" "9.1.6"
+    "@intlify/shared" "9.1.6"
+    source-map "0.6.1"
+
+"@intlify/message-resolver@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/message-resolver/-/message-resolver-9.1.6.tgz#d7493c9f326d5feb0cd8538a6735b648a91d8f2f"
+  integrity sha512-UUnbawQa5U9sffd5wRIscqtyY1xWlwJbyfwCLPEWLvBhyAnCwPYlvaHGnnO0CSi0fzJTVwlV9DYzobh3agDeMA==
+
+"@intlify/runtime@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/runtime/-/runtime-9.1.6.tgz#bf1548d9034c80eef92b06b240cb347effb41f71"
+  integrity sha512-U1QZ+TPf3kQQvWo4BA2mj3cHAxMRHXNTBhu2u+deh6ubTqXdZ19XGBTMSasrXG6RE+zSio9oM+ndoLja7JGtPg==
+  dependencies:
+    "@intlify/message-compiler" "9.1.6"
+    "@intlify/message-resolver" "9.1.6"
+    "@intlify/shared" "9.1.6"
+
+"@intlify/shared@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.1.6.tgz#d03c9301898d6ddffe2a54c03e7664174fbcdfd9"
+  integrity sha512-6MtsKulyfZxdD7OuxjaODjj8QWoHCnLFAk4wkWiHqBCa6UCTC0qXjtEeZ1MxpQihvFmmJZauBUu25EvtngW5qQ==
+
+"@intlify/vue-devtools@9.1.6":
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/@intlify/vue-devtools/-/vue-devtools-9.1.6.tgz#88faadf203951a2a10107440fa99b58f4637d40d"
+  integrity sha512-UdNovg4OML9rIr1sOGZzTfNr1nUy4UQpDf5ni4dNC93T6FIkVJz0n1Np7Vp7e6gDjcmufRYcV99tEwjQSN9+5A==
+  dependencies:
+    "@intlify/message-resolver" "9.1.6"
+    "@intlify/runtime" "9.1.6"
+    "@intlify/shared" "9.1.6"
 
 "@nodelib/fs.scandir@2.1.3":
   version "2.1.3"
@@ -1003,6 +1159,26 @@
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.0.0.tgz#048fe579958da408fb7a8b2a3ec050b50a661040"
   integrity sha512-6tyf5Cqm4m6v7buITuwS+jHzPlIPxbFzEhXR5JGZpbrvOcp1hiQKckd305/3C7C36wFekNTQSxAtgeM0j0yoUw==
 
+"@vue/babel-helper-vue-transform-on@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.0.2.tgz#9b9c691cd06fc855221a2475c3cc831d774bc7dc"
+  integrity sha512-hz4R8tS5jMn8lDq6iD+yWL6XNB699pGIVLk7WSJnn1dbpjaazsjZQkieJoRX6gW5zpYSCFqQ7jUquPNY65tQYA==
+
+"@vue/babel-plugin-jsx@^1.0.3":
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.0.5.tgz#72820d5fb371c41d2113b31b16787995e8bdf69a"
+  integrity sha512-Jtipy7oI0am5e1q5Ahunm/cCcCh5ssf5VkMQsLR383S3un5Qh7NBfxgSK9kmWf4IXJEhDeYp9kHv8G/EnMai9A==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/plugin-syntax-jsx" "^7.0.0"
+    "@babel/template" "^7.0.0"
+    "@babel/traverse" "^7.0.0"
+    "@babel/types" "^7.0.0"
+    "@vue/babel-helper-vue-transform-on" "^1.0.2"
+    camelcase "^6.0.0"
+    html-tags "^3.1.0"
+    svg-tags "^1.0.0"
+
 "@vue/babel-plugin-transform-vue-jsx@^1.1.2":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.1.2.tgz#c0a3e6efc022e75e4247b448a8fc6b86f03e91c0"
@@ -1015,12 +1191,93 @@
     lodash.kebabcase "^4.1.1"
     svg-tags "^1.0.0"
 
-"@vue/test-utils@^1.0.0-beta.26":
-  version "1.0.0-beta.28"
-  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.28.tgz#767c43413df8cde86128735e58923803e444b9a5"
+"@vue/compiler-core@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.0.11.tgz#5ef579e46d7b336b8735228758d1c2c505aae69a"
+  integrity sha512-6sFj6TBac1y2cWCvYCA8YzHJEbsVkX7zdRs/3yK/n1ilvRqcn983XvpBbnN3v4mZ1UiQycTvOiajJmOgN9EVgw==
   dependencies:
-    dom-event-types "^1.0.0"
-    lodash "^4.17.4"
+    "@babel/parser" "^7.12.0"
+    "@babel/types" "^7.12.0"
+    "@vue/shared" "3.0.11"
+    estree-walker "^2.0.1"
+    source-map "^0.6.1"
+
+"@vue/compiler-dom@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.0.11.tgz#b15fc1c909371fd671746020ba55b5dab4a730ee"
+  integrity sha512-+3xB50uGeY5Fv9eMKVJs2WSRULfgwaTJsy23OIltKgMrynnIj8hTYY2UL97HCoz78aDw1VDXdrBQ4qepWjnQcw==
+  dependencies:
+    "@vue/compiler-core" "3.0.11"
+    "@vue/shared" "3.0.11"
+
+"@vue/compiler-sfc@^3.0.7":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.0.11.tgz#cd8ca2154b88967b521f5ad3b10f5f8b6b665679"
+  integrity sha512-7fNiZuCecRleiyVGUWNa6pn8fB2fnuJU+3AGjbjl7r1P5wBivfl02H4pG+2aJP5gh2u+0wXov1W38tfWOphsXw==
+  dependencies:
+    "@babel/parser" "^7.13.9"
+    "@babel/types" "^7.13.0"
+    "@vue/compiler-core" "3.0.11"
+    "@vue/compiler-dom" "3.0.11"
+    "@vue/compiler-ssr" "3.0.11"
+    "@vue/shared" "3.0.11"
+    consolidate "^0.16.0"
+    estree-walker "^2.0.1"
+    hash-sum "^2.0.0"
+    lru-cache "^5.1.1"
+    magic-string "^0.25.7"
+    merge-source-map "^1.1.0"
+    postcss "^8.1.10"
+    postcss-modules "^4.0.0"
+    postcss-selector-parser "^6.0.4"
+    source-map "^0.6.1"
+
+"@vue/compiler-ssr@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.0.11.tgz#ac5a05fd1257412fa66079c823d8203b6a889a13"
+  integrity sha512-66yUGI8SGOpNvOcrQybRIhl2M03PJ+OrDPm78i7tvVln86MHTKhM3ERbALK26F7tXl0RkjX4sZpucCpiKs3MnA==
+  dependencies:
+    "@vue/compiler-dom" "3.0.11"
+    "@vue/shared" "3.0.11"
+
+"@vue/devtools-api@^6.0.0-beta.7":
+  version "6.0.0-beta.8"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.0.0-beta.8.tgz#0dbb2d21b13818c04b7f70b1b0c3f7aae95e4fb4"
+  integrity sha512-I2QYmUYvuJnMMX/4/i+fbCf2nlAkjfw58siw0whFlUT7LTvTc5Xv7jcLP5XS3+8LkHd7UtVhU7EBGMfA7jkXXg==
+
+"@vue/reactivity@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.0.11.tgz#07b588349fd05626b17f3500cbef7d4bdb4dbd0b"
+  integrity sha512-SKM3YKxtXHBPMf7yufXeBhCZ4XZDKP9/iXeQSC8bBO3ivBuzAi4aZi0bNoeE2IF2iGfP/AHEt1OU4ARj4ao/Xw==
+  dependencies:
+    "@vue/shared" "3.0.11"
+
+"@vue/runtime-core@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.0.11.tgz#c52dfc6acf3215493623552c1c2919080c562e44"
+  integrity sha512-87XPNwHfz9JkmOlayBeCCfMh9PT2NBnv795DSbi//C/RaAnc/bGZgECjmkD7oXJ526BZbgk9QZBPdFT8KMxkAg==
+  dependencies:
+    "@vue/reactivity" "3.0.11"
+    "@vue/shared" "3.0.11"
+
+"@vue/runtime-dom@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.0.11.tgz#7a552df21907942721feb6961c418e222a699337"
+  integrity sha512-jm3FVQESY3y2hKZ2wlkcmFDDyqaPyU3p1IdAX92zTNeCH7I8zZ37PtlE1b9NlCtzV53WjB4TZAYh9yDCMIEumA==
+  dependencies:
+    "@vue/runtime-core" "3.0.11"
+    "@vue/shared" "3.0.11"
+    csstype "^2.6.8"
+
+"@vue/shared@3.0.11":
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77"
+  integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==
+
+"@vue/test-utils@^2.0.0-beta.8":
+  version "2.0.0-rc.6"
+  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.0.0-rc.6.tgz#d0aac24d20450d379e183f70542c0822670b8783"
+  integrity sha512-0cnQBVH589PwgqWpyv1fgCAz+9Ram/MsvN3ZEAEVXi1aPuhUa22EudGc0WezQ9PKwR+L40NrBmt3JBXE2tSRRQ==
 
 "@webassemblyjs/ast@1.8.5":
   version "1.8.5"
@@ -1657,6 +1914,11 @@ base64-js@^1.0.2:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.0.tgz#cab1e6118f051095e58b5281aea8c1cd22bfc0e3"
 
+base64-js@^1.3.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a"
+  integrity sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==
+
 base64id@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/base64id/-/base64id-1.0.0.tgz#47688cb99bb6804f0e06d3e763b1c32e57d8e6b6"
@@ -1695,7 +1957,7 @@ blob@0.0.5:
   version "0.0.5"
   resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.5.tgz#d680eeef25f8cd91ad533f5b01eed48e64caf683"
 
-bluebird@^3.1.1, bluebird@^3.3.0:
+bluebird@^3.3.0:
   version "3.5.3"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.3.tgz#7d01c6f9616c9a51ab0f8c549a79dfe6ec33efa7"
 
@@ -1703,6 +1965,11 @@ bluebird@^3.5.3:
   version "3.5.4"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.4.tgz#d6cc661595de30d5b3af5fcedd3c0b3ef6ec5714"
 
+bluebird@^3.7.2:
+  version "3.7.2"
+  resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f"
+  integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
+
 bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0:
   version "4.11.8"
   resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f"
@@ -1881,9 +2148,10 @@ buffer-fill@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/buffer-fill/-/buffer-fill-1.0.0.tgz#f8f78b76789888ef39f205cd637f68e702122b2c"
 
-buffer-from@^1.0.0:
+buffer-from@^1.0.0, buffer-from@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
+  integrity sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A==
 
 buffer-xor@^1.0.3:
   version "1.0.3"
@@ -1897,6 +2165,14 @@ buffer@^4.3.0:
     ieee754 "^1.1.4"
     isarray "^1.0.0"
 
+buffer@^5.4.3:
+  version "5.7.1"
+  resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.7.1.tgz#ba62e7c13133053582197160851a8f648e99eed0"
+  integrity sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==
+  dependencies:
+    base64-js "^1.3.1"
+    ieee754 "^1.1.13"
+
 builtin-modules@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
@@ -2010,12 +2286,6 @@ camelcase@^6.0.0:
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.0.0.tgz#5259f7c30e35e278f1bdc2a4d91230b37cad981e"
   integrity sha512-8KMDF1Vz2gzOq54ONPJS65IvTUaB1cHJ2DMM7MbPmLZljDH1qpzzLsWdiN9pHh6qvkRVDTi/07+eNGch/oLU4w==
 
-can-promise@0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/can-promise/-/can-promise-0.0.1.tgz#7a7597ad801fb14c8b22341dfec314b6bd6ad8d3"
-  dependencies:
-    window-or-global "^1.0.1"
-
 caniuse-api@^1.5.2:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-1.6.1.tgz#b534e7c734c4f81ec5fbe8aca2ad24354b962c6c"
@@ -2220,13 +2490,14 @@ cli-width@^2.0.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.0.tgz#ff19ede8a9a5e579324147b0c11f0fbcbabed639"
 
-cliui@^4.0.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/cliui/-/cliui-4.1.0.tgz#348422dbe82d800b3022eef4f6ac10bf2e4d1b49"
+cliui@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/cliui/-/cliui-5.0.0.tgz#deefcfdb2e800784aa34f46fa08e06851c7bbbc5"
+  integrity sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==
   dependencies:
-    string-width "^2.1.1"
-    strip-ansi "^4.0.0"
-    wrap-ansi "^2.0.0"
+    string-width "^3.1.0"
+    strip-ansi "^5.2.0"
+    wrap-ansi "^5.1.0"
 
 clone-deep@^4.0.1:
   version "4.0.1"
@@ -2314,6 +2585,11 @@ colorette@^1.2.0:
   resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.1.tgz#4d0b921325c14faf92633086a536db6e89564b1b"
   integrity sha512-puCDz0CzydiSYOrnXpz/PKd69zRrribezjtE9yd4zvytoRc8+RY/KJPvtPFKZS3E3wP6neGyMe0vOTlHO5L3Pw==
 
+colorette@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.2.2.tgz#cbcc79d5e99caea2dbf10eb3a26fd8b3e6acfa94"
+  integrity sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==
+
 colormin@^1.0.5:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/colormin/-/colormin-1.1.2.tgz#ea2f7420a72b96881a38aae59ec124a6f7298133"
@@ -2406,11 +2682,12 @@ console-control-strings@^1.0.0, console-control-strings@~1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/console-control-strings/-/console-control-strings-1.1.0.tgz#3d7cf4464db6446ea644bf4b39507f9851008e8e"
 
-consolidate@^0.14.0:
-  version "0.14.5"
-  resolved "https://registry.yarnpkg.com/consolidate/-/consolidate-0.14.5.tgz#5a25047bc76f73072667c8cb52c989888f494c63"
+consolidate@^0.16.0:
+  version "0.16.0"
+  resolved "https://registry.yarnpkg.com/consolidate/-/consolidate-0.16.0.tgz#a11864768930f2f19431660a65906668f5fbdc16"
+  integrity sha512-Nhl1wzCslqXYTJVDyJCu3ODohy9OfBMB5uD2BiBTzd7w+QY0lBzafkR8y8755yMYHAaMD4NuzbAw03/xzfw+eQ==
   dependencies:
-    bluebird "^3.1.1"
+    bluebird "^3.7.2"
 
 constants-browserify@^1.0.0:
   version "1.0.0"
@@ -2480,18 +2757,6 @@ core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
 
-cosmiconfig@^2.1.0, cosmiconfig@^2.1.1:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-2.2.2.tgz#6173cebd56fac042c1f4390edf7af6c07c7cb892"
-  dependencies:
-    is-directory "^0.3.1"
-    js-yaml "^3.4.3"
-    minimist "^1.2.0"
-    object-assign "^4.1.0"
-    os-homedir "^1.0.1"
-    parse-json "^2.2.0"
-    require-from-string "^1.1.0"
-
 cosmiconfig@^5.0.0:
   version "5.2.1"
   resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.2.1.tgz#040f726809c591e77a17c0a3626ca45b4f168b1a"
@@ -2552,7 +2817,7 @@ cross-spawn@^4.0.2:
     lru-cache "^4.0.1"
     which "^1.2.9"
 
-cross-spawn@^6.0.0, cross-spawn@^6.0.5:
+cross-spawn@^6.0.5:
   version "6.0.5"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
   dependencies:
@@ -2675,6 +2940,11 @@ csso@~2.3.1:
     clap "^1.0.9"
     source-map "^0.5.3"
 
+csstype@^2.6.8:
+  version "2.6.17"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.17.tgz#4cf30eb87e1d1a005d8b6510f95292413f6a1c0e"
+  integrity sha512-u1wmTI1jJGzCJzWndZo8mk4wnPTZd1eOIYTYvuEyOQGfmDl3TrabCCfKnOC86FZwW/9djqTl933UF/cS425i9A==
+
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -2713,11 +2983,6 @@ dateformat@^1.0.6:
     get-stdin "^4.0.1"
     meow "^3.3.0"
 
-de-indent@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
-  integrity sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=
-
 debug@2, debug@2.6.9, debug@^2.1.2, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
@@ -2931,10 +3196,6 @@ dom-converter@~0.2:
   dependencies:
     utila "~0.4"
 
-dom-event-types@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/dom-event-types/-/dom-event-types-1.0.0.tgz#5830a0a29e1bf837fe50a70cd80a597232813cae"
-
 dom-serialize@^2.2.0:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/dom-serialize/-/dom-serialize-2.2.1.tgz#562ae8999f44be5ea3076f5419dcd59eb43ac95b"
@@ -3053,6 +3314,11 @@ emojis-list@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-2.1.0.tgz#4daa4d9db00f9819880c79fa457ae5b09a1fd389"
 
+emojis-list@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78"
+  integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==
+
 encodeurl@~1.0.1, encodeurl@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
@@ -3372,6 +3638,11 @@ estraverse@^4.0.0, estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.2.0.tgz#0dee3fed31fcd469618ce7342099fc1afa0bdb13"
 
+estree-walker@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
+  integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==
+
 esutils@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
@@ -3399,18 +3670,6 @@ evp_bytestokey@^1.0.0, evp_bytestokey@^1.0.3:
     md5.js "^1.3.4"
     safe-buffer "^5.1.1"
 
-execa@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/execa/-/execa-1.0.0.tgz#c6236a5bb4df6d6f15e88e7f017798216749ddd8"
-  dependencies:
-    cross-spawn "^6.0.0"
-    get-stream "^4.0.0"
-    is-stream "^1.1.0"
-    npm-run-path "^2.0.0"
-    p-finally "^1.0.0"
-    signal-exit "^3.0.0"
-    strip-eof "^1.0.0"
-
 execall@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/execall/-/execall-2.0.0.tgz#16a06b5fe5099df7d00be5d9c06eecded1663b45"
@@ -3847,14 +4106,22 @@ gauge@~2.7.3:
     strip-ansi "^3.0.1"
     wide-align "^1.1.0"
 
+generic-names@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/generic-names/-/generic-names-2.0.1.tgz#f8a378ead2ccaa7a34f0317b05554832ae41b872"
+  integrity sha512-kPCHWa1m9wGG/OwQpeweTwM/PYiQLrUIxXbt/P4Nic3LbGjCP0YwrALHW1uNLKZ0LIMg+RF+XRlj2ekT9ZlZAQ==
+  dependencies:
+    loader-utils "^1.1.0"
+
 gensync@^1.0.0-beta.1:
   version "1.0.0-beta.1"
   resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.1.tgz#58f4361ff987e5ff6e1e7a210827aa371eaac269"
   integrity sha512-r8EC6NO1sngH/zdD9fiRDLdcgnbayXah+mLgManTaIZJqEC1MZstmnox8KpnI2/fxQwrp5OpCOYWLp4rBl4Jcg==
 
-get-caller-file@^1.0.1:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-1.0.3.tgz#f978fa4c90d1dfe7ff2d6beda2a515e713bdcf4a"
+get-caller-file@^2.0.1:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
+  integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
 
 get-stdin@^4.0.1:
   version "4.0.1"
@@ -3865,12 +4132,6 @@ get-stdin@^8.0.0:
   resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-8.0.0.tgz#cbad6a73feb75f6eeb22ba9e01f89aa28aa97a53"
   integrity sha512-sY22aA6xchAzprjyqmSEQv4UbAAzRN0L2dQB0NlN5acTTK9Don6nhoc3eAbUnpZiCANAMfd/+40kVdKfFygohg==
 
-get-stream@^4.0.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-4.1.0.tgz#c1b255575f3dc21d59bfc79cd3d2b46b1c3a54b5"
-  dependencies:
-    pump "^3.0.0"
-
 get-stream@^5.1.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-5.2.0.tgz#4966a1795ee5ace65e706c4b7beb71257d6e22d3"
@@ -4139,6 +4400,11 @@ hash-sum@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/hash-sum/-/hash-sum-1.0.2.tgz#33b40777754c6432573c120cc3808bbd10d47f04"
 
+hash-sum@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/hash-sum/-/hash-sum-2.0.0.tgz#81d01bb5de8ea4a214ad5d6ead1b523460b0b45a"
+  integrity sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==
+
 hash.js@^1.0.0, hash.js@^1.0.3:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.7.tgz#0babca538e8d4ee4a0f8988d68866537a003cf42"
@@ -4150,7 +4416,7 @@ he@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
 
-he@1.2.x, he@^1.1.0:
+he@1.2.x:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
 
@@ -4312,6 +4578,16 @@ icss-utils@^2.1.0:
   dependencies:
     postcss "^6.0.1"
 
+icss-utils@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-5.1.0.tgz#c6be6858abd013d768e98366ae47e25d5887b1ae"
+  integrity sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==
+
+ieee754@^1.1.13:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352"
+  integrity sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==
+
 ieee754@^1.1.4:
   version "1.1.12"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.12.tgz#50bf24e5b9c8bb98af4964c941cdb0918da7b60b"
@@ -4462,10 +4738,6 @@ invariant@^2.2.2:
   dependencies:
     loose-envify "^1.0.0"
 
-invert-kv@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/invert-kv/-/invert-kv-2.0.0.tgz#7393f5afa59ec9ff5f67a27620d11c226e3eec02"
-
 ip-regex@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/ip-regex/-/ip-regex-2.1.0.tgz#fa78bf5d2e6913c911ce9f819ee5146bb6d844e9"
@@ -4731,10 +5003,6 @@ is-regexp@^2.0.0:
   resolved "https://registry.yarnpkg.com/is-regexp/-/is-regexp-2.1.0.tgz#cd734a56864e23b956bf4e7c66c396a4c0b22c2d"
   integrity sha512-OZ4IlER3zmRIoB9AqNhEggVxqIH4ofDns5nRrPS6yQxXE1TPCUpFznBfRQmQa8uC+pXqjMnukiJBxCisIxiLGA==
 
-is-stream@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
-
 is-svg@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-svg/-/is-svg-2.1.0.tgz#cf61090da0d9efbcab8722deba6f032208dbb0e9"
@@ -4881,7 +5149,7 @@ js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
 
-js-yaml@3.x, js-yaml@^3.4.3:
+js-yaml@3.x:
   version "3.12.1"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.1.tgz#295c8632a18a23e054cf5c9d3cecafe678167600"
   dependencies:
@@ -5075,12 +5343,6 @@ known-css-properties@^0.19.0:
   resolved "https://registry.yarnpkg.com/known-css-properties/-/known-css-properties-0.19.0.tgz#5d92b7fa16c72d971bda9b7fe295bdf61836ee5b"
   integrity sha512-eYboRV94Vco725nKMlpkn3nV2+96p9c3gKXRsYqAJSswSENvBhN7n5L+uDhY58xQa0UukWsDMTGELzmD8Q+wTA==
 
-lcid@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/lcid/-/lcid-2.0.0.tgz#6ef5d2df60e52f82eb228a4c373e8d1f397253cf"
-  dependencies:
-    invert-kv "^2.0.0"
-
 leven@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/leven/-/leven-3.1.0.tgz#77891de834064cccba82ae7842bb6b14a13ed7f2"
@@ -5151,6 +5413,15 @@ loader-utils@^1.0.1, loader-utils@^1.0.2, loader-utils@^1.1.0:
     emojis-list "^2.0.0"
     json5 "^1.0.1"
 
+loader-utils@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.0.tgz#e4cace5b816d425a166b5f097e10cd12b36064b0"
+  integrity sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ==
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^3.0.0"
+    json5 "^2.1.2"
+
 localforage@^1.5.0:
   version "1.7.3"
   resolved "https://registry.yarnpkg.com/localforage/-/localforage-1.7.3.tgz#0082b3ca9734679e1bd534995bdd3b24cf10f204"
@@ -5491,7 +5762,7 @@ lower-case@^1.1.1:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-1.1.4.tgz#9a2cabd1b9e8e0ae993a4bf7d5875c39c42e8eac"
 
-lru-cache@4.1.x, lru-cache@^4.0.1, lru-cache@^4.1.1:
+lru-cache@4.1.x, lru-cache@^4.0.1:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
   dependencies:
@@ -5508,6 +5779,13 @@ lru-cache@~2.6.5:
   version "2.6.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-2.6.5.tgz#e56d6354148ede8d7707b58d143220fd08df0fd5"
 
+magic-string@^0.25.7:
+  version "0.25.7"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.7.tgz#3f497d6fd34c669c6798dcb821f2ef31f5445051"
+  integrity sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==
+  dependencies:
+    sourcemap-codec "^1.4.4"
+
 make-dir@^2.0.0, make-dir@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
@@ -5519,12 +5797,6 @@ mamacro@^0.0.3:
   version "0.0.3"
   resolved "https://registry.yarnpkg.com/mamacro/-/mamacro-0.0.3.tgz#ad2c9576197c9f1abf308d0787865bd975a3f3e4"
 
-map-age-cleaner@^0.1.1:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/map-age-cleaner/-/map-age-cleaner-0.1.3.tgz#7d583a7306434c055fe474b0f45078e6e1b4b92a"
-  dependencies:
-    p-defer "^1.0.0"
-
 map-cache@^0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/map-cache/-/map-cache-0.2.2.tgz#c32abd0bd6525d9b051645bb4f26ac5dc98a0dbf"
@@ -5588,14 +5860,6 @@ media-typer@0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748"
 
-mem@^4.0.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/mem/-/mem-4.1.0.tgz#aeb9be2d21f47e78af29e4ac5978e8afa2ca5b8a"
-  dependencies:
-    map-age-cleaner "^0.1.1"
-    mimic-fn "^1.0.0"
-    p-is-promise "^2.0.0"
-
 memory-fs@^0.4.0, memory-fs@^0.4.1, memory-fs@~0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
@@ -5641,6 +5905,13 @@ merge-descriptors@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/merge-descriptors/-/merge-descriptors-1.0.1.tgz#b00aaa556dd8b44568150ec9d1b953f3f90cbb61"
 
+merge-source-map@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/merge-source-map/-/merge-source-map-1.1.0.tgz#2fdde7e6020939f70906a68f2d7ae685e4c8c646"
+  integrity sha512-Qkcp7P2ygktpMPh2mCQZaf3jhN6D3Z/qVZHSdWvQ+2Ef5HgRAPBO57A77+ENm0CPx2+1Ce/MYKi3ymqdfuqibw==
+  dependencies:
+    source-map "^0.6.1"
+
 merge2@^1.3.0:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
@@ -5907,6 +6178,11 @@ nan@^2.12.1:
   version "2.14.0"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.0.tgz#7818f722027b2459a86f0295d434d1fc2336c52c"
 
+nanoid@^3.1.22:
+  version "3.1.22"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.1.22.tgz#b35f8fb7d151990a8aebd5aa5015c03cf726f844"
+  integrity sha512-/2ZUaJX2ANuLtTvqTlgqBQNJoQO398KyJgZloL0PZkC0dpysjncRUPsFe3DUPzz/y3h+u7C46np8RMuvF3jsSQ==
+
 nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
@@ -6118,12 +6394,6 @@ npm-packlist@^1.1.6:
     ignore-walk "^3.0.1"
     npm-bundled "^1.0.1"
 
-npm-run-path@^2.0.0:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-2.0.2.tgz#35a9232dfa35d7067b4cb2ddf2357b1871536c5f"
-  dependencies:
-    path-key "^2.0.0"
-
 npmlog@^4.0.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/npmlog/-/npmlog-4.1.2.tgz#08a7f2a8bf734604779a9efa4ad5cc717abb954b"
@@ -6267,18 +6537,10 @@ os-browserify@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/os-browserify/-/os-browserify-0.3.0.tgz#854373c7f5c2315914fc9bfc6bd8238fdda1ec27"
 
-os-homedir@^1.0.0, os-homedir@^1.0.1:
+os-homedir@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
 
-os-locale@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/os-locale/-/os-locale-3.1.0.tgz#a802a6ee17f24c10483ab9935719cef4ed16bf1a"
-  dependencies:
-    execa "^1.0.0"
-    lcid "^2.0.0"
-    mem "^4.0.0"
-
 os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.1, os-tmpdir@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
@@ -6290,18 +6552,6 @@ osenv@^0.1.4:
     os-homedir "^1.0.0"
     os-tmpdir "^1.0.0"
 
-p-defer@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/p-defer/-/p-defer-1.0.0.tgz#9f6eb182f6c9aa8cd743004a7d4f96b196b0fb0c"
-
-p-finally@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/p-finally/-/p-finally-1.0.0.tgz#3fbcfb15b899a44123b34b6dcc18b724336a2cae"
-
-p-is-promise@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/p-is-promise/-/p-is-promise-2.0.0.tgz#7554e3d572109a87e1f3f53f6a7d85d1b194f4c5"
-
 p-limit@^1.1.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.3.0.tgz#b86bd5f0c25690911c7590fcbfc2010d54b3ccb8"
@@ -6517,7 +6767,7 @@ path-is-inside@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/path-is-inside/-/path-is-inside-1.0.2.tgz#365417dede44430d1c11af61027facf074bdfc53"
 
-path-key@^2.0.0, path-key@^2.0.1:
+path-key@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
 
@@ -6624,10 +6874,6 @@ pngjs@^3.3.0:
   version "3.3.3"
   resolved "https://registry.yarnpkg.com/pngjs/-/pngjs-3.3.3.tgz#85173703bde3edac8998757b96e5821d0966a21b"
 
-portal-vue@^2.1.4:
-  version "2.1.4"
-  resolved "https://registry.yarnpkg.com/portal-vue/-/portal-vue-2.1.4.tgz#1fc679d77e294dc8d026f1eb84aa467de11b392e"
-
 posix-character-classes@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"
@@ -6706,15 +6952,6 @@ postcss-less@^3.1.4:
   dependencies:
     postcss "^7.0.14"
 
-postcss-load-config@^1.1.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-1.2.0.tgz#539e9afc9ddc8620121ebf9d8c3673e0ce50d28a"
-  dependencies:
-    cosmiconfig "^2.1.0"
-    object-assign "^4.1.0"
-    postcss-load-options "^1.2.0"
-    postcss-load-plugins "^2.3.0"
-
 postcss-load-config@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-2.1.0.tgz#c84d692b7bb7b41ddced94ee62e8ab31b417b003"
@@ -6723,20 +6960,6 @@ postcss-load-config@^2.0.0:
     cosmiconfig "^5.0.0"
     import-cwd "^2.0.0"
 
-postcss-load-options@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/postcss-load-options/-/postcss-load-options-1.2.0.tgz#b098b1559ddac2df04bc0bb375f99a5cfe2b6d8c"
-  dependencies:
-    cosmiconfig "^2.1.0"
-    object-assign "^4.1.0"
-
-postcss-load-plugins@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz#745768116599aca2f009fad426b00175049d8d92"
-  dependencies:
-    cosmiconfig "^2.1.1"
-    object-assign "^4.1.0"
-
 postcss-loader@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-3.0.0.tgz#6b97943e47c72d845fa9e03f273773d4e8dd6c2d"
@@ -6819,6 +7042,11 @@ postcss-modules-extract-imports@^1.2.0:
   dependencies:
     postcss "^6.0.1"
 
+postcss-modules-extract-imports@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz#cda1f047c0ae80c97dbe28c3e76a43b88025741d"
+  integrity sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==
+
 postcss-modules-local-by-default@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-1.2.0.tgz#f7d80c398c5a393fa7964466bd19500a7d61c069"
@@ -6826,6 +7054,15 @@ postcss-modules-local-by-default@^1.2.0:
     css-selector-tokenizer "^0.7.0"
     postcss "^6.0.1"
 
+postcss-modules-local-by-default@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.0.tgz#ebbb54fae1598eecfdf691a02b3ff3b390a5a51c"
+  integrity sha512-sT7ihtmGSF9yhm6ggikHdV0hlziDTX7oFoXtuVWeDd3hHObNkcHRo9V3yg7vCAY7cONyxJC/XXCmmiHHcvX7bQ==
+  dependencies:
+    icss-utils "^5.0.0"
+    postcss-selector-parser "^6.0.2"
+    postcss-value-parser "^4.1.0"
+
 postcss-modules-scope@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-1.1.0.tgz#d6ea64994c79f97b62a72b426fbe6056a194bb90"
@@ -6833,6 +7070,13 @@ postcss-modules-scope@^1.1.0:
     css-selector-tokenizer "^0.7.0"
     postcss "^6.0.1"
 
+postcss-modules-scope@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-scope/-/postcss-modules-scope-3.0.0.tgz#9ef3151456d3bbfa120ca44898dfca6f2fa01f06"
+  integrity sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==
+  dependencies:
+    postcss-selector-parser "^6.0.4"
+
 postcss-modules-values@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/postcss-modules-values/-/postcss-modules-values-1.3.0.tgz#ecffa9d7e192518389f42ad0e83f72aec456ea20"
@@ -6840,6 +7084,27 @@ postcss-modules-values@^1.3.0:
     icss-replace-symbols "^1.1.0"
     postcss "^6.0.1"
 
+postcss-modules-values@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz#d7c5e7e68c3bb3c9b27cbf48ca0bb3ffb4602c9c"
+  integrity sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==
+  dependencies:
+    icss-utils "^5.0.0"
+
+postcss-modules@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/postcss-modules/-/postcss-modules-4.0.0.tgz#2bc7f276ab88f3f1b0fadf6cbd7772d43b5f3b9b"
+  integrity sha512-ghS/ovDzDqARm4Zj6L2ntadjyQMoyJmi0JkLlYtH2QFLrvNlxH5OAVRPWPeKilB0pY7SbuhO173KOWkPAxRJcw==
+  dependencies:
+    generic-names "^2.0.1"
+    icss-replace-symbols "^1.1.0"
+    lodash.camelcase "^4.3.0"
+    postcss-modules-extract-imports "^3.0.0"
+    postcss-modules-local-by-default "^4.0.0"
+    postcss-modules-scope "^3.0.0"
+    postcss-modules-values "^4.0.0"
+    string-hash "^1.1.1"
+
 postcss-normalize-charset@^1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz#ef9ee71212d7fe759c78ed162f61ed62b5cb93f1"
@@ -6946,6 +7211,14 @@ postcss-selector-parser@^6.0.2:
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
+postcss-selector-parser@^6.0.4:
+  version "6.0.5"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.5.tgz#042d74e137db83e6f294712096cb413f5aa612c4"
+  integrity sha512-aFYPoYmXbZ1V6HZaSvat08M97A8HqO6Pjz+PiNpw/DhuRrC72XWAdp3hL6wusDCN31sSmcZyMGa2hZEuX+Xfhg==
+  dependencies:
+    cssesc "^3.0.0"
+    util-deprecate "^1.0.2"
+
 postcss-svgo@^2.1.1:
   version "2.1.6"
   resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-2.1.6.tgz#b6df18aa613b666e133f08adb5219c2684ac108d"
@@ -6994,7 +7267,7 @@ postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0
     source-map "^0.5.6"
     supports-color "^3.2.3"
 
-postcss@^6.0.1, postcss@^6.0.8:
+postcss@^6.0.1:
   version "6.0.23"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
   dependencies:
@@ -7020,6 +7293,15 @@ postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.21, postcss@^7.0.26, postcss@^7.0.
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
+postcss@^8.1.10:
+  version "8.2.12"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.2.12.tgz#81248a1a87e0f575cc594a99a08207fd1c4addc4"
+  integrity sha512-BJnGT5+0q2tzvs6oQfnY2NpEJ7rIXNfBnZtQOKCIsweeWXBXeDd5k31UgTdS3d/c02ouspufn37mTaHWkJyzMQ==
+  dependencies:
+    colorette "^1.2.2"
+    nanoid "^3.1.22"
+    source-map "^0.6.1"
+
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
@@ -7032,10 +7314,6 @@ preserve@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
 
-prettier@^1.16.0:
-  version "1.17.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.17.1.tgz#ed64b4e93e370cb8a25b9ef7fef3e4fd1c0995db"
-
 pretty-error@^2.0.2:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-2.1.1.tgz#5f4f87c8f91e5ae3f3ba87ab4cf5e03b1a17f1a3"
@@ -7154,15 +7432,18 @@ qjobs@^1.1.4:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/qjobs/-/qjobs-1.2.0.tgz#c45e9c61800bd087ef88d7e256423bdd49e5d071"
 
-qrcode@^1.3.0:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.3.3.tgz#5ef50c0c890cffa1897f452070f0f094936993de"
+qrcode@^1.4.4:
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.4.4.tgz#f0c43568a7e7510a55efc3b88d9602f71963ea83"
+  integrity sha512-oLzEC5+NKFou9P0bMj5+v6Z40evexeE29Z9cummZXZ9QXyMr3lphkURzxjXgPJC5azpxcshoDWV1xE46z+/c3Q==
   dependencies:
-    can-promise "0.0.1"
+    buffer "^5.4.3"
+    buffer-alloc "^1.2.0"
+    buffer-from "^1.1.1"
     dijkstrajs "^1.0.1"
     isarray "^2.0.1"
     pngjs "^3.3.0"
-    yargs "^12.0.5"
+    yargs "^13.2.4"
 
 qs@6.5.2:
   version "6.5.2"
@@ -7552,13 +7833,10 @@ require-directory@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42"
 
-require-from-string@^1.1.0:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-1.2.1.tgz#529c9ccef27380adfec9a2f965b649bbee636418"
-
-require-main-filename@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-1.0.1.tgz#97f717b69d48784f5f526a6c5aa8ffdda055a4d1"
+require-main-filename@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-2.0.0.tgz#d0b329ecc7cc0f61649f62215be69af54aa8989b"
+  integrity sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==
 
 require-package-name@^2.0.1:
   version "2.0.1"
@@ -7590,7 +7868,7 @@ resolve@1.1.x, resolve@^1.1.6:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
 
-resolve@^1.10.0, resolve@^1.4.0, resolve@^1.5.0, resolve@^1.8.1:
+resolve@^1.10.0, resolve@^1.5.0, resolve@^1.8.1:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.11.0.tgz#4014870ba296176b86343d50b60f3b50609ce232"
   dependencies:
@@ -8022,20 +8300,25 @@ source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
 
+source-map@0.6.1, source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
+  version "0.6.1"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+
 source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
-source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
-
 source-map@~0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.2.0.tgz#dab73fbcfc2ba819b4de03bd6f6eaa48164b3f9d"
   dependencies:
     amdefine ">=0.0.4"
 
+sourcemap-codec@^1.4.4:
+  version "1.4.8"
+  resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
+  integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
+
 spdx-correct@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"
@@ -8140,6 +8423,11 @@ strict-uri-encode@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/strict-uri-encode/-/strict-uri-encode-1.1.0.tgz#279b225df1d582b1f54e65addd4352e18faa0713"
 
+string-hash@^1.1.1:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/string-hash/-/string-hash-1.1.3.tgz#e8aafc0ac1855b4666929ed7dd1275df5d6c811b"
+  integrity sha1-6Kr8CsGFW0Zmkp7X3RJ1311sgRs=
+
 string-width@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-1.0.2.tgz#118bdf5b8cdc51a2a7e70d211e07e2b0b9b107d3"
@@ -8148,14 +8436,14 @@ string-width@^1.0.1:
     is-fullwidth-code-point "^1.0.0"
     strip-ansi "^3.0.0"
 
-"string-width@^1.0.2 || 2", string-width@^2.0.0, string-width@^2.1.0, string-width@^2.1.1:
+"string-width@^1.0.2 || 2", string-width@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-2.1.1.tgz#ab93f27a8dc13d28cac815c462143a6d9012ae9e"
   dependencies:
     is-fullwidth-code-point "^2.0.0"
     strip-ansi "^4.0.0"
 
-string-width@^3.0.0:
+string-width@^3.0.0, string-width@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-3.1.0.tgz#22767be21b62af1081574306f69ac51b62203961"
   dependencies:
@@ -8218,7 +8506,7 @@ strip-ansi@^4.0.0:
   dependencies:
     ansi-regex "^3.0.0"
 
-strip-ansi@^5.1.0:
+strip-ansi@^5.0.0, strip-ansi@^5.1.0, strip-ansi@^5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-5.2.0.tgz#8c9a536feb6afc962bdfa5b104a5091c1ad9c0ae"
   dependencies:
@@ -8245,10 +8533,6 @@ strip-bom@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
 
-strip-eof@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/strip-eof/-/strip-eof-1.0.0.tgz#bb43ff5598a6eb05d89b59fcd129c983313606bf"
-
 strip-indent@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-1.0.1.tgz#0c7962a6adefa7bbd4ac366460a638552ae1a0a2"
@@ -8830,9 +9114,10 @@ useragent@2.3.0:
     lru-cache "4.1.x"
     tmp "0.0.x"
 
-util-deprecate@^1.0.1, util-deprecate@~1.0.1:
+util-deprecate@^1.0.1, util-deprecate@^1.0.2, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
+  integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=
 
 util.promisify@1.0.0:
   version "1.0.0"
@@ -8934,67 +9219,55 @@ vue-eslint-parser@^5.0.0:
     esquery "^1.0.1"
     lodash "^4.17.11"
 
-vue-hot-reload-api@^2.2.0:
-  version "2.3.3"
-  resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.3.tgz#2756f46cb3258054c5f4723de8ae7e87302a1ccf"
-
-vue-i18n@^7.3.2:
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-7.8.1.tgz#2ce4b6efde679a1e05ddb5d907bfc1bc218803b2"
-
-vue-loader@^14.0.0:
-  version "14.2.4"
-  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-14.2.4.tgz#d0a0e8236155fa7f9602cde65b0d38259e051ee2"
+vue-i18n@^9.0.0-beta.18:
+  version "9.1.6"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.1.6.tgz#4cf992e2aec5458bc19369973c96ea7d0f560321"
+  integrity sha512-FEC4HZkTH6QRIu/A0wlo0VS/GH3w/fuCC6xfvoC8IyhhtbG9A+go9NfW+HZ1ZXdAcO4EWcVQi04M+iSwuxgixw==
   dependencies:
-    consolidate "^0.14.0"
-    hash-sum "^1.0.2"
-    loader-utils "^1.1.0"
-    lru-cache "^4.1.1"
-    postcss "^6.0.8"
-    postcss-load-config "^1.1.0"
-    postcss-selector-parser "^2.0.0"
-    prettier "^1.16.0"
-    resolve "^1.4.0"
-    source-map "^0.6.1"
-    vue-hot-reload-api "^2.2.0"
-    vue-style-loader "^4.0.1"
-    vue-template-es2015-compiler "^1.6.0"
+    "@intlify/core-base" "9.1.6"
+    "@intlify/shared" "9.1.6"
+    "@intlify/vue-devtools" "9.1.6"
+    "@vue/devtools-api" "^6.0.0-beta.7"
 
-vue-router@^3.0.1:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.0.2.tgz#dedc67afe6c4e2bc25682c8b1c2a8c0d7c7e56be"
+vue-loader@^16.1.2:
+  version "16.2.0"
+  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-16.2.0.tgz#046a53308dd47e58efe20ddec1edec027ce3b46e"
+  integrity sha512-TitGhqSQ61RJljMmhIGvfWzJ2zk9m1Qug049Ugml6QP3t0e95o0XJjk29roNEiPKJQBEi8Ord5hFuSuELzSp8Q==
+  dependencies:
+    chalk "^4.1.0"
+    hash-sum "^2.0.0"
+    loader-utils "^2.0.0"
 
-vue-style-loader@^4.0.0, vue-style-loader@^4.0.1:
+vue-router@^4.0.5:
+  version "4.0.6"
+  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.0.6.tgz#91750db507d26642f225b0ec6064568e5fe448d6"
+  integrity sha512-Y04llmK2PyaESj+N33VxLjGCUDuv9t4q2OpItEGU7POZiuQZaugV6cJpE6Qm1sVFtxufodLKN2y2dQl9nk0Reg==
+
+vue-style-loader@^4.0.0:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.2.tgz#dedf349806f25ceb4e64f3ad7c0a44fba735fcf8"
   dependencies:
     hash-sum "^1.0.2"
     loader-utils "^1.0.2"
 
-vue-template-compiler@^2.6.11:
-  version "2.6.11"
-  resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.11.tgz#c04704ef8f498b153130018993e56309d4698080"
-  integrity sha512-KIq15bvQDrcCjpGjrAhx4mUlyyHfdmTaoNfeoATHLAiWB+MU3cx4lOzMwrnUh9cCxy0Lt1T11hAFY6TQgroUAA==
+vue@^3.0.7:
+  version "3.0.11"
+  resolved "https://registry.yarnpkg.com/vue/-/vue-3.0.11.tgz#c82f9594cbf4dcc869241d4c8dd3e08d9a8f4b5f"
+  integrity sha512-3/eUi4InQz8MPzruHYSTQPxtM3LdZ1/S/BvaU021zBnZi0laRUyH6pfuE4wtUeLvI8wmUNwj5wrZFvbHUXL9dw==
   dependencies:
-    de-indent "^1.0.2"
-    he "^1.1.0"
+    "@vue/compiler-dom" "3.0.11"
+    "@vue/runtime-dom" "3.0.11"
+    "@vue/shared" "3.0.11"
 
-vue-template-es2015-compiler@^1.6.0:
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
+vuelidate@^0.7.6:
+  version "0.7.6"
+  resolved "https://registry.yarnpkg.com/vuelidate/-/vuelidate-0.7.6.tgz#84100c13b943470660d0416642845cd2a1edf4b2"
+  integrity sha512-suzIuet1jGcyZ4oUSW8J27R2tNrJ9cIfklAh63EbAkFjE380iv97BAiIeolRYoB9bF9usBXCu4BxftWN1Dkn3g==
 
-vue@^2.6.11:
-  version "2.6.11"
-  resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
-  integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==
-
-vuelidate@^0.7.4:
-  version "0.7.4"
-  resolved "https://registry.yarnpkg.com/vuelidate/-/vuelidate-0.7.4.tgz#5a0e54be09ac0192f1aa3387d74b92e0945bf8aa"
-
-vuex@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.0.1.tgz#e761352ebe0af537d4bb755a9b9dc4be3df7efd2"
+vuex@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/vuex/-/vuex-4.0.0.tgz#ac877aa76a9c45368c979471e461b520d38e6cf5"
+  integrity sha512-56VPujlHscP5q/e7Jlpqc40sja4vOhC4uJD1llBCWolVI8ND4+VzisDVkUMl+z5y0MpIImW6HjhNc+ZvuizgOw==
 
 watchpack@^1.5.0:
   version "1.6.0"
@@ -9094,10 +9367,6 @@ wide-align@^1.1.0:
   dependencies:
     string-width "^1.0.2 || 2"
 
-window-or-global@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/window-or-global/-/window-or-global-1.0.1.tgz#dbe45ba2a291aabc56d62cf66c45b7fa322946de"
-
 wordwrap@^1.0.0, wordwrap@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-1.0.0.tgz#27584810891456a4171c8d0226441ade90cbcaeb"
@@ -9112,12 +9381,14 @@ worker-farm@^1.7.0:
   dependencies:
     errno "~0.1.7"
 
-wrap-ansi@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-2.1.0.tgz#d8fc3d284dd05794fe84973caecdd1cf824fdd85"
+wrap-ansi@^5.1.0:
+  version "5.1.0"
+  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-5.1.0.tgz#1fd1f67235d5b6d0fee781056001bfb694c03b09"
+  integrity sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==
   dependencies:
-    string-width "^1.0.1"
-    strip-ansi "^3.0.1"
+    ansi-styles "^3.2.0"
+    string-width "^3.0.0"
+    strip-ansi "^5.0.0"
 
 wrappy@1:
   version "1.0.2"
@@ -9164,7 +9435,7 @@ xtend@^4.0.1:
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
   integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==
 
-"y18n@^3.2.1 || ^4.0.0", y18n@^4.0.0:
+y18n@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.0.tgz#95ef94f85ecc81d007c264e190a120f0a3c8566b"
 
@@ -9181,9 +9452,10 @@ yaml@^1.7.2:
   resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.0.tgz#3b593add944876077d4d683fee01081bd9fff31e"
   integrity sha512-yr2icI4glYaNG+KWONODapy2/jDdMSDnrONSjblABjD9B4Z5LgiircSt8m8sRZFNi08kG9Sm0uSHtEmP3zaEGg==
 
-yargs-parser@^11.1.1:
-  version "11.1.1"
-  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-11.1.1.tgz#879a0865973bca9f6bab5cbdf3b1c67ec7d3bcf4"
+yargs-parser@^13.1.2:
+  version "13.1.2"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-13.1.2.tgz#130f09702ebaeef2650d54ce6e3e5706f7a4fb38"
+  integrity sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==
   dependencies:
     camelcase "^5.0.0"
     decamelize "^1.2.0"
@@ -9196,22 +9468,21 @@ yargs-parser@^18.1.3:
     camelcase "^5.0.0"
     decamelize "^1.2.0"
 
-yargs@^12.0.5:
-  version "12.0.5"
-  resolved "https://registry.yarnpkg.com/yargs/-/yargs-12.0.5.tgz#05f5997b609647b64f66b81e3b4b10a368e7ad13"
+yargs@^13.2.4:
+  version "13.3.2"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-13.3.2.tgz#ad7ffefec1aa59565ac915f82dccb38a9c31a2dd"
+  integrity sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==
   dependencies:
-    cliui "^4.0.0"
-    decamelize "^1.2.0"
+    cliui "^5.0.0"
     find-up "^3.0.0"
-    get-caller-file "^1.0.1"
-    os-locale "^3.0.0"
+    get-caller-file "^2.0.1"
     require-directory "^2.1.1"
-    require-main-filename "^1.0.1"
+    require-main-filename "^2.0.0"
     set-blocking "^2.0.0"
-    string-width "^2.0.0"
+    string-width "^3.0.0"
     which-module "^2.0.0"
-    y18n "^3.2.1 || ^4.0.0"
-    yargs-parser "^11.1.1"
+    y18n "^4.0.0"
+    yargs-parser "^13.1.2"
 
 yauzl@^2.10.0:
   version "2.10.0"

From 509ec995743d21b6a5b81634d026460b082f3506 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sat, 24 Apr 2021 18:04:35 +0300
Subject: [PATCH 005/113] some minor fixes to get it to boot

---
 .../settings_modal/settings_modal.js          | 16 ++++------
 .../settings_modal/settings_modal.vue         | 32 ++++++++++---------
 .../settings_modal/tabs/version_tab.vue       |  2 +-
 src/components/user_panel/user_panel.vue      |  2 +-
 4 files changed, 26 insertions(+), 26 deletions(-)

diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js
index 04043483..7f97fa08 100644
--- a/src/components/settings_modal/settings_modal.js
+++ b/src/components/settings_modal/settings_modal.js
@@ -1,7 +1,7 @@
+import { defineAsyncComponent } from 'vue'
 import Modal from 'src/components/modal/modal.vue'
 import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
 import AsyncComponentError from 'src/components/async_component_error/async_component_error.vue'
-import getResettableAsyncComponent from 'src/services/resettable_async_component.js'
 import Popover from '../popover/popover.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { cloneDeep } from 'lodash'
@@ -51,14 +51,12 @@ const SettingsModal = {
   components: {
     Modal,
     Popover,
-    SettingsModalContent: getResettableAsyncComponent(
-      () => import('./settings_modal_content.vue'),
-      {
-        loading: PanelLoading,
-        error: AsyncComponentError,
-        delay: 0
-      }
-    )
+    SettingsModalContent: defineAsyncComponent({
+      loader: () => import('./settings_modal_content.vue'),
+      loadingComponent: PanelLoading,
+      errorComponent: AsyncComponentError,
+      delay: 0
+    })
   },
   methods: {
     closeModal () {
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index c7da5433..12519925 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -11,22 +11,24 @@
           {{ $t('settings.settings') }}
         </span>
         <transition name="fade">
-          <template v-if="currentSaveStateNotice">
-            <div
-              v-if="currentSaveStateNotice.error"
-              class="alert error"
-              @click.prevent
-            >
-              {{ $t('settings.saving_err') }}
-            </div>
+          <template>
+            <template v-if="currentSaveStateNotice">
+              <div
+                v-if="currentSaveStateNotice.error"
+                class="alert error"
+                @click.prevent
+              >
+                {{ $t('settings.saving_err') }}
+              </div>
 
-            <div
-              v-if="!currentSaveStateNotice.error"
-              class="alert transparent"
-              @click.prevent
-            >
-              {{ $t('settings.saving_ok') }}
-            </div>
+              <div
+                v-if="!currentSaveStateNotice.error"
+                class="alert transparent"
+                @click.prevent
+              >
+                {{ $t('settings.saving_ok') }}
+              </div>
+            </template>
           </template>
         </transition>
         <button
diff --git a/src/components/settings_modal/tabs/version_tab.vue b/src/components/settings_modal/tabs/version_tab.vue
index d35ff25e..0330d49f 100644
--- a/src/components/settings_modal/tabs/version_tab.vue
+++ b/src/components/settings_modal/tabs/version_tab.vue
@@ -28,4 +28,4 @@
     </div>
   </div>
 </template>
-<script src="./version_tab.js">
+<script src="./version_tab.js" />
diff --git a/src/components/user_panel/user_panel.vue b/src/components/user_panel/user_panel.vue
index 5685916a..50949b98 100644
--- a/src/components/user_panel/user_panel.vue
+++ b/src/components/user_panel/user_panel.vue
@@ -2,7 +2,7 @@
   <div class="user-panel">
     <div
       v-if="signedIn"
-      key="user-panel"
+      key="user-panel-signed"
       class="panel panel-default signed-in"
     >
       <UserCard

From 1f5f612163bd1c359212c2e6832806f0dd606977 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 12:46:13 +0300
Subject: [PATCH 006/113] remove Vue.component, just export an object. Seems to
 be working

---
 src/components/chat_title/chat_title.js   | 5 ++---
 src/hocs/with_load_more/with_load_more.js | 5 ++---
 2 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/components/chat_title/chat_title.js b/src/components/chat_title/chat_title.js
index edfbe7a4..1da04d4b 100644
--- a/src/components/chat_title/chat_title.js
+++ b/src/components/chat_title/chat_title.js
@@ -1,8 +1,7 @@
-import Vue from 'vue'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 import UserAvatar from '../user_avatar/user_avatar.vue'
 
-export default Vue.component('chat-title', {
+export default {
   name: 'ChatTitle',
   components: {
     UserAvatar
@@ -23,4 +22,4 @@ export default Vue.component('chat-title', {
       return generateProfileLink(user.id, user.screen_name)
     }
   }
-})
+}
diff --git a/src/hocs/with_load_more/with_load_more.js b/src/hocs/with_load_more/with_load_more.js
index 671b2b6f..537f5720 100644
--- a/src/hocs/with_load_more/with_load_more.js
+++ b/src/hocs/with_load_more/with_load_more.js
@@ -1,4 +1,3 @@
-import Vue from 'vue'
 import isEmpty from 'lodash/isEmpty'
 import { getComponentProps } from '../../services/component_utils/component_utils'
 import './with_load_more.scss'
@@ -23,7 +22,7 @@ const withLoadMore = ({
   const originalProps = Object.keys(getComponentProps(WrappedComponent))
   const props = originalProps.filter(v => v !== childPropName).concat(additionalPropNames)
 
-  return Vue.component('withLoadMore', {
+  return {
     props,
     data () {
       return {
@@ -106,7 +105,7 @@ const withLoadMore = ({
         </div>
       )
     }
-  })
+  }
 }
 
 export default withLoadMore

From 76a2e6befb3aea6e890bb3c2e001a4635d05091a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 12:50:17 +0300
Subject: [PATCH 007/113] remove Vue.component from hooks

---
 .../with_load_more/{with_load_more.js => with_load_more.jsx} | 2 +-
 .../{with_subscription.js => with_subscription.jsx}          | 5 ++---
 2 files changed, 3 insertions(+), 4 deletions(-)
 rename src/hocs/with_load_more/{with_load_more.js => with_load_more.jsx} (99%)
 rename src/hocs/with_subscription/{with_subscription.js => with_subscription.jsx} (97%)

diff --git a/src/hocs/with_load_more/with_load_more.js b/src/hocs/with_load_more/with_load_more.jsx
similarity index 99%
rename from src/hocs/with_load_more/with_load_more.js
rename to src/hocs/with_load_more/with_load_more.jsx
index 537f5720..7f491558 100644
--- a/src/hocs/with_load_more/with_load_more.js
+++ b/src/hocs/with_load_more/with_load_more.jsx
@@ -38,7 +38,7 @@ const withLoadMore = ({
         this.fetchEntries()
       }
     },
-    destroyed () {
+    unmounted () {
       window.removeEventListener('scroll', this.scrollLoad)
       destroy && destroy(this.$props, this.$store)
     },
diff --git a/src/hocs/with_subscription/with_subscription.js b/src/hocs/with_subscription/with_subscription.jsx
similarity index 97%
rename from src/hocs/with_subscription/with_subscription.js
rename to src/hocs/with_subscription/with_subscription.jsx
index b1244276..7e590f73 100644
--- a/src/hocs/with_subscription/with_subscription.js
+++ b/src/hocs/with_subscription/with_subscription.jsx
@@ -1,4 +1,3 @@
-import Vue from 'vue'
 import isEmpty from 'lodash/isEmpty'
 import { getComponentProps } from '../../services/component_utils/component_utils'
 import './with_subscription.scss'
@@ -22,7 +21,7 @@ const withSubscription = ({
   const originalProps = Object.keys(getComponentProps(WrappedComponent))
   const props = originalProps.filter(v => v !== childPropName).concat(additionalPropNames)
 
-  return Vue.component('withSubscription', {
+  return {
     props: [
       ...props,
       'refresh' // boolean saying to force-fetch data whenever created
@@ -88,7 +87,7 @@ const withSubscription = ({
         )
       }
     }
-  })
+  }
 }
 
 export default withSubscription

From 6e687c0663110853f48ee2acb2ffb29f7ff91ef7 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:15:02 +0300
Subject: [PATCH 008/113] fix one async component preventing further load

---
 src/components/user_list_popover/user_list_popover.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/user_list_popover/user_list_popover.js b/src/components/user_list_popover/user_list_popover.js
index 32ca2b8d..f0a16c38 100644
--- a/src/components/user_list_popover/user_list_popover.js
+++ b/src/components/user_list_popover/user_list_popover.js
@@ -1,3 +1,5 @@
+import { defineAsyncComponent } from 'vue'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
 
@@ -11,8 +13,8 @@ const UserListPopover = {
     'users'
   ],
   components: {
-    Popover: () => import('../popover/popover.vue'),
-    UserAvatar: () => import('../user_avatar/user_avatar.vue')
+    Popover: defineAsyncComponent(() => import('../popover/popover.vue')),
+    UserAvatar: defineAsyncComponent(() => import('../user_avatar/user_avatar.vue'))
   },
   computed: {
     usersCapped () {

From fca885e665094b8efcbc65a3f4ec9ba31679c4c2 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:23:16 +0300
Subject: [PATCH 009/113] resolve TODO VUE3

---
 src/components/color_input/color_input.vue    | 20 +++++++--------
 src/components/emoji_input/emoji_input.js     | 23 ++++++++---------
 src/components/font_control/font_control.vue  |  2 +-
 .../opacity_input/opacity_input.vue           |  4 +--
 src/components/range_input/range_input.vue    |  6 ++---
 .../settings_modal/settings_modal_content.js  |  2 +-
 .../status_popover/status_popover.js          |  5 ++--
 src/components/tab_switcher/tab_switcher.jsx  | 25 ++++++++-----------
 8 files changed, 41 insertions(+), 46 deletions(-)

diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index 8fb16113..81462979 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -14,25 +14,25 @@
       :checked="present"
       :disabled="disabled"
       class="opt"
-      @change="$emit('input', typeof value === 'undefined' ? fallback : undefined)"
+      @change="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
     />
     <div class="input color-input-field">
       <input
         :id="name + '-t'"
         class="textColor unstyled"
         type="text"
-        :value="value || fallback"
+        :value="modelValue || fallback"
         :disabled="!present || disabled"
-        @input="$emit('input', $event.target.value)"
+        @input="$emit('update:modelValue', $event.target.value)"
       >
       <input
         v-if="validColor"
         :id="name"
         class="nativeColor unstyled"
         type="color"
-        :value="value || fallback"
+        :value="modelValue || fallback"
         :disabled="!present || disabled"
-        @input="$emit('input', $event.target.value)"
+        @input="$emit('update:modelValue', $event.target.value)"
       >
       <div
         v-if="transparentColor"
@@ -67,7 +67,7 @@ export default {
     },
     // Color value, should be required but vue cannot tell the difference
     // between "property missing" and "property set to undefined"
-    value: {
+    modelValue: {
       required: false,
       type: String,
       default: undefined
@@ -93,16 +93,16 @@ export default {
   },
   computed: {
     present () {
-      return typeof this.value !== 'undefined'
+      return typeof this.modelValue !== 'undefined'
     },
     validColor () {
-      return hex2rgb(this.value || this.fallback)
+      return hex2rgb(this.modelValue || this.fallback)
     },
     transparentColor () {
-      return this.value === 'transparent'
+      return this.modelValue === 'transparent'
     },
     computedColor () {
-      return this.value && this.value.startsWith('--')
+      return this.modelValue && this.modelValue.startsWith('--')
     }
   }
 }
diff --git a/src/components/emoji_input/emoji_input.js b/src/components/emoji_input/emoji_input.js
index c4d235c0..389b6787 100644
--- a/src/components/emoji_input/emoji_input.js
+++ b/src/components/emoji_input/emoji_input.js
@@ -57,8 +57,7 @@ const EmojiInput = {
       required: true,
       type: Function
     },
-    // TODO VUE3: change to modelValue, change 'input' event to 'input'
-    value: {
+    modelValue: {
       /**
        * Used for v-model
        */
@@ -137,8 +136,8 @@ const EmojiInput = {
       return (this.wordAtCaret || {}).word || ''
     },
     wordAtCaret () {
-      if (this.value && this.caret) {
-        const word = Completion.wordAtPosition(this.value, this.caret - 1) || {}
+      if (this.modelValue && this.caret) {
+        const word = Completion.wordAtPosition(this.modelValue, this.caret - 1) || {}
         return word
       }
     }
@@ -225,13 +224,13 @@ const EmojiInput = {
       }
     },
     replace (replacement) {
-      const newValue = Completion.replaceWord(this.value, this.wordAtCaret, replacement)
-      this.$emit('input', newValue)
+      const newValue = Completion.replaceWord(this.modelValue, this.wordAtCaret, replacement)
+      this.$emit('update:modelValue', newValue)
       this.caret = 0
     },
     insert ({ insertion, keepOpen, surroundingSpace = true }) {
-      const before = this.value.substring(0, this.caret) || ''
-      const after = this.value.substring(this.caret) || ''
+      const before = this.modelValue.substring(0, this.caret) || ''
+      const after = this.modelValue.substring(this.caret) || ''
 
       /* Using a bit more smart approach to padding emojis with spaces:
        * - put a space before cursor if there isn't one already, unless we
@@ -259,7 +258,7 @@ const EmojiInput = {
         after
       ].join('')
       this.keepOpen = keepOpen
-      this.$emit('input', newValue)
+      this.$emit('update:modelValue', newValue)
       const position = this.caret + (insertion + spaceAfter + spaceBefore).length
       if (!keepOpen) {
         this.input.focus()
@@ -278,8 +277,8 @@ const EmojiInput = {
       if (len > 0 || suggestion) {
         const chosenSuggestion = suggestion || this.suggestions[this.highlighted]
         const replacement = chosenSuggestion.replacement
-        const newValue = Completion.replaceWord(this.value, this.wordAtCaret, replacement)
-        this.$emit('input', newValue)
+        const newValue = Completion.replaceWord(this.modelValue, this.wordAtCaret, replacement)
+        this.$emit('update:modelValue', newValue)
         this.highlighted = 0
         const position = this.wordAtCaret.start + replacement.length
 
@@ -455,7 +454,7 @@ const EmojiInput = {
       this.showPicker = false
       this.setCaret(e)
       this.resize()
-      this.$emit('input', e.target.value)
+      this.$emit('update:modelValue', e.target.value)
     },
     onClickInput (e) {
       this.showPicker = false
diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index dd117ec0..0cee2edc 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -15,7 +15,7 @@
       class="opt exlcude-disabled"
       type="checkbox"
       :checked="present"
-      @input="$emit('input', typeof value === 'undefined' ? fallback : undefined)"
+      @input="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
     >
     <label
       v-if="typeof fallback !== 'undefined'"
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index 3cc3942b..e1d31fc2 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -14,7 +14,7 @@
       :checked="present"
       :disabled="disabled"
       class="opt"
-      @change="$emit('input', !present ? fallback : undefined)"
+      @change="$emit('update:modelValue', !present ? fallback : undefined)"
     />
     <input
       :id="name"
@@ -25,7 +25,7 @@
       max="1"
       min="0"
       step=".05"
-      @input="$emit('input', $event.target.value)"
+      @input="$emit('update:modelValue', $event.target.value)"
     >
   </div>
 </template>
diff --git a/src/components/range_input/range_input.vue b/src/components/range_input/range_input.vue
index 5857a5c1..82681809 100644
--- a/src/components/range_input/range_input.vue
+++ b/src/components/range_input/range_input.vue
@@ -15,7 +15,7 @@
       class="opt"
       type="checkbox"
       :checked="present"
-      @input="$emit('input', !present ? fallback : undefined)"
+      @input="$emit('update:modelValue', !present ? fallback : undefined)"
     >
     <label
       v-if="typeof fallback !== 'undefined'"
@@ -31,7 +31,7 @@
       :max="max || hardMax || 100"
       :min="min || hardMin || 0"
       :step="step || 1"
-      @input="$emit('input', $event.target.value)"
+      @input="$emit('update:modelValue', $event.target.value)"
     >
     <input
       :id="name"
@@ -42,7 +42,7 @@
       :max="hardMax"
       :min="hardMin"
       :step="step || 1"
-      @input="$emit('input', $event.target.value)"
+      @input="$emit('update:modelValue', $event.target.value)"
     >
   </div>
 </template>
diff --git a/src/components/settings_modal/settings_modal_content.js b/src/components/settings_modal/settings_modal_content.js
index deb77298..506b52e4 100644
--- a/src/components/settings_modal/settings_modal_content.js
+++ b/src/components/settings_modal/settings_modal_content.js
@@ -63,7 +63,7 @@ const SettingsModalContent = {
       const targetTab = this.$store.state.interface.settingsModalTargetTab
       // We're being told to open in specific tab
       if (targetTab) {
-        const tabIndex = this.$refs.tabSwitcher.$slots.default.findIndex(elm => {
+        const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => {
           return elm.data && elm.data.attrs['data-tab-name'] === targetTab
         })
         if (tabIndex >= 0) {
diff --git a/src/components/status_popover/status_popover.js b/src/components/status_popover/status_popover.js
index c47f5631..e0962ccd 100644
--- a/src/components/status_popover/status_popover.js
+++ b/src/components/status_popover/status_popover.js
@@ -1,6 +1,7 @@
 import { find } from 'lodash'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
+import { defineAsyncComponent } from 'vue'
 
 library.add(
   faCircleNotch
@@ -22,8 +23,8 @@ const StatusPopover = {
     }
   },
   components: {
-    Status: () => import('../status/status.vue'),
-    Popover: () => import('../popover/popover.vue')
+    Status: defineAsyncComponent(() => import('../status/status.vue')),
+    Popover: defineAsyncComponent(() => import('../popover/popover.vue'))
   },
   methods: {
     enter () {
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index 2869e59c..db82e075 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -1,10 +1,11 @@
+// eslint-disable-next-line no-unused
+import { h } from 'vue'
 import { mapState } from 'vuex'
 import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
 
 import './tab_switcher.scss'
 
-// TODO VUE3: change data to props
-const findFirstUsable = (slots) => slots.findIndex(_ => _.data && _.data.attrs)
+const findFirstUsable = (slots) => slots.findIndex(_ => _.props)
 
 export default {
   name: 'TabSwitcher',
@@ -42,15 +43,14 @@ export default {
   },
   data () {
     return {
-      // TODO VUE3: add () after 'default'
-      active: findFirstUsable(this.$slots.default)
+      active: findFirstUsable(this.$slots.default())
     }
   },
   computed: {
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
-        return this.$slots.default.findIndex(slot => this.activeTab === slot.key)
+        return this.$slots.default().findIndex(slot => this.activeTab === slot.key)
       } else {
         return this.active
       }
@@ -61,8 +61,7 @@ export default {
   },
   beforeUpdate () {
     const currentSlot = this.slots()[this.active]
-    // TODO VUE3: change data to props
-    if (!currentSlot.data) {
+    if (!currentSlot.props) {
       this.active = findFirstUsable(this.slots())
     }
   },
@@ -75,8 +74,7 @@ export default {
     },
     // DO NOT put it to computed, it doesn't work (caching?)
     slots () {
-      // TODO VUE3: add () at the end
-      return this.$slots.default
+      return this.$slots.default()
     },
     setTab (index) {
       if (typeof this.onSwitch === 'function') {
@@ -88,12 +86,10 @@ export default {
       }
     }
   },
-  // TODO VUE3: remove 'h' here
-  render (h) {
+  render () {
     const tabs = this.slots()
       .map((slot, index) => {
-        // TODO VUE3 change to slot.props
-        const props = slot.data && slot.data.attrs
+        const props = slot.props
         if (!props) return
         const classesTab = ['tab', 'button-default']
         const classesWrapper = ['tab-wrapper']
@@ -134,8 +130,7 @@ export default {
       })
 
     const contents = this.slots().map((slot, index) => {
-      // TODO VUE3 change to slot.props
-      const props = slot.data && slot.data.attrs
+      const props = slot.props
       if (!props) return
       const active = this.activeIndex === index
       const classes = [ active ? 'active' : 'hidden' ]

From 905b9771ec74c4c79e5795676ea9c3946e586ce9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:24:08 +0300
Subject: [PATCH 010/113] stop using vue.set

---
 src/components/font_control/font_control.js   |  5 ++--
 src/components/gallery/gallery.js             |  2 +-
 .../tabs/theme_tab/theme_tab.js               | 13 +++++------
 src/modules/chats.js                          | 22 +++++++++---------
 src/modules/config.js                         |  7 +++---
 src/modules/instance.js                       |  3 +--
 src/modules/interface.js                      |  9 +++-----
 src/modules/oauth.js                          |  4 +---
 src/modules/polls.js                          | 13 +++++------
 src/modules/statuses.js                       | 15 ++++++------
 src/modules/users.js                          | 23 +++++++++----------
 11 files changed, 52 insertions(+), 64 deletions(-)

diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js
index 6274780b..d3e4680f 100644
--- a/src/components/font_control/font_control.js
+++ b/src/components/font_control/font_control.js
@@ -1,4 +1,3 @@
-import { set } from 'vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faChevronDown
@@ -40,8 +39,8 @@ export default {
         return this.dValue.family
       },
       set (v) {
-        set(this.lValue, 'family', v)
-        this.$emit('input', this.lValue)
+        this.lValue.family = v
+        this.$emit('update:modelValue', this.lValue)
       }
     },
     isCustom () {
diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
index f856fd0a..d13d98f9 100644
--- a/src/components/gallery/gallery.js
+++ b/src/components/gallery/gallery.js
@@ -34,7 +34,7 @@ const Gallery = {
   },
   methods: {
     onNaturalSizeLoad (id, size) {
-      this.$set(this.sizes, id, size)
+      this.sizes[id] = size
     },
     rowStyle (itemsPerRow) {
       return { 'padding-bottom': `${(100 / (itemsPerRow + 0.6))}%` }
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
index 727513f4..9f4dd1a9 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.js
@@ -1,4 +1,3 @@
-import { set, delete as del } from 'vue'
 import {
   rgb2hex,
   hex2rgb,
@@ -326,9 +325,9 @@ export default {
       },
       set (val) {
         if (val) {
-          set(this.shadowsLocal, this.shadowSelected, this.currentShadowFallback.map(_ => Object.assign({}, _)))
+          this.shadowsLocal[this.shadowSelected] = this.currentShadowFallback.map(_ => Object.assign({}, _))
         } else {
-          del(this.shadowsLocal, this.shadowSelected)
+          delete this.shadowsLocal[this.shadowSelected]
         }
       }
     },
@@ -340,7 +339,7 @@ export default {
         return this.shadowsLocal[this.shadowSelected]
       },
       set (v) {
-        set(this.shadowsLocal, this.shadowSelected, v)
+        this.shadowsLocal[this.shadowSelected] = v
       }
     },
     themeValid () {
@@ -562,7 +561,7 @@ export default {
         .filter(_ => _.endsWith('ColorLocal') || _.endsWith('OpacityLocal'))
         .filter(_ => !v1OnlyNames.includes(_))
         .forEach(key => {
-          set(this.$data, key, undefined)
+          this.$data[key] = undefined
         })
     },
 
@@ -570,7 +569,7 @@ export default {
       Object.keys(this.$data)
         .filter(_ => _.endsWith('RadiusLocal'))
         .forEach(key => {
-          set(this.$data, key, undefined)
+          this.$data[key] = undefined
         })
     },
 
@@ -578,7 +577,7 @@ export default {
       Object.keys(this.$data)
         .filter(_ => _.endsWith('OpacityLocal'))
         .forEach(key => {
-          set(this.$data, key, undefined)
+          this.$data[key] = undefined
         })
     },
 
diff --git a/src/modules/chats.js b/src/modules/chats.js
index 69d683bd..f28c2603 100644
--- a/src/modules/chats.js
+++ b/src/modules/chats.js
@@ -1,4 +1,4 @@
-import Vue from 'vue'
+import { reactive } from 'vue'
 import { find, omitBy, orderBy, sumBy } from 'lodash'
 import chatService from '../services/chat_service/chat_service.js'
 import { parseChat, parseChatMessage } from '../services/entity_normalizer/entity_normalizer.service.js'
@@ -13,8 +13,8 @@ const emptyChatList = () => ({
 const defaultState = {
   chatList: emptyChatList(),
   chatListFetcher: null,
-  openedChats: {},
-  openedChatMessageServices: {},
+  openedChats: reactive({}),
+  openedChatMessageServices: reactive({}),
   fetcher: undefined,
   currentChatId: null,
   lastReadMessageId: null
@@ -137,10 +137,10 @@ const chats = {
     },
     addOpenedChat (state, { _dispatch, chat }) {
       state.currentChatId = chat.id
-      Vue.set(state.openedChats, chat.id, chat)
+      state.openedChats[chat.id] = chat
 
       if (!state.openedChatMessageServices[chat.id]) {
-        Vue.set(state.openedChatMessageServices, chat.id, chatService.empty(chat.id))
+        state.openedChatMessageServices[chat.id] = chatService.empty(chat.id)
       }
     },
     setCurrentChatId (state, { chatId }) {
@@ -160,7 +160,7 @@ const chats = {
           }
         } else {
           state.chatList.data.push(updatedChat)
-          Vue.set(state.chatList.idStore, updatedChat.id, updatedChat)
+          state.chatList.idStore[updatedChat.id] = updatedChat
         }
       })
     },
@@ -172,7 +172,7 @@ const chats = {
         chat.updated_at = updatedChat.updated_at
       }
       if (!chat) { state.chatList.data.unshift(updatedChat) }
-      Vue.set(state.chatList.idStore, updatedChat.id, updatedChat)
+      state.chatList.idStore[updatedChat.id] = updatedChat
     },
     deleteChat (state, { _dispatch, id, _rootGetters }) {
       state.chats.data = state.chats.data.filter(conversation =>
@@ -186,8 +186,8 @@ const chats = {
       commit('setChatListFetcher', { fetcher: undefined })
       for (const chatId in state.openedChats) {
         chatService.clear(state.openedChatMessageServices[chatId])
-        Vue.delete(state.openedChats, chatId)
-        Vue.delete(state.openedChatMessageServices, chatId)
+        delete state.openedChats[chatId]
+        delete state.openedChatMessageServices[chatId]
       }
     },
     setChatsLoading (state, { value }) {
@@ -215,8 +215,8 @@ const chats = {
       for (const chatId in state.openedChats) {
         if (currentChatId !== chatId) {
           chatService.clear(state.openedChatMessageServices[chatId])
-          Vue.delete(state.openedChats, chatId)
-          Vue.delete(state.openedChatMessageServices, chatId)
+          delete state.openedChats[chatId]
+          delete state.openedChatMessageServices[chatId]
         }
       }
     },
diff --git a/src/modules/config.js b/src/modules/config.js
index 629588a8..9e419b40 100644
--- a/src/modules/config.js
+++ b/src/modules/config.js
@@ -1,4 +1,3 @@
-import { set, delete as del } from 'vue'
 import { setPreset, applyTheme } from '../services/style_setter/style_setter.js'
 import messages from '../i18n/messages'
 
@@ -98,14 +97,14 @@ const config = {
   },
   mutations: {
     setOption (state, { name, value }) {
-      set(state, name, value)
+      state[name] = value
     },
     setHighlight (state, { user, color, type }) {
       const data = this.state.config.highlight[user]
       if (color || type) {
-        set(state.highlight, user, { color: color || data.color, type: type || data.type })
+        state.highlight[user] = { color: color || data.color, type: type || data.type }
       } else {
-        del(state.highlight, user)
+        delete state.highlight[user]
       }
     }
   },
diff --git a/src/modules/instance.js b/src/modules/instance.js
index 96de73ca..fd7d5efb 100644
--- a/src/modules/instance.js
+++ b/src/modules/instance.js
@@ -1,4 +1,3 @@
-import { set } from 'vue'
 import { getPreset, applyTheme } from '../services/style_setter/style_setter.js'
 import { CURRENT_VERSION } from '../services/theme_data/theme_data.service.js'
 import apiService from '../services/api/api.service.js'
@@ -86,7 +85,7 @@ const instance = {
   mutations: {
     setInstanceOption (state, { name, value }) {
       if (typeof value !== 'undefined') {
-        set(state, name, value)
+        state[name] = value
       }
     },
     setKnownDomains (state, domains) {
diff --git a/src/modules/interface.js b/src/modules/interface.js
index d6db32fd..6509386a 100644
--- a/src/modules/interface.js
+++ b/src/modules/interface.js
@@ -1,5 +1,3 @@
-import { set, delete as del } from 'vue'
-
 const defaultState = {
   settingsModalState: 'hidden',
   settingsModalLoaded: false,
@@ -29,11 +27,10 @@ const interfaceMod = {
         if (state.noticeClearTimeout) {
           clearTimeout(state.noticeClearTimeout)
         }
-        set(state.settings, 'currentSaveStateNotice', { error: false, data: success })
-        set(state.settings, 'noticeClearTimeout',
-          setTimeout(() => del(state.settings, 'currentSaveStateNotice'), 2000))
+        state.settings.currentSaveStateNotice = { error: false, data: success }
+        state.settings.noticeClearTimeout = setTimeout(() => delete state.settings.currentSaveStateNotice, 2000)
       } else {
-        set(state.settings, 'currentSaveStateNotice', { error: true, errorData: error })
+        state.settings.currentSaveStateNotice = { error: true, errorData: error }
       }
     },
     setNotificationPermission (state, permission) {
diff --git a/src/modules/oauth.js b/src/modules/oauth.js
index a2a83450..038bc3f3 100644
--- a/src/modules/oauth.js
+++ b/src/modules/oauth.js
@@ -1,5 +1,3 @@
-import { delete as del } from 'vue'
-
 const oauth = {
   state: {
     clientId: false,
@@ -29,7 +27,7 @@ const oauth = {
       state.userToken = false
       // state.token is userToken with older name, coming from persistent state
       // let's clear it as well, since it is being used as a fallback of state.userToken
-      del(state, 'token')
+      delete state.token
     }
   },
   getters: {
diff --git a/src/modules/polls.js b/src/modules/polls.js
index 92b89a06..1c4f98a4 100644
--- a/src/modules/polls.js
+++ b/src/modules/polls.js
@@ -1,5 +1,4 @@
 import { merge } from 'lodash'
-import { set } from 'vue'
 
 const polls = {
   state: {
@@ -13,25 +12,25 @@ const polls = {
       // Make expired-state change trigger re-renders properly
       poll.expired = Date.now() > Date.parse(poll.expires_at)
       if (existingPoll) {
-        set(state.pollsObject, poll.id, merge(existingPoll, poll))
+        state.pollsObject[poll.id] = merge(existingPoll, poll)
       } else {
-        set(state.pollsObject, poll.id, poll)
+        state.pollsObject[poll.id] = poll
       }
     },
     trackPoll (state, pollId) {
       const currentValue = state.trackedPolls[pollId]
       if (currentValue) {
-        set(state.trackedPolls, pollId, currentValue + 1)
+        state.trackedPolls[pollId] = currentValue + 1
       } else {
-        set(state.trackedPolls, pollId, 1)
+        state.trackedPolls[pollId] = 1
       }
     },
     untrackPoll (state, pollId) {
       const currentValue = state.trackedPolls[pollId]
       if (currentValue) {
-        set(state.trackedPolls, pollId, currentValue - 1)
+        state.trackedPolls[pollId] = currentValue - 1
       } else {
-        set(state.trackedPolls, pollId, 0)
+        state.trackedPolls[pollId] = 0
       }
     }
   },
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
index ac5d25c4..a13930e9 100644
--- a/src/modules/statuses.js
+++ b/src/modules/statuses.js
@@ -12,7 +12,6 @@ import {
   isArray,
   omitBy
 } from 'lodash'
-import { set } from 'vue'
 import {
   isStatusNotification,
   isValidNotification,
@@ -92,7 +91,7 @@ const mergeOrAdd = (arr, obj, item) => {
     // This is a new item, prepare it
     prepareStatus(item)
     arr.push(item)
-    set(obj, item.id, item)
+    obj[item.id] = item
     return { item, new: true }
   }
 }
@@ -131,7 +130,7 @@ const addStatusToGlobalStorage = (state, data) => {
     if (conversationsObject[conversationId]) {
       conversationsObject[conversationId].push(status)
     } else {
-      set(conversationsObject, conversationId, [status])
+      conversationsObject[conversationId] = [status]
     }
   }
   return result
@@ -523,7 +522,7 @@ export const mutations = {
   },
   addEmojiReactionsBy (state, { id, emojiReactions, currentUser }) {
     const status = state.allStatusesObject[id]
-    set(status, 'emoji_reactions', emojiReactions)
+    status['emoji_reactions'] = emojiReactions
   },
   addOwnReaction (state, { id, emoji, currentUser }) {
     const status = state.allStatusesObject[id]
@@ -542,9 +541,9 @@ export const mutations = {
 
     // Update count of existing reaction if it exists, otherwise append at the end
     if (reactionIndex >= 0) {
-      set(status.emoji_reactions, reactionIndex, newReaction)
+      status.emoji_reactions[reactionIndex] = newReaction
     } else {
-      set(status, 'emoji_reactions', [...status.emoji_reactions, newReaction])
+      status['emoji_reactions'] = [...status.emoji_reactions, newReaction]
     }
   },
   removeOwnReaction (state, { id, emoji, currentUser }) {
@@ -563,9 +562,9 @@ export const mutations = {
     }
 
     if (newReaction.count > 0) {
-      set(status.emoji_reactions, reactionIndex, newReaction)
+      status.emoji_reactions[reactionIndex] = newReaction
     } else {
-      set(status, 'emoji_reactions', status.emoji_reactions.filter(r => r.name !== emoji))
+      status['emoji_reactions'] = status.emoji_reactions.filter(r => r.name !== emoji)
     }
   },
   updateStatusWithPoll (state, { id, poll }) {
diff --git a/src/modules/users.js b/src/modules/users.js
index 8a764a16..3c7a49c6 100644
--- a/src/modules/users.js
+++ b/src/modules/users.js
@@ -1,7 +1,6 @@
 import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js'
 import oauthApi from '../services/new_api/oauth.js'
 import { compact, map, each, mergeWith, last, concat, uniq, isArray } from 'lodash'
-import { set } from 'vue'
 import { registerPushNotifications, unregisterPushNotifications } from '../services/push/push.js'
 
 // TODO: Unify with mergeOrAdd in statuses.js
@@ -15,9 +14,9 @@ export const mergeOrAdd = (arr, obj, item) => {
   } else {
     // This is a new item, prepare it
     arr.push(item)
-    set(obj, item.id, item)
+    obj[item.id] = item
     if (item.screen_name && !item.screen_name.includes('@')) {
-      set(obj, item.screen_name.toLowerCase(), item)
+      obj[item.screen_name.toLowerCase()] = item
     }
     return { item, new: true }
   }
@@ -103,23 +102,23 @@ export const mutations = {
     const user = state.usersObject[id]
     const tags = user.tags || []
     const newTags = tags.concat([tag])
-    set(user, 'tags', newTags)
+    user['tags'] = newTags
   },
   untagUser (state, { user: { id }, tag }) {
     const user = state.usersObject[id]
     const tags = user.tags || []
     const newTags = tags.filter(t => t !== tag)
-    set(user, 'tags', newTags)
+    user['tags'] = newTags
   },
   updateRight (state, { user: { id }, right, value }) {
     const user = state.usersObject[id]
     let newRights = user.rights
     newRights[right] = value
-    set(user, 'rights', newRights)
+    user['rights'] = newRights
   },
   updateActivationStatus (state, { user: { id }, deactivated }) {
     const user = state.usersObject[id]
-    set(user, 'deactivated', deactivated)
+    user['deactivated'] = deactivated
   },
   setCurrentUser (state, user) {
     state.lastLoginName = user.screen_name
@@ -148,26 +147,26 @@ export const mutations = {
   clearFriends (state, userId) {
     const user = state.usersObject[userId]
     if (user) {
-      set(user, 'friendIds', [])
+      user['friendIds'] = []
     }
   },
   clearFollowers (state, userId) {
     const user = state.usersObject[userId]
     if (user) {
-      set(user, 'followerIds', [])
+      user['followerIds'] = []
     }
   },
   addNewUsers (state, users) {
     each(users, (user) => {
       if (user.relationship) {
-        set(state.relationships, user.relationship.id, user.relationship)
+        state.relationships[user.relationship.id] = user.relationship
       }
       mergeOrAdd(state.users, state.usersObject, user)
     })
   },
   updateUserRelationship (state, relationships) {
     relationships.forEach((relationship) => {
-      set(state.relationships, relationship.id, relationship)
+      state.relationships[relationship.id] = relationship
     })
   },
   saveBlockIds (state, blockIds) {
@@ -222,7 +221,7 @@ export const mutations = {
   },
   setColor (state, { user: { id }, highlighted }) {
     const user = state.usersObject[id]
-    set(user, 'highlight', highlighted)
+    user['highlight'] = highlighted
   },
   signUpPending (state) {
     state.signUpPending = true

From 52835cf8bf180832c1f193fd95f1906404f8f798 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:25:04 +0300
Subject: [PATCH 011/113] work around modules cyclic dependencies

---
 src/main.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/main.js b/src/main.js
index b7232c2e..8ad7c181 100644
--- a/src/main.js
+++ b/src/main.js
@@ -66,8 +66,9 @@ const persistedStateOptions = {
       },
       interface: interfaceModule,
       instance: instanceModule,
-      statuses: statusesModule,
+      // TODO refactor users/statuses modules, they depend on each other
       users: usersModule,
+      statuses: statusesModule,
       api: apiModule,
       config: configModule,
       chat: chatModule,

From 9e8513b3129b4e7ae22906522418e04aa3db5235 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:25:42 +0300
Subject: [PATCH 012/113] i18n fixes

---
 src/components/notification/notification.vue           |  4 ++--
 src/components/poll/poll.vue                           |  4 ++--
 src/components/post_status_form/post_status_form.vue   |  6 +++---
 .../settings_modal/tabs/theme_tab/preview.vue          | 10 +++++-----
 4 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 0081dee4..cafa1e79 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -101,9 +101,9 @@
             </span>
             <span v-if="notification.type === 'pleroma:emoji_reaction'">
               <small>
-                <i18n path="notifications.reacted_with">
+                <i18n-t keypath="notifications.reacted_with">
                   <span class="emoji-reaction-emoji">{{ notification.emoji }}</span>
-                </i18n>
+                </i18n-t>
               </small>
             </span>
           </div>
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index 187d1829..2215d675 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -65,13 +65,13 @@
           {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}&nbsp;·&nbsp;
         </template>
       </div>
-      <i18n :path="expired ? 'polls.expired' : 'polls.expires_in'">
+      <i18n-t :keypath="expired ? 'polls.expired' : 'polls.expires_in'">
         <Timeago
           :time="expiresAt"
           :auto-update="60"
           :now-threshold="0"
         />
-      </i18n>
+      </i18n-t>
     </div>
   </div>
 </template>
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 6b490aee..c0a85727 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -18,9 +18,9 @@
         <FAIcon :icon="uploadFileLimitReached ? 'ban' : 'upload'" />
       </div>
       <div class="form-group">
-        <i18n
+        <i18n-t
           v-if="!$store.state.users.currentUser.locked && newStatus.visibility == 'private' && !disableLockWarning"
-          path="post_status.account_not_locked_warning"
+          keypath="post_status.account_not_locked_warning"
           tag="p"
           class="visibility-notice"
         >
@@ -30,7 +30,7 @@
           >
             {{ $t('post_status.account_not_locked_warning_link') }}
           </button>
-        </i18n>
+        </i18n-t>
         <p
           v-if="!hideScopeNotice && newStatus.visibility === 'public'"
           class="visibility-notice notice-dismissible"
diff --git a/src/components/settings_modal/tabs/theme_tab/preview.vue b/src/components/settings_modal/tabs/theme_tab/preview.vue
index 7ac7b9d3..36613d20 100644
--- a/src/components/settings_modal/tabs/theme_tab/preview.vue
+++ b/src/components/settings_modal/tabs/theme_tab/preview.vue
@@ -29,14 +29,14 @@
               {{ $t('settings.style.preview.content') }}
             </h4>
 
-            <i18n path="settings.style.preview.text">
+            <i18n-t keypath="settings.style.preview.text">
               <code style="font-family: var(--postCodeFont)">
                 {{ $t('settings.style.preview.mono') }}
               </code>
               <a style="color: var(--link)">
                 {{ $t('settings.style.preview.link') }}
               </a>
-            </i18n>
+            </i18n-t>
 
             <div class="icons">
               <FAIcon
@@ -72,15 +72,15 @@
             :^)
           </div>
           <div class="content">
-            <i18n
-              path="settings.style.preview.fine_print"
+            <i18n-t
+              keypath="settings.style.preview.fine_print"
               tag="span"
               class="faint"
             >
               <a style="color: var(--faintLink)">
                 {{ $t('settings.style.preview.faint_link') }}
               </a>
-            </i18n>
+            </i18n-t>
           </div>
         </div>
         <div class="separator" />

From b479d80366161768529655385165021fc368d155 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:30:18 +0300
Subject: [PATCH 013/113] fix i18n in services

---
 src/main.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/main.js b/src/main.js
index 8ad7c181..1e35df12 100644
--- a/src/main.js
+++ b/src/main.js
@@ -61,7 +61,7 @@ const persistedStateOptions = {
     modules: {
       i18n: {
         getters: {
-          i18n: () => i18n
+          i18n: () => i18n.global
         }
       },
       interface: interfaceModule,

From 4b18e0f36e260f0571bc3d11ca4061d653e145ee Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:33:02 +0300
Subject: [PATCH 014/113] fix status error

---
 src/components/status/status.js  | 2 +-
 src/components/status/status.vue | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index 470c01f1..0befc72e 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -308,7 +308,7 @@ const Status = {
   watch: {
     'highlight': function (id) {
       if (this.status.id === id) {
-        let rect = this.$el.getBoundingClientRect()
+        let rect = this.$refs.root.getBoundingClientRect()
         if (rect.top < 100) {
           // Post is above screen, match its top to screen top
           window.scrollBy(0, rect.top - 100)
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 00e962f3..60ab4601 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -2,6 +2,7 @@
   <!-- eslint-disable vue/no-v-html -->
   <div
     v-if="!hideStatus"
+    ref="root"
     class="Status"
     :class="[{ '-focused': isFocused }, { '-conversation': inlineExpanded }]"
   >

From 72956e23436b5fb352652b25707a51be3a823b3d Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:40:08 +0300
Subject: [PATCH 015/113] fix HOCs

---
 src/hocs/with_load_more/with_load_more.jsx       | 4 +++-
 src/hocs/with_subscription/with_subscription.jsx | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/hocs/with_load_more/with_load_more.jsx b/src/hocs/with_load_more/with_load_more.jsx
index 7f491558..6cd198ed 100644
--- a/src/hocs/with_load_more/with_load_more.jsx
+++ b/src/hocs/with_load_more/with_load_more.jsx
@@ -1,3 +1,5 @@
+// eslint-disable-next-line no-unused
+import { h } from 'vue'
 import isEmpty from 'lodash/isEmpty'
 import { getComponentProps } from '../../services/component_utils/component_utils'
 import './with_load_more.scss'
@@ -78,7 +80,7 @@ const withLoadMore = ({
         }
       }
     },
-    render (h) {
+    render () {
       const props = {
         props: {
           ...this.$props,
diff --git a/src/hocs/with_subscription/with_subscription.jsx b/src/hocs/with_subscription/with_subscription.jsx
index 7e590f73..4529399e 100644
--- a/src/hocs/with_subscription/with_subscription.jsx
+++ b/src/hocs/with_subscription/with_subscription.jsx
@@ -1,3 +1,5 @@
+// eslint-disable-next-line no-unused
+import { h } from 'vue'
 import isEmpty from 'lodash/isEmpty'
 import { getComponentProps } from '../../services/component_utils/component_utils'
 import './with_subscription.scss'
@@ -58,7 +60,7 @@ const withSubscription = ({
         }
       }
     },
-    render (h) {
+    render () {
       if (!this.error && !this.loading) {
         const props = {
           props: {

From caed89f0ae64217602a2832bbf2b5df9b66c0999 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:44:50 +0300
Subject: [PATCH 016/113] destroyed -> unmounted

---
 src/components/bookmark_timeline/bookmark_timeline.js           | 2 +-
 src/components/chat/chat.js                                     | 2 +-
 src/components/media_modal/media_modal.js                       | 2 +-
 .../mobile_post_status_button/mobile_post_status_button.js      | 2 +-
 src/components/poll/poll.js                                     | 2 +-
 src/components/popover/popover.js                               | 2 +-
 .../public_and_external_timeline.js                             | 2 +-
 src/components/public_timeline/public_timeline.js               | 2 +-
 src/components/tag_timeline/tag_timeline.js                     | 2 +-
 src/components/timeago/timeago.vue                              | 2 +-
 src/components/timeline/timeline.js                             | 2 +-
 src/components/user_profile/user_profile.js                     | 2 +-
 12 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/bookmark_timeline/bookmark_timeline.js b/src/components/bookmark_timeline/bookmark_timeline.js
index 64b69e5d..5ac43d90 100644
--- a/src/components/bookmark_timeline/bookmark_timeline.js
+++ b/src/components/bookmark_timeline/bookmark_timeline.js
@@ -9,7 +9,7 @@ const Bookmarks = {
   components: {
     Timeline
   },
-  destroyed () {
+  unmounted () {
     this.$store.commit('clearTimeline', { timeline: 'bookmarks' })
   }
 }
diff --git a/src/components/chat/chat.js b/src/components/chat/chat.js
index b54f5fb2..aef11712 100644
--- a/src/components/chat/chat.js
+++ b/src/components/chat/chat.js
@@ -57,7 +57,7 @@ const Chat = {
     })
     this.setChatLayout()
   },
-  destroyed () {
+  unmounted () {
     window.removeEventListener('scroll', this.handleScroll)
     window.removeEventListener('resize', this.handleLayoutChange)
     this.unsetChatLayout()
diff --git a/src/components/media_modal/media_modal.js b/src/components/media_modal/media_modal.js
index e7384c93..38d66160 100644
--- a/src/components/media_modal/media_modal.js
+++ b/src/components/media_modal/media_modal.js
@@ -98,7 +98,7 @@ const MediaModal = {
     document.addEventListener('keyup', this.handleKeyupEvent)
     document.addEventListener('keydown', this.handleKeydownEvent)
   },
-  destroyed () {
+  unmounted () {
     window.removeEventListener('popstate', this.hide)
     document.removeEventListener('keyup', this.handleKeyupEvent)
     document.removeEventListener('keydown', this.handleKeydownEvent)
diff --git a/src/components/mobile_post_status_button/mobile_post_status_button.js b/src/components/mobile_post_status_button/mobile_post_status_button.js
index 366ea89c..293b85fd 100644
--- a/src/components/mobile_post_status_button/mobile_post_status_button.js
+++ b/src/components/mobile_post_status_button/mobile_post_status_button.js
@@ -29,7 +29,7 @@ const MobilePostStatusButton = {
     }
     window.addEventListener('resize', this.handleOSK)
   },
-  destroyed () {
+  unmounted () {
     if (this.autohideFloatingPostButton) {
       this.deactivateFloatingPostButtonAutohide()
     }
diff --git a/src/components/poll/poll.js b/src/components/poll/poll.js
index 98db5582..4611a95c 100644
--- a/src/components/poll/poll.js
+++ b/src/components/poll/poll.js
@@ -17,7 +17,7 @@ export default {
     }
     this.$store.dispatch('trackPoll', this.pollId)
   },
-  destroyed () {
+  unmounted () {
     this.$store.dispatch('untrackPoll', this.pollId)
   },
   computed: {
diff --git a/src/components/popover/popover.js b/src/components/popover/popover.js
index bc6cd8e7..849846f5 100644
--- a/src/components/popover/popover.js
+++ b/src/components/popover/popover.js
@@ -178,7 +178,7 @@ const Popover = {
   created () {
     document.addEventListener('click', this.onClickOutside)
   },
-  destroyed () {
+  unmounted () {
     document.removeEventListener('click', this.onClickOutside)
     this.hidePopover()
   }
diff --git a/src/components/public_and_external_timeline/public_and_external_timeline.js b/src/components/public_and_external_timeline/public_and_external_timeline.js
index cbd4491b..bfcce6ae 100644
--- a/src/components/public_and_external_timeline/public_and_external_timeline.js
+++ b/src/components/public_and_external_timeline/public_and_external_timeline.js
@@ -9,7 +9,7 @@ const PublicAndExternalTimeline = {
   created () {
     this.$store.dispatch('startFetchingTimeline', { timeline: 'publicAndExternal' })
   },
-  destroyed () {
+  unmounted () {
     this.$store.dispatch('stopFetchingTimeline', 'publicAndExternal')
   }
 }
diff --git a/src/components/public_timeline/public_timeline.js b/src/components/public_timeline/public_timeline.js
index 66c40d3a..30693544 100644
--- a/src/components/public_timeline/public_timeline.js
+++ b/src/components/public_timeline/public_timeline.js
@@ -9,7 +9,7 @@ const PublicTimeline = {
   created () {
     this.$store.dispatch('startFetchingTimeline', { timeline: 'public' })
   },
-  destroyed () {
+  unmounted () {
     this.$store.dispatch('stopFetchingTimeline', 'public')
   }
 
diff --git a/src/components/tag_timeline/tag_timeline.js b/src/components/tag_timeline/tag_timeline.js
index 400c6a4b..bda61ae0 100644
--- a/src/components/tag_timeline/tag_timeline.js
+++ b/src/components/tag_timeline/tag_timeline.js
@@ -18,7 +18,7 @@ const TagTimeline = {
       this.$store.dispatch('startFetchingTimeline', { timeline: 'tag', tag: this.tag })
     }
   },
-  destroyed () {
+  unmounted () {
     this.$store.dispatch('stopFetchingTimeline', 'tag')
   }
 }
diff --git a/src/components/timeago/timeago.vue b/src/components/timeago/timeago.vue
index 55a2dd94..bed29020 100644
--- a/src/components/timeago/timeago.vue
+++ b/src/components/timeago/timeago.vue
@@ -31,7 +31,7 @@ export default {
   created () {
     this.refreshRelativeTimeObject()
   },
-  destroyed () {
+  unmounted () {
     clearTimeout(this.interval)
   },
   methods: {
diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index 44f749c3..b5a45926 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -122,7 +122,7 @@ const Timeline = {
     window.addEventListener('keydown', this.handleShortKey)
     setTimeout(this.determineVisibleStatuses, 250)
   },
-  destroyed () {
+  unmounted () {
     window.removeEventListener('scroll', this.handleScroll)
     window.removeEventListener('keydown', this.handleShortKey)
     if (typeof document.hidden !== 'undefined') document.removeEventListener('visibilitychange', this.handleVisibilityChange, false)
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index c5ccf747..8aa67765 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -46,7 +46,7 @@ const UserProfile = {
     this.load(routeParams.name || routeParams.id)
     this.tab = get(this.$route, 'query.tab', defaultTabKey)
   },
-  destroyed () {
+  unmounted () {
     this.stopFetching()
   },
   computed: {

From 709b75198d4e7051c7e1d310379bfeddad5c411f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:45:47 +0300
Subject: [PATCH 017/113] fix portals/teleports

---
 src/App.vue                                          | 2 +-
 src/components/moderation_tools/moderation_tools.vue | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 1a166778..702b69d1 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -58,7 +58,7 @@
     <UserReportingModal />
     <PostStatusModal />
     <SettingsModal />
-    <portal-target name="modal" />
+    <div id="modal"/>
     <GlobalNoticeList />
   </div>
 </template>
diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue
index c4c6ee46..bd7e6448 100644
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@@ -131,7 +131,7 @@
         <FAIcon icon="chevron-down" />
       </button>
     </Popover>
-    <portal to="modal">
+    <teleport to="#modal">
       <DialogModal
         v-if="showDeleteUserDialog"
         :on-cancel="deleteUserDialog.bind(this, false)"
@@ -155,7 +155,7 @@
           </button>
         </template>
       </DialogModal>
-    </portal>
+    </teleport>
   </div>
 </template>
 

From 95e74319e11e673ce0a6a53546eae98a0b9c3eb5 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 13:48:23 +0300
Subject: [PATCH 018/113] clean warnings from status

---
 src/components/status/status.js                 | 8 ++------
 src/components/status/status.vue                | 2 +-
 src/components/status_content/status_content.js | 3 ++-
 3 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index 0befc72e..906413ae 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -83,7 +83,8 @@ const Status = {
     'inlineExpanded',
     'showPinned',
     'inProfile',
-    'profileUserId'
+    'profileUserId',
+    'virtualHidden'
   ],
   data () {
     return {
@@ -336,11 +337,6 @@ const Status = {
     'isSuspendable': function (val) {
       this.suspendable = val
     }
-  },
-  filters: {
-    capitalize: function (str) {
-      return str.charAt(0).toUpperCase() + str.slice(1)
-    }
   }
 }
 
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 60ab4601..6e3ce0ff 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -182,7 +182,7 @@
                 <span
                   v-if="status.visibility"
                   class="visibility-icon"
-                  :title="status.visibility | capitalize"
+                  :title="status.visibility"
                 >
                   <FAIcon
                     fixed-width
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index a6f79d76..a755518c 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -33,7 +33,8 @@ const StatusContent = {
     'focused',
     'noHeading',
     'fullContent',
-    'singleLine'
+    'singleLine',
+    'compact'
   ],
   data () {
     return {

From 8d46fd78c7ada7600afe7b74932a6f2380964592 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 7 Apr 2021 22:42:34 +0300
Subject: [PATCH 019/113] migrate to v-slot

---
 .../account_actions/account_actions.vue       |  25 ++--
 src/components/chat_list/chat_list.vue        |   5 +-
 src/components/chat_message/chat_message.vue  |  32 ++---
 .../domain_mute_card/domain_mute_card.vue     |   4 +-
 .../extra_buttons/extra_buttons.vue           |  24 ++--
 .../moderation_tools/moderation_tools.vue     |  25 ++--
 .../notifications/notification_filters.vue    |   8 +-
 src/components/popover/popover.js             |   2 +-
 src/components/react_button/react_button.vue  |  28 +++--
 .../selectable_list/selectable_list.vue       |   7 +-
 .../helpers/modified_indicator.vue            |  16 +--
 .../settings_modal/settings_modal.vue         |  28 +++--
 .../tabs/mutes_and_blocks_tab.vue             |  73 +++++-------
 .../status_popover/status_popover.vue         |   8 +-
 .../timeline/timeline_quick_settings.vue      | 109 +++++++++---------
 .../timeline_menu/timeline_menu.vue           |  43 +++----
 src/components/user_card/user_card.vue        |   6 +-
 .../user_list_popover/user_list_popover.vue   |  59 +++++-----
 src/components/user_profile/user_profile.vue  |  10 +-
 .../user_reporting_modal.vue                  |   5 +-
 20 files changed, 238 insertions(+), 279 deletions(-)

diff --git a/src/components/account_actions/account_actions.vue b/src/components/account_actions/account_actions.vue
index ab5d1d29..1e31151c 100644
--- a/src/components/account_actions/account_actions.vue
+++ b/src/components/account_actions/account_actions.vue
@@ -6,10 +6,7 @@
       :bound-to="{ x: 'container' }"
       remove-padding
     >
-      <div
-        slot="content"
-        class="account-tools-popover"
-      >
+      <template v-slot:content>
         <div class="dropdown-menu">
           <template v-if="relationship.following">
             <button
@@ -59,16 +56,15 @@
             {{ $t('user_card.message') }}
           </button>
         </div>
-      </div>
-      <div
-        slot="trigger"
-        class="ellipsis-button"
-      >
-        <FAIcon
-          class="icon"
-          icon="ellipsis-v"
-        />
-      </div>
+      </template>
+      <template v-slot:trigger>
+        <button class="button-unstyled ellipsis-button">
+          <FAIcon
+            class="icon"
+            icon="ellipsis-v"
+          />
+        </button>
+      </template>
     </Popover>
   </div>
 </template>
@@ -83,7 +79,6 @@
   }
 
   .ellipsis-button {
-    cursor: pointer;
     width: 2.5em;
     margin: -0.5em 0;
     padding: 0.5em 0;
diff --git a/src/components/chat_list/chat_list.vue b/src/components/chat_list/chat_list.vue
index e23eec13..f98b7ed2 100644
--- a/src/components/chat_list/chat_list.vue
+++ b/src/components/chat_list/chat_list.vue
@@ -23,10 +23,7 @@
         class="timeline"
       >
         <List :items="sortedChatList">
-          <template
-            slot="item"
-            slot-scope="{item}"
-          >
+          <template v-slot:item="{item}">
             <ChatListItem
               :key="item.id"
               :compact="false"
diff --git a/src/components/chat_message/chat_message.vue b/src/components/chat_message/chat_message.vue
index 0777f880..0f3fc97d 100644
--- a/src/components/chat_message/chat_message.vue
+++ b/src/components/chat_message/chat_message.vue
@@ -50,7 +50,7 @@
                 @show="menuOpened = true"
                 @close="menuOpened = false"
               >
-                <div slot="content">
+                <template v-slot:content>
                   <div class="dropdown-menu">
                     <button
                       class="button-default dropdown-item dropdown-item-icon"
@@ -59,26 +59,28 @@
                       <FAIcon icon="times" /> {{ $t("chats.delete") }}
                     </button>
                   </div>
-                </div>
-                <button
-                  slot="trigger"
-                  class="button-default menu-icon"
-                  :title="$t('chats.more')"
-                >
-                  <FAIcon icon="ellipsis-h" />
-                </button>
+                </template>
+                <template v-slot:trigger>
+                  <button
+                    class="button-default menu-icon"
+                    :title="$t('chats.more')"
+                  >
+                    <FAIcon icon="ellipsis-h" />
+                  </button>
+                </template>
               </Popover>
             </div>
             <StatusContent
               :status="messageForStatusContent"
               :full-content="true"
             >
-              <span
-                slot="footer"
-                class="created-at"
-              >
-                {{ createdAt }}
-              </span>
+              <template v-slot:footer>
+                <span
+                  class="created-at"
+                >
+                  {{ createdAt }}
+                </span>
+              </template>
             </StatusContent>
           </div>
         </div>
diff --git a/src/components/domain_mute_card/domain_mute_card.vue b/src/components/domain_mute_card/domain_mute_card.vue
index 3b5aec14..836688aa 100644
--- a/src/components/domain_mute_card/domain_mute_card.vue
+++ b/src/components/domain_mute_card/domain_mute_card.vue
@@ -9,7 +9,7 @@
       class="btn button-default"
     >
       {{ $t('domain_mute_card.unmute') }}
-      <template slot="progress">
+      <template v-slot:progress>
         {{ $t('domain_mute_card.unmute_progress') }}
       </template>
     </ProgressButton>
@@ -19,7 +19,7 @@
       class="btn button-default"
     >
       {{ $t('domain_mute_card.mute') }}
-      <template slot="progress">
+      <template v-slot:progress>
         {{ $t('domain_mute_card.mute_progress') }}
       </template>
     </ProgressButton>
diff --git a/src/components/extra_buttons/extra_buttons.vue b/src/components/extra_buttons/extra_buttons.vue
index c6cb9fbe..a3c3c767 100644
--- a/src/components/extra_buttons/extra_buttons.vue
+++ b/src/components/extra_buttons/extra_buttons.vue
@@ -7,10 +7,7 @@
     :bound-to="{ x: 'container' }"
     remove-padding
   >
-    <div
-      slot="content"
-      slot-scope="{close}"
-    >
+    <template v-slot:content="{close}">
       <div class="dropdown-menu">
         <button
           v-if="canMute && !status.thread_muted"
@@ -120,16 +117,15 @@
           /><span>{{ $t("user_card.report") }}</span>
         </button>
       </div>
-    </div>
-    <span
-      slot="trigger"
-      class="popover-trigger"
-    >
-      <FAIcon
-        class="fa-scale-110 fa-old-padding"
-        icon="ellipsis-h"
-      />
-    </span>
+    </template>
+    <template v-slot:trigger>
+      <button class="button-unstyled popover-trigger">
+        <FAIcon
+          class="fa-scale-110 fa-old-padding"
+          icon="ellipsis-h"
+        />
+      </button>
+    </template>
   </Popover>
 </template>
 
diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue
index bd7e6448..96b8c3a3 100644
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@@ -8,7 +8,7 @@
       @show="setToggled(true)"
       @close="setToggled(false)"
     >
-      <div slot="content">
+      <template v-slot:content>
         <div class="dropdown-menu">
           <span v-if="user.is_local">
             <button
@@ -121,26 +121,27 @@
             </button>
           </span>
         </div>
-      </div>
-      <button
-        slot="trigger"
-        class="btn button-default btn-block moderation-tools-button"
-        :class="{ toggled }"
-      >
-        {{ $t('user_card.admin_menu.moderation') }}
-        <FAIcon icon="chevron-down" />
-      </button>
+      </template>
+      <template v-slot:trigger>
+        <button
+          class="btn button-default btn-block moderation-tools-button"
+          :class="{ toggled }"
+        >
+          {{ $t('user_card.admin_menu.moderation') }}
+          <FAIcon icon="chevron-down" />
+        </button>
+      </template>
     </Popover>
     <teleport to="#modal">
       <DialogModal
         v-if="showDeleteUserDialog"
         :on-cancel="deleteUserDialog.bind(this, false)"
       >
-        <template slot="header">
+        <template v-slot:header>
           {{ $t('user_card.admin_menu.delete_user') }}
         </template>
         <p>{{ $t('user_card.admin_menu.delete_user_confirmation') }}</p>
-        <template slot="footer">
+        <template v-slot:footer>
           <button
             class="btn button-default"
             @click="deleteUserDialog(false)"
diff --git a/src/components/notifications/notification_filters.vue b/src/components/notifications/notification_filters.vue
index e86a0fcc..ba0e90a0 100644
--- a/src/components/notifications/notification_filters.vue
+++ b/src/components/notifications/notification_filters.vue
@@ -5,9 +5,7 @@
     placement="bottom"
     :bound-to="{ x: 'container' }"
   >
-    <template
-      v-slot:content
-    >
+    <template v-slot:content>
       <div class="dropdown-menu">
         <button
           class="button-default dropdown-item"
@@ -66,7 +64,9 @@
       </div>
     </template>
     <template v-slot:trigger>
-      <FAIcon icon="filter" />
+      <button class="button-unstyled">
+        <FAIcon icon="filter" />
+      </button>
     </template>
   </Popover>
 </template>
diff --git a/src/components/popover/popover.js b/src/components/popover/popover.js
index 849846f5..a30a37c9 100644
--- a/src/components/popover/popover.js
+++ b/src/components/popover/popover.js
@@ -54,7 +54,7 @@ const Popover = {
       }
 
       // Popover will be anchored around this element, trigger ref is the container, so
-      // its children are what are inside the slot. Expect only one slot="trigger".
+      // its children are what are inside the slot. Expect only one v-slot:trigger.
       const anchorEl = (this.$refs.trigger && this.$refs.trigger.children[0]) || this.$el
       // SVGs don't have offsetWidth/Height, use fallback
       const anchorWidth = anchorEl.offsetWidth || anchorEl.clientWidth
diff --git a/src/components/react_button/react_button.vue b/src/components/react_button/react_button.vue
index 4839024c..c69c315b 100644
--- a/src/components/react_button/react_button.vue
+++ b/src/components/react_button/react_button.vue
@@ -8,10 +8,7 @@
     remove-padding
     @show="focusInput"
   >
-    <div
-      slot="content"
-      slot-scope="{close}"
-    >
+    <template v-slot:content="{close}">
       <div class="reaction-picker-filter">
         <input
           v-model="filterWord"
@@ -41,17 +38,18 @@
         </span>
         <div class="reaction-bottom-fader" />
       </div>
-    </div>
-    <span
-      slot="trigger"
-      class="popover-trigger"
-      :title="$t('tool_tip.add_reaction')"
-    >
-      <FAIcon
-        class="fa-scale-110 fa-old-padding"
-        :icon="['far', 'smile-beam']"
-      />
-    </span>
+    </template>
+    <template v-slot:trigger>
+      <button
+        class="button-unstyled popover-trigger"
+        :title="$t('tool_tip.add_reaction')"
+      >
+        <FAIcon
+          class="fa-scale-110 fa-old-padding"
+          :icon="['far', 'smile-beam']"
+        />
+      </button>
+    </template>
   </Popover>
 </template>
 
diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue
index a9bb12a1..3f885881 100644
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@@ -24,10 +24,7 @@
       :items="items"
       :get-key="getKey"
     >
-      <template
-        slot="item"
-        slot-scope="{item}"
-      >
+      <template v-slot:item="{item}">
         <div
           class="selectable-list-item-inner"
           :class="{ 'selectable-list-item-selected-inner': isSelected(item) }"
@@ -44,7 +41,7 @@
           />
         </div>
       </template>
-      <template slot="empty">
+      <template v-slot:empty>
         <slot name="empty" />
       </template>
     </List>
diff --git a/src/components/settings_modal/helpers/modified_indicator.vue b/src/components/settings_modal/helpers/modified_indicator.vue
index 9f4e81fe..ad212db9 100644
--- a/src/components/settings_modal/helpers/modified_indicator.vue
+++ b/src/components/settings_modal/helpers/modified_indicator.vue
@@ -6,18 +6,18 @@
     <Popover
       trigger="hover"
     >
-      <span slot="trigger">
+      <template v-slot:trigger>
         &nbsp;
         <FAIcon
           icon="wrench"
+          :aria-label="$t('settings.setting_changed')"
         />
-      </span>
-      <div
-        slot="content"
-        class="modified-tooltip"
-      >
-        {{ $t('settings.setting_changed') }}
-      </div>
+      </template>
+      <template v-slot:content>
+        <div class="modified-tooltip">
+          {{ $t('settings.setting_changed') }}
+        </div>
+      </template>
     </Popover>
   </span>
 </template>
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 12519925..0c261474 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -64,20 +64,18 @@
           :bound-to="{ x: 'container' }"
           remove-padding
         >
-          <button
-            slot="trigger"
-            class="btn button-default"
-            :title="$t('general.close')"
-          >
-            <span>{{ $t("settings.file_export_import.backup_restore") }}</span>
-            <FAIcon
-              icon="chevron-down"
-            />
-          </button>
-          <div
-            slot="content"
-            slot-scope="{close}"
-          >
+          <template v-slot:trigger>
+            <button
+              class="btn button-default"
+              :title="$t('general.close')"
+            >
+              <span>{{ $t("settings.file_export_import.backup_restore") }}</span>
+              <FAIcon
+                icon="chevron-down"
+              />
+            </button>
+          </template>
+          <template v-slot:content ="{close}">
             <div class="dropdown-menu">
               <button
                 class="button-default dropdown-item dropdown-item-icon"
@@ -110,7 +108,7 @@
                 /><span>{{ $t("settings.file_export_import.restore_settings") }}</span>
               </button>
             </div>
-          </div>
+          </template>
         </Popover>
       </div>
     </div>
diff --git a/src/components/settings_modal/tabs/mutes_and_blocks_tab.vue b/src/components/settings_modal/tabs/mutes_and_blocks_tab.vue
index 63d36bf9..32a21415 100644
--- a/src/components/settings_modal/tabs/mutes_and_blocks_tab.vue
+++ b/src/components/settings_modal/tabs/mutes_and_blocks_tab.vue
@@ -10,20 +10,18 @@
           :query="queryUserIds"
           :placeholder="$t('settings.search_user_to_block')"
         >
-          <BlockCard
-            slot-scope="row"
-            :user-id="row.item"
-          />
+          <template v-slot="row">
+            <BlockCard
+              :user-id="row.item"
+            />
+          </template>
         </Autosuggest>
       </div>
       <BlockList
         :refresh="true"
         :get-key="i => i"
       >
-        <template
-          slot="header"
-          slot-scope="{selected}"
-        >
+        <template v-slot:header="{selected}">
           <div class="bulk-actions">
             <ProgressButton
               v-if="selected.length > 0"
@@ -31,7 +29,7 @@
               :click="() => blockUsers(selected)"
             >
               {{ $t('user_card.block') }}
-              <template slot="progress">
+              <template v-slot:progress>
                 {{ $t('user_card.block_progress') }}
               </template>
             </ProgressButton>
@@ -41,19 +39,16 @@
               :click="() => unblockUsers(selected)"
             >
               {{ $t('user_card.unblock') }}
-              <template slot="progress">
+              <template v-slot:progress>
                 {{ $t('user_card.unblock_progress') }}
               </template>
             </ProgressButton>
           </div>
         </template>
-        <template
-          slot="item"
-          slot-scope="{item}"
-        >
+        <template v-slot:item="{item}">
           <BlockCard :user-id="item" />
         </template>
-        <template slot="empty">
+        <template v-slot:empty>
           {{ $t('settings.no_blocks') }}
         </template>
       </BlockList>
@@ -68,20 +63,18 @@
               :query="queryUserIds"
               :placeholder="$t('settings.search_user_to_mute')"
             >
-              <MuteCard
-                slot-scope="row"
-                :user-id="row.item"
-              />
+              <template v-slot="row">
+                <MuteCard
+                  :user-id="row.item"
+                />
+              </template>
             </Autosuggest>
           </div>
           <MuteList
             :refresh="true"
             :get-key="i => i"
           >
-            <template
-              slot="header"
-              slot-scope="{selected}"
-            >
+            <template v-slot:header="{selected}">
               <div class="bulk-actions">
                 <ProgressButton
                   v-if="selected.length > 0"
@@ -89,7 +82,7 @@
                   :click="() => muteUsers(selected)"
                 >
                   {{ $t('user_card.mute') }}
-                  <template slot="progress">
+                  <template v-slot:progress>
                     {{ $t('user_card.mute_progress') }}
                   </template>
                 </ProgressButton>
@@ -99,19 +92,16 @@
                   :click="() => unmuteUsers(selected)"
                 >
                   {{ $t('user_card.unmute') }}
-                  <template slot="progress">
+                  <template v-slot:progress>
                     {{ $t('user_card.unmute_progress') }}
                   </template>
                 </ProgressButton>
               </div>
             </template>
-            <template
-              slot="item"
-              slot-scope="{item}"
-            >
+            <template v-slot:item="{item}">
               <MuteCard :user-id="item" />
             </template>
-            <template slot="empty">
+            <template v-slot:empty>
               {{ $t('settings.no_mutes') }}
             </template>
           </MuteList>
@@ -124,20 +114,18 @@
               :query="queryKnownDomains"
               :placeholder="$t('settings.type_domains_to_mute')"
             >
-              <DomainMuteCard
-                slot-scope="row"
-                :domain="row.item"
-              />
+              <template v-slot="row">
+                <DomainMuteCard
+                  :domain="row.item"
+                />
+              </template>
             </Autosuggest>
           </div>
           <DomainMuteList
             :refresh="true"
             :get-key="i => i"
           >
-            <template
-              slot="header"
-              slot-scope="{selected}"
-            >
+            <template v-slot:header="{selected}">
               <div class="bulk-actions">
                 <ProgressButton
                   v-if="selected.length > 0"
@@ -145,19 +133,16 @@
                   :click="() => unmuteDomains(selected)"
                 >
                   {{ $t('domain_mute_card.unmute') }}
-                  <template slot="progress">
+                  <template v-slot:progress>
                     {{ $t('domain_mute_card.unmute_progress') }}
                   </template>
                 </ProgressButton>
               </div>
             </template>
-            <template
-              slot="item"
-              slot-scope="{item}"
-            >
+            <template v-slot:item="{item}">
               <DomainMuteCard :domain="item" />
             </template>
-            <template slot="empty">
+            <template v-slot:empty>
               {{ $t('settings.no_mutes') }}
             </template>
           </DomainMuteList>
diff --git a/src/components/status_popover/status_popover.vue b/src/components/status_popover/status_popover.vue
index 8237ce00..fdca8c9c 100644
--- a/src/components/status_popover/status_popover.vue
+++ b/src/components/status_popover/status_popover.vue
@@ -5,12 +5,10 @@
     :bound-to="{ x: 'container' }"
     @show="enter"
   >
-    <template slot="trigger">
+    <template v-slot:trigger>
       <slot />
     </template>
-    <div
-      slot="content"
-    >
+    <template v-slot:content>
       <Status
         v-if="status"
         :is-preview="true"
@@ -33,7 +31,7 @@
           size="2x"
         />
       </div>
-    </div>
+    </template>
   </Popover>
 </template>
 
diff --git a/src/components/timeline/timeline_quick_settings.vue b/src/components/timeline/timeline_quick_settings.vue
index 94997c0d..98996ebd 100644
--- a/src/components/timeline/timeline_quick_settings.vue
+++ b/src/components/timeline/timeline_quick_settings.vue
@@ -4,77 +4,78 @@
     class="TimelineQuickSettings"
     :bound-to="{ x: 'container' }"
   >
-    <div
-      slot="content"
-      class="dropdown-menu"
-    >
-      <div v-if="loggedIn">
+    <template v-slot:content>
+      <div class="dropdown-menu">
+        <div v-if="loggedIn">
+          <button
+            class="button-default dropdown-item"
+            @click="replyVisibilityAll = true"
+          >
+            <span
+              class="menu-checkbox"
+              :class="{ 'menu-checkbox-radio': replyVisibilityAll }"
+            />{{ $t('settings.reply_visibility_all') }}
+          </button>
+          <button
+            class="button-default dropdown-item"
+            @click="replyVisibilityFollowing = true"
+          >
+            <span
+              class="menu-checkbox"
+              :class="{ 'menu-checkbox-radio': replyVisibilityFollowing }"
+            />{{ $t('settings.reply_visibility_following_short') }}
+          </button>
+          <button
+            class="button-default dropdown-item"
+            @click="replyVisibilitySelf = true"
+          >
+            <span
+              class="menu-checkbox"
+              :class="{ 'menu-checkbox-radio': replyVisibilitySelf }"
+            />{{ $t('settings.reply_visibility_self_short') }}
+          </button>
+          <div
+            role="separator"
+            class="dropdown-divider"
+          />
+        </div>
         <button
           class="button-default dropdown-item"
-          @click="replyVisibilityAll = true"
+          @click="hideMedia = !hideMedia"
         >
           <span
             class="menu-checkbox"
-            :class="{ 'menu-checkbox-radio': replyVisibilityAll }"
-          />{{ $t('settings.reply_visibility_all') }}
+            :class="{ 'menu-checkbox-checked': hideMedia }"
+          />{{ $t('settings.hide_media_previews') }}
         </button>
         <button
           class="button-default dropdown-item"
-          @click="replyVisibilityFollowing = true"
+          @click="hideMutedPosts = !hideMutedPosts"
         >
           <span
             class="menu-checkbox"
-            :class="{ 'menu-checkbox-radio': replyVisibilityFollowing }"
-          />{{ $t('settings.reply_visibility_following_short') }}
+            :class="{ 'menu-checkbox-checked': hideMutedPosts }"
+          />{{ $t('settings.hide_all_muted_posts') }}
         </button>
         <button
-          class="button-default dropdown-item"
-          @click="replyVisibilitySelf = true"
+          class="button-default dropdown-item dropdown-item-icon"
+          @click="openTab('filtering')"
         >
-          <span
-            class="menu-checkbox"
-            :class="{ 'menu-checkbox-radio': replyVisibilitySelf }"
-          />{{ $t('settings.reply_visibility_self_short') }}
+          <FAIcon icon="font" />{{ $t('settings.word_filter') }}
+        </button>
+        <button
+          class="button-default dropdown-item dropdown-item-icon"
+          @click="openTab('general')"
+        >
+          <FAIcon icon="wrench" />{{ $t('settings.more_settings') }}
         </button>
-        <div
-          role="separator"
-          class="dropdown-divider"
-        />
       </div>
-      <button
-        class="button-default dropdown-item"
-        @click="hideMedia = !hideMedia"
-      >
-        <span
-          class="menu-checkbox"
-          :class="{ 'menu-checkbox-checked': hideMedia }"
-        />{{ $t('settings.hide_media_previews') }}
+    </template>
+    <template v-slot:trigger>
+      <button class="button-unstyled">
+        <FAIcon icon="filter" />
       </button>
-      <button
-        class="button-default dropdown-item"
-        @click="hideMutedPosts = !hideMutedPosts"
-      >
-        <span
-          class="menu-checkbox"
-          :class="{ 'menu-checkbox-checked': hideMutedPosts }"
-        />{{ $t('settings.hide_all_muted_posts') }}
-      </button>
-      <button
-        class="button-default dropdown-item dropdown-item-icon"
-        @click="openTab('filtering')"
-      >
-        <FAIcon icon="font" />{{ $t('settings.word_filter') }}
-      </button>
-      <button
-        class="button-default dropdown-item dropdown-item-icon"
-        @click="openTab('general')"
-      >
-        <FAIcon icon="wrench" />{{ $t('settings.more_settings') }}
-      </button>
-    </div>
-    <div slot="trigger">
-      <FAIcon icon="filter" />
-    </div>
+    </template>
   </Popover>
 </template>
 
diff --git a/src/components/timeline_menu/timeline_menu.vue b/src/components/timeline_menu/timeline_menu.vue
index 22dc3432..4f6681b8 100644
--- a/src/components/timeline_menu/timeline_menu.vue
+++ b/src/components/timeline_menu/timeline_menu.vue
@@ -9,28 +9,29 @@
     @show="openMenu"
     @close="() => isOpen = false"
   >
-    <div
-      slot="content"
-      class="timeline-menu-popover panel panel-default"
-    >
-      <TimelineMenuContent />
-    </div>
-    <div
-      slot="trigger"
-      class="title timeline-menu-title"
-    >
-      <span class="timeline-title">{{ timelineName() }}</span>
-      <span>
-        <FAIcon
-          size="sm"
-          icon="chevron-down"
+    <template v-slot:content>
+      <div
+        slot="content"
+        class="timeline-menu-popover popover-default"
+        >
+        <TimelineMenuContent />
+      </div>
+    </template>
+    <template v-slot:trigger>
+      <button class="button-unstyled title timeline-menu-title">
+        <span class="timeline-title">{{ timelineName() }}</span>
+        <span>
+          <FAIcon
+            size="sm"
+            icon="chevron-down"
+          />
+        </span>
+        <span
+          class="click-blocker"
+          @click="blockOpen"
         />
-      </span>
-      <span
-        class="click-blocker"
-        @click="blockOpen"
-      />
-    </div>
+      </button>
+    </template>
   </Popover>
 </template>
 
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 4b7ee7d5..78b0813f 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -53,17 +53,17 @@
               >
                 {{ user.name }}
               </div>
-              <a
+              <button
                 v-if="isOtherUser && !user.is_local"
                 :href="user.statusnet_profile_url"
                 target="_blank"
-                class="external-link-button"
+                class="button-unstyled external-link-button"
               >
                 <FAIcon
                   class="icon"
                   icon="external-link-alt"
                 />
-              </a>
+              </button>
               <AccountActions
                 v-if="isOtherUser && loggedIn"
                 :user="user"
diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue
index d0aa315e..f4b93c9a 100644
--- a/src/components/user_list_popover/user_list_popover.vue
+++ b/src/components/user_list_popover/user_list_popover.vue
@@ -4,40 +4,39 @@
     placement="top"
     :offset="{ y: 5 }"
   >
-    <template slot="trigger">
+    <template v-slot:trigger>
       <slot />
     </template>
-    <div
-      slot="content"
-      class="user-list-popover"
-    >
-      <div v-if="users.length">
-        <div
-          v-for="(user) in usersCapped"
-          :key="user.id"
-          class="user-list-row"
-        >
-          <UserAvatar
-            :user="user"
-            class="avatar-small"
-            :compact="true"
-          />
-          <div class="user-list-names">
-            <!-- eslint-disable vue/no-v-html -->
-            <span v-html="user.name_html" />
-            <!-- eslint-enable vue/no-v-html -->
-            <span class="user-list-screen-name">{{ user.screen_name_ui }}</span>
+    <template v-slot:content>
+      <div class="user-list-popover">
+        <template v-if="users.length">
+          <div
+            v-for="(user) in usersCapped"
+            :key="user.id"
+            class="user-list-row"
+          >
+            <UserAvatar
+              :user="user"
+              class="avatar-small"
+              :compact="true"
+            />
+            <div class="user-list-names">
+              <!-- eslint-disable vue/no-v-html -->
+              <span v-html="user.name_html" />
+              <!-- eslint-enable vue/no-v-html -->
+              <span class="user-list-screen-name">{{ user.screen_name_ui }}</span>
+            </div>
           </div>
-        </div>
+        </template>
+        <template v-else>
+          <FAIcon
+            icon="circle-notch"
+            spin
+            size="3x"
+          />
+        </template>
       </div>
-      <div v-else>
-        <FAIcon
-          icon="circle-notch"
-          spin
-          size="3x"
-        />
-      </div>
-    </div>
+    </template>
   </Popover>
 </template>
 
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 745e795d..aef897ae 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -60,10 +60,7 @@
           :disabled="!user.friends_count"
         >
           <FriendList :user-id="userId">
-            <template
-              slot="item"
-              slot-scope="{item}"
-            >
+            <template v-slot:item="{item}">
               <FollowCard :user="item" />
             </template>
           </FriendList>
@@ -75,10 +72,7 @@
           :disabled="!user.followers_count"
         >
           <FollowerList :user-id="userId">
-            <template
-              slot="item"
-              slot-scope="{item}"
-            >
+            <template v-slot:item="{item}">
               <FollowCard
                 :user="item"
                 :no-follows-you="isUs"
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index a71c02c1..1f67a5cc 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -45,10 +45,7 @@
         </div>
         <div class="user-reporting-panel-right">
           <List :items="statuses">
-            <template
-              slot="item"
-              slot-scope="{item}"
-            >
+            <template v-slot:item="{item}">
               <div class="status-fadein user-reporting-panel-sitem">
                 <Status
                   :in-conversation="false"

From e47d5ba53b7d619bdb83f85b88feadccc8877eab Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 14:12:34 +0300
Subject: [PATCH 020/113] fix importer/exporter i18n

---
 src/components/exporter/exporter.js  | 14 ++------------
 src/components/exporter/exporter.vue |  4 ++--
 src/components/importer/importer.js  | 21 +++------------------
 src/components/importer/importer.vue |  6 +++---
 4 files changed, 10 insertions(+), 35 deletions(-)

diff --git a/src/components/exporter/exporter.js b/src/components/exporter/exporter.js
index 51912ac3..fc75372e 100644
--- a/src/components/exporter/exporter.js
+++ b/src/components/exporter/exporter.js
@@ -15,18 +15,8 @@ const Exporter = {
       type: String,
       default: 'export.csv'
     },
-    exportButtonLabel: {
-      type: String,
-      default () {
-        return this.$t('exporter.export')
-      }
-    },
-    processingMessage: {
-      type: String,
-      default () {
-        return this.$t('exporter.processing')
-      }
-    }
+    exportButtonLabel: { type: String },
+    processingMessage: { type: String }
   },
   data () {
     return {
diff --git a/src/components/exporter/exporter.vue b/src/components/exporter/exporter.vue
index d6a03088..79defdf6 100644
--- a/src/components/exporter/exporter.vue
+++ b/src/components/exporter/exporter.vue
@@ -7,14 +7,14 @@
         spin
       />
 
-      <span>{{ processingMessage }}</span>
+      <span>{{ processingMessage || $t('exporter.processing') }}</span>
     </div>
     <button
       v-else
       class="btn button-default"
       @click="process"
     >
-      {{ exportButtonLabel }}
+      {{ exportButtonLabel || $t('exporter.export') }}
     </button>
   </div>
 </template>
diff --git a/src/components/importer/importer.js b/src/components/importer/importer.js
index 59f9beb1..da86a223 100644
--- a/src/components/importer/importer.js
+++ b/src/components/importer/importer.js
@@ -15,24 +15,9 @@ const Importer = {
       type: Function,
       required: true
     },
-    submitButtonLabel: {
-      type: String,
-      default () {
-        return this.$t('importer.submit')
-      }
-    },
-    successMessage: {
-      type: String,
-      default () {
-        return this.$t('importer.success')
-      }
-    },
-    errorMessage: {
-      type: String,
-      default () {
-        return this.$t('importer.error')
-      }
-    }
+    submitButtonLabel: { type: String },
+    successMessage: { type: String },
+    errorMessage: { type: String }
   },
   data () {
     return {
diff --git a/src/components/importer/importer.vue b/src/components/importer/importer.vue
index 210823f5..466e15b9 100644
--- a/src/components/importer/importer.vue
+++ b/src/components/importer/importer.vue
@@ -18,21 +18,21 @@
       class="btn button-default"
       @click="submit"
     >
-      {{ submitButtonLabel }}
+      {{ submitButtonLabel || $t('importer.submit') }}
     </button>
     <div v-if="success">
       <FAIcon
         icon="times"
         @click="dismiss"
       />
-      <p>{{ successMessage }}</p>
+      <p>{{ successMessage || $t('importer.success')}}</p>
     </div>
     <div v-else-if="error">
       <FAIcon
         icon="times"
         @click="dismiss"
       />
-      <p>{{ errorMessage }}</p>
+      <p>{{ errorMessage || $t('importer.error')}}</p>
     </div>
   </div>
 </template>

From e73cb423b606cdb95fec7408089a428dcf4902f5 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 14:44:07 +0300
Subject: [PATCH 021/113] fix login form

---
 src/components/auth_form/auth_form.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/auth_form/auth_form.js b/src/components/auth_form/auth_form.js
index e9a6e2d5..a86a3dca 100644
--- a/src/components/auth_form/auth_form.js
+++ b/src/components/auth_form/auth_form.js
@@ -1,3 +1,4 @@
+import { h, resolveComponent } from 'vue'
 import LoginForm from '../login_form/login_form.vue'
 import MFARecoveryForm from '../mfa_form/recovery_form.vue'
 import MFATOTPForm from '../mfa_form/totp_form.vue'
@@ -5,8 +6,8 @@ import { mapGetters } from 'vuex'
 
 const AuthForm = {
   name: 'AuthForm',
-  render (createElement) {
-    return createElement('component', { is: this.authForm })
+  render () {
+    return h(resolveComponent(this.authForm))
   },
   computed: {
     authForm () {

From b6e8c12dbcd7d9f4cf50e10bfd3c85fe691c2640 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 14:51:00 +0300
Subject: [PATCH 022/113] emoji picker fix

---
 src/components/emoji_picker/emoji_picker.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/emoji_picker/emoji_picker.js b/src/components/emoji_picker/emoji_picker.js
index 2716d93f..6b589079 100644
--- a/src/components/emoji_picker/emoji_picker.js
+++ b/src/components/emoji_picker/emoji_picker.js
@@ -1,3 +1,4 @@
+import { defineAsyncComponent } from 'vue'
 import Checkbox from '../checkbox/checkbox.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -57,7 +58,7 @@ const EmojiPicker = {
     }
   },
   components: {
-    StickerPicker: () => import('../sticker_picker/sticker_picker.vue'),
+    StickerPicker: defineAsyncComponent(() => import('../sticker_picker/sticker_picker.vue')),
     Checkbox
   },
   methods: {
@@ -79,7 +80,7 @@ const EmojiPicker = {
     },
     highlight (key) {
       const ref = this.$refs['group-' + key]
-      const top = ref[0].offsetTop
+      const top = ref.offsetTop
       this.setShowStickers(false)
       this.activeGroup = key
       this.$nextTick(() => {
@@ -96,7 +97,7 @@ const EmojiPicker = {
       }
     },
     triggerLoadMore (target) {
-      const ref = this.$refs['group-end-custom'][0]
+      const ref = this.$refs['group-end-custom']
       if (!ref) return
       const bottom = ref.offsetTop + ref.offsetHeight
 
@@ -119,7 +120,7 @@ const EmojiPicker = {
       this.$nextTick(() => {
         this.emojisView.forEach(group => {
           const ref = this.$refs['group-' + group.id]
-          if (ref[0].offsetTop <= top) {
+          if (ref.offsetTop <= top) {
             this.activeGroup = group.id
           }
         })

From 8a9115b58e020f750366e87bb4fd3483d6b62b03 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 25 Apr 2021 14:51:15 +0300
Subject: [PATCH 023/113] temp fix for now-unused resettable async component

---
 src/services/resettable_async_component.js | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/services/resettable_async_component.js b/src/services/resettable_async_component.js
index 517bbd88..e85c540b 100644
--- a/src/services/resettable_async_component.js
+++ b/src/services/resettable_async_component.js
@@ -1,4 +1,5 @@
-import Vue from 'vue'
+// TODO investigate if even necessary since VUE3
+import { reactive } from 'vue'
 
 /* By default async components don't have any way to recover, if component is
  * failed, it is failed forever. This helper tries to remedy that by recreating
@@ -13,7 +14,7 @@ function getResettableAsyncComponent (asyncComponent, options) {
     ...options
   })
 
-  const observe = Vue.observable({ c: asyncComponentFactory() })
+  const observe = reactive({ c: asyncComponentFactory() })
 
   return {
     functional: true,

From e51144809f4c743072e040e0875402596bebb3cf Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 16 Mar 2022 22:02:44 +0200
Subject: [PATCH 024/113] shit boots yo

---
 build/webpack.base.conf.js                    |  15 +-
 package.json                                  |  19 +-
 src/components/registration/registration.js   |   6 +-
 .../settings_modal/settings_modal.vue         |  34 +-
 src/components/user_card/user_card.vue        |   2 +-
 src/main.js                                   |  14 +-
 yarn.lock                                     | 541 ++++++++++++++----
 7 files changed, 462 insertions(+), 169 deletions(-)

diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js
index 4a02852c..65d398c8 100644
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@@ -3,8 +3,8 @@ var config = require('../config')
 var utils = require('./utils')
 var projectRoot = path.resolve(__dirname, '../')
 var ServiceWorkerWebpackPlugin = require('serviceworker-webpack-plugin')
-var { VueLoaderPlugin } = require('vue-loader')
 var CopyPlugin = require('copy-webpack-plugin');
+var { VueLoaderPlugin } = require('vue-loader')
 
 var env = process.env.NODE_ENV
 // check env & config/index.js to decide weither to enable CSS Sourcemaps for the
@@ -30,12 +30,12 @@ module.exports = {
     }
   },
   resolve: {
-    extensions: ['.js', '.vue', '.jsx'],
+    extensions: ['.js', '.jsx', '.vue'],
     modules: [
       path.join(__dirname, '../node_modules')
     ],
     alias: {
-      vue: "@vue/runtime-dom",
+      'vue': '@vue/compat',
       'static': path.resolve(__dirname, '../static'),
       'src': path.resolve(__dirname, '../src'),
       'assets': path.resolve(__dirname, '../src/assets'),
@@ -61,7 +61,14 @@ module.exports = {
       },
       {
         test: /\.vue$/,
-        use: 'vue-loader'
+        loader: 'vue-loader',
+        options: {
+          compilerOptions: {
+            compatConfig: {
+              MODE: 2
+            }
+          }
+        }
       },
       {
         test: /\.jsx?$/,
diff --git a/package.json b/package.json
index adcfa3d9..4f494324 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
     "@fortawesome/fontawesome-svg-core": "1.3.0",
     "@fortawesome/free-regular-svg-icons": "5.15.4",
     "@fortawesome/free-solid-svg-icons": "5.15.4",
-    "@fortawesome/vue-fontawesome": "2.0.6",
+    "@fortawesome/vue-fontawesome": "3.0.0-5",
     "@kazvmoe-infra/pinch-zoom-element": "1.2.0",
     "body-scroll-lock": "2.6.4",
     "chromatism": "3.0.0",
@@ -35,12 +35,13 @@
     "punycode.js": "2.1.0",
     "ruffle-mirror": "2021.4.11",
     "v-click-outside": "2.1.5",
-    "vue": "2.6.11",
-    "vue-i18n": "7.8.1",
-    "vue-router": "3.0.2",
-    "vue-template-compiler": "2.6.11",
-    "vuelidate": "0.7.7",
-    "vuex": "3.0.1"
+    "vue": "^3.1.0",
+    "@vue/compat": "^3.1.0",
+    "vue-i18n": "9.1.9",
+    "vue-router": "4.0.14",
+    "@vuelidate/core": "2.0.0-alpha.35",
+    "@vuelidate/validators": "2.0.0-alpha.27",
+    "vuex": "4.0.2"
   },
   "devDependencies": {
     "@babel/core": "7.7.5",
@@ -50,7 +51,9 @@
     "@ungap/event-target": "0.2.3",
     "@vue/babel-helper-vue-jsx-merge-props": "1.2.1",
     "@vue/babel-preset-jsx": "1.2.4",
+    "@vue/babel-plugin-jsx": "1.1.1",
     "@vue/test-utils": "1.0.0-beta.28",
+    "@vue/compiler-sfc": "^3.1.0",
     "autoprefixer": "6.7.7",
     "babel-eslint": "7.2.3",
     "babel-loader": "8.0.6",
@@ -112,7 +115,7 @@
     "stylelint-config-standard": "20.0.0",
     "stylelint-rscss": "0.4.0",
     "url-loader": "1.1.2",
-    "vue-loader": "14.2.4",
+    "vue-loader": "^16.0.0",
     "vue-style-loader": "4.1.2",
     "webpack": "4.46.0",
     "webpack-dev-middleware": "3.7.3",
diff --git a/src/components/registration/registration.js b/src/components/registration/registration.js
index 1ac8e8be..531cc480 100644
--- a/src/components/registration/registration.js
+++ b/src/components/registration/registration.js
@@ -1,9 +1,9 @@
-import { validationMixin } from 'vuelidate'
-import { required, requiredIf, sameAs } from 'vuelidate/lib/validators'
+import useVuelidate from '@vuelidate/core'
+import { required, requiredIf, sameAs } from '@vuelidate/validators'
 import { mapActions, mapState } from 'vuex'
 
 const registration = {
-  mixins: [validationMixin],
+  setup () { return { v$: useVuelidate() } },
   data: () => ({
     user: {
       email: '',
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 1805c77f..ccbb2af9 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -11,23 +11,25 @@
           {{ $t('settings.settings') }}
         </span>
         <transition name="fade">
-          <template v-if="currentSaveStateNotice">
-            <div
-              v-if="currentSaveStateNotice.error"
-              class="alert error"
-              @click.prevent
-            >
-              {{ $t('settings.saving_err') }}
-            </div>
+          <div>
+            <template v-if="currentSaveStateNotice">
+              <div
+                v-if="currentSaveStateNotice.error"
+                class="alert error"
+                @click.prevent
+              >
+                {{ $t('settings.saving_err') }}
+              </div>
 
-            <div
-              v-if="!currentSaveStateNotice.error"
-              class="alert transparent"
-              @click.prevent
-            >
-              {{ $t('settings.saving_ok') }}
-            </div>
-          </template>
+              <div
+                v-if="!currentSaveStateNotice.error"
+                class="alert transparent"
+                @click.prevent
+              >
+                {{ $t('settings.saving_ok') }}
+              </div>
+            </template>
+          </div>
         </transition>
         <button
           class="btn button-default"
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 2576bf87..0708f387 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -66,7 +66,7 @@
                   class="icon"
                   icon="external-link-alt"
                 />
-              </button>
+              </a>
               <AccountActions
                 v-if="isOtherUser && loggedIn"
                 :user="user"
diff --git a/src/main.js b/src/main.js
index 2d50dff5..eacd554c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -31,19 +31,7 @@ import afterStoreSetup from './boot/after_store.js'
 
 const currentLocale = (window.navigator.language || 'en').split('-')[0]
 
-Vue.use(Vuex)
-Vue.use(VueRouter)
-Vue.use(VueI18n)
-Vue.use(VueClickOutside)
-Vue.use(PortalVue)
-Vue.use(VBodyScrollLock)
-
-Vue.config.ignoredElements = ['pinch-zoom']
-
-Vue.component('FAIcon', FontAwesomeIcon)
-Vue.component('FALayers', FontAwesomeLayers)
-
-const i18n = new VueI18n({
+const i18n = createI18n({
   // By default, use the browser locale, we will update it if neccessary
   locale: 'en',
   fallbackLocale: 'en',
diff --git a/yarn.lock b/yarn.lock
index 4eecbd20..bcd8d06f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -15,6 +15,13 @@
   dependencies:
     "@babel/highlight" "^7.10.4"
 
+"@babel/code-frame@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.7.tgz#44416b6bd7624b998f5b1af5d470856c40138789"
+  integrity sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg==
+  dependencies:
+    "@babel/highlight" "^7.16.7"
+
 "@babel/code-frame@^7.5.5":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.5.5.tgz#bc0782f6d69f7b7d49531219699b988f669a8f9d"
@@ -73,6 +80,15 @@
     jsesc "^2.5.1"
     source-map "^0.5.0"
 
+"@babel/generator@^7.17.3":
+  version "7.17.7"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.7.tgz#8da2599beb4a86194a3b24df6c085931d9ee45ad"
+  integrity sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w==
+  dependencies:
+    "@babel/types" "^7.17.0"
+    jsesc "^2.5.1"
+    source-map "^0.5.0"
+
 "@babel/generator@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.7.4.tgz#db651e2840ca9aa66f327dcec1dc5f5fa9611369"
@@ -124,6 +140,13 @@
     "@babel/types" "^7.7.4"
     lodash "^4.17.13"
 
+"@babel/helper-environment-visitor@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.16.7.tgz#ff484094a839bde9d89cd63cba017d7aae80ecd7"
+  integrity sha512-SLLb0AAn6PkUeAfKJCCOl9e1R53pQlGAfc4y4XuMRZfqeMYLE0dM1LMhqbGAlGQY0lfw5/ohoYWAe9V1yibRag==
+  dependencies:
+    "@babel/types" "^7.16.7"
+
 "@babel/helper-explode-assignable-expression@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-explode-assignable-expression/-/helper-explode-assignable-expression-7.7.4.tgz#fa700878e008d85dc51ba43e9fb835cddfe05c84"
@@ -141,6 +164,15 @@
     "@babel/template" "^7.10.4"
     "@babel/types" "^7.10.4"
 
+"@babel/helper-function-name@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.16.7.tgz#f1ec51551fb1c8956bc8dd95f38523b6cf375f8f"
+  integrity sha512-QfDfEnIUyyBSR3HtrtGECuZ6DAyCkYFp7GHl75vFtTnn6pjKeK0T1DB5lLkFvBea8MdaiUABx3osbgLyInoejA==
+  dependencies:
+    "@babel/helper-get-function-arity" "^7.16.7"
+    "@babel/template" "^7.16.7"
+    "@babel/types" "^7.16.7"
+
 "@babel/helper-function-name@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.7.4.tgz#ab6e041e7135d436d8f0a3eca15de5b67a341a2e"
@@ -157,6 +189,13 @@
   dependencies:
     "@babel/types" "^7.10.4"
 
+"@babel/helper-get-function-arity@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.7.tgz#ea08ac753117a669f1508ba06ebcc49156387419"
+  integrity sha512-flc+RLSOBXzNzVhcLu6ujeHUrD6tANAOU5ojrRx/as+tbzf8+stUCj7+IfRRoAbEZqj/ahXEMsjhOhgeZsrnTw==
+  dependencies:
+    "@babel/types" "^7.16.7"
+
 "@babel/helper-get-function-arity@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.7.4.tgz#cb46348d2f8808e632f0ab048172130e636005f0"
@@ -164,6 +203,13 @@
   dependencies:
     "@babel/types" "^7.7.4"
 
+"@babel/helper-hoist-variables@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.16.7.tgz#86bcb19a77a509c7b77d0e22323ef588fa58c246"
+  integrity sha512-m04d/0Op34H5v7pbZw6pSKP7weA6lsMvfiIAMeIvkY/R4xQtBSMFEigu9QTZ2qB/9l22vsxtM8a+Q8CzD255fg==
+  dependencies:
+    "@babel/types" "^7.16.7"
+
 "@babel/helper-hoist-variables@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.7.4.tgz#612384e3d823fdfaaf9fce31550fe5d4db0f3d12"
@@ -249,6 +295,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.0.0.tgz#bbb3fbee98661c569034237cc03967ba99b4f250"
   integrity sha512-CYAOUCARwExnEixLdB6sDm2dIJ/YgEAKDM1MOeMeZu9Ld/bDgVo8aiWrXwcY7OBh+1Ea2uUcVRcxKk0GJvW7QA==
 
+"@babel/helper-plugin-utils@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz#aa3a8ab4c3cceff8e65eb9e73d87dc4ff320b2f5"
+  integrity sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==
+
 "@babel/helper-regex@^7.0.0", "@babel/helper-regex@^7.4.4":
   version "7.5.5"
   resolved "https://registry.yarnpkg.com/@babel/helper-regex/-/helper-regex-7.5.5.tgz#0aa6824f7100a2e0e89c1527c23936c152cab351"
@@ -310,6 +361,13 @@
   dependencies:
     "@babel/types" "^7.10.4"
 
+"@babel/helper-split-export-declaration@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.16.7.tgz#0b648c0c42da9d3920d85ad585f2778620b8726b"
+  integrity sha512-xbWoy/PFoxSWazIToT9Sif+jJTlrMcndIsaOKvTA6u7QEo7ilkRZpjew18/W3c7nm8fXdUDXh02VXTbZ0pGDNw==
+  dependencies:
+    "@babel/types" "^7.16.7"
+
 "@babel/helper-split-export-declaration@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.7.4.tgz#57292af60443c4a3622cf74040ddc28e68336fd8"
@@ -322,6 +380,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz#a78c7a7251e01f616512d31b10adcf52ada5e0d2"
   integrity sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw==
 
+"@babel/helper-validator-identifier@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz#e8c602438c4a8195751243da9031d1607d247cad"
+  integrity sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw==
+
 "@babel/helper-wrap-function@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/helper-wrap-function/-/helper-wrap-function-7.7.4.tgz#37ab7fed5150e22d9d7266e830072c0cdd8baace"
@@ -367,11 +430,25 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.16.7":
+  version "7.16.10"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.10.tgz#744f2eb81579d6eea753c227b0f570ad785aba88"
+  integrity sha512-5FnTQLSLswEj6IkgVw5KusNUUFY9ZGqe/TRFnP/BKYHYgfh7tc+C7mwiy95/yNP7Dh9x580Vv8r7u7ZfTBFxdw==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.16.7"
+    chalk "^2.0.0"
+    js-tokens "^4.0.0"
+
 "@babel/parser@^7.10.4", "@babel/parser@^7.10.5":
   version "7.10.5"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.10.5.tgz#e7c6bf5a7deff957cec9f04b551e2762909d826b"
   integrity sha512-wfryxy4bE1UivvQKSQDU4/X6dr+i8bctjUjj8Zyt3DQy7NtPizJXT8M52nqpNKL+nq2PW8lxk4ZqLj0fD4B4hQ==
 
+"@babel/parser@^7.16.4", "@babel/parser@^7.16.7", "@babel/parser@^7.17.3":
+  version "7.17.7"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.7.tgz#fc19b645a5456c8d6fdb6cecd3c66c0173902800"
+  integrity sha512-bm3AQf45vR4gKggRfvJdYJ0gFLoCbsPxiFLSH6hTVYABptNHY6l9NrhnucVjQ/X+SPtLANT9lc0fFhikj+VBRA==
+
 "@babel/parser@^7.7.4", "@babel/parser@^7.7.5":
   version "7.7.5"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.7.5.tgz#cbf45321619ac12d83363fcf9c94bb67fa646d71"
@@ -447,6 +524,13 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.0.0"
 
+"@babel/plugin-syntax-jsx@^7.0.0":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.16.7.tgz#50b6571d13f764266a113d77c82b4a6508bbe665"
+  integrity sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==
+  dependencies:
+    "@babel/helper-plugin-utils" "^7.16.7"
+
 "@babel/plugin-syntax-jsx@^7.2.0":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.7.4.tgz#dab2b56a36fb6c3c222a1fbc71f7bf97f327a9ec"
@@ -804,6 +888,15 @@
   dependencies:
     regenerator-runtime "^0.13.2"
 
+"@babel/template@^7.0.0", "@babel/template@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.7.tgz#8d126c8701fde4d66b264b3eba3d96f07666d155"
+  integrity sha512-I8j/x8kHUrbYRTUxXrrMbfCa7jxkE7tZre39x3kjr9hvI82cK1FfqLygotcWN5kdPGWcLdWMHpSBavse5tWw3w==
+  dependencies:
+    "@babel/code-frame" "^7.16.7"
+    "@babel/parser" "^7.16.7"
+    "@babel/types" "^7.16.7"
+
 "@babel/template@^7.10.4":
   version "7.10.4"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.10.4.tgz#3251996c4200ebc71d1a8fc405fba940f36ba278"
@@ -822,6 +915,22 @@
     "@babel/parser" "^7.7.4"
     "@babel/types" "^7.7.4"
 
+"@babel/traverse@^7.0.0":
+  version "7.17.3"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.3.tgz#0ae0f15b27d9a92ba1f2263358ea7c4e7db47b57"
+  integrity sha512-5irClVky7TxRWIRtxlh2WPUUOLhcPN06AGgaQSB8AEwuyEBgJVuJ5imdHm5zxk8w0QS5T+tDfnDxAlhWjpb7cw==
+  dependencies:
+    "@babel/code-frame" "^7.16.7"
+    "@babel/generator" "^7.17.3"
+    "@babel/helper-environment-visitor" "^7.16.7"
+    "@babel/helper-function-name" "^7.16.7"
+    "@babel/helper-hoist-variables" "^7.16.7"
+    "@babel/helper-split-export-declaration" "^7.16.7"
+    "@babel/parser" "^7.17.3"
+    "@babel/types" "^7.17.0"
+    debug "^4.1.0"
+    globals "^11.1.0"
+
 "@babel/traverse@^7.10.4", "@babel/traverse@^7.10.5":
   version "7.10.5"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.10.5.tgz#77ce464f5b258be265af618d8fddf0536f20b564"
@@ -869,6 +978,14 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
+"@babel/types@^7.16.7", "@babel/types@^7.17.0":
+  version "7.17.0"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.17.0.tgz#a826e368bccb6b3d84acd76acad5c0d87342390b"
+  integrity sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.16.7"
+    to-fast-properties "^2.0.0"
+
 "@babel/types@^7.7.4":
   version "7.7.4"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.7.4.tgz#516570d539e44ddf308c07569c258ff94fde9193"
@@ -916,10 +1033,66 @@
   dependencies:
     "@fortawesome/fontawesome-common-types" "^0.2.36"
 
-"@fortawesome/vue-fontawesome@2.0.6":
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-2.0.6.tgz#87e691ed87f28f4667238573a29743f543a087f6"
-  integrity sha512-V3vT3flY15AKbUS31aZOP12awQI3aAzkr2B1KnqcHLmwrmy51DW3pwyBczKdypV8QxBZ8U68Hl2XxK2nudTxpg==
+"@fortawesome/vue-fontawesome@3.0.0-5":
+  version "3.0.0-5"
+  resolved "https://registry.yarnpkg.com/@fortawesome/vue-fontawesome/-/vue-fontawesome-3.0.0-5.tgz#6251e6917198362fa56510eb256cfb6aa6d30a32"
+  integrity sha512-aNmBT4bOecrFsZTog1l6AJDQHPP3ocXV+WQ3Ogy8WZCqstB/ahfhH4CPu5i4N9Hw0MBKXqE+LX+NbUxcj8cVTw==
+
+"@intlify/core-base@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.1.9.tgz#e4e8c951010728e4af3a0d13d74cf3f9e7add7f6"
+  integrity sha512-x5T0p/Ja0S8hs5xs+ImKyYckVkL4CzcEXykVYYV6rcbXxJTe2o58IquSqX9bdncVKbRZP7GlBU1EcRaQEEJ+vw==
+  dependencies:
+    "@intlify/devtools-if" "9.1.9"
+    "@intlify/message-compiler" "9.1.9"
+    "@intlify/message-resolver" "9.1.9"
+    "@intlify/runtime" "9.1.9"
+    "@intlify/shared" "9.1.9"
+    "@intlify/vue-devtools" "9.1.9"
+
+"@intlify/devtools-if@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/devtools-if/-/devtools-if-9.1.9.tgz#a30e1dd1256ff2c5c98d8d75d075384fba898e5d"
+  integrity sha512-oKSMKjttG3Ut/1UGEZjSdghuP3fwA15zpDPcjkf/1FjlOIm6uIBGMNS5jXzsZy593u+P/YcnrZD6cD3IVFz9vQ==
+  dependencies:
+    "@intlify/shared" "9.1.9"
+
+"@intlify/message-compiler@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.1.9.tgz#1193cbd224a71c2fb981455b8534a3c766d2948d"
+  integrity sha512-6YgCMF46Xd0IH2hMRLCssZI3gFG4aywidoWQ3QP4RGYQXQYYfFC54DxhSgfIPpVoPLQ+4AD29eoYmhiHZ+qLFQ==
+  dependencies:
+    "@intlify/message-resolver" "9.1.9"
+    "@intlify/shared" "9.1.9"
+    source-map "0.6.1"
+
+"@intlify/message-resolver@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/message-resolver/-/message-resolver-9.1.9.tgz#3155ccd2f5e6d0dc16cad8b7f1d8e97fcda05bfc"
+  integrity sha512-Lx/DBpigeK0sz2BBbzv5mu9/dAlt98HxwbG7xLawC3O2xMF9MNWU5FtOziwYG6TDIjNq0O/3ZbOJAxwITIWXEA==
+
+"@intlify/runtime@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/runtime/-/runtime-9.1.9.tgz#2c12ce29518a075629efed0a8ed293ee740cb285"
+  integrity sha512-XgPw8+UlHCiie3fI41HPVa/VDJb3/aSH7bLhY1hJvlvNV713PFtb4p4Jo+rlE0gAoMsMCGcsiT982fImolSltg==
+  dependencies:
+    "@intlify/message-compiler" "9.1.9"
+    "@intlify/message-resolver" "9.1.9"
+    "@intlify/shared" "9.1.9"
+
+"@intlify/shared@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.1.9.tgz#0baaf96128b85560666bec784ffb01f6623cc17a"
+  integrity sha512-xKGM1d0EAxdDFCWedcYXOm6V5Pfw/TMudd6/qCdEb4tv0hk9EKeg7lwQF1azE0dP2phvx0yXxrt7UQK+IZjNdw==
+
+"@intlify/vue-devtools@9.1.9":
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/@intlify/vue-devtools/-/vue-devtools-9.1.9.tgz#2be8f4dbe7f7ed4115676eb32348141d411e426b"
+  integrity sha512-YPehH9uL4vZcGXky4Ev5qQIITnHKIvsD2GKGXgqf+05osMUI6WSEQHaN9USRa318Rs8RyyPCiDfmA0hRu3k7og==
+  dependencies:
+    "@intlify/message-resolver" "9.1.9"
+    "@intlify/runtime" "9.1.9"
+    "@intlify/shared" "9.1.9"
 
 "@kazvmoe-infra/pinch-zoom-element@1.2.0":
   version "1.2.0"
@@ -1029,6 +1202,26 @@
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz#31624a7a505fb14da1d58023725a4c5f270e6a81"
   integrity sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA==
 
+"@vue/babel-helper-vue-transform-on@^1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.0.2.tgz#9b9c691cd06fc855221a2475c3cc831d774bc7dc"
+  integrity sha512-hz4R8tS5jMn8lDq6iD+yWL6XNB699pGIVLk7WSJnn1dbpjaazsjZQkieJoRX6gW5zpYSCFqQ7jUquPNY65tQYA==
+
+"@vue/babel-plugin-jsx@1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.1.1.tgz#0c5bac27880d23f89894cd036a37b55ef61ddfc1"
+  integrity sha512-j2uVfZjnB5+zkcbc/zsOc0fSNGCMMjaEXP52wdwdIfn0qjFfEYpYZBFKFg+HHnQeJCVrjOeO0YxgaL7DMrym9w==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/plugin-syntax-jsx" "^7.0.0"
+    "@babel/template" "^7.0.0"
+    "@babel/traverse" "^7.0.0"
+    "@babel/types" "^7.0.0"
+    "@vue/babel-helper-vue-transform-on" "^1.0.2"
+    camelcase "^6.0.0"
+    html-tags "^3.1.0"
+    svg-tags "^1.0.0"
+
 "@vue/babel-plugin-transform-vue-jsx@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.2.1.tgz#646046c652c2f0242727f34519d917b064041ed7"
@@ -1104,6 +1297,106 @@
     "@vue/babel-plugin-transform-vue-jsx" "^1.2.1"
     camelcase "^5.0.0"
 
+"@vue/compat@^3.1.0":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compat/-/compat-3.2.31.tgz#9c8bdf265eeba1777e5edb56cda73581e351a648"
+  integrity sha512-hhwJk/SRwpT2OADctj+t7QZCRIgh04AcelGpe6gdj0OxA75xpHnPrG+fmG37U3Z6WDrNHZpGvu2eXBzWXM4OVA==
+
+"@vue/compiler-core@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.31.tgz#d38f06c2cf845742403b523ab4596a3fda152e89"
+  integrity sha512-aKno00qoA4o+V/kR6i/pE+aP+esng5siNAVQ422TkBNM6qA4veXiZbSe8OTXHXquEi/f6Akc+nLfB4JGfe4/WQ==
+  dependencies:
+    "@babel/parser" "^7.16.4"
+    "@vue/shared" "3.2.31"
+    estree-walker "^2.0.2"
+    source-map "^0.6.1"
+
+"@vue/compiler-dom@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.31.tgz#b1b7dfad55c96c8cc2b919cd7eb5fd7e4ddbf00e"
+  integrity sha512-60zIlFfzIDf3u91cqfqy9KhCKIJgPeqxgveH2L+87RcGU/alT6BRrk5JtUso0OibH3O7NXuNOQ0cDc9beT0wrg==
+  dependencies:
+    "@vue/compiler-core" "3.2.31"
+    "@vue/shared" "3.2.31"
+
+"@vue/compiler-sfc@3.2.31", "@vue/compiler-sfc@^3.1.0":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.31.tgz#d02b29c3fe34d599a52c5ae1c6937b4d69f11c2f"
+  integrity sha512-748adc9msSPGzXgibHiO6T7RWgfnDcVQD+VVwYgSsyyY8Ans64tALHZANrKtOzvkwznV/F4H7OAod/jIlp/dkQ==
+  dependencies:
+    "@babel/parser" "^7.16.4"
+    "@vue/compiler-core" "3.2.31"
+    "@vue/compiler-dom" "3.2.31"
+    "@vue/compiler-ssr" "3.2.31"
+    "@vue/reactivity-transform" "3.2.31"
+    "@vue/shared" "3.2.31"
+    estree-walker "^2.0.2"
+    magic-string "^0.25.7"
+    postcss "^8.1.10"
+    source-map "^0.6.1"
+
+"@vue/compiler-ssr@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.2.31.tgz#4fa00f486c9c4580b40a4177871ebbd650ecb99c"
+  integrity sha512-mjN0rqig+A8TVDnsGPYJM5dpbjlXeHUm2oZHZwGyMYiGT/F4fhJf/cXy8QpjnLQK4Y9Et4GWzHn9PS8AHUnSkw==
+  dependencies:
+    "@vue/compiler-dom" "3.2.31"
+    "@vue/shared" "3.2.31"
+
+"@vue/devtools-api@^6.0.0", "@vue/devtools-api@^6.0.0-beta.11", "@vue/devtools-api@^6.0.0-beta.7":
+  version "6.1.3"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.1.3.tgz#a44c52e8fa6d22f84db3abdcdd0be5135b7dd7cf"
+  integrity sha512-79InfO2xHv+WHIrH1bHXQUiQD/wMls9qBk6WVwGCbdwP7/3zINtvqPNMtmSHXsIKjvUAHc8L0ouOj6ZQQRmcXg==
+
+"@vue/reactivity-transform@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.2.31.tgz#0f5b25c24e70edab2b613d5305c465b50fc00911"
+  integrity sha512-uS4l4z/W7wXdI+Va5pgVxBJ345wyGFKvpPYtdSgvfJfX/x2Ymm6ophQlXXB6acqGHtXuBqNyyO3zVp9b1r0MOA==
+  dependencies:
+    "@babel/parser" "^7.16.4"
+    "@vue/compiler-core" "3.2.31"
+    "@vue/shared" "3.2.31"
+    estree-walker "^2.0.2"
+    magic-string "^0.25.7"
+
+"@vue/reactivity@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.31.tgz#fc90aa2cdf695418b79e534783aca90d63a46bbd"
+  integrity sha512-HVr0l211gbhpEKYr2hYe7hRsV91uIVGFYNHj73njbARVGHQvIojkImKMaZNDdoDZOIkMsBc9a1sMqR+WZwfSCw==
+  dependencies:
+    "@vue/shared" "3.2.31"
+
+"@vue/runtime-core@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.31.tgz#9d284c382f5f981b7a7b5971052a1dc4ef39ac7a"
+  integrity sha512-Kcog5XmSY7VHFEMuk4+Gap8gUssYMZ2+w+cmGI6OpZWYOEIcbE0TPzzPHi+8XTzAgx1w/ZxDFcXhZeXN5eKWsA==
+  dependencies:
+    "@vue/reactivity" "3.2.31"
+    "@vue/shared" "3.2.31"
+
+"@vue/runtime-dom@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.2.31.tgz#79ce01817cb3caf2c9d923f669b738d2d7953eff"
+  integrity sha512-N+o0sICVLScUjfLG7u9u5XCjvmsexAiPt17GNnaWHJUfsKed5e85/A3SWgKxzlxx2SW/Hw7RQxzxbXez9PtY3g==
+  dependencies:
+    "@vue/runtime-core" "3.2.31"
+    "@vue/shared" "3.2.31"
+    csstype "^2.6.8"
+
+"@vue/server-renderer@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.2.31.tgz#201e9d6ce735847d5989403af81ef80960da7141"
+  integrity sha512-8CN3Zj2HyR2LQQBHZ61HexF5NReqngLT3oahyiVRfSSvak+oAvVmu8iNLSu6XR77Ili2AOpnAt1y8ywjjqtmkg==
+  dependencies:
+    "@vue/compiler-ssr" "3.2.31"
+    "@vue/shared" "3.2.31"
+
+"@vue/shared@3.2.31":
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e"
+  integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==
+
 "@vue/test-utils@1.0.0-beta.28":
   version "1.0.0-beta.28"
   resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.28.tgz#767c43413df8cde86128735e58923803e444b9a5"
@@ -1112,6 +1405,20 @@
     dom-event-types "^1.0.0"
     lodash "^4.17.4"
 
+"@vuelidate/core@2.0.0-alpha.35":
+  version "2.0.0-alpha.35"
+  resolved "https://registry.yarnpkg.com/@vuelidate/core/-/core-2.0.0-alpha.35.tgz#22d91787147b0883d31585fab44d0218622b7560"
+  integrity sha512-BSGQElu5lyI0GzqehFzUWy7GXhEUC7Z8oEpdxgCyGGN5gOFlAQ5Zr4dDFzfIOhU4jik3CfPHK+i+Juqg2OCKNw==
+  dependencies:
+    vue-demi "^0.12.0"
+
+"@vuelidate/validators@2.0.0-alpha.27":
+  version "2.0.0-alpha.27"
+  resolved "https://registry.yarnpkg.com/@vuelidate/validators/-/validators-2.0.0-alpha.27.tgz#260f81b2e3c0695159a9576ee7930d7d0a2e698b"
+  integrity sha512-omCUVP+gr2kKBMQwdKsOYPWYk/Fu92K93LRnl8Vk856UudNlb89wCreh0/Q8DpVEOisLljI3T7026QCo9eSq4Q==
+  dependencies:
+    vue-demi "^0.12.0"
+
 "@webassemblyjs/ast@1.9.0":
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.9.0.tgz#bd850604b4042459a5a41cd7d338cbed695ed964"
@@ -1839,7 +2146,7 @@ blob@0.0.5:
   version "0.0.5"
   resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.5.tgz#d680eeef25f8cd91ad533f5b01eed48e64caf683"
 
-bluebird@^3.1.1, bluebird@^3.3.0:
+bluebird@^3.3.0:
   version "3.5.3"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.3.tgz#7d01c6f9616c9a51ab0f8c549a79dfe6ec33efa7"
 
@@ -2614,12 +2921,6 @@ console-control-strings@^1.0.0, console-control-strings@~1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/console-control-strings/-/console-control-strings-1.1.0.tgz#3d7cf4464db6446ea644bf4b39507f9851008e8e"
 
-consolidate@^0.14.0:
-  version "0.14.5"
-  resolved "https://registry.yarnpkg.com/consolidate/-/consolidate-0.14.5.tgz#5a25047bc76f73072667c8cb52c989888f494c63"
-  dependencies:
-    bluebird "^3.1.1"
-
 constants-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
@@ -2705,18 +3006,6 @@ core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
 
-cosmiconfig@^2.1.0, cosmiconfig@^2.1.1:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-2.2.2.tgz#6173cebd56fac042c1f4390edf7af6c07c7cb892"
-  dependencies:
-    is-directory "^0.3.1"
-    js-yaml "^3.4.3"
-    minimist "^1.2.0"
-    object-assign "^4.1.0"
-    os-homedir "^1.0.1"
-    parse-json "^2.2.0"
-    require-from-string "^1.1.0"
-
 cosmiconfig@^5.0.0:
   version "5.2.1"
   resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.2.1.tgz#040f726809c591e77a17c0a3626ca45b4f168b1a"
@@ -2903,6 +3192,11 @@ csso@~2.3.1:
     clap "^1.0.9"
     source-map "^0.5.3"
 
+csstype@^2.6.8:
+  version "2.6.20"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.20.tgz#9229c65ea0b260cf4d3d997cb06288e36a8d6dda"
+  integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
+
 currently-unhandled@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
@@ -2941,11 +3235,6 @@ dateformat@^1.0.6:
     get-stdin "^4.0.1"
     meow "^3.3.0"
 
-de-indent@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
-  integrity sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=
-
 debug@2, debug@2.6.9, debug@^2.1.2, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
@@ -3621,6 +3910,11 @@ estraverse@^4.0.0, estraverse@^4.1.0, estraverse@^4.1.1, estraverse@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-4.2.0.tgz#0dee3fed31fcd469618ce7342099fc1afa0bdb13"
 
+estree-walker@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
+  integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==
+
 esutils@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
@@ -4426,6 +4720,11 @@ hash-sum@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/hash-sum/-/hash-sum-1.0.2.tgz#33b40777754c6432573c120cc3808bbd10d47f04"
 
+hash-sum@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/hash-sum/-/hash-sum-2.0.0.tgz#81d01bb5de8ea4a214ad5d6ead1b523460b0b45a"
+  integrity sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==
+
 hash.js@^1.0.0, hash.js@^1.0.3:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/hash.js/-/hash.js-1.1.7.tgz#0babca538e8d4ee4a0f8988d68866537a003cf42"
@@ -4437,7 +4736,7 @@ he@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
 
-he@1.2.x, he@^1.1.0:
+he@1.2.x:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
 
@@ -5173,7 +5472,7 @@ js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
 
-js-yaml@3.x, js-yaml@^3.4.3:
+js-yaml@3.x:
   version "3.12.1"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.1.tgz#295c8632a18a23e054cf5c9d3cecafe678167600"
   dependencies:
@@ -5811,7 +6110,7 @@ lower-case@^1.1.1:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-1.1.4.tgz#9a2cabd1b9e8e0ae993a4bf7d5875c39c42e8eac"
 
-lru-cache@4.1.x, lru-cache@^4.0.1, lru-cache@^4.1.1:
+lru-cache@4.1.x, lru-cache@^4.0.1:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
   dependencies:
@@ -5835,6 +6134,13 @@ lru-cache@~2.6.5:
   version "2.6.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-2.6.5.tgz#e56d6354148ede8d7707b58d143220fd08df0fd5"
 
+magic-string@^0.25.7:
+  version "0.25.9"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c"
+  integrity sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==
+  dependencies:
+    sourcemap-codec "^1.4.8"
+
 make-dir@^2.0.0, make-dir@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
@@ -6281,6 +6587,11 @@ nan@^2.12.1:
   version "2.14.0"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.0.tgz#7818f722027b2459a86f0295d434d1fc2336c52c"
 
+nanoid@^3.3.1:
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.1.tgz#6347a18cac88af88f58af0b3594b723d5e99bb35"
+  integrity sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw==
+
 nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
@@ -6644,7 +6955,7 @@ os-browserify@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/os-browserify/-/os-browserify-0.3.0.tgz#854373c7f5c2315914fc9bfc6bd8238fdda1ec27"
 
-os-homedir@^1.0.0, os-homedir@^1.0.1:
+os-homedir@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
 
@@ -6938,6 +7249,11 @@ phoenix@1.4.0:
   resolved "https://registry.yarnpkg.com/phoenix/-/phoenix-1.4.0.tgz#9cec8dbd8cbc59ecd2147bc09ca8ceb56b860d75"
   integrity sha512-+M7erjPRtrHM53Bc9sT/WSyNFOEhsAc48PBsex0R87hu0GhBRMNE2uAb8MT2gKtJmAYxv5Quaozh/PBuhO8tdQ==
 
+picocolors@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
+  integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
+
 picomatch@^2.0.4:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.3.tgz#465547f359ccc206d3c48e46a1bcb89bf7ee619d"
@@ -7091,15 +7407,6 @@ postcss-less@^3.1.4:
   dependencies:
     postcss "^7.0.14"
 
-postcss-load-config@^1.1.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-1.2.0.tgz#539e9afc9ddc8620121ebf9d8c3673e0ce50d28a"
-  dependencies:
-    cosmiconfig "^2.1.0"
-    object-assign "^4.1.0"
-    postcss-load-options "^1.2.0"
-    postcss-load-plugins "^2.3.0"
-
 postcss-load-config@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-2.1.0.tgz#c84d692b7bb7b41ddced94ee62e8ab31b417b003"
@@ -7108,20 +7415,6 @@ postcss-load-config@^2.0.0:
     cosmiconfig "^5.0.0"
     import-cwd "^2.0.0"
 
-postcss-load-options@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/postcss-load-options/-/postcss-load-options-1.2.0.tgz#b098b1559ddac2df04bc0bb375f99a5cfe2b6d8c"
-  dependencies:
-    cosmiconfig "^2.1.0"
-    object-assign "^4.1.0"
-
-postcss-load-plugins@^2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/postcss-load-plugins/-/postcss-load-plugins-2.3.0.tgz#745768116599aca2f009fad426b00175049d8d92"
-  dependencies:
-    cosmiconfig "^2.1.1"
-    object-assign "^4.1.0"
-
 postcss-loader@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-3.0.0.tgz#6b97943e47c72d845fa9e03f273773d4e8dd6c2d"
@@ -7379,7 +7672,7 @@ postcss@^5.0.10, postcss@^5.0.11, postcss@^5.0.12, postcss@^5.0.13, postcss@^5.0
     source-map "^0.5.6"
     supports-color "^3.2.3"
 
-postcss@^6.0.1, postcss@^6.0.8:
+postcss@^6.0.1:
   version "6.0.23"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
   dependencies:
@@ -7405,6 +7698,15 @@ postcss@^7.0.14, postcss@^7.0.2, postcss@^7.0.21, postcss@^7.0.26, postcss@^7.0.
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
+postcss@^8.1.10:
+  version "8.4.12"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.12.tgz#1e7de78733b28970fa4743f7da6f3763648b1905"
+  integrity sha512-lg6eITwYe9v6Hr5CncVbK70SoioNQIq81nsaG86ev5hAidQvmOeETBqs7jm43K2F5/Ley3ytDtriImV6TpNiSg==
+  dependencies:
+    nanoid "^3.3.1"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
@@ -7417,10 +7719,6 @@ preserve@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
 
-prettier@^1.16.0:
-  version "1.17.1"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.17.1.tgz#ed64b4e93e370cb8a25b9ef7fef3e4fd1c0995db"
-
 pretty-error@^2.0.2:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/pretty-error/-/pretty-error-2.1.1.tgz#5f4f87c8f91e5ae3f3ba87ab4cf5e03b1a17f1a3"
@@ -7946,10 +8244,6 @@ require-directory@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42"
 
-require-from-string@^1.1.0:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-1.2.1.tgz#529c9ccef27380adfec9a2f965b649bbee636418"
-
 require-main-filename@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-2.0.0.tgz#d0b329ecc7cc0f61649f62215be69af54aa8989b"
@@ -7985,7 +8279,7 @@ resolve@1.1.x, resolve@^1.1.6:
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.1.7.tgz#203114d82ad2c5ed9e8e0411b3932875e889e97b"
 
-resolve@^1.10.0, resolve@^1.4.0, resolve@^1.5.0, resolve@^1.8.1:
+resolve@^1.10.0, resolve@^1.5.0, resolve@^1.8.1:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.11.0.tgz#4014870ba296176b86343d50b60f3b50609ce232"
   dependencies:
@@ -8417,6 +8711,11 @@ source-list-map@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-2.0.1.tgz#3993bd873bfc48479cca9ea3a547835c7c154b34"
 
+source-map-js@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
+  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
+
 source-map-resolve@^0.5.0:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.2.tgz#72e2cc34095543e43b2c62b2c4c10d4a9054f259"
@@ -8453,14 +8752,14 @@ source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
 
+source-map@0.6.1, source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
+  version "0.6.1"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+
 source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.3, source-map@^0.5.6, source-map@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
-source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.0, source-map@~0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
-
 source-map@^0.7.3:
   version "0.7.3"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383"
@@ -8472,6 +8771,11 @@ source-map@~0.2.0:
   dependencies:
     amdefine ">=0.0.4"
 
+sourcemap-codec@^1.4.8:
+  version "1.4.8"
+  resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
+  integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
+
 spdx-correct@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"
@@ -9393,6 +9697,11 @@ void-elements@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-2.0.1.tgz#c066afb582bb1cb4128d60ea92392e94d5e9dbec"
 
+vue-demi@^0.12.0:
+  version "0.12.4"
+  resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.12.4.tgz#420dd17628f95f1bbce1102ad3c51074713a8049"
+  integrity sha512-ztPDkFt0TSUdoq1ZI6oD730vgztBkiByhUW7L1cOTebiSBqSYfSQgnhYakYigBkyAybqCTH7h44yZuDJf2xILQ==
+
 vue-eslint-parser@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-5.0.0.tgz#00f4e4da94ec974b821a26ff0ed0f7a78402b8a1"
@@ -9404,72 +9713,56 @@ vue-eslint-parser@^5.0.0:
     esquery "^1.0.1"
     lodash "^4.17.11"
 
-vue-hot-reload-api@^2.2.0:
-  version "2.3.3"
-  resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.3.tgz#2756f46cb3258054c5f4723de8ae7e87302a1ccf"
-
-vue-i18n@7.8.1:
-  version "7.8.1"
-  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-7.8.1.tgz#2ce4b6efde679a1e05ddb5d907bfc1bc218803b2"
-  integrity sha512-BzB+EAPo/iFyFn/GXd/qVdDe67jfk+gmQaWUKD5BANhUclGrFxzRExzW2pYEAbhNm2pg0F12Oo+gL2IMLDcTAw==
-
-vue-loader@14.2.4:
-  version "14.2.4"
-  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-14.2.4.tgz#d0a0e8236155fa7f9602cde65b0d38259e051ee2"
-  integrity sha512-bub2/rcTMJ3etEbbeehdH2Em3G2F5vZIjMK7ZUePj5UtgmZSTtOX1xVVawDpDsy021s3vQpO6VpWJ3z3nO8dDw==
+vue-i18n@9.1.9:
+  version "9.1.9"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.1.9.tgz#cb53e06ab5cc5b7eed59332f151caf48d47be9bb"
+  integrity sha512-JeRdNVxS2OGp1E+pye5XB6+M6BBkHwAv9C80Q7+kzoMdUDGRna06tjC0vCB/jDX9aWrl5swxOMFcyAr7or8XTA==
   dependencies:
-    consolidate "^0.14.0"
-    hash-sum "^1.0.2"
-    loader-utils "^1.1.0"
-    lru-cache "^4.1.1"
-    postcss "^6.0.8"
-    postcss-load-config "^1.1.0"
-    postcss-selector-parser "^2.0.0"
-    prettier "^1.16.0"
-    resolve "^1.4.0"
-    source-map "^0.6.1"
-    vue-hot-reload-api "^2.2.0"
-    vue-style-loader "^4.0.1"
-    vue-template-es2015-compiler "^1.6.0"
+    "@intlify/core-base" "9.1.9"
+    "@intlify/shared" "9.1.9"
+    "@intlify/vue-devtools" "9.1.9"
+    "@vue/devtools-api" "^6.0.0-beta.7"
 
-vue-router@3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.0.2.tgz#dedc67afe6c4e2bc25682c8b1c2a8c0d7c7e56be"
-  integrity sha512-opKtsxjp9eOcFWdp6xLQPLmRGgfM932Tl56U9chYTnoWqKxQ8M20N7AkdEbM5beUh6wICoFGYugAX9vQjyJLFg==
+vue-loader@^16.0.0:
+  version "16.8.3"
+  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-16.8.3.tgz#d43e675def5ba9345d6c7f05914c13d861997087"
+  integrity sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==
+  dependencies:
+    chalk "^4.1.0"
+    hash-sum "^2.0.0"
+    loader-utils "^2.0.0"
 
-vue-style-loader@4.1.2, vue-style-loader@^4.0.1:
+vue-router@4.0.14:
+  version "4.0.14"
+  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-4.0.14.tgz#ce2028c1c5c33e30c7287950c973f397fce1bd65"
+  integrity sha512-wAO6zF9zxA3u+7AkMPqw9LjoUCjSxfFvINQj3E/DceTt6uEz1XZLraDhdg2EYmvVwTBSGlLYsUw8bDmx0754Mw==
+  dependencies:
+    "@vue/devtools-api" "^6.0.0"
+
+vue-style-loader@4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/vue-style-loader/-/vue-style-loader-4.1.2.tgz#dedf349806f25ceb4e64f3ad7c0a44fba735fcf8"
   dependencies:
     hash-sum "^1.0.2"
     loader-utils "^1.0.2"
 
-vue-template-compiler@2.6.11:
-  version "2.6.11"
-  resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.6.11.tgz#c04704ef8f498b153130018993e56309d4698080"
-  integrity sha512-KIq15bvQDrcCjpGjrAhx4mUlyyHfdmTaoNfeoATHLAiWB+MU3cx4lOzMwrnUh9cCxy0Lt1T11hAFY6TQgroUAA==
+vue@^3.1.0:
+  version "3.2.31"
+  resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
+  integrity sha512-odT3W2tcffTiQCy57nOT93INw1auq5lYLLYtWpPYQQYQOOdHiqFct9Xhna6GJ+pJQaF67yZABraH47oywkJgFw==
   dependencies:
-    de-indent "^1.0.2"
-    he "^1.1.0"
+    "@vue/compiler-dom" "3.2.31"
+    "@vue/compiler-sfc" "3.2.31"
+    "@vue/runtime-dom" "3.2.31"
+    "@vue/server-renderer" "3.2.31"
+    "@vue/shared" "3.2.31"
 
-vue-template-es2015-compiler@^1.6.0:
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
-
-vue@2.6.11:
-  version "2.6.11"
-  resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.11.tgz#76594d877d4b12234406e84e35275c6d514125c5"
-  integrity sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==
-
-vuelidate@0.7.7:
-  version "0.7.7"
-  resolved "https://registry.yarnpkg.com/vuelidate/-/vuelidate-0.7.7.tgz#5df3930a63ddecf56fde7bdacea9dbaf0c9bf899"
-  integrity sha512-pT/U2lDI67wkIqI4tum7cMSIfGcAMfB+Phtqh2ttdXURwvHRBJEAQ0tVbUsW9Upg83Q5QH59bnCoXI7A9JDGnA==
-
-vuex@3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.0.1.tgz#e761352ebe0af537d4bb755a9b9dc4be3df7efd2"
-  integrity sha512-wLoqz0B7DSZtgbWL1ShIBBCjv22GV5U+vcBFox658g6V0s4wZV9P4YjCNyoHSyIBpj1f29JBoNQIqD82cR4O3w==
+vuex@4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/vuex/-/vuex-4.0.2.tgz#f896dbd5bf2a0e963f00c67e9b610de749ccacc9"
+  integrity sha512-M6r8uxELjZIK8kTKDGgZTYX/ahzblnzC4isU1tpmEuOIIKmV+TRdc+H4s8ds2NuZ7wpUTdGRzJRtoj+lI+pc0Q==
+  dependencies:
+    "@vue/devtools-api" "^6.0.0-beta.11"
 
 watchpack-chokidar2@^2.0.1:
   version "2.0.1"

From 8311d4deba93309dd60ebeb28f7b3ac1d0d23e6c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 16 Mar 2022 22:13:21 +0200
Subject: [PATCH 025/113] shit renders yo

---
 src/components/rich_content/rich_content.jsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx
index 46bc661a..383b29b3 100644
--- a/src/components/rich_content/rich_content.jsx
+++ b/src/components/rich_content/rich_content.jsx
@@ -1,4 +1,4 @@
-import Vue from 'vue'
+import { h } from 'vue'
 import { unescape, flattenDeep } from 'lodash'
 import { getTagName, processTextForEmoji, getAttrs } from 'src/services/html_converter/utility.service.js'
 import { convertHtmlToTree } from 'src/services/html_converter/html_tree_converter.service.js'
@@ -27,7 +27,7 @@ import './rich_content.scss'
  *
  * Apart from that one small hiccup with emit in render this _should_ be vue3-ready
  */
-export default Vue.component('RichContent', {
+export default {
   name: 'RichContent',
   props: {
     // Original html content
@@ -58,7 +58,7 @@ export default Vue.component('RichContent', {
     }
   },
   // NEVER EVER TOUCH DATA INSIDE RENDER
-  render (h) {
+  render () {
     // Pre-process HTML
     const { newHtml: html } = preProcessPerLine(this.html, this.greentext)
     let currentMentions = null // Current chain of mentions, we group all mentions together
@@ -266,7 +266,7 @@ export default Vue.component('RichContent', {
 
     return result
   }
-})
+}
 
 const getLinkData = (attrs, children, index) => {
   const stripTags = (item) => {

From be4244acde8183271d3770f2fbbd9d1ac571086b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 08:35:19 +0200
Subject: [PATCH 026/113] fix some warnings

---
 src/App.vue                                   |   2 +-
 .../basic_user_card/basic_user_card.vue       |   2 +-
 src/components/chat/chat.vue                  | 128 +++++++++---------
 src/components/checkbox/checkbox.vue          |   2 +-
 src/components/desktop_nav/desktop_nav.vue    |   2 +-
 src/components/font_control/font_control.js   |   2 +-
 src/components/importer/importer.vue          |   4 +-
 src/components/status/status.vue              |   2 +-
 8 files changed, 71 insertions(+), 73 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 31e8fd40..3532f898 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -59,7 +59,7 @@
     <UserReportingModal />
     <PostStatusModal />
     <SettingsModal />
-    <div id="modal"/>
+    <div id="modal" />
     <GlobalNoticeList />
   </div>
 </template>
diff --git a/src/components/basic_user_card/basic_user_card.vue b/src/components/basic_user_card/basic_user_card.vue
index 53deb1df..eeca7828 100644
--- a/src/components/basic_user_card/basic_user_card.vue
+++ b/src/components/basic_user_card/basic_user_card.vue
@@ -4,7 +4,7 @@
       <UserAvatar
         class="avatar"
         :user="user"
-        @click.prevent.native="toggleUserExpanded"
+        @click.prevent="toggleUserExpanded"
       />
     </router-link>
     <div
diff --git a/src/components/chat/chat.vue b/src/components/chat/chat.vue
index 94a0097c..493c5d5a 100644
--- a/src/components/chat/chat.vue
+++ b/src/components/chat/chat.vue
@@ -26,73 +26,71 @@
             />
           </div>
         </div>
-        <template>
-          <div
-            ref="scrollable"
-            class="scrollable-message-list"
-            :style="{ height: scrollableContainerHeight }"
-            @scroll="handleScroll"
-          >
-            <template v-if="!errorLoadingChat">
-              <ChatMessage
-                v-for="chatViewItem in chatViewItems"
-                :key="chatViewItem.id"
-                :author="recipient"
-                :chat-view-item="chatViewItem"
-                :hovered-message-chain="chatViewItem.messageChainId === hoveredMessageChainId"
-                @hover="onMessageHover"
-              />
-            </template>
-            <div
-              v-else
-              class="chat-loading-error"
-            >
-              <div class="alert error">
-                {{ $t('chats.error_loading_chat') }}
-              </div>
-            </div>
-          </div>
-          <div
-            ref="footer"
-            class="panel-body footer"
-          >
-            <div
-              class="jump-to-bottom-button"
-              :class="{ 'visible': jumpToBottomButtonVisible }"
-              @click="scrollDown({ behavior: 'smooth' })"
-            >
-              <span>
-                <FAIcon icon="chevron-down" />
-                <div
-                  v-if="newMessageCount"
-                  class="badge badge-notification unread-chat-count unread-message-count"
-                >
-                  {{ newMessageCount }}
-                </div>
-              </span>
-            </div>
-            <PostStatusForm
-              :disable-subject="true"
-              :disable-scope-selector="true"
-              :disable-notice="true"
-              :disable-lock-warning="true"
-              :disable-polls="true"
-              :disable-sensitivity-checkbox="true"
-              :disable-submit="errorLoadingChat || !currentChat"
-              :disable-preview="true"
-              :optimistic-posting="true"
-              :post-handler="sendMessage"
-              :submit-on-enter="!mobileLayout"
-              :preserve-focus="!mobileLayout"
-              :auto-focus="!mobileLayout"
-              :placeholder="formPlaceholder"
-              :file-limit="1"
-              max-height="160"
-              emoji-picker-placement="top"
-              @resize="handleResize"
+        <div
+          ref="scrollable"
+          class="scrollable-message-list"
+          :style="{ height: scrollableContainerHeight }"
+          @scroll="handleScroll"
+        >
+          <template v-if="!errorLoadingChat">
+            <ChatMessage
+              v-for="chatViewItem in chatViewItems"
+              :key="chatViewItem.id"
+              :author="recipient"
+              :chat-view-item="chatViewItem"
+              :hovered-message-chain="chatViewItem.messageChainId === hoveredMessageChainId"
+              @hover="onMessageHover"
             />
+          </template>
+          <div
+            v-else
+            class="chat-loading-error"
+          >
+            <div class="alert error">
+              {{ $t('chats.error_loading_chat') }}
+            </div>
           </div>
-        </template>
+        </div>
+        <div
+          ref="footer"
+          class="panel-body footer"
+        >
+          <div
+            class="jump-to-bottom-button"
+            :class="{ 'visible': jumpToBottomButtonVisible }"
+            @click="scrollDown({ behavior: 'smooth' })"
+          >
+            <span>
+              <FAIcon icon="chevron-down" />
+              <div
+                v-if="newMessageCount"
+                class="badge badge-notification unread-chat-count unread-message-count"
+              >
+                {{ newMessageCount }}
+              </div>
+            </span>
+          </div>
+          <PostStatusForm
+            :disable-subject="true"
+            :disable-scope-selector="true"
+            :disable-notice="true"
+            :disable-lock-warning="true"
+            :disable-polls="true"
+            :disable-sensitivity-checkbox="true"
+            :disable-submit="errorLoadingChat || !currentChat"
+            :disable-preview="true"
+            :optimistic-posting="true"
+            :post-handler="sendMessage"
+            :submit-on-enter="!mobileLayout"
+            :preserve-focus="!mobileLayout"
+            :auto-focus="!mobileLayout"
+            :placeholder="formPlaceholder"
+            :file-limit="1"
+            max-height="160"
+            emoji-picker-placement="top"
+            @resize="handleResize"
+          />
+        </div>
       </div>
     </div>
   </div>
diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index d28c2cfd..ff2b4e77 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -7,7 +7,7 @@
       type="checkbox"
       :disabled="disabled"
       :checked="checked"
-      :indeterminate.prop="indeterminate"
+      :indeterminate="indeterminate"
       @change="$emit('change', $event.target.checked)"
     >
     <i class="checkbox-indicator" />
diff --git a/src/components/desktop_nav/desktop_nav.vue b/src/components/desktop_nav/desktop_nav.vue
index 304baf9d..bab3ca81 100644
--- a/src/components/desktop_nav/desktop_nav.vue
+++ b/src/components/desktop_nav/desktop_nav.vue
@@ -34,7 +34,7 @@
         <search-bar
           v-if="currentUser || !privateMode"
           @toggled="onSearchBarToggled"
-          @click.stop.native
+          @click.stop
         />
         <button
           class="button-unstyled nav-icon"
diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js
index 137ef9c0..24bad937 100644
--- a/src/components/font_control/font_control.js
+++ b/src/components/font_control/font_control.js
@@ -1,4 +1,4 @@
-import { set } from 'vue'
+import { set } from 'lodash'
 import Select from '../select/select.vue'
 
 export default {
diff --git a/src/components/importer/importer.vue b/src/components/importer/importer.vue
index 466e15b9..ddc3010e 100644
--- a/src/components/importer/importer.vue
+++ b/src/components/importer/importer.vue
@@ -25,14 +25,14 @@
         icon="times"
         @click="dismiss"
       />
-      <p>{{ successMessage || $t('importer.success')}}</p>
+      <p>{{ successMessage || $t('importer.success') }}</p>
     </div>
     <div v-else-if="error">
       <FAIcon
         icon="times"
         @click="dismiss"
       />
-      <p>{{ errorMessage || $t('importer.error')}}</p>
+      <p>{{ errorMessage || $t('importer.error') }}</p>
     </div>
   </div>
 </template>
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index f5b71f54..f778753f 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -123,7 +123,7 @@
         >
           <router-link
             :to="userProfileLink"
-            @click.stop.prevent.capture.native="toggleUserExpanded"
+            @click.stop.prevent.capture="toggleUserExpanded"
           >
             <UserAvatar
               :bot="botIndicator"

From b62653c202d35ebcc5cd56d87c049405d6d500cd Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 08:37:01 +0200
Subject: [PATCH 027/113] fix chat user titles

---
 src/components/chat_title/chat_title.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/chat_title/chat_title.js b/src/components/chat_title/chat_title.js
index 1da04d4b..f6e299ad 100644
--- a/src/components/chat_title/chat_title.js
+++ b/src/components/chat_title/chat_title.js
@@ -1,10 +1,12 @@
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 import UserAvatar from '../user_avatar/user_avatar.vue'
+import RichContent from 'src/components/rich_content/rich_content.jsx'
 
 export default {
   name: 'ChatTitle',
   components: {
-    UserAvatar
+    UserAvatar,
+    RichContent
   },
   props: [
     'user', 'withAvatar'

From 0671aa0dd0cd199dc6206ae8b3fb0de114acddfe Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 08:47:11 +0200
Subject: [PATCH 028/113] fix tabswitcher

---
 src/components/settings_modal/settings_modal_content.js | 2 +-
 src/components/tab_switcher/tab_switcher.jsx            | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/settings_modal/settings_modal_content.js b/src/components/settings_modal/settings_modal_content.js
index 506b52e4..deb77298 100644
--- a/src/components/settings_modal/settings_modal_content.js
+++ b/src/components/settings_modal/settings_modal_content.js
@@ -63,7 +63,7 @@ const SettingsModalContent = {
       const targetTab = this.$store.state.interface.settingsModalTargetTab
       // We're being told to open in specific tab
       if (targetTab) {
-        const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => {
+        const tabIndex = this.$refs.tabSwitcher.$slots.default.findIndex(elm => {
           return elm.data && elm.data.attrs['data-tab-name'] === targetTab
         })
         if (tabIndex >= 0) {
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index db82e075..d9df42ce 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -43,14 +43,14 @@ export default {
   },
   data () {
     return {
-      active: findFirstUsable(this.$slots.default())
+      active: findFirstUsable(this.$slots.default)
     }
   },
   computed: {
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
-        return this.$slots.default().findIndex(slot => this.activeTab === slot.key)
+        return this.$slots.default.findIndex(slot => this.activeTab === slot.key)
       } else {
         return this.active
       }
@@ -74,7 +74,7 @@ export default {
     },
     // DO NOT put it to computed, it doesn't work (caching?)
     slots () {
-      return this.$slots.default()
+      return this.$slots.default
     },
     setTab (index) {
       if (typeof this.onSwitch === 'function') {

From 4993dc37e2430067a92ec78389c9d9dce79d19db Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 08:47:19 +0200
Subject: [PATCH 029/113] fix rich content not rendering stillimage nor links
 correctly

---
 src/components/rich_content/rich_content.jsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx
index 383b29b3..97c51189 100644
--- a/src/components/rich_content/rich_content.jsx
+++ b/src/components/rich_content/rich_content.jsx
@@ -76,7 +76,7 @@ export default {
 
     const renderImage = (tag) => {
       return <StillImage
-        {...{ attrs: getAttrs(tag) }}
+        {...getAttrs(tag)}
         class="img"
       />
     }
@@ -222,7 +222,7 @@ export default {
               attrs.target = '_blank'
               const newChildren = [...children].reverse().map(processItemReverse).reverse()
 
-              return <a {...{ attrs }}>
+              return <a {...attrs}>
                 { newChildren }
               </a>
             }

From d815f984fb354da2262d6a6e55b281aad817cda2 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 08:52:17 +0200
Subject: [PATCH 030/113] fix i18n errors related to @ symbol

---
 src/i18n/en.json | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/i18n/en.json b/src/i18n/en.json
index 76a871fb..f3401e61 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -502,14 +502,14 @@
       "true": "yes"
     },
     "virtual_scrolling": "Optimize timeline rendering",
-    "use_at_icon": "Display @ symbol as an icon instead of text",
+    "use_at_icon": "Display {'@'} symbol as an icon instead of text",
     "mention_link_display": "Display mention links",
-    "mention_link_display_short": "always as short names (e.g. @foo)",
-    "mention_link_display_full_for_remote": "as full names only for remote users (e.g. @foo@example.org)",
-    "mention_link_display_full": "always as full names (e.g. @foo@example.org)",
+    "mention_link_display_short": "always as short names (e.g. {'@'}foo)",
+    "mention_link_display_full_for_remote": "as full names only for remote users (e.g. {'@'}foo{'@'}example.org)",
+    "mention_link_display_full": "always as full names (e.g. {'@'}foo{'@'}example.org)",
     "mention_link_show_tooltip": "Show full user names as tooltip for remote users",
     "mention_link_show_avatar": "Show user avatar beside the link",
-    "mention_link_fade_domain": "Fade domains (e.g. @example.org in @foo@example.org)",
+    "mention_link_fade_domain": "Fade domains (e.g. {'@'}example.org in {'@'}foo{'@'}example.org)",
     "mention_link_bolden_you": "Highlight mention of you when you are mentioned",
     "fun": "Fun",
     "greentext": "Meme arrows",

From a97c07bfdfd8b69d59fec619d269cf14d65d8e0c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 09:02:26 +0200
Subject: [PATCH 031/113] fix settings not persisting

---
 src/lib/persisted_state.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/persisted_state.js b/src/lib/persisted_state.js
index 8ecb66a8..24b835da 100644
--- a/src/lib/persisted_state.js
+++ b/src/lib/persisted_state.js
@@ -1,6 +1,6 @@
 import merge from 'lodash.merge'
 import localforage from 'localforage'
-import { each, get, set } from 'lodash'
+import { each, get, set, cloneDeep } from 'lodash'
 
 let loaded = false
 
@@ -69,7 +69,7 @@ export default function createPersistedState ({
       subscriber(store)((mutation, state) => {
         try {
           if (saveImmedeatelyActions.includes(mutation.type)) {
-            setState(key, reducer(state, paths), storage)
+            setState(key, reducer(cloneDeep(state), paths), storage)
               .then(success => {
                 if (typeof success !== 'undefined') {
                   if (mutation.type === 'setOption' || mutation.type === 'setCurrentUser') {

From 5718c6491ef1c250e7ea445d80f563071355f406 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 09:06:05 +0200
Subject: [PATCH 032/113] fix selects being messed up

---
 src/components/select/select.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/select/select.vue b/src/components/select/select.vue
index 8d6528ff..56e651e3 100644
--- a/src/components/select/select.vue
+++ b/src/components/select/select.vue
@@ -23,7 +23,8 @@
 <style lang="scss">
 @import '../../_variables.scss';
 
-.Select {
+/* TODO fix order of styles */
+label.Select {
   padding: 0;
 
   select {

From 051d51bcd92530e5aff0c3e47f26b26695af7843 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 09:28:19 +0200
Subject: [PATCH 033/113] fix suggest not working

---
 package.json                              |  2 +-
 src/boot/after_store.js                   | 11 ++++++++---
 src/components/emoji_input/emoji_input.js |  1 +
 yarn.lock                                 | 10 +++++-----
 4 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index 4f494324..4bcd4853 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "portal-vue": "2.1.7",
     "punycode.js": "2.1.0",
     "ruffle-mirror": "2021.4.11",
-    "v-click-outside": "2.1.5",
+    "click-outside-vue3": "4.0.1",
     "vue": "^3.1.0",
     "@vue/compat": "^3.1.0",
     "vue-i18n": "9.1.9",
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index e0d7aa0f..5ddc7465 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -1,6 +1,6 @@
-import { createApp } from 'vue'
+import { createApp, configureCompat } from 'vue'
 import { createRouter, createWebHistory } from 'vue-router'
-import VueClickOutside from 'v-click-outside'
+import vClickOutside from 'click-outside-vue3'
 
 import { FontAwesomeIcon, FontAwesomeLayers } from '@fortawesome/vue-fontawesome'
 
@@ -15,6 +15,11 @@ import { CURRENT_VERSION } from '../services/theme_data/theme_data.service.js'
 import { applyTheme } from '../services/style_setter/style_setter.js'
 import FaviconService from '../services/favicon_service/favicon_service.js'
 
+// disable compat for certain features
+configureCompat({
+  COMPONENT_V_MODEL: false
+})
+
 let staticInitialResults = null
 
 const parsedInitialResults = () => {
@@ -390,7 +395,7 @@ const afterStoreSetup = async ({ store, i18n }) => {
   app.use(store)
   app.use(i18n)
 
-  app.use(VueClickOutside)
+  app.use(vClickOutside)
   app.use(VBodyScrollLock)
 
   app.component('FAIcon', FontAwesomeIcon)
diff --git a/src/components/emoji_input/emoji_input.js b/src/components/emoji_input/emoji_input.js
index c836317a..5b51da18 100644
--- a/src/components/emoji_input/emoji_input.js
+++ b/src/components/emoji_input/emoji_input.js
@@ -31,6 +31,7 @@ library.add(
  */
 
 const EmojiInput = {
+  emits: ['update:modelValue'],
   props: {
     suggest: {
       /**
diff --git a/yarn.lock b/yarn.lock
index bcd8d06f..4af18daa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2731,6 +2731,11 @@ cli-width@^2.0.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-2.2.0.tgz#ff19ede8a9a5e579324147b0c11f0fbcbabed639"
 
+click-outside-vue3@4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/click-outside-vue3/-/click-outside-vue3-4.0.1.tgz#81a6ac01696b301764b42db6fdbdf28e7cd8ef95"
+  integrity sha512-sbplNecrup5oGqA3o4bo8XmvHRT6q9fvw21Z67aDbTqB9M6LF7CuYLTlLvNtOgKU6W3zst5H5zJuEh4auqA34g==
+
 cliui@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/cliui/-/cliui-6.0.0.tgz#511d702c0c4e41ca156d7d0e96021f23e13225b1"
@@ -9639,11 +9644,6 @@ uuid@^3.3.2:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
 
-v-click-outside@2.1.5:
-  version "2.1.5"
-  resolved "https://registry.yarnpkg.com/v-click-outside/-/v-click-outside-2.1.5.tgz#aa69172fb41fcc79b26b9a4bc72a30ccf03f7a3c"
-  integrity sha512-VPNCOTZK6WZy73lcWc+R7IW1uaBFEO3/Csrs5CzWVOdvE30V8Y1+BE/BtTlcEmeDGx0eqdE7bSCg55Jj37PMJg==
-
 v8-compile-cache@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.1.1.tgz#54bc3cdd43317bca91e35dcaf305b1a7237de745"

From fea0c91f74d98e34b52a3aabfe40eac8536106cc Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 17 Mar 2022 09:33:36 +0200
Subject: [PATCH 034/113] bunp node version

---
 .gitlab-ci.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index 85d3ee44..ab601173 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -1,7 +1,7 @@
 # This file is a template, and might need editing before it works on your project.
 # Official framework image. Look for the different tagged releases at:
 # https://hub.docker.com/r/library/node/tags/
-image: node:10
+image: node:12
 
 stages:
   - lint

From 26bfbdc2add0c116c66b10e82f0814d180cc98c9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 18 Mar 2022 11:02:00 +0200
Subject: [PATCH 035/113] fix sw compilation

---
 src/sw.js | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/sw.js b/src/sw.js
index f5e34dd6..9118dd71 100644
--- a/src/sw.js
+++ b/src/sw.js
@@ -3,12 +3,10 @@
 import localForage from 'localforage'
 import { parseNotification } from './services/entity_normalizer/entity_normalizer.service.js'
 import { prepareNotificationObject } from './services/notification_utils/notification_utils.js'
-import Vue from 'vue'
-import VueI18n from 'vue-i18n'
+import { createI18n } from 'vue-i18n'
 import messages from './i18n/service_worker_messages.js'
 
-Vue.use(VueI18n)
-const i18n = new VueI18n({
+const i18n = createI18n({
   // By default, use the browser locale, we will update it if neccessary
   locale: 'en',
   fallbackLocale: 'en',

From b3ed29ff02fa3db46a1ec7b5856f2c9131b8fa33 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 18 Mar 2022 13:32:36 +0200
Subject: [PATCH 036/113] made withLoadMore work... sorta

---
 src/boot/after_store.js                      |  4 +++-
 src/boot/routes.js                           |  2 +-
 src/components/gallery/gallery.js            |  4 ++--
 src/components/tab_switcher/tab_switcher.jsx |  6 +++---
 src/hocs/with_load_more/with_load_more.jsx   | 11 ++++-------
 5 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 5ddc7465..91a13174 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -17,7 +17,9 @@ import FaviconService from '../services/favicon_service/favicon_service.js'
 
 // disable compat for certain features
 configureCompat({
-  COMPONENT_V_MODEL: false
+  COMPONENT_V_MODEL: false,
+  INSTANCE_SET: false,
+  RENDER_FUNCTION: false
 })
 
 let staticInitialResults = null
diff --git a/src/boot/routes.js b/src/boot/routes.js
index 1bc1f9f7..e5bdd1f0 100644
--- a/src/boot/routes.js
+++ b/src/boot/routes.js
@@ -69,7 +69,7 @@ export default (store) => {
     { name: 'search', path: '/search', component: Search, props: (route) => ({ query: route.query.query }) },
     { name: 'who-to-follow', path: '/who-to-follow', component: WhoToFollow, beforeEnter: validateAuthenticatedRoute },
     { name: 'about', path: '/about', component: About },
-    { name: 'user-profile', path: '/(users/)?:name', component: UserProfile }
+    { name: 'user-profile', path: '/:_(users)?/:name', component: UserProfile }
   ]
 
   if (store.state.instance.pleromaChatMessagesAvailable) {
diff --git a/src/components/gallery/gallery.js b/src/components/gallery/gallery.js
index 094b3e57..4e1bda55 100644
--- a/src/components/gallery/gallery.js
+++ b/src/components/gallery/gallery.js
@@ -1,5 +1,5 @@
 import Attachment from '../attachment/attachment.vue'
-import { sumBy } from 'lodash'
+import { sumBy, set } from 'lodash'
 
 const Gallery = {
   props: [
@@ -85,7 +85,7 @@ const Gallery = {
   },
   methods: {
     onNaturalSizeLoad ({ id, width, height }) {
-      this.$set(this.sizes, id, { width, height })
+      set(this.sizes, id, { width, height })
     },
     rowStyle (row) {
       if (row.audio) {
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index d9df42ce..db82e075 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -43,14 +43,14 @@ export default {
   },
   data () {
     return {
-      active: findFirstUsable(this.$slots.default)
+      active: findFirstUsable(this.$slots.default())
     }
   },
   computed: {
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
-        return this.$slots.default.findIndex(slot => this.activeTab === slot.key)
+        return this.$slots.default().findIndex(slot => this.activeTab === slot.key)
       } else {
         return this.active
       }
@@ -74,7 +74,7 @@ export default {
     },
     // DO NOT put it to computed, it doesn't work (caching?)
     slots () {
-      return this.$slots.default
+      return this.$slots.default()
     },
     setTab (index) {
       if (typeof this.onSwitch === 'function') {
diff --git a/src/hocs/with_load_more/with_load_more.jsx b/src/hocs/with_load_more/with_load_more.jsx
index 6cd198ed..e57f9b20 100644
--- a/src/hocs/with_load_more/with_load_more.jsx
+++ b/src/hocs/with_load_more/with_load_more.jsx
@@ -82,14 +82,11 @@ const withLoadMore = ({
     },
     render () {
       const props = {
-        props: {
-          ...this.$props,
-          [childPropName]: this.entries
-        },
-        on: this.$listeners,
-        scopedSlots: this.$scopedSlots
+        ...this.$props,
+        [childPropName]: this.entries
+        // on: this.$listeners // TODO fix listeners
       }
-      const children = Object.entries(this.$slots).map(([key, value]) => h('template', { slot: key }, value))
+      const children = this.$slots
       return (
         <div class="with-load-more">
           <WrappedComponent {...props}>

From 5948d20f00a4b01bee143a617bea9ae40cb1243f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Fri, 18 Mar 2022 13:36:08 +0200
Subject: [PATCH 037/113] mutes and blocks tab works

---
 src/hocs/with_subscription/with_subscription.jsx | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/hocs/with_subscription/with_subscription.jsx b/src/hocs/with_subscription/with_subscription.jsx
index 4529399e..5ba2662b 100644
--- a/src/hocs/with_subscription/with_subscription.jsx
+++ b/src/hocs/with_subscription/with_subscription.jsx
@@ -63,14 +63,11 @@ const withSubscription = ({
     render () {
       if (!this.error && !this.loading) {
         const props = {
-          props: {
-            ...this.$props,
-            [childPropName]: this.fetchedData
-          },
-          on: this.$listeners,
-          scopedSlots: this.$scopedSlots
+          ...this.$props,
+          [childPropName]: this.fetchedData
+          // on: this.$listeners // TODO
         }
-        const children = Object.entries(this.$slots).map(([key, value]) => h('template', { slot: key }, value))
+        const children = this.$slots
         return (
           <div class="with-subscription">
             <WrappedComponent {...props}>

From 1187727b6065363c253f399a6da53725a493fb32 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 21 Mar 2022 21:29:51 +0200
Subject: [PATCH 038/113] fix tabswitcher bugs

---
 src/components/interactions/interactions.js  | 4 +++-
 src/components/tab_switcher/tab_switcher.jsx | 9 ++++++---
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js
index 7fe5e76d..c5ceb63d 100644
--- a/src/components/interactions/interactions.js
+++ b/src/components/interactions/interactions.js
@@ -1,4 +1,5 @@
 import Notifications from '../notifications/notifications.vue'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 
 const tabModeDict = {
   mentions: ['mention'],
@@ -20,7 +21,8 @@ const Interactions = {
     }
   },
   components: {
-    Notifications
+    Notifications,
+    TabSwitcher
   }
 }
 
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index db82e075..a5c6cd2b 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -1,5 +1,5 @@
 // eslint-disable-next-line no-unused
-import { h } from 'vue'
+import { h, Fragment } from 'vue'
 import { mapState } from 'vuex'
 import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
 
@@ -43,14 +43,14 @@ export default {
   },
   data () {
     return {
-      active: findFirstUsable(this.$slots.default())
+      active: findFirstUsable(this.slots())
     }
   },
   computed: {
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
-        return this.$slots.default().findIndex(slot => this.activeTab === slot.key)
+        return this.slots().findIndex(slot => this.activeTab === slot.key)
       } else {
         return this.active
       }
@@ -74,6 +74,9 @@ export default {
     },
     // DO NOT put it to computed, it doesn't work (caching?)
     slots () {
+      if (this.$slots.default()[0].type === Fragment) {
+        return this.$slots.default()[0].children
+      }
       return this.$slots.default()
     },
     setTab (index) {

From 4cb14c257c980a13e50027ed4b1a2e38fcafe953 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 21 Mar 2022 21:34:55 +0200
Subject: [PATCH 039/113] fix expert mode checkbox not working

---
 src/components/settings_modal/settings_modal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index ccbb2af9..18b151f4 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -111,7 +111,7 @@
           </template>
         </Popover>
 
-        <Checkbox v-model="expertLevel">
+        <Checkbox :checked="!!expertLevel" @change="expertLevel = Number($event)">
           {{ $t("settings.expert_mode") }}
         </Checkbox>
       </div>

From 7a17eb7fec4e8f7dbe0a288a22498b800886ac01 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 21 Mar 2022 22:00:25 +0200
Subject: [PATCH 040/113] fix selects

---
 src/components/select/select.js  | 7 ++-----
 src/components/select/select.vue | 5 ++---
 2 files changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/components/select/select.js b/src/components/select/select.js
index 49535d07..ec571a14 100644
--- a/src/components/select/select.js
+++ b/src/components/select/select.js
@@ -8,12 +8,9 @@ library.add(
 )
 
 export default {
-  model: {
-    prop: 'value',
-    event: 'change'
-  },
+  emits: ['update:modelValue'],
   props: [
-    'value',
+    'modelValue',
     'disabled',
     'unstyled',
     'kind'
diff --git a/src/components/select/select.vue b/src/components/select/select.vue
index 56e651e3..08c88979 100644
--- a/src/components/select/select.vue
+++ b/src/components/select/select.vue
@@ -1,4 +1,3 @@
-
 <template>
   <label
     class="Select input"
@@ -6,8 +5,8 @@
   >
     <select
       :disabled="disabled"
-      :value="value"
-      @change="$emit('change', $event.target.value)"
+      :value="modelValue"
+      @change="$emit('update:modelValue', $event.target.value)"
     >
       <slot />
     </select>

From edb66ecade3b5d4cdd5a11f9053ebb9c35d8b67f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 16:39:27 +0200
Subject: [PATCH 041/113] fix mobile post button being too square

---
 .../mobile_post_status_button.vue             | 55 ++++++++++---------
 1 file changed, 28 insertions(+), 27 deletions(-)

diff --git a/src/components/mobile_post_status_button/mobile_post_status_button.vue b/src/components/mobile_post_status_button/mobile_post_status_button.vue
index 37becf4c..9fcdf6f8 100644
--- a/src/components/mobile_post_status_button/mobile_post_status_button.vue
+++ b/src/components/mobile_post_status_button/mobile_post_status_button.vue
@@ -1,13 +1,12 @@
 <template>
-  <div v-if="isLoggedIn">
-    <button
-      class="button-default new-status-button"
-      :class="{ 'hidden': isHidden, 'always-show': isPersistent }"
-      @click="openPostForm"
-    >
-      <FAIcon icon="pen" />
-    </button>
-  </div>
+  <button
+    v-if="isLoggedIn"
+    class="MobilePostButton button-default new-status-button"
+    :class="{ 'hidden': isHidden, 'always-show': isPersistent }"
+    @click="openPostForm"
+  >
+    <FAIcon icon="pen" />
+  </button>
 </template>
 
 <script src="./mobile_post_status_button.js"></script>
@@ -15,25 +14,27 @@
 <style lang="scss">
 @import '../../_variables.scss';
 
-.new-status-button {
-  width: 5em;
-  height: 5em;
-  border-radius: 100%;
-  position: fixed;
-  bottom: 1.5em;
-  right: 1.5em;
-  // TODO: this needs its own color, it has to stand out enough and link color
-  // is not very optimal for this particular use.
-  background-color: $fallback--fg;
-  background-color: var(--btn, $fallback--fg);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3), 0px 4px 6px rgba(0, 0, 0, 0.3);
-  z-index: 10;
+.MobilePostButton {
+  &.button-default {
+    width: 5em;
+    height: 5em;
+    border-radius: 100%;
+    position: fixed;
+    bottom: 1.5em;
+    right: 1.5em;
+    // TODO: this needs its own color, it has to stand out enough and link color
+    // is not very optimal for this particular use.
+    background-color: $fallback--fg;
+    background-color: var(--btn, $fallback--fg);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3), 0px 4px 6px rgba(0, 0, 0, 0.3);
+    z-index: 10;
 
-  transition: 0.35s transform;
-  transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
+    transition: 0.35s transform;
+    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
+  }
 
   &.hidden {
     transform: translateY(150%);

From c3546ea8567fc29a795e11d1e5303ea46ed596e0 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 16:40:09 +0200
Subject: [PATCH 042/113] fix tests running

---
 package.json       |   6 +-
 test/unit/index.js |   7 +
 yarn.lock          | 764 +++++++++++++++++++--------------------------
 3 files changed, 332 insertions(+), 445 deletions(-)

diff --git a/package.json b/package.json
index 04c2a8a4..fb156c54 100644
--- a/package.json
+++ b/package.json
@@ -52,7 +52,7 @@
     "@vue/babel-helper-vue-jsx-merge-props": "1.2.1",
     "@vue/babel-preset-jsx": "1.2.4",
     "@vue/babel-plugin-jsx": "1.1.1",
-    "@vue/test-utils": "1.0.0-beta.28",
+    "@vue/test-utils": "2.0.0-rc.17",
     "@vue/compiler-sfc": "^3.1.0",
     "autoprefixer": "6.7.7",
     "babel-eslint": "7.2.3",
@@ -85,10 +85,10 @@
     "iso-639-1": "2.1.13",
     "isparta-loader": "2.0.0",
     "json-loader": "0.5.7",
-    "karma": "3.1.4",
+    "karma": "6.3.17",
     "karma-coverage": "1.1.2",
     "karma-firefox-launcher": "1.3.0",
-    "karma-mocha": "1.3.0",
+    "karma-mocha": "2.0.1",
     "karma-mocha-reporter": "2.2.5",
     "karma-sinon-chai": "2.0.2",
     "karma-sourcemap-loader": "0.3.8",
diff --git a/test/unit/index.js b/test/unit/index.js
index 83a2dcdb..24d2825c 100644
--- a/test/unit/index.js
+++ b/test/unit/index.js
@@ -1,3 +1,10 @@
+import { configureCompat } from 'vue'
+// disable compat for certain features
+configureCompat({
+  COMPONENT_V_MODEL: false,
+  INSTANCE_SET: false,
+  RENDER_FUNCTION: false
+})
 // require all test files (files that ends with .spec.js)
 const testsContext = require.context('./specs', true, /\.spec$/)
 testsContext.keys().forEach(testsContext)
diff --git a/yarn.lock b/yarn.lock
index d35edd91..97eaa130 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1174,6 +1174,11 @@
   dependencies:
     qrcode "^1.4.4"
 
+"@colors/colors@1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"
+  integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==
+
 "@fortawesome/fontawesome-common-types@^0.2.36":
   version "0.2.36"
   resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.36.tgz#b44e52db3b6b20523e0c57ef8c42d315532cb903"
@@ -1320,6 +1325,11 @@
     mkdirp "^1.0.4"
     rimraf "^3.0.2"
 
+"@socket.io/base64-arraybuffer@~1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@socket.io/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz#568d9beae00b0d835f4f8c53fd55714986492e61"
+  integrity sha512-dOlCBKnDw4iShaIsH/bxujKTM18+2TOAsYz+KSc11Am38H4q5Xw8Bbz97ZYdrVNM+um3p7w86Bvvmcn9q+5+eQ==
+
 "@stylelint/postcss-css-in-js@^0.37.1":
   version "0.37.2"
   resolved "https://registry.yarnpkg.com/@stylelint/postcss-css-in-js/-/postcss-css-in-js-0.37.2.tgz#7e5a84ad181f4234a2480803422a47b8749af3d2"
@@ -1345,6 +1355,21 @@
   resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0"
   integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ==
 
+"@types/component-emitter@^1.2.10":
+  version "1.2.11"
+  resolved "https://registry.yarnpkg.com/@types/component-emitter/-/component-emitter-1.2.11.tgz#50d47d42b347253817a39709fef03ce66a108506"
+  integrity sha512-SRXjM+tfsSlA9VuG8hGO2nft2p8zjXCK1VcC6N4NXbBbYbSia9kzCChYQajIjzIqOOOuh5Ock6MmV2oux4jDZQ==
+
+"@types/cookie@^0.4.1":
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.4.1.tgz#bfd02c1f2224567676c1545199f87c3a861d878d"
+  integrity sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q==
+
+"@types/cors@^2.8.12":
+  version "2.8.12"
+  resolved "https://registry.yarnpkg.com/@types/cors/-/cors-2.8.12.tgz#6b2c510a7ad7039e98e7b8d3d6598f4359e5c080"
+  integrity sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw==
+
 "@types/http-proxy@^1.17.3":
   version "1.17.8"
   resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.8.tgz#968c66903e7e42b483608030ee85800f22d03f55"
@@ -1377,6 +1402,11 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.19.tgz#5135176a8330b88ece4e9ab1fdcfc0a545b4bab4"
   integrity sha512-4nhBPStMK04rruRVtVc6cDqhu7S9GZai0fpXgPXrFpcPX6Xul8xnrjSdGB4KPBVYG/R5+fXWdCM8qBoiULWGPQ==
 
+"@types/node@>=10.0.0":
+  version "17.0.22"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-17.0.22.tgz#38b6c4b9b2f3ed9f2e376cce42a298fb2375251e"
+  integrity sha512-8FwbVoG4fy+ykY86XCAclKZDORttqE5/s7dyWZKLXTdv3vRy5HozBEinG5IqhvPXXzIZEcTVbuHlQEI6iuwcmw==
+
 "@types/normalize-package-data@^2.4.0":
   version "2.4.0"
   resolved "https://registry.yarnpkg.com/@types/normalize-package-data/-/normalize-package-data-2.4.0.tgz#e486d0d97396d79beedd0a6e33f4534ff6b4973e"
@@ -1604,13 +1634,10 @@
   resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e"
   integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==
 
-"@vue/test-utils@1.0.0-beta.28":
-  version "1.0.0-beta.28"
-  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.28.tgz#767c43413df8cde86128735e58923803e444b9a5"
-  integrity sha512-uVbFJG0g/H9hf2pgWUdhvQYItRGzQ44cMFf00wp0YEo85pxuvM9e3mx8QLQfx6R2CogxbK4CvV7qvkLblehXeQ==
-  dependencies:
-    dom-event-types "^1.0.0"
-    lodash "^4.17.4"
+"@vue/test-utils@2.0.0-rc.17":
+  version "2.0.0-rc.17"
+  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-2.0.0-rc.17.tgz#e6dcf5b5bd3ae23595bdb154b9b578ebcdffd698"
+  integrity sha512-7LHZKsFRV/HqDoMVY+cJamFzgHgsrmQFalROHC5FMWrzPzd+utG5e11krj1tVsnxYufGA2ABShX4nlcHXED+zQ==
 
 "@vuelidate/core@2.0.0-alpha.35":
   version "2.0.0-alpha.35"
@@ -1811,10 +1838,6 @@ acorn@^6.4.1:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-6.4.2.tgz#35866fd710528e92de10cf06016498e47e39e1e6"
   integrity sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==
 
-after@0.8.2:
-  version "0.8.2"
-  resolved "https://registry.yarnpkg.com/after/-/after-0.8.2.tgz#fedb394f9f0e02aa9768e702bda23b505fae7e1f"
-
 agent-base@2:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-2.1.1.tgz#d6de10d5af6132d5bd692427d46fc538539094c7"
@@ -1957,7 +1980,7 @@ anymatch@^2.0.0:
     micromatch "^3.1.4"
     normalize-path "^2.1.1"
 
-anymatch@~3.1.1:
+anymatch@~3.1.1, anymatch@~3.1.2:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.2.tgz#c0557c096af32f106198f4f4e2a383537e378716"
   integrity sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==
@@ -2013,19 +2036,11 @@ array-includes@^3.1.4:
     get-intrinsic "^1.1.1"
     is-string "^1.0.7"
 
-array-slice@^0.2.3:
-  version "0.2.3"
-  resolved "https://registry.yarnpkg.com/array-slice/-/array-slice-0.2.3.tgz#dd3cfb80ed7973a75117cdac69b0b99ec86186f5"
-
 array-union@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/array-union/-/array-union-2.1.0.tgz#b798420adbeb1de828d84acd8a2e23d3efe85e8d"
   integrity sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==
 
-array-unique@^0.2.1:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.2.1.tgz#a1d97ccafcbc2625cc70fadceb36a50c58b01a53"
-
 array-unique@^0.3.2:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
@@ -2039,10 +2054,6 @@ array.prototype.flat@^1.2.5:
     define-properties "^1.1.3"
     es-abstract "^1.19.0"
 
-arraybuffer.slice@~0.0.7:
-  version "0.0.7"
-  resolved "https://registry.yarnpkg.com/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz#3bbc4275dd584cc1b10809b89d4e8b63a69e7675"
-
 arrify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
@@ -2091,10 +2102,6 @@ async-each@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.3.tgz#b727dbf87d7651602f06f4d4ac387f47d91b0cbf"
 
-async-limiter@~1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.0.tgz#78faed8c3d074ab81f22b4e985d79e8738f720f8"
-
 async@1.x:
   version "1.5.2"
   resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
@@ -2317,10 +2324,6 @@ babylon@^6.17.0, babylon@^6.18.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.18.0.tgz#af2f3b88fa6f5c1e4c634d1a0f8eac4f55b395e3"
 
-backo2@1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/backo2/-/backo2-1.0.2.tgz#31ab1ac8b129363463e35b3ebb69f4dfcfba7947"
-
 bail@^1.0.0:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/bail/-/bail-1.0.5.tgz#b6fa133404a392cbc1f8c4bf63f5953351e7a776"
@@ -2334,17 +2337,14 @@ balanced-match@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
 
-base64-arraybuffer@0.1.5:
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-0.1.5.tgz#73926771923b5a19747ad666aa5cd4bf9c6e9ce8"
-
 base64-js@^1.0.2:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.0.tgz#cab1e6118f051095e58b5281aea8c1cd22bfc0e3"
 
-base64id@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/base64id/-/base64id-1.0.0.tgz#47688cb99bb6804f0e06d3e763b1c32e57d8e6b6"
+base64id@2.0.0, base64id@~2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/base64id/-/base64id-2.0.0.tgz#2770ac6bc47d312af97a8bf9a634342e0cd25cb6"
+  integrity sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog==
 
 base@^0.11.1:
   version "0.11.2"
@@ -2358,12 +2358,6 @@ base@^0.11.1:
     mixin-deep "^1.2.0"
     pascalcase "^0.1.1"
 
-better-assert@~1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/better-assert/-/better-assert-1.0.2.tgz#40866b9e1b9e0b55b481894311e68faffaebc522"
-  dependencies:
-    callsite "1.0.0"
-
 big.js@^3.1.3:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
@@ -2381,14 +2375,6 @@ binary-extensions@^2.0.0:
   resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
   integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==
 
-blob@0.0.5:
-  version "0.0.5"
-  resolved "https://registry.yarnpkg.com/blob/-/blob-0.0.5.tgz#d680eeef25f8cd91ad533f5b01eed48e64caf683"
-
-bluebird@^3.3.0:
-  version "3.5.3"
-  resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.5.3.tgz#7d01c6f9616c9a51ab0f8c549a79dfe6ec33efa7"
-
 bluebird@^3.5.5:
   version "3.7.2"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f"
@@ -2398,7 +2384,7 @@ bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0:
   version "4.11.8"
   resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f"
 
-body-parser@1.19.2:
+body-parser@1.19.2, body-parser@^1.19.0:
   version "1.19.2"
   resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.19.2.tgz#4714ccd9c157d44797b8b5607d72c0b89952f26e"
   integrity sha512-SAAwOxgoCKMGs9uUAUFHygfLAyaniaoun6I8mFY9pRAJL9+Kec34aU+oIjDhTycub1jozEfEwx1W1IuOYxVSFw==
@@ -2414,21 +2400,6 @@ body-parser@1.19.2:
     raw-body "2.4.3"
     type-is "~1.6.18"
 
-body-parser@^1.16.1:
-  version "1.18.3"
-  resolved "https://registry.yarnpkg.com/body-parser/-/body-parser-1.18.3.tgz#5b292198ffdd553b3a0f20ded0592b956955c8b4"
-  dependencies:
-    bytes "3.0.0"
-    content-type "~1.0.4"
-    debug "2.6.9"
-    depd "~1.1.2"
-    http-errors "~1.6.3"
-    iconv-lite "0.4.23"
-    on-finished "~2.3.0"
-    qs "6.5.2"
-    raw-body "2.3.3"
-    type-is "~1.6.16"
-
 body-scroll-lock@2.7.1:
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/body-scroll-lock/-/body-scroll-lock-2.7.1.tgz#caf3f9c91773af1ffb684cd66ed9137b5b737014"
@@ -2445,12 +2416,6 @@ brace-expansion@^1.0.0, brace-expansion@^1.1.7:
     balanced-match "^1.0.0"
     concat-map "0.0.1"
 
-braces@^0.1.2:
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/braces/-/braces-0.1.5.tgz#c085711085291d8b75fdd74eab0f8597280711e6"
-  dependencies:
-    expand-range "^0.1.0"
-
 braces@^2.3.1, braces@^2.3.2:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/braces/-/braces-2.3.2.tgz#5979fd3f14cd531565e5fa2df1abfff1dfaee729"
@@ -2466,7 +2431,7 @@ braces@^2.3.1, braces@^2.3.2:
     split-string "^3.0.2"
     to-regex "^3.0.1"
 
-braces@^3.0.1, braces@~3.0.2:
+braces@^3.0.1, braces@^3.0.2, braces@~3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
   integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==
@@ -2562,26 +2527,11 @@ browserslist@^4.17.5, browserslist@^4.19.1:
     node-releases "^2.0.2"
     picocolors "^1.0.0"
 
-buffer-alloc-unsafe@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/buffer-alloc-unsafe/-/buffer-alloc-unsafe-1.1.0.tgz#bd7dc26ae2972d0eda253be061dba992349c19f0"
-
-buffer-alloc@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/buffer-alloc/-/buffer-alloc-1.2.0.tgz#890dd90d923a873e08e10e5fd51a57e5b7cce0ec"
-  dependencies:
-    buffer-alloc-unsafe "^1.1.0"
-    buffer-fill "^1.0.0"
-
 buffer-crc32@~0.2.3:
   version "0.2.13"
   resolved "https://registry.yarnpkg.com/buffer-crc32/-/buffer-crc32-0.2.13.tgz#0d333e3f00eac50aa1454abd30ef8c2a5d9a7242"
   integrity sha1-DTM+PwDqxQqhRUq9MO+MKl2ackI=
 
-buffer-fill@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/buffer-fill/-/buffer-fill-1.0.0.tgz#f8f78b76789888ef39f205cd637f68e702122b2c"
-
 buffer-from@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
@@ -2695,10 +2645,6 @@ caller-path@^2.0.0:
   dependencies:
     caller-callsite "^2.0.0"
 
-callsite@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/callsite/-/callsite-1.0.0.tgz#280398e5d664bd74038b6f0905153e6e8af1bc20"
-
 callsites@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/callsites/-/callsites-2.0.0.tgz#06eb84f00eea413da86affefacbffb36093b3c50"
@@ -2851,7 +2797,7 @@ chardet@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
 
-chokidar@^2.0.0, chokidar@^2.0.3:
+chokidar@^2.0.0:
   version "2.1.6"
   resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.1.6.tgz#b6cad653a929e244ce8a834244164d241fa954c5"
   dependencies:
@@ -2903,6 +2849,21 @@ chokidar@^3.4.1:
   optionalDependencies:
     fsevents "~2.3.1"
 
+chokidar@^3.5.1:
+  version "3.5.3"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd"
+  integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==
+  dependencies:
+    anymatch "~3.1.2"
+    braces "~3.0.2"
+    glob-parent "~5.1.2"
+    is-binary-path "~2.1.0"
+    is-glob "~4.0.1"
+    normalize-path "~3.0.0"
+    readdirp "~3.6.0"
+  optionalDependencies:
+    fsevents "~2.3.2"
+
 chownr@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-1.1.1.tgz#54726b8b8fff4df053c42187e801fb4412df1494"
@@ -2943,10 +2904,6 @@ cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
     inherits "^2.0.1"
     safe-buffer "^5.0.1"
 
-circular-json@^0.5.5:
-  version "0.5.9"
-  resolved "https://registry.yarnpkg.com/circular-json/-/circular-json-0.5.9.tgz#932763ae88f4f7dead7a0d09c8a51a4743a53b1d"
-
 clap@^1.0.9:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/clap/-/clap-1.2.3.tgz#4f36745b32008492557f46412d66d50cb99bce51"
@@ -3002,6 +2959,15 @@ cliui@^6.0.0:
     strip-ansi "^6.0.0"
     wrap-ansi "^6.2.0"
 
+cliui@^7.0.2:
+  version "7.0.4"
+  resolved "https://registry.yarnpkg.com/cliui/-/cliui-7.0.4.tgz#a0265ee655476fc807aea9df3df8df7783808b4f"
+  integrity sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==
+  dependencies:
+    string-width "^4.2.0"
+    strip-ansi "^6.0.0"
+    wrap-ansi "^7.0.0"
+
 clone-deep@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/clone-deep/-/clone-deep-4.0.1.tgz#c19fd9bdbbf85942b4fd979c84dcf7d5f07c2387"
@@ -3101,20 +3067,10 @@ colors@1.4.0:
   resolved "https://registry.yarnpkg.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
   integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
 
-colors@^1.1.0:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/colors/-/colors-1.3.3.tgz#39e005d546afe01e01f9c4ca8fa50f686a01205d"
-
 colors@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/colors/-/colors-1.1.2.tgz#168a4701756b6a7f51a12ce0c97bfa28c084ed63"
 
-combine-lists@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/combine-lists/-/combine-lists-1.0.1.tgz#458c07e09e0d900fc28b70a3fec2dacd1d2cb7f6"
-  dependencies:
-    lodash "^4.5.0"
-
 commander@2.17.x, commander@~2.17.1:
   version "2.17.1"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.17.1.tgz#bd77ab7de6de94205ceacc72f1716d29f20a77bf"
@@ -3134,17 +3090,14 @@ commondir@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
 
-component-bind@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/component-bind/-/component-bind-1.0.0.tgz#00c608ab7dcd93897c0009651b1d3a8e1e73bbd1"
-
-component-emitter@1.2.1, component-emitter@^1.2.1:
+component-emitter@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.2.1.tgz#137918d6d78283f7df7a6b7c5a63e140e69425e6"
 
-component-inherit@0.0.3:
-  version "0.0.3"
-  resolved "https://registry.yarnpkg.com/component-inherit/-/component-inherit-0.0.3.tgz#645fc4adf58b72b649d5cae65135619db26ff143"
+component-emitter@~1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.3.0.tgz#16e4070fba8ae29b679f2215853ee181ab2eabc0"
+  integrity sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==
 
 concat-map@0.0.1:
   version "0.0.1"
@@ -3164,13 +3117,14 @@ connect-history-api-fallback@1.6.0:
   resolved "https://registry.yarnpkg.com/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz#8b32089359308d111115d81cad3fceab888f97bc"
   integrity sha512-e54B99q/OUoH64zYYRf3HBP5z24G38h5D3qXu23JGRoigpX5Ss4r9ZnDk3g0Z8uQC2x2lPaJ+UlWBc1ZWBWdLg==
 
-connect@^3.6.0:
-  version "3.6.6"
-  resolved "https://registry.yarnpkg.com/connect/-/connect-3.6.6.tgz#09eff6c55af7236e137135a72574858b6786f524"
+connect@^3.7.0:
+  version "3.7.0"
+  resolved "https://registry.yarnpkg.com/connect/-/connect-3.7.0.tgz#5d49348910caa5e07a01800b030d0c35f20484f8"
+  integrity sha512-ZqRXc+tZukToSNmh5C2iWMSoV3X1YUcPbqEM4DkEG5tNQXrQUZCNVGGv3IuicnkMtPfGf3Xtp8WCXs295iQ1pQ==
   dependencies:
     debug "2.6.9"
-    finalhandler "1.1.0"
-    parseurl "~1.3.2"
+    finalhandler "1.1.2"
+    parseurl "~1.3.3"
     utils-merge "1.0.1"
 
 console-browserify@^1.1.0:
@@ -3215,11 +3169,7 @@ cookie-signature@1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/cookie-signature/-/cookie-signature-1.0.6.tgz#e303a882b342cc3ee8ca513a79999734dab3ae2c"
 
-cookie@0.3.1:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.3.1.tgz#e7e0a1f9ef43b4c8ba925c5c5a96e806d16873bb"
-
-cookie@0.4.2:
+cookie@0.4.2, cookie@~0.4.1:
   version "0.4.2"
   resolved "https://registry.yarnpkg.com/cookie/-/cookie-0.4.2.tgz#0e41f24de5ecf317947c82fc789e06a884824432"
   integrity sha512-aSWTXFzaKWkvHO1Ny/s+ePFpvKsPnjc551iI41v3ny/ow6tBG5Vd+FuqGNhh1LxOmVzOlGUriIlOaokOvhaStA==
@@ -3264,7 +3214,7 @@ core-js-compat@^3.20.2, core-js-compat@^3.21.0:
     browserslist "^4.19.1"
     semver "7.0.0"
 
-core-js@^2.2.0, core-js@^2.4.0, core-js@^2.5.0:
+core-js@^2.4.0, core-js@^2.5.0:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.2.tgz#267988d7268323b349e20b4588211655f0e83944"
 
@@ -3272,6 +3222,14 @@ core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
 
+cors@~2.8.5:
+  version "2.8.5"
+  resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.5.tgz#eac11da51592dd86b9f06f6e7ac293b3df875d29"
+  integrity sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==
+  dependencies:
+    object-assign "^4"
+    vary "^1"
+
 cosmiconfig@^5.0.0:
   version "5.2.1"
   resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-5.2.1.tgz#040f726809c591e77a17c0a3626ca45b4f168b1a"
@@ -3486,9 +3444,10 @@ data-uri-to-buffer@1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-1.2.0.tgz#77163ea9c20d8641b4707e8f18abdf9a78f34835"
 
-date-format@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/date-format/-/date-format-1.2.0.tgz#615e828e233dd1ab9bb9ae0950e0ceccfa6ecad8"
+date-format@^4.0.6:
+  version "4.0.6"
+  resolved "https://registry.yarnpkg.com/date-format/-/date-format-4.0.6.tgz#f6138b8f17968df9815b3d101fc06b0523f066c5"
+  integrity sha512-B9vvg5rHuQ8cbUXE/RMWMyX2YA5TecT3jKF5fLtGNlzPlU7zblSPmAm2OImDbWL+LDOQ6pUm+4LOFz+ywS41Zw==
 
 date-now@^0.1.4:
   version "0.1.4"
@@ -3532,18 +3491,12 @@ debug@4.1.0:
   dependencies:
     ms "^2.1.1"
 
-debug@=3.1.0, debug@~3.1.0:
+debug@=3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
   dependencies:
     ms "2.0.0"
 
-debug@^3.1.0:
-  version "3.2.6"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
-  dependencies:
-    ms "^2.1.1"
-
 debug@^3.2.7:
   version "3.2.7"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a"
@@ -3557,6 +3510,13 @@ debug@^4.0.1, debug@^4.1.0, debug@^4.1.1:
   dependencies:
     ms "^2.1.1"
 
+debug@^4.3.4, debug@~4.3.1, debug@~4.3.2:
+  version "4.3.4"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
+  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
+  dependencies:
+    ms "2.1.2"
+
 decamelize-keys@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/decamelize-keys/-/decamelize-keys-1.1.0.tgz#d171a87933252807eb3cb61dc1c1445d078df2d9"
@@ -3722,13 +3682,10 @@ dom-converter@~0.2:
   dependencies:
     utila "~0.4"
 
-dom-event-types@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/dom-event-types/-/dom-event-types-1.0.0.tgz#5830a0a29e1bf837fe50a70cd80a597232813cae"
-
-dom-serialize@^2.2.0:
+dom-serialize@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/dom-serialize/-/dom-serialize-2.2.1.tgz#562ae8999f44be5ea3076f5419dcd59eb43ac95b"
+  integrity sha1-ViromZ9Evl6jB29UGdzVnrQ6yVs=
   dependencies:
     custom-event "~1.0.0"
     ent "~2.2.0"
@@ -3854,7 +3811,7 @@ encode-utf8@^1.0.3:
   resolved "https://registry.yarnpkg.com/encode-utf8/-/encode-utf8-1.0.3.tgz#f30fdd31da07fb596f281beb2f6b027851994cda"
   integrity sha512-ucAnuBEhUK4boH2HjVYG5Q2mQyPorvv0u/ocS+zhdw0S8AlHYY+GOFhP1Gio5z4icpP2ivFSvhtFjQi8+T9ppw==
 
-encodeurl@~1.0.1, encodeurl@~1.0.2:
+encodeurl@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
 
@@ -3864,42 +3821,28 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
   dependencies:
     once "^1.4.0"
 
-engine.io-client@~3.2.0:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/engine.io-client/-/engine.io-client-3.2.1.tgz#6f54c0475de487158a1a7c77d10178708b6add36"
+engine.io-parser@~5.0.3:
+  version "5.0.3"
+  resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-5.0.3.tgz#ca1f0d7b11e290b4bfda251803baea765ed89c09"
+  integrity sha512-BtQxwF27XUNnSafQLvDi0dQ8s3i6VgzSoQMJacpIcGNrlUdfHSKbgm3jmjCVvQluGzqwujQMPAoMai3oYSTurg==
   dependencies:
-    component-emitter "1.2.1"
-    component-inherit "0.0.3"
-    debug "~3.1.0"
-    engine.io-parser "~2.1.1"
-    has-cors "1.1.0"
-    indexof "0.0.1"
-    parseqs "0.0.5"
-    parseuri "0.0.5"
-    ws "~3.3.1"
-    xmlhttprequest-ssl "~1.5.4"
-    yeast "0.1.2"
+    "@socket.io/base64-arraybuffer" "~1.0.2"
 
-engine.io-parser@~2.1.0, engine.io-parser@~2.1.1:
-  version "2.1.3"
-  resolved "https://registry.yarnpkg.com/engine.io-parser/-/engine.io-parser-2.1.3.tgz#757ab970fbf2dfb32c7b74b033216d5739ef79a6"
-  dependencies:
-    after "0.8.2"
-    arraybuffer.slice "~0.0.7"
-    base64-arraybuffer "0.1.5"
-    blob "0.0.5"
-    has-binary2 "~1.0.2"
-
-engine.io@~3.2.0:
-  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/engine.io/-/engine.io-3.2.1.tgz#b60281c35484a70ee0351ea0ebff83ec8c9522a2"
+engine.io@~6.1.0:
+  version "6.1.3"
+  resolved "https://registry.yarnpkg.com/engine.io/-/engine.io-6.1.3.tgz#f156293d011d99a3df5691ac29d63737c3302e6f"
+  integrity sha512-rqs60YwkvWTLLnfazqgZqLa/aKo+9cueVfEi/dZ8PyGyaf8TLOxj++4QMIgeG3Gn0AhrWiFXvghsoY9L9h25GA==
   dependencies:
+    "@types/cookie" "^0.4.1"
+    "@types/cors" "^2.8.12"
+    "@types/node" ">=10.0.0"
     accepts "~1.3.4"
-    base64id "1.0.0"
-    cookie "0.3.1"
-    debug "~3.1.0"
-    engine.io-parser "~2.1.0"
-    ws "~3.3.1"
+    base64id "2.0.0"
+    cookie "~0.4.1"
+    cors "~2.8.5"
+    debug "~4.3.1"
+    engine.io-parser "~5.0.3"
+    ws "~8.2.3"
 
 enhanced-resolve@^4.5.0:
   version "4.5.0"
@@ -4240,10 +4183,6 @@ etag@~1.8.1:
   version "1.8.1"
   resolved "https://registry.yarnpkg.com/etag/-/etag-1.8.1.tgz#41ae2eeb65efa62268aebfea83ac7d79299b0887"
 
-eventemitter3@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-3.1.0.tgz#090b4d6cdbd645ed10bf750d4b5407942d7ba163"
-
 eventemitter3@^4.0.0:
   version "4.0.7"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.7.tgz#2de9b68f6528d5644ef5c59526a1b4a07306169f"
@@ -4272,14 +4211,6 @@ execall@^2.0.0:
   dependencies:
     clone-regexp "^2.1.0"
 
-expand-braces@^0.1.1:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/expand-braces/-/expand-braces-0.1.2.tgz#488b1d1d2451cb3d3a6b192cfc030f44c5855fea"
-  dependencies:
-    array-slice "^0.2.3"
-    array-unique "^0.2.1"
-    braces "^0.1.2"
-
 expand-brackets@^2.1.4:
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-2.1.4.tgz#b77735e315ce30f6b6eff0f83b04151a22449622"
@@ -4292,13 +4223,6 @@ expand-brackets@^2.1.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
-expand-range@^0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/expand-range/-/expand-range-0.1.1.tgz#4cb8eda0993ca56fa4f41fc42f3cbb4ccadff044"
-  dependencies:
-    is-number "^0.1.1"
-    repeat-string "^0.2.2"
-
 express@4.17.3:
   version "4.17.3"
   resolved "https://registry.yarnpkg.com/express/-/express-4.17.3.tgz#f6c7302194a4fb54271b73a1fe7a06478c8f85a1"
@@ -4487,19 +4411,7 @@ fill-range@^7.0.1:
   dependencies:
     to-regex-range "^5.0.1"
 
-finalhandler@1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.0.tgz#ce0b6855b45853e791b2fcc680046d88253dd7f5"
-  dependencies:
-    debug "2.6.9"
-    encodeurl "~1.0.1"
-    escape-html "~1.0.3"
-    on-finished "~2.3.0"
-    parseurl "~1.3.2"
-    statuses "~1.3.1"
-    unpipe "~1.0.0"
-
-finalhandler@~1.1.2:
+finalhandler@1.1.2, finalhandler@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/finalhandler/-/finalhandler-1.1.2.tgz#b7e7d000ffd11938d0fdb053506f6ebabe9f587d"
   integrity sha512-aAWcW57uxVNrQZqFXjITpW3sIUQmHGG3qSb9mUah9MgMC4NeWhNOlNjXEYq3HjRAvL6arUviZGGJsBg6z0zsWA==
@@ -4576,6 +4488,11 @@ flatted@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/flatted/-/flatted-2.0.0.tgz#55122b6536ea496b4b44893ee2608141d10d9916"
 
+flatted@^3.2.5:
+  version "3.2.5"
+  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.5.tgz#76c8584f4fc843db64702a6bd04ab7a8bd666da3"
+  integrity sha512-WIWGi2L3DyTUvUrwRKgGi9TwxQMUEqPOPQBVi71R96jZXJdFskXEmf54BoZaS1kknGODoIGASGEzBUYdyMCBJg==
+
 flatten@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
@@ -4630,6 +4547,15 @@ from2@^2.1.0:
     inherits "^2.0.1"
     readable-stream "^2.0.0"
 
+fs-extra@^10.0.1:
+  version "10.0.1"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-10.0.1.tgz#27de43b4320e833f6867cc044bfce29fdf0ef3b8"
+  integrity sha512-NbdoVMZso2Lsrn/QwLXOy6rm0ufY2zEOKCDzJR/0kBsb0E6qed0P3iYK+Ath3BfvXEeu4JhEtXLgILx5psUfag==
+  dependencies:
+    graceful-fs "^4.2.0"
+    jsonfile "^6.0.1"
+    universalify "^2.0.0"
+
 fs-minipass@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/fs-minipass/-/fs-minipass-1.2.5.tgz#06c277218454ec288df77ada54a03b8702aacb9d"
@@ -4663,7 +4589,7 @@ fsevents@^1.2.7:
     nan "^2.12.1"
     node-pre-gyp "^0.12.0"
 
-fsevents@~2.3.1:
+fsevents@~2.3.1, fsevents@~2.3.2:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
   integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
@@ -4706,7 +4632,7 @@ gensync@^1.0.0-beta.2:
   resolved "https://registry.yarnpkg.com/gensync/-/gensync-1.0.0-beta.2.tgz#32a6ee76c3d7f52d46b2b1ae5d93fea8580a25e0"
   integrity sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==
 
-get-caller-file@^2.0.1:
+get-caller-file@^2.0.1, get-caller-file@^2.0.5:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
   integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
@@ -4773,7 +4699,7 @@ glob-parent@^5.1.0:
   dependencies:
     is-glob "^4.0.1"
 
-glob-parent@^5.1.1, glob-parent@~5.1.0:
+glob-parent@^5.1.1, glob-parent@~5.1.0, glob-parent@~5.1.2:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-5.1.2.tgz#869832c58034fe68a4093c17dc15e8340d8401c4"
   integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
@@ -4846,6 +4772,18 @@ glob@^7.1.4:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
+glob@^7.1.7:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.0.tgz#d15535af7732e02e948f4c41628bd910293f6023"
+  integrity sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==
+  dependencies:
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "^3.0.4"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
 global-modules@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/global-modules/-/global-modules-2.0.0.tgz#997605ad2345f27f51539bea26574421215c7780"
@@ -4898,6 +4836,11 @@ graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2:
   version "4.1.15"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
 
+graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.6:
+  version "4.2.9"
+  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96"
+  integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==
+
 graceful-fs@^4.2.4:
   version "4.2.4"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb"
@@ -4937,20 +4880,10 @@ has-bigints@^1.0.1:
   resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
   integrity sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA==
 
-has-binary2@~1.0.2:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/has-binary2/-/has-binary2-1.0.3.tgz#7776ac627f3ea77250cfc332dab7ddf5e4f5d11d"
-  dependencies:
-    isarray "2.0.1"
-
 has-color@~0.1.0:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/has-color/-/has-color-0.1.7.tgz#67144a5260c34fc3cca677d041daf52fe7b78b2f"
 
-has-cors@1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/has-cors/-/has-cors-1.1.0.tgz#5e474793f7ea9843d1bb99c23eef49ff126fff39"
-
 has-flag@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-1.0.0.tgz#9d9e793165ce017a00f00418c43f942a7b1d11fa"
@@ -5131,7 +5064,7 @@ htmlparser2@~3.3.0:
     domutils "1.1"
     readable-stream "1.0"
 
-http-errors@1.6.3, http-errors@~1.6.3:
+http-errors@1.6.3:
   version "1.6.3"
   resolved "https://registry.yarnpkg.com/http-errors/-/http-errors-1.6.3.tgz#8b55680bb4be283a0b5bf4ea2e38580be1d9320d"
   dependencies:
@@ -5170,15 +5103,7 @@ http-proxy-middleware@0.21.0:
     lodash "^4.17.15"
     micromatch "^4.0.2"
 
-http-proxy@^1.13.0:
-  version "1.17.0"
-  resolved "https://registry.yarnpkg.com/http-proxy/-/http-proxy-1.17.0.tgz#7ad38494658f84605e2f6db4436df410f4e5be9a"
-  dependencies:
-    eventemitter3 "^3.0.0"
-    follow-redirects "^1.0.0"
-    requires-port "^1.0.0"
-
-http-proxy@^1.18.0:
+http-proxy@^1.18.0, http-proxy@^1.18.1:
   version "1.18.1"
   resolved "https://registry.yarnpkg.com/http-proxy/-/http-proxy-1.18.1.tgz#401541f0534884bbf95260334e72f88ee3976549"
   integrity sha512-7mz/721AbnJwIVbnaSv1Cz3Am0ZLT/UBwkC92VlxhXv/k/BBQfM2fXElQNC27BVGr0uwUpplYPQM9LnaBMR5NQ==
@@ -5317,10 +5242,6 @@ indexes-of@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/indexes-of/-/indexes-of-1.0.1.tgz#f30f716c8e2bd346c7b67d3df3915566a7c05607"
 
-indexof@0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/indexof/-/indexof-0.0.1.tgz#82dc336d232b9062179d05ab3293a66059fd435d"
-
 infer-owner@^1.0.3, infer-owner@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/infer-owner/-/infer-owner-1.0.4.tgz#c4cefcaa8e51051c2a40ba2ce8a3d27295af9467"
@@ -5625,10 +5546,6 @@ is-number-object@^1.0.4:
   dependencies:
     has-tostringtag "^1.0.0"
 
-is-number@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/is-number/-/is-number-0.1.1.tgz#69a7af116963d47206ec9bd9b48a14216f1e3806"
-
 is-number@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
@@ -5779,15 +5696,10 @@ isarray@1.0.0, isarray@^1.0.0, isarray@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
 
-isarray@2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.1.tgz#a37d94ed9cda2d59865c9f76fe596ee1f338741e"
-
-isbinaryfile@^3.0.0:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/isbinaryfile/-/isbinaryfile-3.0.3.tgz#5d6def3edebf6e8ca8cae9c30183a804b5f8be80"
-  dependencies:
-    buffer-alloc "^1.2.0"
+isbinaryfile@^4.0.8:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/isbinaryfile/-/isbinaryfile-4.0.8.tgz#5d34b94865bd4946633ecc78a026fc76c5b11fcf"
+  integrity sha512-53h6XFniq77YdW+spoRrebh0mnmTxRPTlcuIArO57lmMdq4uBKFKaeTjnb92oYWrSn/LVL+LT+Hap2tFQj8V+w==
 
 isexe@^2.0.0:
   version "2.0.0"
@@ -5932,6 +5844,15 @@ json5@^2.1.2:
   dependencies:
     minimist "^1.2.5"
 
+jsonfile@^6.0.1:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-6.1.0.tgz#bc55b2634793c679ec6403094eb13698a6ec0aae"
+  integrity sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==
+  dependencies:
+    universalify "^2.0.0"
+  optionalDependencies:
+    graceful-fs "^4.1.6"
+
 karma-coverage@1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/karma-coverage/-/karma-coverage-1.1.2.tgz#cc09dceb589a83101aca5fe70c287645ef387689"
@@ -5959,12 +5880,12 @@ karma-mocha-reporter@2.2.5:
     log-symbols "^2.1.0"
     strip-ansi "^4.0.0"
 
-karma-mocha@1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/karma-mocha/-/karma-mocha-1.3.0.tgz#eeaac7ffc0e201eb63c467440d2b69c7cf3778bf"
-  integrity sha1-7qrH/8DiAetjxGdEDStpx883eL8=
+karma-mocha@2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/karma-mocha/-/karma-mocha-2.0.1.tgz#4b0254a18dfee71bdbe6188d9a6861bf86b0cd7d"
+  integrity sha512-Tzd5HBjm8his2OA4bouAsATYEpZrp9vC7z5E5j4C5Of5Rrs1jY67RAwXNcVmd/Bnk1wgvQRou0zGVLey44G4tQ==
   dependencies:
-    minimist "1.2.0"
+    minimist "^1.2.3"
 
 karma-sinon-chai@2.0.2:
   version "2.0.2"
@@ -5997,39 +5918,35 @@ karma-webpack@4.0.2:
     source-map "^0.7.3"
     webpack-dev-middleware "^3.7.0"
 
-karma@3.1.4:
-  version "3.1.4"
-  resolved "https://registry.yarnpkg.com/karma/-/karma-3.1.4.tgz#3890ca9722b10d1d14b726e1335931455788499e"
-  integrity sha512-31Vo8Qr5glN+dZEVIpnPCxEGleqE0EY6CtC2X9TagRV3rRQ3SNrvfhddICkJgUK3AgqpeKSZau03QumTGhGoSw==
+karma@6.3.17:
+  version "6.3.17"
+  resolved "https://registry.yarnpkg.com/karma/-/karma-6.3.17.tgz#5d963fb52463b73e1b5892ecb54c8f21bb04ba1d"
+  integrity sha512-2TfjHwrRExC8yHoWlPBULyaLwAFmXmxQrcuFImt/JsAsSZu1uOWTZ1ZsWjqQtWpHLiatJOHL5jFjXSJIgCd01g==
   dependencies:
-    bluebird "^3.3.0"
-    body-parser "^1.16.1"
-    chokidar "^2.0.3"
-    colors "^1.1.0"
-    combine-lists "^1.0.0"
-    connect "^3.6.0"
-    core-js "^2.2.0"
+    "@colors/colors" "1.5.0"
+    body-parser "^1.19.0"
+    braces "^3.0.2"
+    chokidar "^3.5.1"
+    connect "^3.7.0"
     di "^0.0.1"
-    dom-serialize "^2.2.0"
-    expand-braces "^0.1.1"
-    flatted "^2.0.0"
-    glob "^7.1.1"
-    graceful-fs "^4.1.2"
-    http-proxy "^1.13.0"
-    isbinaryfile "^3.0.0"
-    lodash "^4.17.5"
-    log4js "^3.0.0"
-    mime "^2.3.1"
-    minimatch "^3.0.2"
-    optimist "^0.6.1"
-    qjobs "^1.1.4"
-    range-parser "^1.2.0"
-    rimraf "^2.6.0"
-    safe-buffer "^5.0.1"
-    socket.io "2.1.1"
+    dom-serialize "^2.2.1"
+    glob "^7.1.7"
+    graceful-fs "^4.2.6"
+    http-proxy "^1.18.1"
+    isbinaryfile "^4.0.8"
+    lodash "^4.17.21"
+    log4js "^6.4.1"
+    mime "^2.5.2"
+    minimatch "^3.0.4"
+    mkdirp "^0.5.5"
+    qjobs "^1.2.0"
+    range-parser "^1.2.1"
+    rimraf "^3.0.2"
+    socket.io "^4.2.0"
     source-map "^0.6.1"
-    tmp "0.0.33"
-    useragent "2.3.0"
+    tmp "^0.2.1"
+    ua-parser-js "^0.7.30"
+    yargs "^16.1.1"
 
 kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
   version "3.2.2"
@@ -6414,12 +6331,12 @@ lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
 
-lodash@4.17.21:
+lodash@4.17.21, lodash@^4.17.21:
   version "4.17.21"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
-lodash@^4.17.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.5.0:
+lodash@^4.17.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.3, lodash@^4.17.4:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
 
@@ -6452,15 +6369,16 @@ log-symbols@^4.0.0:
   dependencies:
     chalk "^4.0.0"
 
-log4js@^3.0.0:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/log4js/-/log4js-3.0.6.tgz#e6caced94967eeeb9ce399f9f8682a4b2b28c8ff"
+log4js@^6.4.1:
+  version "6.4.4"
+  resolved "https://registry.yarnpkg.com/log4js/-/log4js-6.4.4.tgz#c9bc75569f3f40bba22fe1bd0677afa7a6a13bac"
+  integrity sha512-ncaWPsuw9Vl1CKA406hVnJLGQKy1OHx6buk8J4rE2lVW+NW5Y82G5/DIloO7NkqLOUtNPEANaWC1kZYVjXssPw==
   dependencies:
-    circular-json "^0.5.5"
-    date-format "^1.2.0"
-    debug "^3.1.0"
-    rfdc "^1.1.2"
-    streamroller "0.7.0"
+    date-format "^4.0.6"
+    debug "^4.3.4"
+    flatted "^3.2.5"
+    rfdc "^1.3.0"
+    streamroller "^3.0.6"
 
 lolex@1.6.0, lolex@^1.6.0:
   version "1.6.0"
@@ -6489,7 +6407,7 @@ lower-case@^1.1.1:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-1.1.4.tgz#9a2cabd1b9e8e0ae993a4bf7d5875c39c42e8eac"
 
-lru-cache@4.1.x, lru-cache@^4.0.1:
+lru-cache@^4.0.1:
   version "4.1.5"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.5.tgz#8bbe50ea85bed59bc9e33dcab8235ee9bcf443cd"
   dependencies:
@@ -6697,16 +6615,6 @@ mime-db@1.52.0:
   resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.52.0.tgz#bbabcdc02859f4987301c856e3387ce5ec43bf70"
   integrity sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==
 
-mime-db@~1.37.0:
-  version "1.37.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.37.0.tgz#0b6a0ce6fdbe9576e25f1f2d2fde8830dc0ad0d8"
-
-mime-types@~2.1.18:
-  version "2.1.21"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.21.tgz#28995aa1ecb770742fe6ae7e58f9181c744b3f96"
-  dependencies:
-    mime-db "~1.37.0"
-
 mime-types@~2.1.24:
   version "2.1.24"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.24.tgz#b6f8d0b3e951efb77dedeca194cff6d16f676f81"
@@ -6725,11 +6633,11 @@ mime@1.6.0:
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
   integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==
 
-mime@^2.0.3, mime@^2.3.1:
+mime@^2.0.3:
   version "2.4.3"
   resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.3.tgz#229687331e86f68924e6cb59e1cdd937f18275fe"
 
-mime@^2.4.4:
+mime@^2.4.4, mime@^2.5.2:
   version "2.6.0"
   resolved "https://registry.yarnpkg.com/mime/-/mime-2.6.0.tgz#a2a682a95cd4d0cb1d6257e28f83da7e35800367"
   integrity sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==
@@ -6786,10 +6694,15 @@ minimist@0.0.8, minimist@~0.0.1:
   version "0.0.8"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
 
-minimist@1.2.0, minimist@^1.1.3, minimist@^1.2.0:
+minimist@^1.1.3, minimist@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
+minimist@^1.2.3:
+  version "1.2.6"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44"
+  integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
+
 minimist@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
@@ -6872,7 +6785,7 @@ mkdirp@0.5.1, mkdirp@0.5.x, mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@~0.5.1:
   dependencies:
     minimist "0.0.8"
 
-mkdirp@^0.5.3:
+mkdirp@^0.5.3, mkdirp@^0.5.5:
   version "0.5.5"
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def"
   integrity sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==
@@ -7203,14 +7116,10 @@ number-is-nan@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
 
-object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
+object-assign@^4, object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
 
-object-component@0.0.3:
-  version "0.0.3"
-  resolved "https://registry.yarnpkg.com/object-component/-/object-component-0.0.3.tgz#f0c69aa50efc95b866c186f400a33769cb2f1291"
-
 object-copy@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/object-copy/-/object-copy-0.1.0.tgz#7e7d858b781bd7c991a41ba975ed3812754e998c"
@@ -7342,7 +7251,7 @@ os-homedir@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
 
-os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.1, os-tmpdir@~1.0.2:
+os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
 
@@ -7515,22 +7424,6 @@ parse-link-header@1.0.1:
   dependencies:
     xtend "~4.0.1"
 
-parseqs@0.0.5:
-  version "0.0.5"
-  resolved "https://registry.yarnpkg.com/parseqs/-/parseqs-0.0.5.tgz#d5208a3738e46766e291ba2ea173684921a8b89d"
-  dependencies:
-    better-assert "~1.0.0"
-
-parseuri@0.0.5:
-  version "0.0.5"
-  resolved "https://registry.yarnpkg.com/parseuri/-/parseuri-0.0.5.tgz#80204a50d4dbb779bfdc6ebe2778d90e4bce320a"
-  dependencies:
-    better-assert "~1.0.0"
-
-parseurl@~1.3.2:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.2.tgz#fc289d4ed8993119460c156253262cdc8de65bf3"
-
 parseurl@~1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4"
@@ -8200,9 +8093,10 @@ q@1.4.1, q@^1.1.2:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/q/-/q-1.4.1.tgz#55705bcd93c5f3673530c2c2cbc0c2b3addc286e"
 
-qjobs@^1.1.4:
+qjobs@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/qjobs/-/qjobs-1.2.0.tgz#c45e9c61800bd087ef88d7e256423bdd49e5d071"
+  integrity sha512-8YOJEHtxpySA3fFDyCRxA+UUV+fA+rTWnuWvylOK/NCjhY+b4ocCtmu8TtsWb+mYeU+GCHf/S66KZF/AsteKHg==
 
 qrcode@^1.4.4:
   version "1.5.0"
@@ -8214,10 +8108,6 @@ qrcode@^1.4.4:
     pngjs "^5.0.0"
     yargs "^15.3.1"
 
-qs@6.5.2:
-  version "6.5.2"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
-
 qs@6.9.7:
   version "6.9.7"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.9.7.tgz#4610846871485e1e048f44ae3b94033f0e675afe"
@@ -8257,16 +8147,12 @@ randomfill@^1.0.3:
     randombytes "^2.0.5"
     safe-buffer "^5.1.0"
 
-range-parser@^1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.0.tgz#f49be6b487894ddc40dcc94a322f611092e00d5e"
-
 range-parser@^1.2.1, range-parser@~1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031"
   integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==
 
-raw-body@2, raw-body@2.3.3:
+raw-body@2:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/raw-body/-/raw-body-2.3.3.tgz#1b324ece6b5706e153855bc1148c65bb7f6ea0c3"
   dependencies:
@@ -8333,7 +8219,7 @@ read-pkg@^5.2.0:
     parse-json "^5.0.0"
     type-fest "^0.6.0"
 
-"readable-stream@1 || 2", readable-stream@2, readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.0, readable-stream@^2.3.3, readable-stream@^2.3.6, readable-stream@~2.3.6:
+"readable-stream@1 || 2", readable-stream@2, readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.6, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@^2.3.3, readable-stream@^2.3.6, readable-stream@~2.3.6:
   version "2.3.6"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
   dependencies:
@@ -8387,6 +8273,13 @@ readdirp@~3.5.0:
   dependencies:
     picomatch "^2.2.1"
 
+readdirp@~3.6.0:
+  version "3.6.0"
+  resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7"
+  integrity sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==
+  dependencies:
+    picomatch "^2.2.1"
+
 rechoir@^0.6.2:
   version "0.6.2"
   resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
@@ -8580,10 +8473,6 @@ repeat-element@^1.1.2:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce"
 
-repeat-string@^0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-0.2.2.tgz#c7a8d3236068362059a7e4651fc6884e8b1fb4ae"
-
 repeat-string@^1.0.0, repeat-string@^1.5.4, repeat-string@^1.6.1:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637"
@@ -8676,11 +8565,12 @@ reusify@^1.0.4:
   resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
   integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
 
-rfdc@^1.1.2:
-  version "1.1.4"
-  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.1.4.tgz#ba72cc1367a0ccd9cf81a870b3b58bd3ad07f8c2"
+rfdc@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.3.0.tgz#d0b7c441ab2720d05dc4cf26e01c89631d9da08b"
+  integrity sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==
 
-rimraf@2.6.3, rimraf@^2.5.4, rimraf@^2.6.0, rimraf@^2.6.1:
+rimraf@2.6.3, rimraf@^2.5.4, rimraf@^2.6.1:
   version "2.6.3"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.3.tgz#b2d104fe0d8fb27cf9e0a1cda8262dd3833c6cab"
   dependencies:
@@ -8693,7 +8583,7 @@ rimraf@^2.6.3:
   dependencies:
     glob "^7.1.3"
 
-rimraf@^3.0.2:
+rimraf@^3.0.0, rimraf@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a"
   integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==
@@ -9035,47 +8925,31 @@ snapdragon@^0.8.1:
     source-map-resolve "^0.5.0"
     use "^3.1.0"
 
-socket.io-adapter@~1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/socket.io-adapter/-/socket.io-adapter-1.1.1.tgz#2a805e8a14d6372124dd9159ad4502f8cb07f06b"
+socket.io-adapter@~2.3.3:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/socket.io-adapter/-/socket.io-adapter-2.3.3.tgz#4d6111e4d42e9f7646e365b4f578269821f13486"
+  integrity sha512-Qd/iwn3VskrpNO60BeRyCyr8ZWw9CPZyitW4AQwmRZ8zCiyDiL+znRnWX6tDHXnWn1sJrM1+b6Mn6wEDJJ4aYQ==
 
-socket.io-client@2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/socket.io-client/-/socket.io-client-2.1.1.tgz#dcb38103436ab4578ddb026638ae2f21b623671f"
+socket.io-parser@~4.0.4:
+  version "4.0.4"
+  resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-4.0.4.tgz#9ea21b0d61508d18196ef04a2c6b9ab630f4c2b0"
+  integrity sha512-t+b0SS+IxG7Rxzda2EVvyBZbvFPBCjJoyHuE0P//7OAsN23GItzDRdWa6ALxZI/8R5ygK7jAR6t028/z+7295g==
   dependencies:
-    backo2 "1.0.2"
-    base64-arraybuffer "0.1.5"
-    component-bind "1.0.0"
-    component-emitter "1.2.1"
-    debug "~3.1.0"
-    engine.io-client "~3.2.0"
-    has-binary2 "~1.0.2"
-    has-cors "1.1.0"
-    indexof "0.0.1"
-    object-component "0.0.3"
-    parseqs "0.0.5"
-    parseuri "0.0.5"
-    socket.io-parser "~3.2.0"
-    to-array "0.1.4"
+    "@types/component-emitter" "^1.2.10"
+    component-emitter "~1.3.0"
+    debug "~4.3.1"
 
-socket.io-parser@~3.2.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/socket.io-parser/-/socket.io-parser-3.2.0.tgz#e7c6228b6aa1f814e6148aea325b51aa9499e077"
+socket.io@^4.2.0:
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/socket.io/-/socket.io-4.4.1.tgz#cd6de29e277a161d176832bb24f64ee045c56ab8"
+  integrity sha512-s04vrBswdQBUmuWJuuNTmXUVJhP0cVky8bBDhdkf8y0Ptsu7fKU2LuLbts9g+pdmAdyMMn8F/9Mf1/wbtUN0fg==
   dependencies:
-    component-emitter "1.2.1"
-    debug "~3.1.0"
-    isarray "2.0.1"
-
-socket.io@2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/socket.io/-/socket.io-2.1.1.tgz#a069c5feabee3e6b214a75b40ce0652e1cfb9980"
-  dependencies:
-    debug "~3.1.0"
-    engine.io "~3.2.0"
-    has-binary2 "~1.0.2"
-    socket.io-adapter "~1.1.0"
-    socket.io-client "2.1.1"
-    socket.io-parser "~3.2.0"
+    accepts "~1.3.4"
+    base64id "~2.0.0"
+    debug "~4.3.2"
+    engine.io "~6.1.0"
+    socket.io-adapter "~2.3.3"
+    socket.io-parser "~4.0.4"
 
 socks-proxy-agent@2:
   version "2.1.1"
@@ -9238,10 +9112,6 @@ static-extend@^0.1.1:
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c"
   integrity sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow=
 
-statuses@~1.3.1:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.3.1.tgz#faf51b9eb74aaef3b3acf4ad5f61abf24cb7b93e"
-
 stream-browserify@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/stream-browserify/-/stream-browserify-2.0.1.tgz#66266ee5f9bdb9940a4e4514cafb43bb71e5c9db"
@@ -9270,14 +9140,14 @@ stream-shift@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/stream-shift/-/stream-shift-1.0.0.tgz#d5c752825e5367e786f78e18e445ea223a155952"
 
-streamroller@0.7.0:
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/streamroller/-/streamroller-0.7.0.tgz#a1d1b7cf83d39afb0d63049a5acbf93493bdf64b"
+streamroller@^3.0.6:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/streamroller/-/streamroller-3.0.6.tgz#52823415800ded79a49aa3f7712f50a422b97493"
+  integrity sha512-Qz32plKq/MZywYyhEatxyYc8vs994Gz0Hu2MSYXXLD233UyPeIeRBZARIIGwFer4Mdb8r3Y2UqKkgyDghM6QCg==
   dependencies:
-    date-format "^1.2.0"
-    debug "^3.1.0"
-    mkdirp "^0.5.1"
-    readable-stream "^2.3.0"
+    date-format "^4.0.6"
+    debug "^4.3.4"
+    fs-extra "^10.0.1"
 
 strict-uri-encode@^1.0.0:
   version "1.1.0"
@@ -9687,21 +9557,18 @@ timers-browserify@^2.0.4:
   dependencies:
     setimmediate "^1.0.4"
 
-tmp@0.0.33, tmp@^0.0.33:
+tmp@^0.0.33:
   version "0.0.33"
   resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.33.tgz#6d34335889768d21b2bcda0aa277ced3b1bfadf9"
   dependencies:
     os-tmpdir "~1.0.2"
 
-tmp@0.0.x:
-  version "0.0.31"
-  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.0.31.tgz#8f38ab9438e17315e5dbd8b3657e8bfb277ae4a7"
+tmp@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.2.1.tgz#8457fc3037dcf4719c251367a1af6500ee1ccf14"
+  integrity sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==
   dependencies:
-    os-tmpdir "~1.0.1"
-
-to-array@0.1.4:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/to-array/-/to-array-0.1.4.tgz#17e6c11f73dd4f3d74cda7a4ff3238e9ad9bf890"
+    rimraf "^3.0.0"
 
 to-arraybuffer@^1.0.0:
   version "1.0.1"
@@ -9832,13 +9699,6 @@ type-fest@^0.8.1:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
   integrity sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==
 
-type-is@~1.6.16:
-  version "1.6.16"
-  resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.16.tgz#f89ce341541c672b25ee7ae3c73dee3b2be50194"
-  dependencies:
-    media-typer "0.3.0"
-    mime-types "~2.1.18"
-
 type-is@~1.6.18:
   version "1.6.18"
   resolved "https://registry.yarnpkg.com/type-is/-/type-is-1.6.18.tgz#4e552cd05df09467dcbc4ef739de89f2cf37c131"
@@ -9858,6 +9718,11 @@ typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
 
+ua-parser-js@^0.7.30:
+  version "0.7.31"
+  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.31.tgz#649a656b191dffab4f21d5e053e27ca17cbff5c6"
+  integrity sha512-qLK/Xe9E2uzmYI3qLeOmI0tEOt+TBBQyUIAh4aAgU05FVYzeZrKUdkAZfBNVGRaHVgV0TDkdEngJSw/SyQchkQ==
+
 uglify-js@3.4.x, uglify-js@^3.1.4:
   version "3.4.9"
   resolved "https://registry.yarnpkg.com/uglify-js/-/uglify-js-3.4.9.tgz#af02f180c1207d76432e473ed24a28f4a782bae3"
@@ -9865,10 +9730,6 @@ uglify-js@3.4.x, uglify-js@^3.1.4:
     commander "~2.17.1"
     source-map "~0.6.1"
 
-ultron@~1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.1.1.tgz#9fe1536a10a664a65266a1e3ccf85fd36302bc9c"
-
 unbox-primitive@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.1.tgz#085e215625ec3162574dc8859abee78a59b14471"
@@ -9998,6 +9859,11 @@ unist-util-visit@^2.0.0:
     unist-util-is "^4.0.0"
     unist-util-visit-parents "^3.0.0"
 
+universalify@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
+  integrity sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==
+
 unpipe@1.0.0, unpipe@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unpipe/-/unpipe-1.0.0.tgz#b2bf4ee8514aae6165b4817829d21b2ef49904ec"
@@ -10047,13 +9913,6 @@ use@^3.1.0:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/use/-/use-3.1.1.tgz#d50c8cac79a19fbc20f2911f56eb973f4e10070f"
 
-useragent@2.3.0:
-  version "2.3.0"
-  resolved "https://registry.yarnpkg.com/useragent/-/useragent-2.3.0.tgz#217f943ad540cb2128658ab23fc960f6a88c9972"
-  dependencies:
-    lru-cache "4.1.x"
-    tmp "0.0.x"
-
 util-deprecate@^1.0.1, util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
@@ -10101,7 +9960,7 @@ validate-npm-package-license@^3.0.1:
     spdx-correct "^3.0.0"
     spdx-expression-parse "^3.0.0"
 
-vary@~1.1.2:
+vary@^1, vary@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
 
@@ -10363,6 +10222,15 @@ wrap-ansi@^6.2.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
+wrap-ansi@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
+  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
+  dependencies:
+    ansi-styles "^4.0.0"
+    string-width "^4.1.0"
+    strip-ansi "^6.0.0"
+
 wrappy@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
@@ -10383,17 +10251,10 @@ write@1.0.3:
   dependencies:
     mkdirp "^0.5.1"
 
-ws@~3.3.1:
-  version "3.3.3"
-  resolved "https://registry.yarnpkg.com/ws/-/ws-3.3.3.tgz#f1cf84fe2d5e901ebce94efaece785f187a228f2"
-  dependencies:
-    async-limiter "~1.0.0"
-    safe-buffer "~5.1.0"
-    ultron "~1.1.0"
-
-xmlhttprequest-ssl@~1.5.4:
-  version "1.5.5"
-  resolved "https://registry.yarnpkg.com/xmlhttprequest-ssl/-/xmlhttprequest-ssl-1.5.5.tgz#c2876b06168aadc40e57d97e81191ac8f4398b3e"
+ws@~8.2.3:
+  version "8.2.3"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-8.2.3.tgz#63a56456db1b04367d0b721a0b80cae6d8becbba"
+  integrity sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA==
 
 xregexp@2.0.0:
   version "2.0.0"
@@ -10412,6 +10273,11 @@ y18n@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.0.tgz#95ef94f85ecc81d007c264e190a120f0a3c8566b"
 
+y18n@^5.0.5:
+  version "5.0.8"
+  resolved "https://registry.yarnpkg.com/y18n/-/y18n-5.0.8.tgz#7f4934d0f7ca8c56f95314939ddcd2dd91ce1d55"
+  integrity sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==
+
 yallist@^2.1.2:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-2.1.2.tgz#1c11f9218f076089a47dd512f93c6699a6a81d52"
@@ -10438,6 +10304,11 @@ yargs-parser@^18.1.2, yargs-parser@^18.1.3:
     camelcase "^5.0.0"
     decamelize "^1.2.0"
 
+yargs-parser@^20.2.2:
+  version "20.2.9"
+  resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-20.2.9.tgz#2eb7dc3b0289718fc295f362753845c41a0c94ee"
+  integrity sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==
+
 yargs@^15.3.1:
   version "15.4.1"
   resolved "https://registry.yarnpkg.com/yargs/-/yargs-15.4.1.tgz#0d87a16de01aee9d8bec2bfbf74f67851730f4f8"
@@ -10455,6 +10326,19 @@ yargs@^15.3.1:
     y18n "^4.0.0"
     yargs-parser "^18.1.2"
 
+yargs@^16.1.1:
+  version "16.2.0"
+  resolved "https://registry.yarnpkg.com/yargs/-/yargs-16.2.0.tgz#1c82bf0f6b6a66eafce7ef30e376f49a12477f66"
+  integrity sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==
+  dependencies:
+    cliui "^7.0.2"
+    escalade "^3.1.1"
+    get-caller-file "^2.0.5"
+    require-directory "^2.1.1"
+    string-width "^4.2.0"
+    y18n "^5.0.5"
+    yargs-parser "^20.2.2"
+
 yauzl@^2.10.0:
   version "2.10.0"
   resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.10.0.tgz#c7eb17c93e112cb1086fa6d8e51fb0667b79a5f9"
@@ -10463,10 +10347,6 @@ yauzl@^2.10.0:
     buffer-crc32 "~0.2.3"
     fd-slicer "~1.1.0"
 
-yeast@0.1.2:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/yeast/-/yeast-0.1.2.tgz#008e06d8094320c372dbc2f8ed76a0ca6c8ac419"
-
 yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"

From c2cf13fc006aa1e513feb99799a8d2df14119eca Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 16:40:45 +0200
Subject: [PATCH 043/113] fix richcontent and its tests

---
 src/components/rich_content/rich_content.jsx  |   7 +-
 .../specs/components/rich_content.spec.js     | 234 +++++++++---------
 2 files changed, 124 insertions(+), 117 deletions(-)

diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx
index 97c51189..41e287e4 100644
--- a/src/components/rich_content/rich_content.jsx
+++ b/src/components/rich_content/rich_content.jsx
@@ -1,4 +1,3 @@
-import { h } from 'vue'
 import { unescape, flattenDeep } from 'lodash'
 import { getTagName, processTextForEmoji, getAttrs } from 'src/services/html_converter/utility.service.js'
 import { convertHtmlToTree } from 'src/services/html_converter/html_tree_converter.service.js'
@@ -82,12 +81,12 @@ export default {
     }
 
     const renderHashtag = (attrs, children, encounteredTextReverse) => {
-      const linkData = getLinkData(attrs, children, tagsIndex++)
+      const { index, ...linkData } = getLinkData(attrs, children, tagsIndex++)
       writtenTags.push(linkData)
       if (!encounteredTextReverse) {
         lastTags.push(linkData)
       }
-      return <HashtagLink {...{ props: linkData }}/>
+      return <HashtagLink { ...linkData }/>
     }
 
     const renderMention = (attrs, children) => {
@@ -235,7 +234,7 @@ export default {
           const newChildren = Array.isArray(children)
             ? [...children].reverse().map(processItemReverse).reverse()
             : children
-          return <Tag {...{ attrs: getAttrs(opener) }}>
+          return <Tag {...getAttrs(opener)}>
             { newChildren }
           </Tag>
         } else {
diff --git a/test/unit/specs/components/rich_content.spec.js b/test/unit/specs/components/rich_content.spec.js
index 30c66a33..a4920867 100644
--- a/test/unit/specs/components/rich_content.spec.js
+++ b/test/unit/specs/components/rich_content.spec.js
@@ -1,8 +1,15 @@
-import { mount, shallowMount, createLocalVue } from '@vue/test-utils'
+import { mount, shallowMount } from '@vue/test-utils'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
 
-const localVue = createLocalVue()
 const attentions = []
+const global = {
+  mocks: {
+    '$store': null
+  },
+  stubs: {
+    FAIcon: true
+  }
+}
 
 const makeMention = (who) => {
   attentions.push({ statusnet_profile_url: `https://fake.tld/@${who}` })
@@ -11,17 +18,17 @@ const makeMention = (who) => {
 const p = (...data) => `<p>${data.join('')}</p>`
 const compwrap = (...data) => `<span class="RichContent">${data.join('')}</span>`
 const mentionsLine = (times) => [
-  '<mentionsline-stub mentions="',
+  '<mentions-line-stub mentions="',
   new Array(times).fill('[object Object]').join(','),
-  '"></mentionsline-stub>'
+  '"></mentions-line-stub>'
 ].join('')
 
 describe('RichContent', () => {
   it('renders simple post without exploding', () => {
     const html = p('Hello world!')
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -30,7 +37,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(html))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(html))
   })
 
   it('unescapes everything as needed', () => {
@@ -43,8 +50,8 @@ describe('RichContent', () => {
       'Testing \'em all'
     ].join('')
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -53,7 +60,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('replaces mention with mentionsline', () => {
@@ -62,8 +69,8 @@ describe('RichContent', () => {
       ' how are you doing today?'
     )
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -72,7 +79,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(p(
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(p(
       mentionsLine(1),
       ' how are you doing today?'
     )))
@@ -93,17 +100,17 @@ describe('RichContent', () => {
       ),
       // TODO fix this extra line somehow?
       p(
-        '<mentionsline-stub mentions="',
+        '<mentions-line-stub mentions="',
         '[object Object],',
         '[object Object],',
         '[object Object]',
-        '"></mentionsline-stub>'
+        '"></mentions-line-stub>'
       )
     ].join('')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -112,7 +119,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('Does not touch links if link handling is disabled', () => {
@@ -130,8 +137,8 @@ describe('RichContent', () => {
     ].join('\n')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: false,
         greentext: true,
@@ -154,8 +161,8 @@ describe('RichContent', () => {
     ].join('\n')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: false,
         greentext: true,
@@ -174,8 +181,8 @@ describe('RichContent', () => {
     ].join('\n')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: false,
         greentext: false,
@@ -191,12 +198,12 @@ describe('RichContent', () => {
     const html = p('Ebin :DDDD :spurdo:')
     const expected = p(
       'Ebin :DDDD ',
-      '<anonymous-stub alt=":spurdo:" src="about:blank" title=":spurdo:" class="emoji img"></anonymous-stub>'
+      '<anonymous-stub src="about:blank" alt=":spurdo:" class="emoji img" title=":spurdo:"></anonymous-stub>'
     )
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: false,
         greentext: false,
@@ -205,15 +212,15 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('Doesn\'t add nonexistent emoji to post', () => {
     const html = p('Lol :lol:')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: false,
         greentext: false,
@@ -222,7 +229,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(html))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(html))
   })
 
   it('Greentext + last mentions', () => {
@@ -240,8 +247,8 @@ describe('RichContent', () => {
     ].join('\n')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -272,8 +279,8 @@ describe('RichContent', () => {
     ].join('<br>')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -282,7 +289,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('buggy example/hashtags', () => {
@@ -300,16 +307,18 @@ describe('RichContent', () => {
       '<p>',
       '<a href="http://macrochan.org/images/N/H/NHCMDUXJPPZ6M3Z2CQ6D2EBRSWGE7MZY.jpg" target="_blank">',
       'NHCMDUXJPPZ6M3Z2CQ6D2EBRSWGE7MZY.jpg</a>',
-      ' <hashtaglink-stub url="https://shitposter.club/tag/nou" content="#nou" tag="nou">',
-      '</hashtaglink-stub>',
-      ' <hashtaglink-stub url="https://shitposter.club/tag/screencap" content="#screencap" tag="screencap">',
-      '</hashtaglink-stub>',
+      ' <hashtag-link-stub url="https://shitposter.club/tag/nou" content="#nou" tag="nou">',
+      '#nou',
+      '</hashtag-link-stub>',
+      ' <hashtag-link-stub url="https://shitposter.club/tag/screencap" content="#screencap" tag="screencap">',
+      '#screencap',
+      '</hashtag-link-stub>',
       ' </p>'
     ].join('')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -318,7 +327,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('rich contents of a mention are handled properly', () => {
@@ -342,7 +351,8 @@ describe('RichContent', () => {
       p(
         '<span class="MentionsLine">',
         '<span class="MentionLink mention-link">',
-        '<a href="lol" target="_blank" class="original">',
+        '<!-- eslint-disable vue/no-v-html -->',
+        '<a href="lol" class="original" target="_blank">',
         '<span>',
         'https://</span>',
         '<span>',
@@ -350,9 +360,10 @@ describe('RichContent', () => {
         '<span>',
         '</span>',
         '</a>',
-        '<!---->', // v-if placeholder, mentionlink's "new" (i.e. rich) display
+        '<!-- eslint-enable vue/no-v-html -->',
+        '<!--v-if-->', // v-if placeholder, mentionlink's "new" (i.e. rich) display
         '</span>',
-        '<!---->', // v-if placeholder, mentionsline's extra mentions and stuff
+        '<!--v-if-->', // v-if placeholder, mentionsline's extra mentions and stuff
         '</span>'
       ),
       p(
@@ -361,8 +372,8 @@ describe('RichContent', () => {
     ].join('')
 
     const wrapper = mount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -371,76 +382,73 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('rich contents of nested mentions are handled properly', () => {
     attentions.push({ statusnet_profile_url: 'lol' })
     const html = [
-      p(
-        '<span class="poast-style">',
-        '<a href="lol" class="mention">',
-        '<span>',
-        'https://</span>',
-        '<span>',
-        'lol.tld/</span>',
-        '<span>',
-        '</span>',
-        '</a>',
-        ' ',
-        '<a href="lol" class="mention">',
-        '<span>',
-        'https://</span>',
-        '<span>',
-        'lol.tld/</span>',
-        '<span>',
-        '</span>',
-        '</a>',
-        '</span>'
-      ),
-      p(
-        'Testing'
-      )
+      '<span class="poast-style">',
+      '<a href="lol" class="mention">',
+      '<span>',
+      'https://</span>',
+      '<span>',
+      'lol.tld/</span>',
+      '<span>',
+      '</span>',
+      '</a>',
+      ' ',
+      '<a href="lol" class="mention">',
+      '<span>',
+      'https://</span>',
+      '<span>',
+      'lol.tld/</span>',
+      '<span>',
+      '</span>',
+      '</a>',
+      ' ',
+      '</span>',
+      'Testing'
     ].join('')
     const expected = [
-      p(
-        '<span class="poast-style">',
-        '<span class="MentionsLine">',
-        '<span class="MentionLink mention-link">',
-        '<a href="lol" target="_blank" class="original">',
-        '<span>',
-        'https://</span>',
-        '<span>',
-        'lol.tld/</span>',
-        '<span>',
-        '</span>',
-        '</a>',
-        '<!---->', // v-if placeholder, mentionlink's "new" (i.e. rich) display
-        '</span>',
-        '<span class="MentionLink mention-link">',
-        '<a href="lol" target="_blank" class="original">',
-        '<span>',
-        'https://</span>',
-        '<span>',
-        'lol.tld/</span>',
-        '<span>',
-        '</span>',
-        '</a>',
-        '<!---->', // v-if placeholder, mentionlink's "new" (i.e. rich) display
-        '</span>',
-        '<!---->', // v-if placeholder, mentionsline's extra mentions and stuff
-        '</span>',
-        '</span>'
-      ),
+      '<span class="poast-style">',
+      '<span class="MentionsLine">',
+      '<span class="MentionLink mention-link">',
+      '<!-- eslint-disable vue/no-v-html -->',
+      '<a href="lol" class="original" target="_blank">',
+      '<span>',
+      'https://</span>',
+      '<span>',
+      'lol.tld/</span>',
+      '<span>',
+      '</span>',
+      '</a>',
+      '<!-- eslint-enable vue/no-v-html -->',
+      '<!--v-if-->', // v-if placeholder, mentionlink's "new" (i.e. rich) display
+      '</span>',
+      '<span class="MentionLink mention-link">',
+      '<!-- eslint-disable vue/no-v-html -->',
+      '<a href="lol" class="original" target="_blank">',
+      '<span>',
+      'https://</span>',
+      '<span>',
+      'lol.tld/</span>',
+      '<span>',
+      '</span>',
+      '</a>',
+      '<!-- eslint-enable vue/no-v-html -->',
+      '<!--v-if-->', // v-if placeholder, mentionlink's "new" (i.e. rich) display
+      '</span>',
+      '<!--v-if-->', // v-if placeholder, mentionsline's extra mentions and stuff
+      '</span>',
       ' ',
-      p(
-        'Testing'
-      )
+      '</span>',
+      'Testing'
     ].join('')
 
     const wrapper = mount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -449,7 +457,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it('rich contents of a link are handled properly', () => {
@@ -483,8 +491,8 @@ describe('RichContent', () => {
     ].join('')
 
     const wrapper = shallowMount(RichContent, {
-      localVue,
-      propsData: {
+      global,
+      props: {
         attentions,
         handleLinks: true,
         greentext: true,
@@ -493,7 +501,7 @@ describe('RichContent', () => {
       }
     })
 
-    expect(wrapper.html()).to.eql(compwrap(expected))
+    expect(wrapper.html().replace(/\n/g, '')).to.eql(compwrap(expected))
   })
 
   it.skip('[INFORMATIVE] Performance testing, 10 000 simple posts', () => {
@@ -530,8 +538,8 @@ describe('RichContent', () => {
       const t0 = performance.now()
 
       const wrapper = mount(TestComponent, {
-        localVue,
-        propsData: {
+        global,
+        props: {
           attentions,
           handleLinks,
           vhtml

From 9d7a7e2019601dd1f7877d8fce2a07c5e459941e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 18:14:56 +0200
Subject: [PATCH 044/113] fix emoji input tests

---
 src/components/emoji_input/emoji_input.js     |  7 +-
 .../unit/specs/components/emoji_input.spec.js | 78 ++++++++++---------
 2 files changed, 48 insertions(+), 37 deletions(-)

diff --git a/src/components/emoji_input/emoji_input.js b/src/components/emoji_input/emoji_input.js
index 5b51da18..e772bf75 100644
--- a/src/components/emoji_input/emoji_input.js
+++ b/src/components/emoji_input/emoji_input.js
@@ -189,8 +189,11 @@ const EmojiInput = {
           img: imageUrl || ''
         }))
     },
-    suggestions (newValue) {
-      this.$nextTick(this.resize)
+    suggestions: {
+      handler (newValue) {
+        this.$nextTick(this.resize)
+      },
+      deep: true
     }
   },
   methods: {
diff --git a/test/unit/specs/components/emoji_input.spec.js b/test/unit/specs/components/emoji_input.spec.js
index 045b47fd..6188308e 100644
--- a/test/unit/specs/components/emoji_input.spec.js
+++ b/test/unit/specs/components/emoji_input.spec.js
@@ -1,108 +1,116 @@
-import { shallowMount, createLocalVue } from '@vue/test-utils'
+import { h } from 'vue'
+import { shallowMount } from '@vue/test-utils'
 import EmojiInput from 'src/components/emoji_input/emoji_input.vue'
+import vClickOutside from 'click-outside-vue3'
 
 const generateInput = (value, padEmoji = true) => {
-  const localVue = createLocalVue()
-  localVue.directive('click-outside', () => {})
   const wrapper = shallowMount(EmojiInput, {
-    propsData: {
-      suggest: () => [],
-      enableEmojiPicker: true,
-      value
-    },
-    mocks: {
-      $store: {
-        getters: {
-          mergedConfig: {
-            padEmoji
+    global: {
+      renderStubDefaultSlot: true,
+      mocks: {
+        $store: {
+          getters: {
+            mergedConfig: {
+              padEmoji
+            }
           }
         }
+      },
+      stubs: {
+        FAIcon: true
+      },
+      directives: {
+        'click-outside': vClickOutside
       }
     },
-    slots: {
-      default: '<input />'
+    props: {
+      suggest: () => [],
+      enableEmojiPicker: true,
+      modelValue: value
     },
-    localVue
+    slots: {
+      'default': () => h('input', '')
+    }
   })
-  return [wrapper, localVue]
+  return wrapper
 }
 
 describe('EmojiInput', () => {
   describe('insertion mechanism', () => {
     it('inserts string at the end with trailing space', () => {
       const initialString = 'Testing'
-      const [wrapper] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length })
       wrapper.vm.insert({ insertion: '(test)', keepOpen: false })
-      const inputEvents = wrapper.emitted().input
+      const inputEvents = wrapper.emitted()['update:modelValue']
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('Testing (test) ')
     })
 
     it('inserts string at the end with trailing space (source has a trailing space)', () => {
       const initialString = 'Testing '
-      const [wrapper] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length })
       wrapper.vm.insert({ insertion: '(test)', keepOpen: false })
-      const inputEvents = wrapper.emitted().input
+      const inputEvents = wrapper.emitted()['update:modelValue']
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('Testing (test) ')
     })
 
     it('inserts string at the begginning without leading space', () => {
       const initialString = 'Testing'
-      const [wrapper] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: 0 })
       wrapper.vm.insert({ insertion: '(test)', keepOpen: false })
-      const inputEvents = wrapper.emitted().input
+      const inputEvents = wrapper.emitted()['update:modelValue']
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('(test) Testing')
     })
 
     it('inserts string between words without creating extra spaces', () => {
       const initialString = 'Spurdo Sparde'
-      const [wrapper] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: 6 })
       wrapper.vm.insert({ insertion: ':ebin:', keepOpen: false })
-      const inputEvents = wrapper.emitted().input
+      const inputEvents = wrapper.emitted()['update:modelValue']
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('Spurdo :ebin: Sparde')
     })
 
     it('inserts string between words without creating extra spaces (other caret)', () => {
       const initialString = 'Spurdo Sparde'
-      const [wrapper] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: 7 })
       wrapper.vm.insert({ insertion: ':ebin:', keepOpen: false })
-      const inputEvents = wrapper.emitted().input
+      const inputEvents = wrapper.emitted()['update:modelValue']
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('Spurdo :ebin: Sparde')
     })
 
     it('inserts string without any padding if padEmoji setting is set to false', () => {
       const initialString = 'Eat some spam!'
-      const [wrapper] = generateInput(initialString, false)
+      const wrapper = generateInput(initialString, false)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length, keepOpen: false })
       wrapper.vm.insert({ insertion: ':spam:' })
-      const inputEvents = wrapper.emitted().input
+      const inputEvents = wrapper.emitted()['update:modelValue']
       expect(inputEvents[inputEvents.length - 1][0]).to.eql('Eat some spam!:spam:')
     })
 
     it('correctly sets caret after insertion at beginning', (done) => {
       const initialString = '1234'
-      const [wrapper, vue] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: 0 })
       wrapper.vm.insert({ insertion: '1234', keepOpen: false })
-      vue.nextTick(() => {
+      wrapper.vm.$nextTick(() => {
         expect(wrapper.vm.caret).to.eql(5)
         done()
       })
@@ -110,12 +118,12 @@ describe('EmojiInput', () => {
 
     it('correctly sets caret after insertion at end', (done) => {
       const initialString = '1234'
-      const [wrapper, vue] = generateInput(initialString)
+      const wrapper = generateInput(initialString)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length })
       wrapper.vm.insert({ insertion: '1234', keepOpen: false })
-      vue.nextTick(() => {
+      wrapper.vm.$nextTick(() => {
         expect(wrapper.vm.caret).to.eql(10)
         done()
       })
@@ -123,12 +131,12 @@ describe('EmojiInput', () => {
 
     it('correctly sets caret after insertion if padEmoji setting is set to false', (done) => {
       const initialString = '1234'
-      const [wrapper, vue] = generateInput(initialString, false)
+      const wrapper = generateInput(initialString, false)
       const input = wrapper.find('input')
       input.setValue(initialString)
       wrapper.setData({ caret: initialString.length })
       wrapper.vm.insert({ insertion: '1234', keepOpen: false })
-      vue.nextTick(() => {
+      wrapper.vm.$nextTick(() => {
         expect(wrapper.vm.caret).to.eql(8)
         done()
       })

From e5ae0671ce9f74bc67fea550204c18bad8f39150 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 18:56:39 +0200
Subject: [PATCH 045/113] skip user profile test for now
 https://github.com/vuejs/test-utils/issues/1382

---
 .../specs/components/user_profile.spec.js     | 48 +++++++++----------
 1 file changed, 24 insertions(+), 24 deletions(-)

diff --git a/test/unit/specs/components/user_profile.spec.js b/test/unit/specs/components/user_profile.spec.js
index 142db73c..584758f7 100644
--- a/test/unit/specs/components/user_profile.spec.js
+++ b/test/unit/specs/components/user_profile.spec.js
@@ -1,12 +1,9 @@
-import { mount, createLocalVue } from '@vue/test-utils'
-import Vuex from 'vuex'
+import { mount } from '@vue/test-utils'
+import { createStore } from 'vuex'
 import UserProfile from 'src/components/user_profile/user_profile.vue'
 import backendInteractorService from 'src/services/backend_interactor_service/backend_interactor_service.js'
 import { getters } from 'src/modules/users.js'
 
-const localVue = createLocalVue()
-localVue.use(Vuex)
-
 const mutations = {
   clearTimeline: () => {}
 }
@@ -42,7 +39,7 @@ const extUser = {
   screen_name_ui: 'testUser@test.instance'
 }
 
-const externalProfileStore = new Vuex.Store({
+const externalProfileStore = createStore({
   mutations,
   actions,
   getters: testGetters,
@@ -104,7 +101,7 @@ const externalProfileStore = new Vuex.Store({
   }
 })
 
-const localProfileStore = new Vuex.Store({
+const localProfileStore = createStore({
   mutations,
   actions,
   getters: testGetters,
@@ -173,17 +170,19 @@ const localProfileStore = new Vuex.Store({
   }
 })
 
-describe('UserProfile', () => {
+// https://github.com/vuejs/test-utils/issues/1382
+describe.skip('UserProfile', () => {
   it('renders external profile', () => {
     const wrapper = mount(UserProfile, {
-      localVue,
-      store: externalProfileStore,
-      mocks: {
-        $route: {
-          params: { id: 100 },
-          name: 'external-user-profile'
-        },
-        $t: (msg) => msg
+      global: {
+        plugins: [ externalProfileStore ],
+        mocks: {
+          $route: {
+            params: { id: 100 },
+            name: 'external-user-profile'
+          },
+          $t: (msg) => msg
+        }
       }
     })
 
@@ -192,14 +191,15 @@ describe('UserProfile', () => {
 
   it('renders local profile', () => {
     const wrapper = mount(UserProfile, {
-      localVue,
-      store: localProfileStore,
-      mocks: {
-        $route: {
-          params: { name: 'testUser' },
-          name: 'user-profile'
-        },
-        $t: (msg) => msg
+      global: {
+        plugins: [ localProfileStore ],
+        mocks: {
+          $route: {
+            params: { name: 'testUser' },
+            name: 'user-profile'
+          },
+          $t: (msg) => msg
+        }
       }
     })
 

From 3250e59266eb552ba3ef120bb7e2465f79340e4f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 18:56:54 +0200
Subject: [PATCH 046/113] fix routes test

---
 test/unit/specs/boot/routes.spec.js | 39 +++++++++++++----------------
 1 file changed, 17 insertions(+), 22 deletions(-)

diff --git a/test/unit/specs/boot/routes.spec.js b/test/unit/specs/boot/routes.spec.js
index 3673256f..439aefd4 100644
--- a/test/unit/specs/boot/routes.spec.js
+++ b/test/unit/specs/boot/routes.spec.js
@@ -1,45 +1,40 @@
-import Vuex from 'vuex'
 import routes from 'src/boot/routes'
-import { createLocalVue } from '@vue/test-utils'
-import VueRouter from 'vue-router'
+import { createRouter, createMemoryHistory } from 'vue-router'
+import { createStore } from 'vuex'
 
-const localVue = createLocalVue()
-localVue.use(Vuex)
-localVue.use(VueRouter)
-
-const store = new Vuex.Store({
+const store = createStore({
   state: {
     instance: {}
   }
 })
 
 describe('routes', () => {
-  const router = new VueRouter({
-    mode: 'abstract',
+  const router = createRouter({
+    history: createMemoryHistory(),
     routes: routes(store)
   })
 
-  it('root path', () => {
-    router.push('/main/all')
+  it('root path', async () => {
+    await router.push('/main/all')
 
-    const matchedComponents = router.getMatchedComponents()
+    const matchedComponents = router.currentRoute.value.matched
 
-    expect(matchedComponents[0].components.hasOwnProperty('Timeline')).to.eql(true)
+    expect(matchedComponents[0].components.default.components.hasOwnProperty('Timeline')).to.eql(true)
   })
 
-  it('user\'s profile', () => {
-    router.push('/fake-user-name')
+  it('user\'s profile', async () => {
+    await router.push('/fake-user-name')
 
-    const matchedComponents = router.getMatchedComponents()
+    const matchedComponents = router.currentRoute.value.matched
 
-    expect(matchedComponents[0].components.hasOwnProperty('UserCard')).to.eql(true)
+    expect(matchedComponents[0].components.default.components.hasOwnProperty('UserCard')).to.eql(true)
   })
 
-  it('user\'s profile at /users', () => {
-    router.push('/users/fake-user-name')
+  it('user\'s profile at /users', async () => {
+    await router.push('/users/fake-user-name')
 
-    const matchedComponents = router.getMatchedComponents()
+    const matchedComponents = router.currentRoute.value.matched
 
-    expect(matchedComponents[0].components.hasOwnProperty('UserCard')).to.eql(true)
+    expect(matchedComponents[0].components.default.components.hasOwnProperty('UserCard')).to.eql(true)
   })
 })

From 6b5791fda6fdf2efe39e1c05e3340a5cf970f312 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 19:20:12 +0200
Subject: [PATCH 047/113] fix other weird route

---
 src/boot/routes.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/boot/routes.js b/src/boot/routes.js
index e5bdd1f0..905ffe41 100644
--- a/src/boot/routes.js
+++ b/src/boot/routes.js
@@ -46,7 +46,7 @@ export default (store) => {
     { name: 'bookmarks', path: '/bookmarks', component: BookmarkTimeline },
     { name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } },
     { name: 'remote-user-profile-acct',
-      path: '/remote-users/(@?):username([^/@]+)@:hostname([^/@]+)',
+      path: '/remote-users/:_(@)?:username([^/@]+)@:hostname([^/@]+)',
       component: RemoteUserResolver,
       beforeEnter: validateAuthenticatedRoute
     },

From b817e09ee8ed4e02a6757b2c4e5577c5f82bec45 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 19:43:11 +0200
Subject: [PATCH 048/113] fix avatars not opening inline card

---
 src/components/notification/notification.vue | 2 +-
 src/components/status/status.vue             | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index c03ebc89..2af4af22 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -33,7 +33,7 @@
     >
       <a
         class="avatar-container"
-        :href="notification.from_profile.statusnet_profile_url"
+        :href="$router.resolve(userProfileLink).href"
         @click.stop.prevent.capture="toggleUserExpanded"
       >
         <UserAvatar
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index eb30f28b..3f352f03 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -121,8 +121,8 @@
           v-if="!noHeading"
           class="left-side"
         >
-          <router-link
-            :to="userProfileLink"
+          <a
+            :href="$router.resolve(userProfileLink).href"
             @click.stop.prevent.capture="toggleUserExpanded"
           >
             <UserAvatar
@@ -132,7 +132,7 @@
               :better-shadow="betterShadow"
               :user="status.user"
             />
-          </router-link>
+          </a>
         </div>
         <div class="right-side">
           <UserCard

From c5a6f40dff714c49f0cc1472f9b70e3efdf7efca Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 20:15:21 +0200
Subject: [PATCH 049/113] fix tabs not being able to be "disabled"

---
 src/components/tab_switcher/tab_switcher.scss | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss
index 0ed614b7..575d41e1 100644
--- a/src/components/tab_switcher/tab_switcher.scss
+++ b/src/components/tab_switcher/tab_switcher.scss
@@ -166,13 +166,6 @@
     position: relative;
     white-space: nowrap;
     padding: 6px 1em;
-    background-color: $fallback--fg;
-    background-color: var(--tab, $fallback--fg);
-
-    &, &:active .tab-icon {
-      color: $fallback--text;
-      color: var(--tabText, $fallback--text);
-    }
 
     &:not(.active) {
       z-index: 4;

From 538903f9d8deee121526a2c7337c0db98d3b7d71 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 20:17:25 +0200
Subject: [PATCH 050/113] fix selects in settings screen

---
 src/components/settings_modal/helpers/choice_setting.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index 54f5d0a7..28bd8500 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -5,9 +5,9 @@
   >
     <slot />
     <Select
-      :value="state"
+      :modelValue="state"
       :disabled="disabled"
-      @change="update"
+      @update:modelValue="update"
     >
       <option
         v-for="option in options"

From 7afa6c9f406795a4fddb3c40a4011b321ee460bc Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 20:22:28 +0200
Subject: [PATCH 051/113] listeners aren't actually used

---
 src/hocs/with_load_more/with_load_more.jsx       | 2 +-
 src/hocs/with_subscription/with_subscription.jsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/hocs/with_load_more/with_load_more.jsx b/src/hocs/with_load_more/with_load_more.jsx
index e57f9b20..360b439a 100644
--- a/src/hocs/with_load_more/with_load_more.jsx
+++ b/src/hocs/with_load_more/with_load_more.jsx
@@ -81,10 +81,10 @@ const withLoadMore = ({
       }
     },
     render () {
+      console.log(this.$listeners)
       const props = {
         ...this.$props,
         [childPropName]: this.entries
-        // on: this.$listeners // TODO fix listeners
       }
       const children = this.$slots
       return (
diff --git a/src/hocs/with_subscription/with_subscription.jsx b/src/hocs/with_subscription/with_subscription.jsx
index 5ba2662b..da1b2cc9 100644
--- a/src/hocs/with_subscription/with_subscription.jsx
+++ b/src/hocs/with_subscription/with_subscription.jsx
@@ -61,11 +61,11 @@ const withSubscription = ({
       }
     },
     render () {
+      console.log(this.$listeners)
       if (!this.error && !this.loading) {
         const props = {
           ...this.$props,
           [childPropName]: this.fetchedData
-          // on: this.$listeners // TODO
         }
         const children = this.$slots
         return (

From d524e983487edd45c2a6558878c21e78b9d1ff38 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 22 Mar 2022 20:42:29 +0200
Subject: [PATCH 052/113] fix capitalization (and localization of tooltips for
 scope icon)

---
 src/components/status/status.js  | 8 +++-----
 src/components/status/status.vue | 2 +-
 src/i18n/en.json                 | 8 +++++++-
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index e54be241..088ddcc5 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -389,6 +389,9 @@ const Status = {
     },
     threadShowing () {
       return this.controlledThreadDisplayStatus === 'showing'
+    },
+    visibilityLocalized () {
+      return this.$i18n.t('general.scope_in_timeline.' + this.status.visibility)
     }
   },
   methods: {
@@ -478,11 +481,6 @@ const Status = {
     'isSuspendable': function (val) {
       this.suspendable = val
     }
-  },
-  filters: {
-    capitalize: function (str) {
-      return str.charAt(0).toUpperCase() + str.slice(1)
-    }
   }
 }
 
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 3f352f03..ceb5a95a 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -192,7 +192,7 @@
                 <span
                   v-if="status.visibility"
                   class="visibility-icon"
-                  :title="status.visibility"
+                  :title="visibilityLocalized"
                 >
                   <FAIcon
                     fixed-width
diff --git a/src/i18n/en.json b/src/i18n/en.json
index f3401e61..d0af7268 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -85,7 +85,13 @@
     },
     "flash_content": "Click to show Flash content using Ruffle (Experimental, may not work).",
     "flash_security": "Note that this can be potentially dangerous since Flash content is still arbitrary code.",
-    "flash_fail": "Failed to load flash content, see console for details."
+    "flash_fail": "Failed to load flash content, see console for details.",
+    "scope_in_timeline": {
+      "direct": "Direct",
+      "private": "Followers-only",
+      "public": "Public",
+      "unlisted": "Unlisted"
+    }
   },
   "image_cropper": {
     "crop_picture": "Crop picture",

From 322ec8681a2fef8f789c0f5cf09c8bbe3689fca4 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 15:44:37 +0200
Subject: [PATCH 053/113] cleanup

---
 .babelrc     |  2 +-
 package.json |  1 -
 yarn.lock    | 94 +---------------------------------------------------
 3 files changed, 2 insertions(+), 95 deletions(-)

diff --git a/.babelrc b/.babelrc
index 79d2b7a4..373d2c59 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,5 +1,5 @@
 {
-  "presets": ["@babel/preset-env", "@vue/babel-preset-jsx"],
+  "presets": ["@babel/preset-env"],
   "plugins": ["@babel/plugin-transform-runtime", "lodash", "@vue/babel-plugin-jsx"],
   "comments": false
 }
diff --git a/package.json b/package.json
index fb156c54..eb4306cd 100644
--- a/package.json
+++ b/package.json
@@ -50,7 +50,6 @@
     "@babel/register": "7.17.7",
     "@ungap/event-target": "0.2.3",
     "@vue/babel-helper-vue-jsx-merge-props": "1.2.1",
-    "@vue/babel-preset-jsx": "1.2.4",
     "@vue/babel-plugin-jsx": "1.1.1",
     "@vue/test-utils": "2.0.0-rc.17",
     "@vue/compiler-sfc": "^3.1.0",
diff --git a/yarn.lock b/yarn.lock
index 97eaa130..933b568a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -643,13 +643,6 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.16.7"
 
-"@babel/plugin-syntax-jsx@^7.2.0":
-  version "7.7.4"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.7.4.tgz#dab2b56a36fb6c3c222a1fbc71f7bf97f327a9ec"
-  integrity sha512-wuy6fiMe9y7HeZBWXYCGt2RGxZOj0BImZ9EyXJVnVGBKO/Br592rbR3rtIQn0eQhAk9vqaKP5n8tVqEFBQMfLg==
-  dependencies:
-    "@babel/helper-plugin-utils" "^7.0.0"
-
 "@babel/plugin-syntax-logical-assignment-operators@^7.10.4":
   version "7.10.4"
   resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz#ca91ef46303530448b906652bac2e9fe9941f699"
@@ -1434,7 +1427,7 @@
   resolved "https://registry.yarnpkg.com/@ungap/event-target/-/event-target-0.2.3.tgz#be682c681126dca2371c4e1a1721f8e8bb400905"
   integrity sha512-7Bz0qdvxNGV9n0f+xcMKU7wsEfK6PNzo8IdAcOiBgMNyCuU0Mk9dv0Hbd/Kgr+MFFfn4xLHFbuOt820egT5qEA==
 
-"@vue/babel-helper-vue-jsx-merge-props@1.2.1", "@vue/babel-helper-vue-jsx-merge-props@^1.2.1":
+"@vue/babel-helper-vue-jsx-merge-props@1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz#31624a7a505fb14da1d58023725a4c5f270e6a81"
   integrity sha512-QOi5OW45e2R20VygMSNhyQHvpdUwQZqGPc748JLGCYEy+yp8fNFNdbNIGAgZmi9e+2JHPd6i6idRuqivyicIkA==
@@ -1459,81 +1452,6 @@
     html-tags "^3.1.0"
     svg-tags "^1.0.0"
 
-"@vue/babel-plugin-transform-vue-jsx@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@vue/babel-plugin-transform-vue-jsx/-/babel-plugin-transform-vue-jsx-1.2.1.tgz#646046c652c2f0242727f34519d917b064041ed7"
-  integrity sha512-HJuqwACYehQwh1fNT8f4kyzqlNMpBuUK4rSiSES5D4QsYncv5fxFsLyrxFPG2ksO7t5WP+Vgix6tt6yKClwPzA==
-  dependencies:
-    "@babel/helper-module-imports" "^7.0.0"
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-    "@vue/babel-helper-vue-jsx-merge-props" "^1.2.1"
-    html-tags "^2.0.0"
-    lodash.kebabcase "^4.1.1"
-    svg-tags "^1.0.0"
-
-"@vue/babel-preset-jsx@1.2.4":
-  version "1.2.4"
-  resolved "https://registry.yarnpkg.com/@vue/babel-preset-jsx/-/babel-preset-jsx-1.2.4.tgz#92fea79db6f13b01e80d3a0099e2924bdcbe4e87"
-  integrity sha512-oRVnmN2a77bYDJzeGSt92AuHXbkIxbf/XXSE3klINnh9AXBmVS1DGa1f0d+dDYpLfsAKElMnqKTQfKn7obcL4w==
-  dependencies:
-    "@vue/babel-helper-vue-jsx-merge-props" "^1.2.1"
-    "@vue/babel-plugin-transform-vue-jsx" "^1.2.1"
-    "@vue/babel-sugar-composition-api-inject-h" "^1.2.1"
-    "@vue/babel-sugar-composition-api-render-instance" "^1.2.4"
-    "@vue/babel-sugar-functional-vue" "^1.2.2"
-    "@vue/babel-sugar-inject-h" "^1.2.2"
-    "@vue/babel-sugar-v-model" "^1.2.3"
-    "@vue/babel-sugar-v-on" "^1.2.3"
-
-"@vue/babel-sugar-composition-api-inject-h@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@vue/babel-sugar-composition-api-inject-h/-/babel-sugar-composition-api-inject-h-1.2.1.tgz#05d6e0c432710e37582b2be9a6049b689b6f03eb"
-  integrity sha512-4B3L5Z2G+7s+9Bwbf+zPIifkFNcKth7fQwekVbnOA3cr3Pq71q71goWr97sk4/yyzH8phfe5ODVzEjX7HU7ItQ==
-  dependencies:
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-
-"@vue/babel-sugar-composition-api-render-instance@^1.2.4":
-  version "1.2.4"
-  resolved "https://registry.yarnpkg.com/@vue/babel-sugar-composition-api-render-instance/-/babel-sugar-composition-api-render-instance-1.2.4.tgz#e4cbc6997c344fac271785ad7a29325c51d68d19"
-  integrity sha512-joha4PZznQMsxQYXtR3MnTgCASC9u3zt9KfBxIeuI5g2gscpTsSKRDzWQt4aqNIpx6cv8On7/m6zmmovlNsG7Q==
-  dependencies:
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-
-"@vue/babel-sugar-functional-vue@^1.2.2":
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/@vue/babel-sugar-functional-vue/-/babel-sugar-functional-vue-1.2.2.tgz#267a9ac8d787c96edbf03ce3f392c49da9bd2658"
-  integrity sha512-JvbgGn1bjCLByIAU1VOoepHQ1vFsroSA/QkzdiSs657V79q6OwEWLCQtQnEXD/rLTA8rRit4rMOhFpbjRFm82w==
-  dependencies:
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-
-"@vue/babel-sugar-inject-h@^1.2.2":
-  version "1.2.2"
-  resolved "https://registry.yarnpkg.com/@vue/babel-sugar-inject-h/-/babel-sugar-inject-h-1.2.2.tgz#d738d3c893367ec8491dcbb669b000919293e3aa"
-  integrity sha512-y8vTo00oRkzQTgufeotjCLPAvlhnpSkcHFEp60+LJUwygGcd5Chrpn5480AQp/thrxVm8m2ifAk0LyFel9oCnw==
-  dependencies:
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-
-"@vue/babel-sugar-v-model@^1.2.3":
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/@vue/babel-sugar-v-model/-/babel-sugar-v-model-1.2.3.tgz#fa1f29ba51ebf0aa1a6c35fa66d539bc459a18f2"
-  integrity sha512-A2jxx87mySr/ulAsSSyYE8un6SIH0NWHiLaCWpodPCVOlQVODCaSpiR4+IMsmBr73haG+oeCuSvMOM+ttWUqRQ==
-  dependencies:
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-    "@vue/babel-helper-vue-jsx-merge-props" "^1.2.1"
-    "@vue/babel-plugin-transform-vue-jsx" "^1.2.1"
-    camelcase "^5.0.0"
-    html-tags "^2.0.0"
-    svg-tags "^1.0.0"
-
-"@vue/babel-sugar-v-on@^1.2.3":
-  version "1.2.3"
-  resolved "https://registry.yarnpkg.com/@vue/babel-sugar-v-on/-/babel-sugar-v-on-1.2.3.tgz#342367178586a69f392f04bfba32021d02913ada"
-  integrity sha512-kt12VJdz/37D3N3eglBywV8GStKNUhNrsxChXIV+o0MwVXORYuhDTHJRKPgLJRb/EY3vM2aRFQdxJBp9CLikjw==
-  dependencies:
-    "@babel/plugin-syntax-jsx" "^7.2.0"
-    "@vue/babel-plugin-transform-vue-jsx" "^1.2.1"
-    camelcase "^5.0.0"
-
 "@vue/compat@^3.1.0":
   version "3.2.31"
   resolved "https://registry.yarnpkg.com/@vue/compat/-/compat-3.2.31.tgz#9c8bdf265eeba1777e5edb56cda73581e351a648"
@@ -5020,11 +4938,6 @@ html-minifier@^3.2.3:
     relateurl "0.2.x"
     uglify-js "3.4.x"
 
-html-tags@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-2.0.0.tgz#10b30a386085f43cede353cc8fa7cb0deeea668b"
-  integrity sha1-ELMKOGCF9Dzt41PMj6fLDe7qZos=
-
 html-tags@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-3.1.0.tgz#7b5e6f7e665e9fb41f30007ed9e0d41e97fb2140"
@@ -6258,11 +6171,6 @@ lodash.istypedarray@^3.0.0:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/lodash.istypedarray/-/lodash.istypedarray-3.0.6.tgz#c9a477498607501d8e8494d283b87c39281cef62"
 
-lodash.kebabcase@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/lodash.kebabcase/-/lodash.kebabcase-4.1.1.tgz#8489b1cb0d29ff88195cceca448ff6d6cc295c36"
-  integrity sha1-hImxyw0p/4gZXM7KRI/21swpXDY=
-
 lodash.keys@^3.0.0:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"

From d690b88c1c240f0f05062051b8e852f626dd4b9d Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 15:53:36 +0200
Subject: [PATCH 054/113] fix animations

---
 src/App.scss                                  |  2 +-
 .../settings_modal/settings_modal.vue         | 32 +++++++++----------
 2 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index bc027f4f..180c0daf 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -572,7 +572,7 @@ nav {
 .fade-enter-active, .fade-leave-active {
   transition: opacity .2s
 }
-.fade-enter, .fade-leave-active {
+.fade-enter-from, .fade-leave-active {
   opacity: 0
 }
 
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 18b151f4..fd4953d7 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -11,24 +11,22 @@
           {{ $t('settings.settings') }}
         </span>
         <transition name="fade">
-          <div>
-            <template v-if="currentSaveStateNotice">
-              <div
-                v-if="currentSaveStateNotice.error"
-                class="alert error"
-                @click.prevent
-              >
-                {{ $t('settings.saving_err') }}
-              </div>
+          <div v-if="currentSaveStateNotice">
+            <div
+              v-if="currentSaveStateNotice.error"
+              class="alert error"
+              @click.prevent
+            >
+              {{ $t('settings.saving_err') }}
+            </div>
 
-              <div
-                v-if="!currentSaveStateNotice.error"
-                class="alert transparent"
-                @click.prevent
-              >
-                {{ $t('settings.saving_ok') }}
-              </div>
-            </template>
+            <div
+              v-if="!currentSaveStateNotice.error"
+              class="alert transparent"
+              @click.prevent
+            >
+              {{ $t('settings.saving_ok') }}
+            </div>
           </div>
         </transition>
         <button

From a6fae395dac4f56ba0a48880f0ce2500b5dd5ebd Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 16:05:53 +0200
Subject: [PATCH 055/113] fix dupe id

---
 src/App.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 3532f898..bee98751 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,11 +1,11 @@
 <template>
   <div
-    id="app"
-    :style="bgStyle"
+    id="app-loaded"
   >
     <div
       id="app_bg_wrapper"
       class="app-bg-wrapper"
+      :style="bgStyle"
     />
     <MobileNav v-if="isMobileLayout" />
     <DesktopNav v-else />

From 08811e5a27548f18c1107170b892a4f614658dc5 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 16:08:45 +0200
Subject: [PATCH 056/113] fix spacings in notifications

---
 src/components/notification/notification.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 2af4af22..23157a51 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -65,12 +65,16 @@
               v-else
               class="username"
               :title="'@'+notification.from_profile.screen_name_ui"
-            >{{ notification.from_profile.name }}</span>
+            >
+              {{ notification.from_profile.name }}
+            </span>
+            {{ ' ' }}
             <span v-if="notification.type === 'like'">
               <FAIcon
                 class="type-icon"
                 icon="star"
               />
+              {{ ' ' }}
               <small>{{ $t('notifications.favorited_you') }}</small>
             </span>
             <span v-if="notification.type === 'repeat'">
@@ -79,6 +83,7 @@
                 icon="retweet"
                 :title="$t('tool_tip.repeat')"
               />
+              {{ ' ' }}
               <small>{{ $t('notifications.repeated_you') }}</small>
             </span>
             <span v-if="notification.type === 'follow'">
@@ -86,6 +91,7 @@
                 class="type-icon"
                 icon="user-plus"
               />
+              {{ ' ' }}
               <small>{{ $t('notifications.followed_you') }}</small>
             </span>
             <span v-if="notification.type === 'follow_request'">
@@ -93,6 +99,7 @@
                 class="type-icon"
                 icon="user"
               />
+              {{ ' ' }}
               <small>{{ $t('notifications.follow_request') }}</small>
             </span>
             <span v-if="notification.type === 'move'">
@@ -100,6 +107,7 @@
                 class="type-icon"
                 icon="suitcase-rolling"
               />
+              {{ ' ' }}
               <small>{{ $t('notifications.migrated_to') }}</small>
             </span>
             <span v-if="notification.type === 'pleroma:emoji_reaction'">

From 961ca3a71b2e5b5f98df5613d4348c8efee6ba05 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 16:15:05 +0200
Subject: [PATCH 057/113] fix all the spacings i could find

---
 src/components/font_control/font_control.vue                   | 1 +
 .../interface_language_switcher.vue                            | 1 +
 src/components/poll/poll_form.vue                              | 1 +
 src/components/scope_selector/scope_selector.vue               | 3 +++
 src/components/select/select.vue                               | 1 +
 src/components/settings_modal/helpers/choice_setting.vue       | 1 +
 src/components/settings_modal/settings_modal.vue               | 1 +
 src/components/settings_modal/tabs/theme_tab/theme_tab.vue     | 1 +
 src/components/status/status.vue                               | 1 +
 src/components/user_card/user_card.vue                         | 1 +
 10 files changed, 12 insertions(+)

diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index ddda218b..72b480ef 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -22,6 +22,7 @@
       class="opt-l"
       :for="name + '-o'"
     />
+    {{ ' ' }}
     <Select
       :id="name + '-font-switcher'"
       v-model="preset"
diff --git a/src/components/interface_language_switcher/interface_language_switcher.vue b/src/components/interface_language_switcher/interface_language_switcher.vue
index cf307a24..6d1f83c4 100644
--- a/src/components/interface_language_switcher/interface_language_switcher.vue
+++ b/src/components/interface_language_switcher/interface_language_switcher.vue
@@ -3,6 +3,7 @@
     <label for="interface-language-switcher">
       {{ $t('settings.interfaceLanguage') }}
     </label>
+    {{ ' ' }}
     <Select
       id="interface-language-switcher"
       v-model="language"
diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue
index 3620075a..f269d60e 100644
--- a/src/components/poll/poll_form.vue
+++ b/src/components/poll/poll_form.vue
@@ -72,6 +72,7 @@
           :max="maxExpirationInCurrentUnit"
           @change="expiryAmountChange"
         >
+        {{ ' ' }}
         <Select
           v-model="expiryUnit"
           unstyled="true"
diff --git a/src/components/scope_selector/scope_selector.vue b/src/components/scope_selector/scope_selector.vue
index a01242fc..f3bee183 100644
--- a/src/components/scope_selector/scope_selector.vue
+++ b/src/components/scope_selector/scope_selector.vue
@@ -16,6 +16,7 @@
         class="fa-scale-110 fa-old-padding"
       />
     </button>
+    {{ ' ' }}
     <button
       v-if="showPrivate"
       class="button-unstyled scope"
@@ -29,6 +30,7 @@
         class="fa-scale-110 fa-old-padding"
       />
     </button>
+    {{ ' ' }}
     <button
       v-if="showUnlisted"
       class="button-unstyled scope"
@@ -42,6 +44,7 @@
         class="fa-scale-110 fa-old-padding"
       />
     </button>
+    {{ ' ' }}
     <button
       v-if="showPublic"
       class="button-unstyled scope"
diff --git a/src/components/select/select.vue b/src/components/select/select.vue
index 08c88979..ea8c8b69 100644
--- a/src/components/select/select.vue
+++ b/src/components/select/select.vue
@@ -10,6 +10,7 @@
     >
       <slot />
     </select>
+    {{ ' ' }}
     <FAIcon
       class="select-down-icon"
       icon="chevron-down"
diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index 28bd8500..b6aa853a 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -4,6 +4,7 @@
     class="ChoiceSetting"
   >
     <slot />
+    {{ ' ' }}
     <Select
       :modelValue="state"
       :disabled="disabled"
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index fd4953d7..603688e4 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -68,6 +68,7 @@
               :title="$t('general.close')"
             >
               <span>{{ $t("settings.file_export_import.backup_restore") }}</span>
+              {{ ' ' }}
               <FAIcon
                 icon="chevron-down"
               />
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index c02986ed..177498f8 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -903,6 +903,7 @@
           <div class="tab-header shadow-selector">
             <div class="select-container">
               {{ $t('settings.style.shadows.component') }}
+              {{ ' ' }}
               <Select
                 id="shadow-switcher"
                 v-model="shadowSelected"
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index ceb5a95a..c832758d 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -275,6 +275,7 @@
                       icon="reply"
                       flip="horizontal"
                     />
+                    {{ ' ' }}
                     <span
                       class="reply-to-text"
                     >
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 0708f387..14b4643a 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -141,6 +141,7 @@
               class="userHighlightCl"
               type="color"
             >
+            {{ ' ' }}
             <Select
               :id="'userHighlightSel'+user.id"
               v-model="userHighlightType"

From 01d8fa4e543b0a349c95ea7e60a79cf5ecc82157 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 16:31:34 +0200
Subject: [PATCH 058/113] fix i18n at places

---
 src/components/conversation/conversation.vue  | 46 +++++++++++--------
 .../helpers/boolean_setting.vue               |  1 +
 .../helpers/integer_setting.vue               |  1 +
 .../tabs/theme_tab/theme_tab.vue              | 19 ++++----
 .../shadow_control/shadow_control.vue         |  6 +--
 src/components/thread_tree/thread_tree.vue    | 46 +++++++++++--------
 6 files changed, 67 insertions(+), 52 deletions(-)

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 7628ceaa..39c5db33 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -27,20 +27,23 @@
           v-if="shouldShowAllConversationButton"
           class="conversation-dive-to-top-level-box"
         >
-          <i18n
-            path="status.show_all_conversation_with_icon"
+          <i18n-t
+            keypath="status.show_all_conversation_with_icon"
             tag="button"
             class="button-unstyled -link"
             @click.prevent="diveToTopLevel"
           >
-            <FAIcon
-              place="icon"
-              icon="angle-double-left"
-            />
-            <span place="text">
-              {{ $tc('status.show_all_conversation', otherTopLevelCount, { numStatus: otherTopLevelCount }) }}
-            </span>
-          </i18n>
+            <template #icon>
+              <FAIcon
+                icon="angle-double-left"
+              />
+            </template>
+            <template #text>
+              <span>
+                {{ $tc('status.show_all_conversation', otherTopLevelCount, { numStatus: otherTopLevelCount }) }}
+              </span>
+            </template>
+          </i18n-t>
         </div>
         <div
           v-if="shouldShowAncestors"
@@ -96,20 +99,23 @@
               <div
                 class="thread-ancestor-dive-box-inner"
               >
-                <i18n
+                <i18n-t
                   tag="button"
-                  path="status.ancestor_follow_with_icon"
+                  keypath="status.ancestor_follow_with_icon"
                   class="button-unstyled -link thread-tree-show-replies-button"
                   @click.prevent="diveIntoStatus(status.id)"
                 >
-                  <FAIcon
-                    place="icon"
-                    icon="angle-double-right"
-                  />
-                  <span place="text">
-                    {{ $tc('status.ancestor_follow', getReplies(status.id).length - 1, { numReplies: getReplies(status.id).length - 1 }) }}
-                  </span>
-                </i18n>
+                  <template #icon>
+                    <FAIcon
+                      icon="angle-double-right"
+                    />
+                  </template>
+                  <template #text>
+                    <span>
+                      {{ $tc('status.ancestor_follow', getReplies(status.id).length - 1, { numReplies: getReplies(status.id).length - 1 }) }}
+                    </span>
+                  </template>
+                </i18n-t>
               </div>
             </div>
           </div>
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index e0d825f2..131377b9 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -14,6 +14,7 @@
       >
         <slot />
       </span>
+      {{ ' ' }}
       <ModifiedIndicator :changed="isChanged" /><ServerSideIndicator :server-side="isServerSide" /> </Checkbox>
   </label>
 </template>
diff --git a/src/components/settings_modal/helpers/integer_setting.vue b/src/components/settings_modal/helpers/integer_setting.vue
index 408b0925..e661a025 100644
--- a/src/components/settings_modal/helpers/integer_setting.vue
+++ b/src/components/settings_modal/helpers/integer_setting.vue
@@ -16,6 +16,7 @@
       :value="state"
       @change="update"
     >
+    {{ ' ' }}
     <ModifiedIndicator :changed="isChanged" />
   </span>
 </template>
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index 177498f8..e86528b8 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -925,6 +925,7 @@
               >
                 {{ $t('settings.style.shadows.override') }}
               </label>
+              {{ ' ' }}
               <input
                 id="override"
                 v-model="currentShadowOverriden"
@@ -950,27 +951,27 @@
             :fallback="currentShadowFallback"
           />
           <div v-if="shadowSelected === 'avatar' || shadowSelected === 'avatarStatus'">
-            <i18n
-              path="settings.style.shadows.filter_hint.always_drop_shadow"
+            <i18n-t
+              keypath="settings.style.shadows.filter_hint.always_drop_shadow"
               tag="p"
             >
               <code>filter: drop-shadow()</code>
-            </i18n>
+            </i18n-t>
             <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
-            <i18n
-              path="settings.style.shadows.filter_hint.drop_shadow_syntax"
+            <i18n-t
+              keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
               tag="p"
             >
               <code>drop-shadow</code>
               <code>spread-radius</code>
               <code>inset</code>
-            </i18n>
-            <i18n
-              path="settings.style.shadows.filter_hint.inset_classic"
+            </i18n-t>
+            <i18n-t
+              keypath="settings.style.shadows.filter_hint.inset_classic"
               tag="p"
             >
               <code>box-shadow</code>
-            </i18n>
+            </i18n-t>
             <p>{{ $t('settings.style.shadows.filter_hint.spread_zero') }}</p>
           </div>
         </div>
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index 511e07f3..b59ac3bc 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -204,12 +204,12 @@
         v-model="selected.alpha"
         :disabled="!present"
       />
-      <i18n
-        path="settings.style.shadows.hintV3"
+      <i18n-t
+        keypath="settings.style.shadows.hintV3"
         tag="p"
       >
         <code>--variable,mod</code>
-      </i18n>
+      </i18n-t>
     </div>
   </div>
 </template>
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index e64455e0..48942005 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -74,36 +74,42 @@
       v-if="currentReplies.length && !threadShowing"
       class="thread-tree-replies thread-tree-replies-hidden"
     >
-      <i18n
+      <i18n-t
         v-if="simple"
         tag="button"
-        path="status.thread_follow_with_icon"
+        keypath="status.thread_follow_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
         @click.prevent="dive(status.id)"
       >
-        <FAIcon
-          place="icon"
-          icon="angle-double-right"
-        />
-        <span place="text">
-          {{ $tc('status.thread_follow', totalReplyCount[status.id], { numStatus: totalReplyCount[status.id] }) }}
-        </span>
-      </i18n>
-      <i18n
+        <template #icon>
+          <FAIcon
+            icon="angle-double-right"
+          />
+        </template>
+        <template #text>
+          <span>
+            {{ $tc('status.thread_follow', totalReplyCount[status.id], { numStatus: totalReplyCount[status.id] }) }}
+          </span>
+        </template>
+      </i18n-t>
+      <i18n-t
         v-else
         tag="button"
-        path="status.thread_show_full_with_icon"
+        keypath="status.thread_show_full_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
         @click.prevent="showThreadRecursively(status.id)"
       >
-        <FAIcon
-          place="icon"
-          icon="angle-double-down"
-        />
-        <span place="text">
-          {{ $tc('status.thread_show_full', totalReplyCount[status.id], { numStatus: totalReplyCount[status.id], depth: totalReplyDepth[status.id] }) }}
-        </span>
-      </i18n>
+        <template #icon>
+          <FAIcon
+            icon="angle-double-down"
+          />
+        </template>
+        <template #text>
+          <span>
+            {{ $tc('status.thread_show_full', totalReplyCount[status.id], { numStatus: totalReplyCount[status.id], depth: totalReplyDepth[status.id] }) }}
+          </span>
+        </template>
+      </i18n-t>
     </div>
   </div>
 </template>

From 97930020706c938d9237cdc3770fab11b03bedc1 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 23 Mar 2022 16:53:57 +0200
Subject: [PATCH 059/113] cleanup console log

---
 src/hocs/with_subscription/with_subscription.jsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/hocs/with_subscription/with_subscription.jsx b/src/hocs/with_subscription/with_subscription.jsx
index da1b2cc9..d3f5506a 100644
--- a/src/hocs/with_subscription/with_subscription.jsx
+++ b/src/hocs/with_subscription/with_subscription.jsx
@@ -61,7 +61,6 @@ const withSubscription = ({
       }
     },
     render () {
-      console.log(this.$listeners)
       if (!this.error && !this.loading) {
         const props = {
           ...this.$props,

From 4539feed409e7f934f5d9d3ccd4944b34350fa2a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 24 Mar 2022 11:41:39 +0200
Subject: [PATCH 060/113] fix checkboxes, specifically the NSFW one

---
 src/components/checkbox/checkbox.vue                  | 11 ++++-------
 src/components/color_input/color_input.vue            |  2 +-
 src/components/font_control/font_control.vue          |  2 +-
 src/components/opacity_input/opacity_input.vue        |  2 +-
 src/components/range_input/range_input.vue            |  2 +-
 src/components/selectable_list/selectable_list.vue    |  4 ++--
 .../settings_modal/helpers/boolean_setting.vue        |  4 ++--
 src/components/settings_modal/settings_modal.vue      |  2 +-
 .../user_reporting_modal/user_reporting_modal.vue     |  2 +-
 9 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index ff2b4e77..a9d78e88 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -6,9 +6,9 @@
     <input
       type="checkbox"
       :disabled="disabled"
-      :checked="checked"
+      :modelValue="modelValue"
       :indeterminate="indeterminate"
-      @change="$emit('change', $event.target.checked)"
+      @change="$emit('update:modelValue', $event.target.checked)"
     >
     <i class="checkbox-indicator" />
     <span
@@ -22,12 +22,9 @@
 
 <script>
 export default {
-  model: {
-    prop: 'checked',
-    event: 'change'
-  },
+  emits: ['update:modelValue'],
   props: [
-    'checked',
+    'modelValue',
     'indeterminate',
     'disabled'
   ]
diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index 81462979..b2acbc3d 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined' && showOptionalTickbox"
-      :checked="present"
+      :modelValue="present"
       :disabled="disabled"
       class="opt"
       @change="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index 72b480ef..2006c7f6 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -14,7 +14,7 @@
       :id="name + '-o'"
       class="opt exlcude-disabled"
       type="checkbox"
-      :checked="present"
+      :modelValue="present"
       @input="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
     >
     <label
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index e1d31fc2..faf07288 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined'"
-      :checked="present"
+      :modelValue="present"
       :disabled="disabled"
       class="opt"
       @change="$emit('update:modelValue', !present ? fallback : undefined)"
diff --git a/src/components/range_input/range_input.vue b/src/components/range_input/range_input.vue
index 82681809..7fe58e80 100644
--- a/src/components/range_input/range_input.vue
+++ b/src/components/range_input/range_input.vue
@@ -14,7 +14,7 @@
       :id="name + '-o'"
       class="opt"
       type="checkbox"
-      :checked="present"
+      :modelValue="present"
       @input="$emit('update:modelValue', !present ? fallback : undefined)"
     >
     <label
diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue
index 3f885881..cf7cec27 100644
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@@ -6,7 +6,7 @@
     >
       <div class="selectable-list-checkbox-wrapper">
         <Checkbox
-          :checked="allSelected"
+          :modelValue="allSelected"
           :indeterminate="someSelected"
           @change="toggleAll"
         >
@@ -31,7 +31,7 @@
         >
           <div class="selectable-list-checkbox-wrapper">
             <Checkbox
-              :checked="isSelected(item)"
+              :modelValue="isSelected(item)"
               @change="checked => toggle(checked, item)"
             />
           </div>
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index 131377b9..3808bc74 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -4,9 +4,9 @@
     class="BooleanSetting"
   >
     <Checkbox
-      :checked="state"
+      :modelValue="state"
       :disabled="disabled"
-      @change="update"
+      @update:modelValue="update"
     >
       <span
         v-if="!!$slots.default"
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 603688e4..f54c89c4 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -110,7 +110,7 @@
           </template>
         </Popover>
 
-        <Checkbox :checked="!!expertLevel" @change="expertLevel = Number($event)">
+        <Checkbox :modelValue="!!expertLevel" @update:modelValue="expertLevel = Number($event)">
           {{ $t("settings.expert_mode") }}
         </Checkbox>
       </div>
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 1f67a5cc..2993e4ec 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -53,7 +53,7 @@
                   :statusoid="item"
                 />
                 <Checkbox
-                  :checked="isChecked(item.id)"
+                  :modelValue="isChecked(item.id)"
                   @change="checked => toggleStatus(checked, item.id)"
                 />
               </div>

From 0eb9c019e44e032b7fb1609bc3981af8a2889ebd Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 24 Mar 2022 13:41:52 +0200
Subject: [PATCH 061/113] woah ima stupid

---
 src/components/checkbox/checkbox.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index a9d78e88..83695912 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -6,7 +6,7 @@
     <input
       type="checkbox"
       :disabled="disabled"
-      :modelValue="modelValue"
+      :checked="modelValue"
       :indeterminate="indeterminate"
       @change="$emit('update:modelValue', $event.target.checked)"
     >

From 3fb647b34bd0cb6eafd61c4a21dcb0e6e2c22675 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 24 Mar 2022 13:50:22 +0200
Subject: [PATCH 062/113] fix minor renames

---
 src/components/image_cropper/image_cropper.js | 4 ++--
 src/hocs/with_load_more/with_load_more.jsx    | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/image_cropper/image_cropper.js b/src/components/image_cropper/image_cropper.js
index e8d5ec6d..e72ed0e8 100644
--- a/src/components/image_cropper/image_cropper.js
+++ b/src/components/image_cropper/image_cropper.js
@@ -66,7 +66,7 @@ const ImageCropper = {
     }
   },
   methods: {
-    destroy () {
+    unmounted () {
       if (this.cropper) {
         this.cropper.destroy()
       }
@@ -117,7 +117,7 @@ const ImageCropper = {
     const fileInput = this.$refs.input
     fileInput.addEventListener('change', this.readFile)
   },
-  beforeDestroy: function () {
+  beforeUnmount: function () {
     // remove the event listeners
     const trigger = this.getTriggerDOM()
     if (trigger) {
diff --git a/src/hocs/with_load_more/with_load_more.jsx b/src/hocs/with_load_more/with_load_more.jsx
index 360b439a..705991ca 100644
--- a/src/hocs/with_load_more/with_load_more.jsx
+++ b/src/hocs/with_load_more/with_load_more.jsx
@@ -17,7 +17,7 @@ library.add(
 const withLoadMore = ({
   fetch, // function to fetch entries and return a promise
   select, // function to select data from store
-  destroy, // function called at "destroyed" lifecycle
+  unmounted, // function called at "destroyed" lifecycle
   childPropName = 'entries', // name of the prop to be passed into the wrapped component
   additionalPropNames = [] // additional prop name list of the wrapper component
 }) => (WrappedComponent) => {
@@ -42,7 +42,7 @@ const withLoadMore = ({
     },
     unmounted () {
       window.removeEventListener('scroll', this.scrollLoad)
-      destroy && destroy(this.$props, this.$store)
+      unmounted && unmounted(this.$props, this.$store)
     },
     methods: {
       // Entries is not a computed because computed can't track the dynamic

From b7755314b1dec6b7ff187d59fdf3a5f914b5be61 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 24 Mar 2022 14:09:25 +0200
Subject: [PATCH 063/113] fix forms closing in timelines

---
 src/components/timeline/timeline.js  |  6 ++++
 src/components/timeline/timeline.vue | 44 +++++++++++++---------------
 2 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index e896a23c..6ede1dc5 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -40,6 +40,12 @@ const Timeline = {
     TimelineQuickSettings
   },
   computed: {
+    filteredVisibleStatuses () {
+      return this.timeline.visibleStatuses.filter(status => this.timelineName !== 'user' || (status.id >= this.timeline.minId && status.id <= this.timeline.maxId))
+    },
+    filteredPinnedStatusesId () {
+      return this.pinnedStatusIds.filter(statusId => this.timeline.statusesObject[statusId])
+    },
     newStatusCount () {
       return this.timeline.newStatusCount
     },
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index ff16208d..d37a9e2a 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -23,30 +23,26 @@
         ref="timeline"
         class="timeline"
       >
-        <template v-for="statusId in pinnedStatusIds">
-          <conversation
-            v-if="timeline.statusesObject[statusId]"
-            :key="statusId + '-pinned'"
-            class="status-fadein"
-            :status-id="statusId"
-            :collapsable="true"
-            :pinned-status-ids-object="pinnedStatusIdsObject"
-            :in-profile="inProfile"
-            :profile-user-id="userId"
-          />
-        </template>
-        <template v-for="status in timeline.visibleStatuses">
-          <conversation
-            v-if="timelineName !== 'user' || (status.id >= timeline.minId && status.id <= timeline.maxId)"
-            :key="status.id"
-            class="status-fadein"
-            :status-id="status.id"
-            :collapsable="true"
-            :in-profile="inProfile"
-            :profile-user-id="userId"
-            :virtual-hidden="virtualScrollingEnabled && !statusesToDisplay.includes(status.id)"
-          />
-        </template>
+        <conversation
+          v-for="statusId in filteredPinnedStatusIds"
+          :key="statusId + '-pinned'"
+          class="status-fadein"
+          :status-id="statusId"
+          :collapsable="true"
+          :pinned-status-ids-object="pinnedStatusIdsObject"
+          :in-profile="inProfile"
+          :profile-user-id="userId"
+        />
+        <conversation
+          v-for="status in filteredVisibleStatuses"
+          :key="status.id"
+          class="status-fadein"
+          :status-id="status.id"
+          :collapsable="true"
+          :in-profile="inProfile"
+          :profile-user-id="userId"
+          :virtual-hidden="virtualScrollingEnabled && !statusesToDisplay.includes(status.id)"
+        />
       </div>
     </div>
     <div :class="classes.footer">

From e4c804fac07a0cc73ae91c06ad4c183f02190cd9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:03:31 +0300
Subject: [PATCH 064/113] fix another spacing issue

---
 src/components/status/status.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index c832758d..61feb303 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -101,6 +101,7 @@
               :to="retweeterProfileLink"
             >{{ retweeter }}</router-link>
           </span>
+          {{ ' ' }}
           <FAIcon
             icon="retweet"
             class="repeat-icon"

From 9ac7046521d9cffcff1e2d846b1158d32c01ed85 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:21:33 +0300
Subject: [PATCH 065/113] Fix notices not disappearing on their own

---
 src/modules/interface.js | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/modules/interface.js b/src/modules/interface.js
index 6509386a..17277331 100644
--- a/src/modules/interface.js
+++ b/src/modules/interface.js
@@ -106,7 +106,7 @@ const interfaceMod = {
       commit('openSettingsModal')
     },
     pushGlobalNotice (
-      { commit, dispatch },
+      { commit, dispatch, state },
       {
         messageKey,
         messageArgs = {},
@@ -118,11 +118,14 @@ const interfaceMod = {
         messageArgs,
         level
       }
-      if (timeout) {
-        setTimeout(() => dispatch('removeGlobalNotice', notice), timeout)
-      }
       commit('pushGlobalNotice', notice)
-      return notice
+      // Adding a new element to array wraps it in a Proxy, which breaks the comparison
+      // TODO: Generate UUID or something instead or relying on !== operator?
+      const newNotice = state.globalNotices[state.globalNotices.length - 1]
+      if (timeout) {
+        setTimeout(() => dispatch('removeGlobalNotice', newNotice), timeout)
+      }
+      return newNotice
     },
     removeGlobalNotice ({ commit }, notice) {
       commit('removeGlobalNotice', notice)

From dd4672dc9a5e059b5cdacc0d687e412ca6fd07a4 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:24:38 +0300
Subject: [PATCH 066/113] fix opening directly to filtering tab not working

---
 src/components/settings_modal/settings_modal_content.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/settings_modal/settings_modal_content.js b/src/components/settings_modal/settings_modal_content.js
index deb77298..9ac0301f 100644
--- a/src/components/settings_modal/settings_modal_content.js
+++ b/src/components/settings_modal/settings_modal_content.js
@@ -63,8 +63,8 @@ const SettingsModalContent = {
       const targetTab = this.$store.state.interface.settingsModalTargetTab
       // We're being told to open in specific tab
       if (targetTab) {
-        const tabIndex = this.$refs.tabSwitcher.$slots.default.findIndex(elm => {
-          return elm.data && elm.data.attrs['data-tab-name'] === targetTab
+        const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => {
+          return elm.props && elm.props['data-tab-name'] === targetTab
         })
         if (tabIndex >= 0) {
           this.$refs.tabSwitcher.setTab(tabIndex)

From 0b7a8dca154e793f3e8d865700ccc53b3f925ba2 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:26:51 +0300
Subject: [PATCH 067/113] fix duplicate setting (most likely a merge issue)

---
 .../settings_modal/tabs/filtering_tab.vue          | 14 +-------------
 1 file changed, 1 insertion(+), 13 deletions(-)

diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue
index dc48902f..97046ff0 100644
--- a/src/components/settings_modal/tabs/filtering_tab.vue
+++ b/src/components/settings_modal/tabs/filtering_tab.vue
@@ -72,22 +72,10 @@
           <div>{{ $t('settings.filtering_explanation') }}</div>
         </li>
         <h3>{{ $t('settings.attachments') }}</h3>
-        <li v-if="expertLevel > 0">
-          <label for="maxThumbnails">
-            {{ $t('settings.max_thumbnails') }}
-          </label>
-          <input
-            id="maxThumbnails"
-            path.number="maxThumbnails"
-            class="number-input"
-            type="number"
-            min="0"
-            step="1"
-          >
-        </li>
         <li>
           <IntegerSetting
             path="maxThumbnails"
+            expert="1"
             :min="0"
           >
             {{ $t('settings.max_thumbnails') }}

From 913749739ff4ae543433cc051485b0d572fc22f9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:29:28 +0300
Subject: [PATCH 068/113] fix user-list-popover

---
 src/components/user_list_popover/user_list_popover.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/user_list_popover/user_list_popover.js b/src/components/user_list_popover/user_list_popover.js
index f0a16c38..e24eb9f7 100644
--- a/src/components/user_list_popover/user_list_popover.js
+++ b/src/components/user_list_popover/user_list_popover.js
@@ -1,4 +1,5 @@
 import { defineAsyncComponent } from 'vue'
+import RichContent from 'src/components/rich_content/rich_content.jsx'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
@@ -13,6 +14,7 @@ const UserListPopover = {
     'users'
   ],
   components: {
+    RichContent,
     Popover: defineAsyncComponent(() => import('../popover/popover.vue')),
     UserAvatar: defineAsyncComponent(() => import('../user_avatar/user_avatar.vue'))
   },

From 87d420a92bdcf9e94923482986ea772bd3753184 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:58:28 +0300
Subject: [PATCH 069/113] port !1488 to vue3

---
 src/components/settings_modal/settings_modal.vue           | 4 ++--
 src/components/settings_modal/tabs/theme_tab/theme_tab.vue | 6 +++---
 src/components/tab_switcher/tab_switcher.jsx               | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 28f85423..18dd3d7a 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -113,9 +113,9 @@
         <Checkbox :modelValue="!!expertLevel" @update:modelValue="expertLevel = Number($event)">
           {{ $t("settings.expert_mode") }}
         </Checkbox>
-        <portal-target
+        <span
           class="extra-content"
-          name="unscrolled-content"
+          id="unscrolled-content"
         />
       </div>
     </div>
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index 9cdd229a..cf049a70 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -1018,9 +1018,9 @@
       </tab-switcher>
     </keep-alive>
 
-    <portal
+    <teleport
       v-if="isActive"
-      to="unscrolled-content"
+      to="#unscrolled-content"
     >
       <div class="apply-container">
         <button
@@ -1037,7 +1037,7 @@
           {{ $t('settings.style.switcher.reset') }}
         </button>
       </div>
-    </portal>
+    </teleport>
   </div>
 </template>
 
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index 59ff98df..f5a1e603 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -50,7 +50,7 @@ export default {
     activeIndex () {
       // In case of controlled component
       if (this.activeTab) {
-        return this.slots().findIndex(slot => this.activeTab === slot.key)
+        return this.slots().findIndex(slot => this.activeTab === slot.props.key)
       } else {
         return this.active
       }
@@ -58,7 +58,7 @@ export default {
     isActive () {
       return tabName => {
         const isWanted = slot => slot.props && slot.props['data-tab-name'] === tabName
-        return this.$slots.default.findIndex(isWanted) === this.activeIndex
+        return this.$slots.default().findIndex(isWanted) === this.activeIndex
       }
     },
     settingsModalVisible () {

From 8e711e05875f9be5b46437a4b38ea98b94cf4306 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 12:58:53 +0300
Subject: [PATCH 070/113] get rid of portal-vue

---
 package.json | 1 -
 yarn.lock    | 5 -----
 2 files changed, 6 deletions(-)

diff --git a/package.json b/package.json
index c7a296cb..f9a58b87 100644
--- a/package.json
+++ b/package.json
@@ -31,7 +31,6 @@
     "localforage": "1.10.0",
     "parse-link-header": "1.0.1",
     "phoenix": "1.4.0",
-    "portal-vue": "2.1.7",
     "punycode.js": "2.1.0",
     "ruffle-mirror": "2021.12.31",
     "click-outside-vue3": "4.0.1",
diff --git a/yarn.lock b/yarn.lock
index 4f3def64..a1206eff 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7501,11 +7501,6 @@ pointer-tracker@^2.0.3:
   resolved "https://registry.yarnpkg.com/pointer-tracker/-/pointer-tracker-2.4.0.tgz#78721c2d2201486db11ec1094377f03023b621b3"
   integrity sha512-pWI2tpaM/XNtc9mUTv42Rmjf6mkHvE8LT5DDEq0G7baPNhxNM9E3CepubPplSoSLk9E5bwQrAMyDcPVmJyTW4g==
 
-portal-vue@2.1.7:
-  version "2.1.7"
-  resolved "https://registry.yarnpkg.com/portal-vue/-/portal-vue-2.1.7.tgz#ea08069b25b640ca08a5b86f67c612f15f4e4ad4"
-  integrity sha512-+yCno2oB3xA7irTt0EU5Ezw22L2J51uKAacE/6hMPMoO/mx3h4rXFkkBkT4GFsMDv/vEe8TNKC3ujJJ0PTwb6g==
-
 posix-character-classes@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"

From ccd7378347594d3e1e38f8716ce83a4068a65057 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 13:28:59 +0300
Subject: [PATCH 071/113] fix (roundness) ranges in theme tab

---
 src/components/range_input/range_input.vue | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/range_input/range_input.vue b/src/components/range_input/range_input.vue
index 7fe58e80..1e7e42d5 100644
--- a/src/components/range_input/range_input.vue
+++ b/src/components/range_input/range_input.vue
@@ -14,8 +14,8 @@
       :id="name + '-o'"
       class="opt"
       type="checkbox"
-      :modelValue="present"
-      @input="$emit('update:modelValue', !present ? fallback : undefined)"
+      :checked="present"
+      @change="$emit('update:modelValue', !present ? fallback : undefined)"
     >
     <label
       v-if="typeof fallback !== 'undefined'"
@@ -26,7 +26,7 @@
       :id="name"
       class="input-number"
       type="range"
-      :value="value || fallback"
+      :value="modelValue || fallback"
       :disabled="!present || disabled"
       :max="max || hardMax || 100"
       :min="min || hardMin || 0"
@@ -37,7 +37,7 @@
       :id="name"
       class="input-number"
       type="number"
-      :value="value || fallback"
+      :value="modelValue || fallback"
       :disabled="!present || disabled"
       :max="hardMax"
       :min="hardMin"
@@ -50,11 +50,12 @@
 <script>
 export default {
   props: [
-    'name', 'value', 'fallback', 'disabled', 'label', 'max', 'min', 'step', 'hardMin', 'hardMax'
+    'name', 'modelValue', 'fallback', 'disabled', 'label', 'max', 'min', 'step', 'hardMin', 'hardMax'
   ],
+  emits: ['update:modelValue'],
   computed: {
     present () {
-      return typeof this.value !== 'undefined'
+      return typeof this.modelValue !== 'undefined'
     }
   }
 }

From 1d77063a4bd27074200bea9b7b19d9b92dd71649 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 13:31:29 +0300
Subject: [PATCH 072/113] fix shadow control in theme tab

---
 src/components/shadow_control/shadow_control.js | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/shadow_control/shadow_control.js b/src/components/shadow_control/shadow_control.js
index 2d5d6eb1..386a5756 100644
--- a/src/components/shadow_control/shadow_control.js
+++ b/src/components/shadow_control/shadow_control.js
@@ -30,18 +30,19 @@ const toModel = (object = {}) => ({
 })
 
 export default {
-  // 'Value' and 'Fallback' can be undefined, but if they are
+  // 'modelValue' and 'Fallback' can be undefined, but if they are
   // initially vue won't detect it when they become something else
   // therefore i'm using "ready" which should be passed as true when
   // data becomes available
   props: [
-    'value', 'fallback', 'ready'
+    'modelValue', 'fallback', 'ready'
   ],
+  emits: ['update:modelValue'],
   data () {
     return {
       selectedId: 0,
       // TODO there are some bugs regarding display of array (it's not getting updated when deleting for some reason)
-      cValue: (this.value || this.fallback || []).map(toModel)
+      cValue: (this.modelValue || this.fallback || []).map(toModel)
     }
   },
   components: {
@@ -70,7 +71,7 @@ export default {
     }
   },
   beforeUpdate () {
-    this.cValue = this.value || this.fallback
+    this.cValue = this.modelValue || this.fallback
   },
   computed: {
     anyShadows () {
@@ -105,7 +106,7 @@ export default {
         !this.usingFallback
     },
     usingFallback () {
-      return typeof this.value === 'undefined'
+      return typeof this.modelValue === 'undefined'
     },
     rgb () {
       return hex2rgb(this.selected.color)

From 75f6506bc7e490dd544548db7bcccbe0420d2727 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 14:10:45 +0300
Subject: [PATCH 073/113] fix (You) spacing

---
 src/components/mention_link/mention_link.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/mention_link/mention_link.vue b/src/components/mention_link/mention_link.vue
index 3562f511..022f04c7 100644
--- a/src/components/mention_link/mention_link.vue
+++ b/src/components/mention_link/mention_link.vue
@@ -41,10 +41,12 @@
           class="serverName"
           :class="{ '-faded': shouldFadeDomain }"
           v-html="'@' + serverName"
-        /></span><span
+        />
+        </span>
+        <span
           v-if="isYou && shouldShowYous"
           :class="{ '-you': shouldBoldenYou }"
-        > {{ $t('status.you') }}</span>
+        > {{ ' ' + $t('status.you') }}</span>
         <!-- eslint-enable vue/no-v-html -->
       </a><span
         v-if="shouldShowTooltip"

From 53cde520276af98a9b2b20cd0e8acf7bde768e70 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 14:16:23 +0300
Subject: [PATCH 074/113] fix font control

---
 src/components/font_control/font_control.js  | 9 +++++----
 src/components/font_control/font_control.vue | 4 ++--
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js
index 24bad937..92ee3f30 100644
--- a/src/components/font_control/font_control.js
+++ b/src/components/font_control/font_control.js
@@ -6,11 +6,12 @@ export default {
     Select
   },
   props: [
-    'name', 'label', 'value', 'fallback', 'options', 'no-inherit'
+    'name', 'label', 'modelValue', 'fallback', 'options', 'no-inherit'
   ],
+  emits: ['update:modelValue'],
   data () {
     return {
-      lValue: this.value,
+      lValue: this.modelValue,
       availableOptions: [
         this.noInherit ? '' : 'inherit',
         'custom',
@@ -22,7 +23,7 @@ export default {
     }
   },
   beforeUpdate () {
-    this.lValue = this.value
+    this.lValue = this.modelValue
   },
   computed: {
     present () {
@@ -37,7 +38,7 @@ export default {
       },
       set (v) {
         set(this.lValue, 'family', v)
-        this.$emit('input', this.lValue)
+        this.$emit('update:modelValue', this.lValue)
       }
     },
     isCustom () {
diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue
index 2006c7f6..f100c3a9 100644
--- a/src/components/font_control/font_control.vue
+++ b/src/components/font_control/font_control.vue
@@ -14,8 +14,8 @@
       :id="name + '-o'"
       class="opt exlcude-disabled"
       type="checkbox"
-      :modelValue="present"
-      @input="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
+      :checked="present"
+      @change="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
     >
     <label
       v-if="typeof fallback !== 'undefined'"

From 48fd8a66ad554ee1f5079db7e267bf838d2e8b0a Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 14:18:02 +0300
Subject: [PATCH 075/113] fix opacity control

---
 src/components/opacity_input/opacity_input.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index faf07288..c5142df0 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -14,7 +14,7 @@
       :modelValue="present"
       :disabled="disabled"
       class="opt"
-      @change="$emit('update:modelValue', !present ? fallback : undefined)"
+      @update:modelValue="$emit('update:modelValue', !present ? fallback : undefined)"
     />
     <input
       :id="name"
@@ -37,11 +37,12 @@ export default {
     Checkbox
   },
   props: [
-    'name', 'value', 'fallback', 'disabled'
+    'name', 'modelValue', 'fallback', 'disabled'
   ],
+  emits: ['update:modelValue'],
   computed: {
     present () {
-      return typeof this.value !== 'undefined'
+      return typeof this.modelValue !== 'undefined'
     }
   }
 }

From 115f38c422cffec6cc8f9b47a052f57766355aed Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 14:20:55 +0300
Subject: [PATCH 076/113] fix optional color inputs

---
 src/components/color_input/color_input.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index b2acbc3d..bb25f5a8 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -14,7 +14,7 @@
       :modelValue="present"
       :disabled="disabled"
       class="opt"
-      @change="$emit('update:modelValue', typeof value === 'undefined' ? fallback : undefined)"
+      @update:modelValue="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
     />
     <div class="input color-input-field">
       <input
@@ -91,6 +91,7 @@ export default {
       default: true
     }
   },
+  emits: ['update:modelValue'],
   computed: {
     present () {
       return typeof this.modelValue !== 'undefined'

From 8424b772b053ffc9d1a004b379ac978ae6e09a72 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Sun, 27 Mar 2022 14:43:16 +0300
Subject: [PATCH 077/113] fix tabs in search

---
 src/components/search/search.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/search/search.js b/src/components/search/search.js
index b62bc2c5..76ac30ef 100644
--- a/src/components/search/search.js
+++ b/src/components/search/search.js
@@ -1,6 +1,7 @@
 import FollowCard from '../follow_card/follow_card.vue'
 import Conversation from '../conversation/conversation.vue'
 import Status from '../status/status.vue'
+import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import map from 'lodash/map'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -17,7 +18,8 @@ const Search = {
   components: {
     FollowCard,
     Conversation,
-    Status
+    Status,
+    TabSwitcher
   },
   props: [
     'query'

From 805615d52befc413693c5a80d69e2f901d106076 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 14:26:50 +0300
Subject: [PATCH 078/113] fix background not showing

---
 src/App.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/App.vue b/src/App.vue
index bee98751..b18b3308 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,11 +1,11 @@
 <template>
   <div
     id="app-loaded"
+    :style="bgStyle"
   >
     <div
       id="app_bg_wrapper"
       class="app-bg-wrapper"
-      :style="bgStyle"
     />
     <MobileNav v-if="isMobileLayout" />
     <DesktopNav v-else />

From f706234d77f0924dac3b8270c1acb73edd387f2e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 15:01:34 +0300
Subject: [PATCH 079/113] fix being unable to set/reset background (and
 possibly avatar/banner)

---
 .../settings_modal/tabs/profile_tab.vue       | 45 ++++++++++++-------
 1 file changed, 28 insertions(+), 17 deletions(-)

diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index e00f6e5b..b78581bd 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -68,8 +68,9 @@
             class="delete-field button-unstyled -hover-highlight"
             @click="deleteField(i)"
           >
+            <!-- TODO something is wrong with v-show here -->
             <FAIcon
-              v-show="newFields.length > 1"
+              v-if="newFields.length > 1"
               icon="times"
             />
           </button>
@@ -106,14 +107,17 @@
           :src="user.profile_image_url_original"
           class="current-avatar"
         >
-        <FAIcon
+        <button
           v-if="!isDefaultAvatar && pickAvatarBtnVisible"
           :title="$t('settings.reset_avatar')"
-          class="reset-button"
-          icon="times"
-          type="button"
           @click="resetAvatar"
-        />
+        >
+          <FAIcon
+            class="reset-button"
+            icon="times"
+            type="button"
+          />
+        </button>
       </div>
       <p>{{ $t('settings.set_new_avatar') }}</p>
       <button
@@ -135,14 +139,17 @@
       <h2>{{ $t('settings.profile_banner') }}</h2>
       <div class="banner-background-preview">
         <img :src="user.cover_photo">
-        <FAIcon
+        <button
           v-if="!isDefaultBanner"
           :title="$t('settings.reset_profile_banner')"
-          class="reset-button"
-          icon="times"
-          type="button"
           @click="resetBanner"
-        />
+        >
+          <FAIcon
+            class="reset-button"
+            icon="times"
+            type="button"
+          />
+        </button>
       </div>
       <p>{{ $t('settings.set_new_profile_banner') }}</p>
       <img
@@ -174,14 +181,18 @@
       <h2>{{ $t('settings.profile_background') }}</h2>
       <div class="banner-background-preview">
         <img :src="user.background_image">
-        <FAIcon
+        <button
           v-if="!isDefaultBackground"
-          :title="$t('settings.reset_profile_background')"
-          class="reset-button"
-          icon="times"
-          type="button"
+          class="button-unstyled"
           @click="resetBackground"
-        />
+          :title="$t('settings.reset_profile_background')"
+        >
+          <FAIcon
+            class="reset-button"
+            icon="times"
+            type="button"
+          />
+        </button>
       </div>
       <p>{{ $t('settings.set_new_profile_background') }}</p>
       <img

From c57af7e242ac4294f15738cbf723abd6e3fc8a6c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 17:13:48 +0300
Subject: [PATCH 080/113] remove some warnings

---
 src/boot/after_store.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 91a13174..87448c8c 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -17,6 +17,7 @@ import FaviconService from '../services/favicon_service/favicon_service.js'
 
 // disable compat for certain features
 configureCompat({
+  ATTR_FALSE_VALUE: false,
   COMPONENT_V_MODEL: false,
   INSTANCE_SET: false,
   RENDER_FUNCTION: false

From bdd240a2308ee729680a7e9d0cf7d801dfdbe4cc Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 17:21:42 +0300
Subject: [PATCH 081/113] fix some more warnings

---
 src/components/timeline/timeline.js | 4 ++--
 src/directives/body_scroll_lock.js  | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index 6ede1dc5..8ec5d1e5 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -43,8 +43,8 @@ const Timeline = {
     filteredVisibleStatuses () {
       return this.timeline.visibleStatuses.filter(status => this.timelineName !== 'user' || (status.id >= this.timeline.minId && status.id <= this.timeline.maxId))
     },
-    filteredPinnedStatusesId () {
-      return this.pinnedStatusIds.filter(statusId => this.timeline.statusesObject[statusId])
+    filteredPinnedStatusIds () {
+      return (this.pinnedStatusIds || []).filter(statusId => this.timeline.statusesObject[statusId])
     },
     newStatusCount () {
       return this.timeline.newStatusCount
diff --git a/src/directives/body_scroll_lock.js b/src/directives/body_scroll_lock.js
index 13a6de1c..f5cc2247 100644
--- a/src/directives/body_scroll_lock.js
+++ b/src/directives/body_scroll_lock.js
@@ -50,7 +50,7 @@ const enableBodyScroll = (el) => {
 }
 
 const directive = {
-  inserted: (el, binding) => {
+  mounted: (el, binding) => {
     if (binding.value) {
       disableBodyScroll(el)
     }

From 4b630c3c36518853489009c27602bdae392b4c94 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 17:37:26 +0300
Subject: [PATCH 082/113] fix warnings

---
 src/components/status/status.js                 | 4 ++--
 src/components/status_content/status_content.js | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index 088ddcc5..ee0da4dc 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -69,7 +69,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return this[toggle] ? this[controlledName] : this[uncontrolledName]
+    return (Object.getOwnPropertyDescriptor(this, toggle) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})
@@ -311,7 +311,7 @@ const Status = {
       return this.mergedConfig.hideWordFilteredPosts
     },
     hideStatus () {
-      return (this.virtualHidden || !this.shouldNotMute) && (
+      return (!this.shouldNotMute) && (
         (this.muted && this.hideFilteredStatuses) ||
         (this.userIsMuted && this.hideMutedUsers) ||
         (this.status.thread_muted && this.hideMutedThreads) ||
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index cf72ccb8..0200382b 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -31,7 +31,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return this[toggle] ? this[controlledName] : this[uncontrolledName]
+    return (Object.getOwnPropertyDescriptor(this, toggle) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})

From 7b10e47b21d4bd130d5d44f394e4836548899fd9 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 23:54:30 +0300
Subject: [PATCH 083/113] rename some binding hooks according to new names

---
 src/directives/body_scroll_lock.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/directives/body_scroll_lock.js b/src/directives/body_scroll_lock.js
index f5cc2247..b6d16790 100644
--- a/src/directives/body_scroll_lock.js
+++ b/src/directives/body_scroll_lock.js
@@ -55,7 +55,7 @@ const directive = {
       disableBodyScroll(el)
     }
   },
-  componentUpdated: (el, binding) => {
+  updated: (el, binding) => {
     if (binding.oldValue === binding.value) {
       return
     }
@@ -66,7 +66,7 @@ const directive = {
       enableBodyScroll(el)
     }
   },
-  unbind: (el) => {
+  unmounted: (el) => {
     enableBodyScroll(el)
   }
 }

From 9afbb12f956434f0426a00d311406ddd8348c892 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 23:55:11 +0300
Subject: [PATCH 084/113] fix opacity control again

---
 src/components/opacity_input/opacity_input.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index c5142df0..83bc917d 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -20,7 +20,7 @@
       :id="name"
       class="input-number"
       type="number"
-      :value="value || fallback"
+      :value="modelValue || fallback"
       :disabled="!present || disabled"
       max="1"
       min="0"

From f21dc21a83cbcf4c502b8fbf56cabac797a0b9da Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Mon, 28 Mar 2022 23:55:26 +0300
Subject: [PATCH 085/113] properly implement resettableAsyncComponent

---
 .../async_component_error.vue                 |  1 +
 .../settings_modal/settings_modal.js          |  4 ++--
 src/services/resettable_async_component.js    | 23 ++++++++-----------
 3 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/src/components/async_component_error/async_component_error.vue b/src/components/async_component_error/async_component_error.vue
index b1b59638..26ab5d21 100644
--- a/src/components/async_component_error/async_component_error.vue
+++ b/src/components/async_component_error/async_component_error.vue
@@ -19,6 +19,7 @@
 
 <script>
 export default {
+  emits: ['resetAsyncComponent'],
   methods: {
     retry () {
       this.$emit('resetAsyncComponent')
diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js
index 82ea410e..0a72dca1 100644
--- a/src/components/settings_modal/settings_modal.js
+++ b/src/components/settings_modal/settings_modal.js
@@ -56,8 +56,8 @@ const SettingsModal = {
     SettingsModalContent: getResettableAsyncComponent(
       () => import('./settings_modal_content.vue'),
       {
-        loading: PanelLoading,
-        error: AsyncComponentError,
+        loadingComponent: PanelLoading,
+        errorComponent: AsyncComponentError,
         delay: 0
       }
     )
diff --git a/src/services/resettable_async_component.js b/src/services/resettable_async_component.js
index e85c540b..1c046ce7 100644
--- a/src/services/resettable_async_component.js
+++ b/src/services/resettable_async_component.js
@@ -1,5 +1,4 @@
-// TODO investigate if even necessary since VUE3
-import { reactive } from 'vue'
+import { defineAsyncComponent, shallowReactive, h } from 'vue'
 
 /* By default async components don't have any way to recover, if component is
  * failed, it is failed forever. This helper tries to remedy that by recreating
@@ -9,23 +8,21 @@ import { reactive } from 'vue'
  * actual target component itself if needs to be.
  */
 function getResettableAsyncComponent (asyncComponent, options) {
-  const asyncComponentFactory = () => () => ({
-    component: asyncComponent(),
+  const asyncComponentFactory = () => () => defineAsyncComponent({
+    loader: asyncComponent,
     ...options
   })
 
-  const observe = reactive({ c: asyncComponentFactory() })
+  const observe = shallowReactive({ c: asyncComponentFactory() })
 
   return {
-    functional: true,
-    render (createElement, { data, children }) {
+    render () {
       //  emit event resetAsyncComponent to reloading
-      data.on = {}
-      data.on.resetAsyncComponent = () => {
-        observe.c = asyncComponentFactory()
-        // parent.$forceUpdate()
-      }
-      return createElement(observe.c, data, children)
+      return h(observe.c(), {
+        onResetAsyncComponent () {
+          observe.c = asyncComponentFactory()
+        }
+      })
     }
   }
 }

From 650e69c33683b34e002f5fdc698ceb384baf059b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 00:02:02 +0300
Subject: [PATCH 086/113] fix misc warnings

---
 src/components/notification/notification.vue               | 2 +-
 src/components/poll/poll.vue                               | 2 +-
 src/components/settings_modal/helpers/integer_setting.js   | 2 +-
 src/components/settings_modal/tabs/theme_tab/theme_tab.vue | 6 +++---
 src/components/shadow_control/shadow_control.vue           | 2 +-
 src/components/thread_tree/thread_tree.vue                 | 4 ++--
 6 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index 23157a51..d77b2f57 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -112,7 +112,7 @@
             </span>
             <span v-if="notification.type === 'pleroma:emoji_reaction'">
               <small>
-                <i18n-t keypath="notifications.reacted_with">
+                <i18n-t scope="global" keypath="notifications.reacted_with">
                   <span class="emoji-reaction-emoji">{{ notification.emoji }}</span>
                 </i18n-t>
               </small>
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index e949c653..c3880096 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -71,7 +71,7 @@
           {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}&nbsp;·&nbsp;
         </template>
       </div>
-      <i18n-t :keypath="expired ? 'polls.expired' : 'polls.expires_in'">
+      <i18n-t scope="global" :keypath="expired ? 'polls.expired' : 'polls.expires_in'">
         <Timeago
           :time="expiresAt"
           :auto-update="60"
diff --git a/src/components/settings_modal/helpers/integer_setting.js b/src/components/settings_modal/helpers/integer_setting.js
index 4a19bd7c..17dc0e7b 100644
--- a/src/components/settings_modal/helpers/integer_setting.js
+++ b/src/components/settings_modal/helpers/integer_setting.js
@@ -8,7 +8,7 @@ export default {
     path: String,
     disabled: Boolean,
     min: Number,
-    expert: Number
+    expert: [Number, String]
   },
   computed: {
     pathDefault () {
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index cf049a70..dfa9a735 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -951,14 +951,14 @@
             :fallback="currentShadowFallback"
           />
           <div v-if="shadowSelected === 'avatar' || shadowSelected === 'avatarStatus'">
-            <i18n-t
+            <i18n-t scope="global"
               keypath="settings.style.shadows.filter_hint.always_drop_shadow"
               tag="p"
             >
               <code>filter: drop-shadow()</code>
             </i18n-t>
             <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
-            <i18n-t
+            <i18n-t scope="global"
               keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
               tag="p"
             >
@@ -966,7 +966,7 @@
               <code>spread-radius</code>
               <code>inset</code>
             </i18n-t>
-            <i18n-t
+            <i18n-t scope="global"
               keypath="settings.style.shadows.filter_hint.inset_classic"
               tag="p"
             >
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index b59ac3bc..d1e5fc22 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -204,7 +204,7 @@
         v-model="selected.alpha"
         :disabled="!present"
       />
-      <i18n-t
+      <i18n-t scope="global"
         keypath="settings.style.shadows.hintV3"
         tag="p"
       >
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index 48942005..f81653eb 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -74,7 +74,7 @@
       v-if="currentReplies.length && !threadShowing"
       class="thread-tree-replies thread-tree-replies-hidden"
     >
-      <i18n-t
+      <i18n-t scope="global"
         v-if="simple"
         tag="button"
         keypath="status.thread_follow_with_icon"
@@ -92,7 +92,7 @@
           </span>
         </template>
       </i18n-t>
-      <i18n-t
+      <i18n-t scope="global"
         v-else
         tag="button"
         keypath="status.thread_show_full_with_icon"

From dc8bef7928cb6a5e06a793a78652234276ca6fce Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 00:58:17 +0300
Subject: [PATCH 087/113] remove compat build

---
 build/webpack.base.conf.js |  8 --------
 build/webpack.dev.conf.js  |  4 +++-
 build/webpack.prod.conf.js |  4 +++-
 package.json               |  1 -
 src/boot/after_store.js    | 10 +---------
 test/unit/index.js         |  7 -------
 yarn.lock                  |  5 -----
 7 files changed, 7 insertions(+), 32 deletions(-)

diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js
index 65d398c8..d7ff9b9a 100644
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@@ -35,7 +35,6 @@ module.exports = {
       path.join(__dirname, '../node_modules')
     ],
     alias: {
-      'vue': '@vue/compat',
       'static': path.resolve(__dirname, '../static'),
       'src': path.resolve(__dirname, '../src'),
       'assets': path.resolve(__dirname, '../src/assets'),
@@ -62,13 +61,6 @@ module.exports = {
       {
         test: /\.vue$/,
         loader: 'vue-loader',
-        options: {
-          compilerOptions: {
-            compatConfig: {
-              MODE: 2
-            }
-          }
-        }
       },
       {
         test: /\.jsx?$/,
diff --git a/build/webpack.dev.conf.js b/build/webpack.dev.conf.js
index 159572ba..4605b93d 100644
--- a/build/webpack.dev.conf.js
+++ b/build/webpack.dev.conf.js
@@ -21,7 +21,9 @@ module.exports = merge(baseWebpackConfig, {
     new webpack.DefinePlugin({
       'process.env': config.dev.env,
       'COMMIT_HASH': JSON.stringify('DEV'),
-      'DEV_OVERRIDES': JSON.stringify(config.dev.settings)
+      'DEV_OVERRIDES': JSON.stringify(config.dev.settings),
+      '__VUE_OPTIONS_API__': true,
+      '__VUE_PROD_DEVTOOLS__': false
     }),
     // https://github.com/glenjamin/webpack-hot-middleware#installation--usage
     new webpack.HotModuleReplacementPlugin(),
diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js
index ed11ebad..a67ed2f6 100644
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@@ -36,7 +36,9 @@ var webpackConfig = merge(baseWebpackConfig, {
     new webpack.DefinePlugin({
       'process.env': env,
       'COMMIT_HASH': JSON.stringify(commitHash),
-      'DEV_OVERRIDES': JSON.stringify(undefined)
+      'DEV_OVERRIDES': JSON.stringify(undefined),
+      '__VUE_OPTIONS_API__': true,
+      '__VUE_PROD_DEVTOOLS__': false
     }),
     // extract css into its own file
     new MiniCssExtractPlugin({
diff --git a/package.json b/package.json
index f9a58b87..1a743c16 100644
--- a/package.json
+++ b/package.json
@@ -35,7 +35,6 @@
     "ruffle-mirror": "2021.12.31",
     "click-outside-vue3": "4.0.1",
     "vue": "^3.1.0",
-    "@vue/compat": "^3.1.0",
     "vue-i18n": "9.1.9",
     "vue-router": "4.0.14",
     "vue-template-compiler": "2.6.11",
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 87448c8c..76832708 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -1,4 +1,4 @@
-import { createApp, configureCompat } from 'vue'
+import { createApp } from 'vue'
 import { createRouter, createWebHistory } from 'vue-router'
 import vClickOutside from 'click-outside-vue3'
 
@@ -15,14 +15,6 @@ import { CURRENT_VERSION } from '../services/theme_data/theme_data.service.js'
 import { applyTheme } from '../services/style_setter/style_setter.js'
 import FaviconService from '../services/favicon_service/favicon_service.js'
 
-// disable compat for certain features
-configureCompat({
-  ATTR_FALSE_VALUE: false,
-  COMPONENT_V_MODEL: false,
-  INSTANCE_SET: false,
-  RENDER_FUNCTION: false
-})
-
 let staticInitialResults = null
 
 const parsedInitialResults = () => {
diff --git a/test/unit/index.js b/test/unit/index.js
index 24d2825c..83a2dcdb 100644
--- a/test/unit/index.js
+++ b/test/unit/index.js
@@ -1,10 +1,3 @@
-import { configureCompat } from 'vue'
-// disable compat for certain features
-configureCompat({
-  COMPONENT_V_MODEL: false,
-  INSTANCE_SET: false,
-  RENDER_FUNCTION: false
-})
 // require all test files (files that ends with .spec.js)
 const testsContext = require.context('./specs', true, /\.spec$/)
 testsContext.keys().forEach(testsContext)
diff --git a/yarn.lock b/yarn.lock
index a1206eff..ca954c04 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1452,11 +1452,6 @@
     html-tags "^3.1.0"
     svg-tags "^1.0.0"
 
-"@vue/compat@^3.1.0":
-  version "3.2.31"
-  resolved "https://registry.yarnpkg.com/@vue/compat/-/compat-3.2.31.tgz#9c8bdf265eeba1777e5edb56cda73581e351a648"
-  integrity sha512-hhwJk/SRwpT2OADctj+t7QZCRIgh04AcelGpe6gdj0OxA75xpHnPrG+fmG37U3Z6WDrNHZpGvu2eXBzWXM4OVA==
-
 "@vue/compiler-core@3.2.31":
   version "3.2.31"
   resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.31.tgz#d38f06c2cf845742403b523ab4596a3fda152e89"

From f20ae34400b35c230d3e7824f98d9b3f4e977f82 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 01:04:37 +0300
Subject: [PATCH 088/113] lint

---
 src/components/color_input/color_input.vue               | 2 +-
 src/components/notification/notification.vue             | 5 ++++-
 src/components/opacity_input/opacity_input.vue           | 2 +-
 src/components/poll/poll.vue                             | 5 ++++-
 src/components/selectable_list/selectable_list.vue       | 4 ++--
 .../settings_modal/helpers/boolean_setting.vue           | 2 +-
 src/components/settings_modal/helpers/choice_setting.vue | 2 +-
 src/components/settings_modal/settings_modal.vue         | 7 +++++--
 src/components/settings_modal/tabs/profile_tab.vue       | 2 +-
 .../settings_modal/tabs/theme_tab/theme_tab.vue          | 9 ++++++---
 src/components/shadow_control/shadow_control.vue         | 3 ++-
 src/components/thread_tree/thread_tree.vue               | 6 ++++--
 src/components/user_avatar/user_avatar.vue               | 2 +-
 .../user_reporting_modal/user_reporting_modal.vue        | 2 +-
 14 files changed, 34 insertions(+), 19 deletions(-)

diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index bb25f5a8..e84603c3 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined' && showOptionalTickbox"
-      :modelValue="present"
+      :model-value="present"
       :disabled="disabled"
       class="opt"
       @update:modelValue="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index d77b2f57..ff7a21f1 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -112,7 +112,10 @@
             </span>
             <span v-if="notification.type === 'pleroma:emoji_reaction'">
               <small>
-                <i18n-t scope="global" keypath="notifications.reacted_with">
+                <i18n-t
+                  scope="global"
+                  keypath="notifications.reacted_with"
+                >
                   <span class="emoji-reaction-emoji">{{ notification.emoji }}</span>
                 </i18n-t>
               </small>
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index 83bc917d..15d08e04 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined'"
-      :modelValue="present"
+      :model-value="present"
       :disabled="disabled"
       class="opt"
       @update:modelValue="$emit('update:modelValue', !present ? fallback : undefined)"
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index c3880096..9e37a9d7 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -71,7 +71,10 @@
           {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}&nbsp;·&nbsp;
         </template>
       </div>
-      <i18n-t scope="global" :keypath="expired ? 'polls.expired' : 'polls.expires_in'">
+      <i18n-t
+        scope="global"
+        :keypath="expired ? 'polls.expired' : 'polls.expires_in'"
+      >
         <Timeago
           :time="expiresAt"
           :auto-update="60"
diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue
index cf7cec27..6d4d0629 100644
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@@ -6,7 +6,7 @@
     >
       <div class="selectable-list-checkbox-wrapper">
         <Checkbox
-          :modelValue="allSelected"
+          :model-value="allSelected"
           :indeterminate="someSelected"
           @change="toggleAll"
         >
@@ -31,7 +31,7 @@
         >
           <div class="selectable-list-checkbox-wrapper">
             <Checkbox
-              :modelValue="isSelected(item)"
+              :model-value="isSelected(item)"
               @change="checked => toggle(checked, item)"
             />
           </div>
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index 3808bc74..69584808 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -4,7 +4,7 @@
     class="BooleanSetting"
   >
     <Checkbox
-      :modelValue="state"
+      :model-value="state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index b6aa853a..258c7422 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -6,7 +6,7 @@
     <slot />
     {{ ' ' }}
     <Select
-      :modelValue="state"
+      :model-value="state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 18dd3d7a..e0e8304d 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -110,12 +110,15 @@
           </template>
         </Popover>
 
-        <Checkbox :modelValue="!!expertLevel" @update:modelValue="expertLevel = Number($event)">
+        <Checkbox
+          :model-value="!!expertLevel"
+          @update:modelValue="expertLevel = Number($event)"
+        >
           {{ $t("settings.expert_mode") }}
         </Checkbox>
         <span
-          class="extra-content"
           id="unscrolled-content"
+          class="extra-content"
         />
       </div>
     </div>
diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index b78581bd..d3f6727f 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -184,8 +184,8 @@
         <button
           v-if="!isDefaultBackground"
           class="button-unstyled"
-          @click="resetBackground"
           :title="$t('settings.reset_profile_background')"
+          @click="resetBackground"
         >
           <FAIcon
             class="reset-button"
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index dfa9a735..ff2fece9 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -951,14 +951,16 @@
             :fallback="currentShadowFallback"
           />
           <div v-if="shadowSelected === 'avatar' || shadowSelected === 'avatarStatus'">
-            <i18n-t scope="global"
+            <i18n-t
+              scope="global"
               keypath="settings.style.shadows.filter_hint.always_drop_shadow"
               tag="p"
             >
               <code>filter: drop-shadow()</code>
             </i18n-t>
             <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
-            <i18n-t scope="global"
+            <i18n-t
+              scope="global"
               keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
               tag="p"
             >
@@ -966,7 +968,8 @@
               <code>spread-radius</code>
               <code>inset</code>
             </i18n-t>
-            <i18n-t scope="global"
+            <i18n-t
+              scope="global"
               keypath="settings.style.shadows.filter_hint.inset_classic"
               tag="p"
             >
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index d1e5fc22..f2fc7b99 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -204,7 +204,8 @@
         v-model="selected.alpha"
         :disabled="!present"
       />
-      <i18n-t scope="global"
+      <i18n-t
+        scope="global"
         keypath="settings.style.shadows.hintV3"
         tag="p"
       >
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index f81653eb..74577583 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -74,8 +74,9 @@
       v-if="currentReplies.length && !threadShowing"
       class="thread-tree-replies thread-tree-replies-hidden"
     >
-      <i18n-t scope="global"
+      <i18n-t
         v-if="simple"
+        scope="global"
         tag="button"
         keypath="status.thread_follow_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
@@ -92,8 +93,9 @@
           </span>
         </template>
       </i18n-t>
-      <i18n-t scope="global"
+      <i18n-t
         v-else
+        scope="global"
         tag="button"
         keypath="status.thread_show_full_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index b19ce89b..f4d294df 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -2,7 +2,7 @@
   <span
     class="Avatar"
     :class="{ '-compact': compact }"
-    >
+  >
     <StillImage
       v-if="user"
       class="avatar"
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 2993e4ec..cd7b52c4 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -53,7 +53,7 @@
                   :statusoid="item"
                 />
                 <Checkbox
-                  :modelValue="isChecked(item.id)"
+                  :model-value="isChecked(item.id)"
                   @change="checked => toggleStatus(checked, item.id)"
                 />
               </div>

From b132581b3a5291fdc9ca62baf912a40be747ee6b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 11:47:22 +0300
Subject: [PATCH 089/113] fix weird thing i somehow missed

---
 src/components/checkbox/checkbox.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index 83695912..78f1b940 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -12,7 +12,7 @@
     >
     <i class="checkbox-indicator" />
     <span
-      v-if="!!$slots.default"
+      v-if="!!$slots.default()"
       class="label"
     >
       <slot />

From d9d4d8954e8dc7a10b5c36840437516f6e56b436 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 11:57:54 +0300
Subject: [PATCH 090/113] Revert "lint"

This reverts commit f20ae34400b35c230d3e7824f98d9b3f4e977f82.
---
 src/components/color_input/color_input.vue               | 2 +-
 src/components/notification/notification.vue             | 5 +----
 src/components/opacity_input/opacity_input.vue           | 2 +-
 src/components/poll/poll.vue                             | 5 +----
 src/components/selectable_list/selectable_list.vue       | 4 ++--
 .../settings_modal/helpers/boolean_setting.vue           | 2 +-
 src/components/settings_modal/helpers/choice_setting.vue | 2 +-
 src/components/settings_modal/settings_modal.vue         | 7 ++-----
 src/components/settings_modal/tabs/profile_tab.vue       | 2 +-
 .../settings_modal/tabs/theme_tab/theme_tab.vue          | 9 +++------
 src/components/shadow_control/shadow_control.vue         | 3 +--
 src/components/thread_tree/thread_tree.vue               | 6 ++----
 src/components/user_avatar/user_avatar.vue               | 2 +-
 .../user_reporting_modal/user_reporting_modal.vue        | 2 +-
 14 files changed, 19 insertions(+), 34 deletions(-)

diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index e84603c3..bb25f5a8 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined' && showOptionalTickbox"
-      :model-value="present"
+      :modelValue="present"
       :disabled="disabled"
       class="opt"
       @update:modelValue="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index ff7a21f1..d77b2f57 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -112,10 +112,7 @@
             </span>
             <span v-if="notification.type === 'pleroma:emoji_reaction'">
               <small>
-                <i18n-t
-                  scope="global"
-                  keypath="notifications.reacted_with"
-                >
+                <i18n-t scope="global" keypath="notifications.reacted_with">
                   <span class="emoji-reaction-emoji">{{ notification.emoji }}</span>
                 </i18n-t>
               </small>
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index 15d08e04..83bc917d 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined'"
-      :model-value="present"
+      :modelValue="present"
       :disabled="disabled"
       class="opt"
       @update:modelValue="$emit('update:modelValue', !present ? fallback : undefined)"
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index 9e37a9d7..c3880096 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -71,10 +71,7 @@
           {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}&nbsp;·&nbsp;
         </template>
       </div>
-      <i18n-t
-        scope="global"
-        :keypath="expired ? 'polls.expired' : 'polls.expires_in'"
-      >
+      <i18n-t scope="global" :keypath="expired ? 'polls.expired' : 'polls.expires_in'">
         <Timeago
           :time="expiresAt"
           :auto-update="60"
diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue
index 6d4d0629..cf7cec27 100644
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@@ -6,7 +6,7 @@
     >
       <div class="selectable-list-checkbox-wrapper">
         <Checkbox
-          :model-value="allSelected"
+          :modelValue="allSelected"
           :indeterminate="someSelected"
           @change="toggleAll"
         >
@@ -31,7 +31,7 @@
         >
           <div class="selectable-list-checkbox-wrapper">
             <Checkbox
-              :model-value="isSelected(item)"
+              :modelValue="isSelected(item)"
               @change="checked => toggle(checked, item)"
             />
           </div>
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index 69584808..3808bc74 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -4,7 +4,7 @@
     class="BooleanSetting"
   >
     <Checkbox
-      :model-value="state"
+      :modelValue="state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index 258c7422..b6aa853a 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -6,7 +6,7 @@
     <slot />
     {{ ' ' }}
     <Select
-      :model-value="state"
+      :modelValue="state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index e0e8304d..18dd3d7a 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -110,15 +110,12 @@
           </template>
         </Popover>
 
-        <Checkbox
-          :model-value="!!expertLevel"
-          @update:modelValue="expertLevel = Number($event)"
-        >
+        <Checkbox :modelValue="!!expertLevel" @update:modelValue="expertLevel = Number($event)">
           {{ $t("settings.expert_mode") }}
         </Checkbox>
         <span
-          id="unscrolled-content"
           class="extra-content"
+          id="unscrolled-content"
         />
       </div>
     </div>
diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index d3f6727f..b78581bd 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -184,8 +184,8 @@
         <button
           v-if="!isDefaultBackground"
           class="button-unstyled"
-          :title="$t('settings.reset_profile_background')"
           @click="resetBackground"
+          :title="$t('settings.reset_profile_background')"
         >
           <FAIcon
             class="reset-button"
diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index ff2fece9..dfa9a735 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -951,16 +951,14 @@
             :fallback="currentShadowFallback"
           />
           <div v-if="shadowSelected === 'avatar' || shadowSelected === 'avatarStatus'">
-            <i18n-t
-              scope="global"
+            <i18n-t scope="global"
               keypath="settings.style.shadows.filter_hint.always_drop_shadow"
               tag="p"
             >
               <code>filter: drop-shadow()</code>
             </i18n-t>
             <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
-            <i18n-t
-              scope="global"
+            <i18n-t scope="global"
               keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
               tag="p"
             >
@@ -968,8 +966,7 @@
               <code>spread-radius</code>
               <code>inset</code>
             </i18n-t>
-            <i18n-t
-              scope="global"
+            <i18n-t scope="global"
               keypath="settings.style.shadows.filter_hint.inset_classic"
               tag="p"
             >
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index f2fc7b99..d1e5fc22 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -204,8 +204,7 @@
         v-model="selected.alpha"
         :disabled="!present"
       />
-      <i18n-t
-        scope="global"
+      <i18n-t scope="global"
         keypath="settings.style.shadows.hintV3"
         tag="p"
       >
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index 74577583..f81653eb 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -74,9 +74,8 @@
       v-if="currentReplies.length && !threadShowing"
       class="thread-tree-replies thread-tree-replies-hidden"
     >
-      <i18n-t
+      <i18n-t scope="global"
         v-if="simple"
-        scope="global"
         tag="button"
         keypath="status.thread_follow_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
@@ -93,9 +92,8 @@
           </span>
         </template>
       </i18n-t>
-      <i18n-t
+      <i18n-t scope="global"
         v-else
-        scope="global"
         tag="button"
         keypath="status.thread_show_full_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index f4d294df..b19ce89b 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -2,7 +2,7 @@
   <span
     class="Avatar"
     :class="{ '-compact': compact }"
-  >
+    >
     <StillImage
       v-if="user"
       class="avatar"
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index cd7b52c4..2993e4ec 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -53,7 +53,7 @@
                   :statusoid="item"
                 />
                 <Checkbox
-                  :model-value="isChecked(item.id)"
+                  :modelValue="isChecked(item.id)"
                   @change="checked => toggleStatus(checked, item.id)"
                 />
               </div>

From 64d56e651526acdba402d4fcae7fc6fa919c0319 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 11:59:00 +0300
Subject: [PATCH 091/113] Revert "fix weird thing i somehow missed"

This reverts commit b132581b3a5291fdc9ca62baf912a40be747ee6b.
---
 src/components/checkbox/checkbox.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/checkbox/checkbox.vue b/src/components/checkbox/checkbox.vue
index 78f1b940..83695912 100644
--- a/src/components/checkbox/checkbox.vue
+++ b/src/components/checkbox/checkbox.vue
@@ -12,7 +12,7 @@
     >
     <i class="checkbox-indicator" />
     <span
-      v-if="!!$slots.default()"
+      v-if="!!$slots.default"
       class="label"
     >
       <slot />

From b93e5437bdfa3f5d3c2e3d9cfec896c399728dfc Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 12:04:09 +0300
Subject: [PATCH 092/113] manual lint

---
 .../settings_modal/tabs/theme_tab/theme_tab.vue          | 9 ++++++---
 src/components/shadow_control/shadow_control.vue         | 3 ++-
 src/components/thread_tree/thread_tree.vue               | 6 ++++--
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
index dfa9a735..ff2fece9 100644
--- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
+++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue
@@ -951,14 +951,16 @@
             :fallback="currentShadowFallback"
           />
           <div v-if="shadowSelected === 'avatar' || shadowSelected === 'avatarStatus'">
-            <i18n-t scope="global"
+            <i18n-t
+              scope="global"
               keypath="settings.style.shadows.filter_hint.always_drop_shadow"
               tag="p"
             >
               <code>filter: drop-shadow()</code>
             </i18n-t>
             <p>{{ $t('settings.style.shadows.filter_hint.avatar_inset') }}</p>
-            <i18n-t scope="global"
+            <i18n-t
+              scope="global"
               keypath="settings.style.shadows.filter_hint.drop_shadow_syntax"
               tag="p"
             >
@@ -966,7 +968,8 @@
               <code>spread-radius</code>
               <code>inset</code>
             </i18n-t>
-            <i18n-t scope="global"
+            <i18n-t
+              scope="global"
               keypath="settings.style.shadows.filter_hint.inset_classic"
               tag="p"
             >
diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue
index d1e5fc22..f2fc7b99 100644
--- a/src/components/shadow_control/shadow_control.vue
+++ b/src/components/shadow_control/shadow_control.vue
@@ -204,7 +204,8 @@
         v-model="selected.alpha"
         :disabled="!present"
       />
-      <i18n-t scope="global"
+      <i18n-t
+        scope="global"
         keypath="settings.style.shadows.hintV3"
         tag="p"
       >
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index f81653eb..4cae2726 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -74,7 +74,8 @@
       v-if="currentReplies.length && !threadShowing"
       class="thread-tree-replies thread-tree-replies-hidden"
     >
-      <i18n-t scope="global"
+      <i18n-t
+        scope="global"
         v-if="simple"
         tag="button"
         keypath="status.thread_follow_with_icon"
@@ -92,8 +93,9 @@
           </span>
         </template>
       </i18n-t>
-      <i18n-t scope="global"
+      <i18n-t
         v-else
+        scope="global"
         tag="button"
         keypath="status.thread_show_full_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"

From 3f04ebd89ac889c39da7f652d77426c6b690ae53 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 12:27:59 +0300
Subject: [PATCH 093/113] lock down version?

---
 package.json | 2 +-
 yarn.lock    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index f9a58b87..ebd7f47a 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "punycode.js": "2.1.0",
     "ruffle-mirror": "2021.12.31",
     "click-outside-vue3": "4.0.1",
-    "vue": "^3.1.0",
+    "vue": "^3.2.31",
     "@vue/compat": "^3.1.0",
     "vue-i18n": "9.1.9",
     "vue-router": "4.0.14",
diff --git a/yarn.lock b/yarn.lock
index a1206eff..d1cf0326 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9967,7 +9967,7 @@ vue-template-compiler@2.6.11:
     de-indent "^1.0.2"
     he "^1.1.0"
 
-vue@^3.1.0:
+vue@^3.2.31:
   version "3.2.31"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
   integrity sha512-odT3W2tcffTiQCy57nOT93INw1auq5lYLLYtWpPYQQYQOOdHiqFct9Xhna6GJ+pJQaF67yZABraH47oywkJgFw==

From 3799983d4f89cad4dbf4595f49a768a66b72b07e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 12:41:34 +0300
Subject: [PATCH 094/113] fix production build's reply not working in tree mode

---
 src/components/status/status.js                 | 2 +-
 src/components/status_content/status_content.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index ee0da4dc..c6b24c72 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -69,7 +69,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return (Object.getOwnPropertyDescriptor(this, toggle) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
+    return (this.$props[toggle] && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index 0200382b..f47d036a 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -31,7 +31,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return (Object.getOwnPropertyDescriptor(this, toggle) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
+    return (this.$props[toggle] && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})

From 5bbc0e0bb5f4a0c95674e6879975e6b5121b421e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 15:35:18 +0300
Subject: [PATCH 095/113] lint + fixes for registration

---
 src/components/color_input/color_input.vue    |  2 +-
 src/components/notification/notification.vue  |  5 ++-
 .../opacity_input/opacity_input.vue           |  2 +-
 src/components/poll/poll.vue                  |  5 ++-
 src/components/registration/registration.js   |  2 +-
 src/components/registration/registration.vue  | 38 +++++++++----------
 .../selectable_list/selectable_list.vue       |  4 +-
 .../helpers/boolean_setting.vue               |  2 +-
 .../settings_modal/helpers/choice_setting.vue |  2 +-
 .../settings_modal/settings_modal.vue         |  7 +++-
 .../settings_modal/tabs/profile_tab.vue       |  2 +-
 src/components/thread_tree/thread_tree.vue    |  2 +-
 src/components/user_avatar/user_avatar.vue    |  2 +-
 .../user_reporting_modal.vue                  |  2 +-
 14 files changed, 43 insertions(+), 34 deletions(-)

diff --git a/src/components/color_input/color_input.vue b/src/components/color_input/color_input.vue
index bb25f5a8..e84603c3 100644
--- a/src/components/color_input/color_input.vue
+++ b/src/components/color_input/color_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined' && showOptionalTickbox"
-      :modelValue="present"
+      :model-value="present"
       :disabled="disabled"
       class="opt"
       @update:modelValue="$emit('update:modelValue', typeof modelValue === 'undefined' ? fallback : undefined)"
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index d77b2f57..ff7a21f1 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -112,7 +112,10 @@
             </span>
             <span v-if="notification.type === 'pleroma:emoji_reaction'">
               <small>
-                <i18n-t scope="global" keypath="notifications.reacted_with">
+                <i18n-t
+                  scope="global"
+                  keypath="notifications.reacted_with"
+                >
                   <span class="emoji-reaction-emoji">{{ notification.emoji }}</span>
                 </i18n-t>
               </small>
diff --git a/src/components/opacity_input/opacity_input.vue b/src/components/opacity_input/opacity_input.vue
index 83bc917d..15d08e04 100644
--- a/src/components/opacity_input/opacity_input.vue
+++ b/src/components/opacity_input/opacity_input.vue
@@ -11,7 +11,7 @@
     </label>
     <Checkbox
       v-if="typeof fallback !== 'undefined'"
-      :modelValue="present"
+      :model-value="present"
       :disabled="disabled"
       class="opt"
       @update:modelValue="$emit('update:modelValue', !present ? fallback : undefined)"
diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index c3880096..9e37a9d7 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -71,7 +71,10 @@
           {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}&nbsp;·&nbsp;
         </template>
       </div>
-      <i18n-t scope="global" :keypath="expired ? 'polls.expired' : 'polls.expires_in'">
+      <i18n-t
+        scope="global"
+        :keypath="expired ? 'polls.expired' : 'polls.expires_in'"
+      >
         <Timeago
           :time="expiresAt"
           :auto-update="60"
diff --git a/src/components/registration/registration.js b/src/components/registration/registration.js
index 531cc480..a792fb7b 100644
--- a/src/components/registration/registration.js
+++ b/src/components/registration/registration.js
@@ -24,7 +24,7 @@ const registration = {
         password: { required },
         confirm: {
           required,
-          sameAsPassword: sameAs('password')
+          sameAs: sameAs(this.password)
         },
         reason: { required: requiredIf(() => this.accountApprovalRequired) }
       }
diff --git a/src/components/registration/registration.vue b/src/components/registration/registration.vue
index 65b4bb33..3d409109 100644
--- a/src/components/registration/registration.vue
+++ b/src/components/registration/registration.vue
@@ -12,7 +12,7 @@
           <div class="text-fields">
             <div
               class="form-group"
-              :class="{ 'form-group--error': $v.user.username.$error }"
+              :class="{ 'form-group--error': v$.user.username.$error }"
             >
               <label
                 class="form--label"
@@ -20,18 +20,18 @@
               >{{ $t('login.username') }}</label>
               <input
                 id="sign-up-username"
-                v-model.trim="$v.user.username.$model"
+                v-model.trim="v$.user.username.$model"
                 :disabled="isPending"
                 class="form-control"
                 :placeholder="$t('registration.username_placeholder')"
               >
             </div>
             <div
-              v-if="$v.user.username.$dirty"
+              v-if="v$.user.username.$dirty"
               class="form-error"
             >
               <ul>
-                <li v-if="!$v.user.username.required">
+                <li v-if="!v$.user.username.required">
                   <span>{{ $t('registration.validations.username_required') }}</span>
                 </li>
               </ul>
@@ -39,7 +39,7 @@
 
             <div
               class="form-group"
-              :class="{ 'form-group--error': $v.user.fullname.$error }"
+              :class="{ 'form-group--error': v$.user.fullname.$error }"
             >
               <label
                 class="form--label"
@@ -47,18 +47,18 @@
               >{{ $t('registration.fullname') }}</label>
               <input
                 id="sign-up-fullname"
-                v-model.trim="$v.user.fullname.$model"
+                v-model.trim="v$.user.fullname.$model"
                 :disabled="isPending"
                 class="form-control"
                 :placeholder="$t('registration.fullname_placeholder')"
               >
             </div>
             <div
-              v-if="$v.user.fullname.$dirty"
+              v-if="v$.user.fullname.$dirty"
               class="form-error"
             >
               <ul>
-                <li v-if="!$v.user.fullname.required">
+                <li v-if="!v$.user.fullname.required">
                   <span>{{ $t('registration.validations.fullname_required') }}</span>
                 </li>
               </ul>
@@ -66,7 +66,7 @@
 
             <div
               class="form-group"
-              :class="{ 'form-group--error': $v.user.email.$error }"
+              :class="{ 'form-group--error': v$.user.email.$error }"
             >
               <label
                 class="form--label"
@@ -74,18 +74,18 @@
               >{{ $t('registration.email') }}</label>
               <input
                 id="email"
-                v-model="$v.user.email.$model"
+                v-model="v$.user.email.$model"
                 :disabled="isPending"
                 class="form-control"
                 type="email"
               >
             </div>
             <div
-              v-if="$v.user.email.$dirty"
+              v-if="v$.user.email.$dirty"
               class="form-error"
             >
               <ul>
-                <li v-if="!$v.user.email.required">
+                <li v-if="!v$.user.email.required">
                   <span>{{ $t('registration.validations.email_required') }}</span>
                 </li>
               </ul>
@@ -107,7 +107,7 @@
 
             <div
               class="form-group"
-              :class="{ 'form-group--error': $v.user.password.$error }"
+              :class="{ 'form-group--error': v$.user.password.$error }"
             >
               <label
                 class="form--label"
@@ -122,11 +122,11 @@
               >
             </div>
             <div
-              v-if="$v.user.password.$dirty"
+              v-if="v$.user.password.$dirty"
               class="form-error"
             >
               <ul>
-                <li v-if="!$v.user.password.required">
+                <li v-if="!v$.user.password.required">
                   <span>{{ $t('registration.validations.password_required') }}</span>
                 </li>
               </ul>
@@ -134,7 +134,7 @@
 
             <div
               class="form-group"
-              :class="{ 'form-group--error': $v.user.confirm.$error }"
+              :class="{ 'form-group--error': v$.user.confirm.$error }"
             >
               <label
                 class="form--label"
@@ -149,14 +149,14 @@
               >
             </div>
             <div
-              v-if="$v.user.confirm.$dirty"
+              v-if="v$.user.confirm.$dirty"
               class="form-error"
             >
               <ul>
-                <li v-if="!$v.user.confirm.required">
+                <li v-if="!v$.user.confirm.required">
                   <span>{{ $t('registration.validations.password_confirmation_required') }}</span>
                 </li>
-                <li v-if="!$v.user.confirm.sameAsPassword">
+                <li v-if="!v$.user.confirm.sameAsPassword">
                   <span>{{ $t('registration.validations.password_confirmation_match') }}</span>
                 </li>
               </ul>
diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue
index cf7cec27..6d4d0629 100644
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@@ -6,7 +6,7 @@
     >
       <div class="selectable-list-checkbox-wrapper">
         <Checkbox
-          :modelValue="allSelected"
+          :model-value="allSelected"
           :indeterminate="someSelected"
           @change="toggleAll"
         >
@@ -31,7 +31,7 @@
         >
           <div class="selectable-list-checkbox-wrapper">
             <Checkbox
-              :modelValue="isSelected(item)"
+              :model-value="isSelected(item)"
               @change="checked => toggle(checked, item)"
             />
           </div>
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index 3808bc74..69584808 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -4,7 +4,7 @@
     class="BooleanSetting"
   >
     <Checkbox
-      :modelValue="state"
+      :model-value="state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index b6aa853a..258c7422 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -6,7 +6,7 @@
     <slot />
     {{ ' ' }}
     <Select
-      :modelValue="state"
+      :model-value="state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue
index 18dd3d7a..e0e8304d 100644
--- a/src/components/settings_modal/settings_modal.vue
+++ b/src/components/settings_modal/settings_modal.vue
@@ -110,12 +110,15 @@
           </template>
         </Popover>
 
-        <Checkbox :modelValue="!!expertLevel" @update:modelValue="expertLevel = Number($event)">
+        <Checkbox
+          :model-value="!!expertLevel"
+          @update:modelValue="expertLevel = Number($event)"
+        >
           {{ $t("settings.expert_mode") }}
         </Checkbox>
         <span
-          class="extra-content"
           id="unscrolled-content"
+          class="extra-content"
         />
       </div>
     </div>
diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index b78581bd..d3f6727f 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -184,8 +184,8 @@
         <button
           v-if="!isDefaultBackground"
           class="button-unstyled"
-          @click="resetBackground"
           :title="$t('settings.reset_profile_background')"
+          @click="resetBackground"
         >
           <FAIcon
             class="reset-button"
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index 4cae2726..74577583 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -75,8 +75,8 @@
       class="thread-tree-replies thread-tree-replies-hidden"
     >
       <i18n-t
-        scope="global"
         v-if="simple"
+        scope="global"
         tag="button"
         keypath="status.thread_follow_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index b19ce89b..f4d294df 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -2,7 +2,7 @@
   <span
     class="Avatar"
     :class="{ '-compact': compact }"
-    >
+  >
     <StillImage
       v-if="user"
       class="avatar"
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 2993e4ec..cd7b52c4 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -53,7 +53,7 @@
                   :statusoid="item"
                 />
                 <Checkbox
-                  :modelValue="isChecked(item.id)"
+                  :model-value="isChecked(item.id)"
                   @change="checked => toggleStatus(checked, item.id)"
                 />
               </div>

From 3171241c6fb0b37408098d9607623a8bf86777ee Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 15:44:42 +0300
Subject: [PATCH 096/113] fix qr code

---
 package.json | 13 +++++++------
 yarn.lock    | 18 +++++++++---------
 2 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/package.json b/package.json
index ebd7f47a..51ba8d1f 100644
--- a/package.json
+++ b/package.json
@@ -17,14 +17,18 @@
   },
   "dependencies": {
     "@babel/runtime": "7.17.8",
-    "@chenfengyuan/vue-qrcode": "1.0.2",
+    "@chenfengyuan/vue-qrcode": "2.0.0",
     "@fortawesome/fontawesome-svg-core": "1.3.0",
     "@fortawesome/free-regular-svg-icons": "5.15.4",
     "@fortawesome/free-solid-svg-icons": "5.15.4",
     "@fortawesome/vue-fontawesome": "3.0.0-5",
     "@kazvmoe-infra/pinch-zoom-element": "1.2.0",
+    "@vue/compat": "^3.1.0",
+    "@vuelidate/core": "2.0.0-alpha.35",
+    "@vuelidate/validators": "2.0.0-alpha.27",
     "body-scroll-lock": "2.7.1",
     "chromatism": "3.0.0",
+    "click-outside-vue3": "4.0.1",
     "cropperjs": "1.5.12",
     "diff": "3.5.0",
     "escape-html": "1.0.3",
@@ -32,15 +36,12 @@
     "parse-link-header": "1.0.1",
     "phoenix": "1.4.0",
     "punycode.js": "2.1.0",
+    "qrcode": "1",
     "ruffle-mirror": "2021.12.31",
-    "click-outside-vue3": "4.0.1",
     "vue": "^3.2.31",
-    "@vue/compat": "^3.1.0",
     "vue-i18n": "9.1.9",
     "vue-router": "4.0.14",
     "vue-template-compiler": "2.6.11",
-    "@vuelidate/core": "2.0.0-alpha.35",
-    "@vuelidate/validators": "2.0.0-alpha.27",
     "vuex": "4.0.2"
   },
   "devDependencies": {
@@ -51,8 +52,8 @@
     "@ungap/event-target": "0.2.3",
     "@vue/babel-helper-vue-jsx-merge-props": "1.2.1",
     "@vue/babel-plugin-jsx": "1.1.1",
-    "@vue/test-utils": "2.0.0-rc.17",
     "@vue/compiler-sfc": "^3.1.0",
+    "@vue/test-utils": "2.0.0-rc.17",
     "autoprefixer": "6.7.7",
     "babel-eslint": "7.2.3",
     "babel-loader": "8.2.4",
diff --git a/yarn.lock b/yarn.lock
index d1cf0326..46538984 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1160,12 +1160,10 @@
     lodash "^4.17.13"
     to-fast-properties "^2.0.0"
 
-"@chenfengyuan/vue-qrcode@1.0.2":
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/@chenfengyuan/vue-qrcode/-/vue-qrcode-1.0.2.tgz#37d71902e166e1ae58176bd6cb9c40905c1b0949"
-  integrity sha512-hwy1d4YMJAyEh+V7dLPG8eAKACRvugzSB4ylwb6QNqo84KHTF50/5EJcBYdUhTRPfAqrxG0i6jDAXONWOGyQbQ==
-  dependencies:
-    qrcode "^1.4.4"
+"@chenfengyuan/vue-qrcode@2.0.0":
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/@chenfengyuan/vue-qrcode/-/vue-qrcode-2.0.0.tgz#8cd01f6fc528d471680ebe812ec47c830aea7e63"
+  integrity sha512-33Cfr0zjbc3Dd8d5b1IgzXRAgXH0c2Gv19VI4snS25V/x9Z41eg769tC+Us1x+vqgQQhgD5YUjLnkpkrQfeMSw==
 
 "@colors/colors@1.5.0":
   version "1.5.0"
@@ -3576,8 +3574,9 @@ diffie-hellman@^5.0.0:
     randombytes "^2.0.0"
 
 dijkstrajs@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/dijkstrajs/-/dijkstrajs-1.0.1.tgz#d3cd81221e3ea40742cfcde556d4e99e98ddc71b"
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/dijkstrajs/-/dijkstrajs-1.0.2.tgz#2e48c0d3b825462afe75ab4ad5e829c8ece36257"
+  integrity sha512-QV6PMaHTCNmKSeP6QoXhVTw9snc9VD8MulTT0Bd99Pacp4SS1cjcrYPgBPmibqKVtMJJfqC6XvOXgPMEEPH/fg==
 
 dir-glob@^3.0.1:
   version "3.0.1"
@@ -8007,7 +8006,7 @@ qjobs@^1.2.0:
   resolved "https://registry.yarnpkg.com/qjobs/-/qjobs-1.2.0.tgz#c45e9c61800bd087ef88d7e256423bdd49e5d071"
   integrity sha512-8YOJEHtxpySA3fFDyCRxA+UUV+fA+rTWnuWvylOK/NCjhY+b4ocCtmu8TtsWb+mYeU+GCHf/S66KZF/AsteKHg==
 
-qrcode@^1.4.4:
+qrcode@1:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/qrcode/-/qrcode-1.5.0.tgz#95abb8a91fdafd86f8190f2836abbfc500c72d1b"
   integrity sha512-9MgRpgVc+/+47dFvQeD6U2s0Z92EsKzcHogtum4QB+UNd025WOJSHvn/hjk9xmzj7Stj95CyUAs31mrjxliEsQ==
@@ -10103,6 +10102,7 @@ which-boxed-primitive@^1.0.2:
 which-module@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
+  integrity sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=
 
 which@^1.0.9, which@^1.1.1, which@^1.2.9, which@^1.3.1:
   version "1.3.1"

From afcfcce2e61ab5a4be8b618e61572d8eabe4ac7e Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 15:46:21 +0300
Subject: [PATCH 097/113] re-fix i18n warnings again

---
 src/components/conversation/conversation.vue             | 2 ++
 src/components/post_status_form/post_status_form.vue     | 1 +
 src/components/settings_modal/tabs/theme_tab/preview.vue | 3 ++-
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 39c5db33..ccc523a2 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -32,6 +32,7 @@
             tag="button"
             class="button-unstyled -link"
             @click.prevent="diveToTopLevel"
+            scope="global"
           >
             <template #icon>
               <FAIcon
@@ -101,6 +102,7 @@
               >
                 <i18n-t
                   tag="button"
+                  scope="global"
                   keypath="status.ancestor_follow_with_icon"
                   class="button-unstyled -link thread-tree-show-replies-button"
                   @click.prevent="diveIntoStatus(status.id)"
diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 45ec9656..8c0b74a3 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -23,6 +23,7 @@
           keypath="post_status.account_not_locked_warning"
           tag="p"
           class="visibility-notice"
+          scope="global"
         >
           <button
             class="button-unstyled -link"
diff --git a/src/components/settings_modal/tabs/theme_tab/preview.vue b/src/components/settings_modal/tabs/theme_tab/preview.vue
index 36613d20..f266b603 100644
--- a/src/components/settings_modal/tabs/theme_tab/preview.vue
+++ b/src/components/settings_modal/tabs/theme_tab/preview.vue
@@ -29,7 +29,7 @@
               {{ $t('settings.style.preview.content') }}
             </h4>
 
-            <i18n-t keypath="settings.style.preview.text">
+            <i18n-t scope="global" keypath="settings.style.preview.text">
               <code style="font-family: var(--postCodeFont)">
                 {{ $t('settings.style.preview.mono') }}
               </code>
@@ -76,6 +76,7 @@
               keypath="settings.style.preview.fine_print"
               tag="span"
               class="faint"
+              scope="global"
             >
               <a style="color: var(--faintLink)">
                 {{ $t('settings.style.preview.faint_link') }}

From 0afc955ebd54e7d242a4d796df38931eaecb40d5 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 16:08:57 +0300
Subject: [PATCH 098/113] registration fixes

---
 src/components/registration/registration.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/registration/registration.js b/src/components/registration/registration.js
index a792fb7b..a3ef0f04 100644
--- a/src/components/registration/registration.js
+++ b/src/components/registration/registration.js
@@ -24,7 +24,7 @@ const registration = {
         password: { required },
         confirm: {
           required,
-          sameAs: sameAs(this.password)
+          sameAs: sameAs(this.user.password)
         },
         reason: { required: requiredIf(() => this.accountApprovalRequired) }
       }
@@ -65,9 +65,9 @@ const registration = {
       this.user.captcha_token = this.captcha.token
       this.user.captcha_answer_data = this.captcha.answer_data
 
-      this.$v.$touch()
+      this.v$.$touch()
 
-      if (!this.$v.$invalid) {
+      if (!this.v$.$invalid) {
         try {
           await this.signUp(this.user)
           this.$router.push({ name: 'friends' })

From 2d7f242713edc45dbcc2811cd86d8864d093ce3f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 16:33:34 +0300
Subject: [PATCH 099/113] remove unused props to fix test

---
 src/components/mentions_line/mentions_line.vue | 2 --
 src/components/status/status.vue               | 1 -
 2 files changed, 3 deletions(-)

diff --git a/src/components/mentions_line/mentions_line.vue b/src/components/mentions_line/mentions_line.vue
index f375e3b0..09b6a1d6 100644
--- a/src/components/mentions_line/mentions_line.vue
+++ b/src/components/mentions_line/mentions_line.vue
@@ -6,7 +6,6 @@
       class="mention-link"
       :content="mention.content"
       :url="mention.url"
-      :first-mention="false"
     /><span
       v-if="manyMentions"
       class="extraMentions"
@@ -21,7 +20,6 @@
           class="mention-link"
           :content="mention.content"
           :url="mention.url"
-          :first-mention="false"
         />
       </span><button
         v-if="!expanded"
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 61feb303..67ce999a 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -296,7 +296,6 @@
                   :url="replyProfileLink"
                   :user-id="status.in_reply_to_user_id"
                   :user-screen-name="status.in_reply_to_screen_name"
-                  :first-mention="false"
                 />
               </span>
 

From bc029b0fa2499651a7ff541f09afe1fbc2e19cea Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 19:04:01 +0300
Subject: [PATCH 100/113] fix spacing in poll expiration label

---
 src/components/poll/poll.vue | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/components/poll/poll.vue b/src/components/poll/poll.vue
index 9e37a9d7..f6b12a54 100644
--- a/src/components/poll/poll.vue
+++ b/src/components/poll/poll.vue
@@ -71,16 +71,18 @@
           {{ $tc("polls.votes_count", poll.votes_count, { count: poll.votes_count }) }}&nbsp;·&nbsp;
         </template>
       </div>
-      <i18n-t
-        scope="global"
-        :keypath="expired ? 'polls.expired' : 'polls.expires_in'"
-      >
-        <Timeago
-          :time="expiresAt"
-          :auto-update="60"
-          :now-threshold="0"
-        />
-      </i18n-t>
+      <span>
+        <i18n-t
+          scope="global"
+          :keypath="expired ? 'polls.expired' : 'polls.expires_in'"
+        >
+          <Timeago
+            :time="expiresAt"
+            :auto-update="60"
+            :now-threshold="0"
+          />
+        </i18n-t>
+      </span>
     </div>
   </div>
 </template>

From 218b15b5fd3c09f927e4f92b5cee7ef988c9ae39 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 19:12:57 +0300
Subject: [PATCH 101/113] fix reset buttons in profile again

---
 src/components/settings_modal/tabs/profile_tab.scss | 6 +++++-
 src/components/settings_modal/tabs/profile_tab.vue  | 7 +++----
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/components/settings_modal/tabs/profile_tab.scss b/src/components/settings_modal/tabs/profile_tab.scss
index 111eaed3..3c9683cd 100644
--- a/src/components/settings_modal/tabs/profile_tab.scss
+++ b/src/components/settings_modal/tabs/profile_tab.scss
@@ -54,16 +54,20 @@
     border-radius: var(--tooltipRadius, $fallback--tooltipRadius);
     background-color: rgba(0, 0, 0, 0.6);
     opacity: 0.7;
-    color: white;
     width: 1.5em;
     height: 1.5em;
     text-align: center;
     line-height: 1.5em;
     font-size: 1.5em;
     cursor: pointer;
+
     &:hover {
       opacity: 1;
     }
+
+    svg {
+      color: white;
+    }
   }
 
   .oauth-tokens {
diff --git a/src/components/settings_modal/tabs/profile_tab.vue b/src/components/settings_modal/tabs/profile_tab.vue
index d3f6727f..881016fb 100644
--- a/src/components/settings_modal/tabs/profile_tab.vue
+++ b/src/components/settings_modal/tabs/profile_tab.vue
@@ -111,9 +111,9 @@
           v-if="!isDefaultAvatar && pickAvatarBtnVisible"
           :title="$t('settings.reset_avatar')"
           @click="resetAvatar"
+          class="button-unstyled reset-button"
         >
           <FAIcon
-            class="reset-button"
             icon="times"
             type="button"
           />
@@ -141,11 +141,11 @@
         <img :src="user.cover_photo">
         <button
           v-if="!isDefaultBanner"
+          class="button-unstyled reset-button"
           :title="$t('settings.reset_profile_banner')"
           @click="resetBanner"
         >
           <FAIcon
-            class="reset-button"
             icon="times"
             type="button"
           />
@@ -183,12 +183,11 @@
         <img :src="user.background_image">
         <button
           v-if="!isDefaultBackground"
-          class="button-unstyled"
+          class="button-unstyled reset-button"
           :title="$t('settings.reset_profile_background')"
           @click="resetBackground"
         >
           <FAIcon
-            class="reset-button"
             icon="times"
             type="button"
           />

From a1822f073d50f101d55ecfe47b664b44f741cb38 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 19:20:43 +0300
Subject: [PATCH 102/113] removing uselsess stuff

---
 src/components/gallery/gallery.vue             | 1 -
 src/components/mentions_line/mentions_line.vue | 2 --
 src/components/status/status.vue               | 1 -
 3 files changed, 4 deletions(-)

diff --git a/src/components/gallery/gallery.vue b/src/components/gallery/gallery.vue
index f2e1b5ce..ccf6e3e2 100644
--- a/src/components/gallery/gallery.vue
+++ b/src/components/gallery/gallery.vue
@@ -22,7 +22,6 @@
             class="gallery-item"
             :nsfw="nsfw"
             :attachment="attachment"
-            :allow-play="false"
             :size="size"
             :editable="editable"
             :remove="removeAttachment"
diff --git a/src/components/mentions_line/mentions_line.vue b/src/components/mentions_line/mentions_line.vue
index f375e3b0..09b6a1d6 100644
--- a/src/components/mentions_line/mentions_line.vue
+++ b/src/components/mentions_line/mentions_line.vue
@@ -6,7 +6,6 @@
       class="mention-link"
       :content="mention.content"
       :url="mention.url"
-      :first-mention="false"
     /><span
       v-if="manyMentions"
       class="extraMentions"
@@ -21,7 +20,6 @@
           class="mention-link"
           :content="mention.content"
           :url="mention.url"
-          :first-mention="false"
         />
       </span><button
         v-if="!expanded"
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index 61feb303..67ce999a 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -296,7 +296,6 @@
                   :url="replyProfileLink"
                   :user-id="status.in_reply_to_user_id"
                   :user-screen-name="status.in_reply_to_screen_name"
-                  :first-mention="false"
                 />
               </span>
 

From e1483488c7982daa9272c570f0a5a9296519ef31 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 19:23:30 +0300
Subject: [PATCH 103/113] fix some issues with trees

---
 src/components/status/status.js                 | 2 +-
 src/components/status_content/status_content.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index c6b24c72..ec0bd25a 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -69,7 +69,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return (this.$props[toggle] && this[toggle]) ? this[controlledName] : this[uncontrolledName]
+    return (this.$props[toggle] !== undefined && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index f47d036a..68e75d9e 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -31,7 +31,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return (this.$props[toggle] && this[toggle]) ? this[controlledName] : this[uncontrolledName]
+    return (this.$props[toggle] !== undefined && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})

From de2f9686452b2bcb6cfe08fe9a5b648ec6bd5ed2 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 19:44:07 +0300
Subject: [PATCH 104/113] fix?

---
 src/components/status/status.js                 | 2 +-
 src/components/status_content/status_content.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/status/status.js b/src/components/status/status.js
index ec0bd25a..a925f30b 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -69,7 +69,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return (this.$props[toggle] !== undefined && this[toggle]) ? this[controlledName] : this[uncontrolledName]
+    return ((this.$data[toggle] !== undefined || this.$props[toggle] !== undefined) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index 68e75d9e..e69c3afd 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -31,7 +31,7 @@ const controlledOrUncontrolledGetters = list => list.reduce((res, name) => {
   const controlledName = `controlled${camelized}`
   const uncontrolledName = `uncontrolled${camelized}`
   res[name] = function () {
-    return (this.$props[toggle] !== undefined && this[toggle]) ? this[controlledName] : this[uncontrolledName]
+    return ((this.$data[toggle] !== undefined || this.$props[toggle] !== undefined) && this[toggle]) ? this[controlledName] : this[uncontrolledName]
   }
   return res
 }, {})

From a3f48fc3f4230b283d62f55fcdf03247ae2ac481 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 19:55:30 +0300
Subject: [PATCH 105/113] fix warning about custom component

---
 build/webpack.base.conf.js | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js
index 65d398c8..1a0e486a 100644
--- a/build/webpack.base.conf.js
+++ b/build/webpack.base.conf.js
@@ -64,6 +64,12 @@ module.exports = {
         loader: 'vue-loader',
         options: {
           compilerOptions: {
+            isCustomElement(tag) {
+              if (tag === 'pinch-zoom') {
+                return true
+              }
+              return false
+            },
             compatConfig: {
               MODE: 2
             }

From 97e072d93a50c45a4a16bbdc6273266b31f4d095 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 29 Mar 2022 20:23:44 +0300
Subject: [PATCH 106/113] how did this get back??

---
 package.json | 1 -
 1 file changed, 1 deletion(-)

diff --git a/package.json b/package.json
index 51ba8d1f..0537780e 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,6 @@
     "@fortawesome/free-solid-svg-icons": "5.15.4",
     "@fortawesome/vue-fontawesome": "3.0.0-5",
     "@kazvmoe-infra/pinch-zoom-element": "1.2.0",
-    "@vue/compat": "^3.1.0",
     "@vuelidate/core": "2.0.0-alpha.35",
     "@vuelidate/validators": "2.0.0-alpha.27",
     "body-scroll-lock": "2.7.1",

From b84acfd7b75337f8999adad7b1a670630e9ee36d Mon Sep 17 00:00:00 2001
From: Tusooa Zhu <tusooa@kazv.moe>
Date: Tue, 29 Mar 2022 13:56:42 -0400
Subject: [PATCH 107/113] Add controlledShowingLongSubject and toggle in
 StatusContent props

---
 src/components/status_content/status_content.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index e69c3afd..89f0aa51 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -59,7 +59,9 @@ const StatusContent = {
     'controlledShowingTall',
     'controlledExpandingSubject',
     'controlledToggleShowingTall',
-    'controlledToggleExpandingSubject'
+    'controlledToggleExpandingSubject',
+    'controlledShowingLongSubject',
+    'controlledToggleShowingLongSubject'
   ],
   data () {
     return {

From 70593e71e642b1f1ea323f2f3b7dc67984f24abb Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 30 Mar 2022 01:24:17 +0300
Subject: [PATCH 108/113] fix error clear icon

---
 src/components/post_status_form/post_status_form.vue | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
index 8c0b74a3..0fdb6dc7 100644
--- a/src/components/post_status_form/post_status_form.vue
+++ b/src/components/post_status_form/post_status_form.vue
@@ -282,11 +282,15 @@
         class="alert error"
       >
         Error: {{ error }}
-        <FAIcon
-          class="fa-scale-110 fa-old-padding"
-          icon="times"
+        <button
+          class="button-unstyled"
           @click="clearError"
-        />
+        >
+          <FAIcon
+            class="fa-scale-110 fa-old-padding"
+            icon="times"
+          />
+        </button>
       </div>
       <gallery
         v-if="newStatus.files && newStatus.files.length > 0"

From c3690b456e66585598f05d71643089a5e9770af7 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 30 Mar 2022 01:24:53 +0300
Subject: [PATCH 109/113] fix emoji input warning spam

---
 src/components/emoji_input/emoji_input.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/emoji_input/emoji_input.js b/src/components/emoji_input/emoji_input.js
index e772bf75..391cc5b5 100644
--- a/src/components/emoji_input/emoji_input.js
+++ b/src/components/emoji_input/emoji_input.js
@@ -31,7 +31,7 @@ library.add(
  */
 
 const EmojiInput = {
-  emits: ['update:modelValue'],
+  emits: ['update:modelValue', 'shown'],
   props: {
     suggest: {
       /**

From 19439910772ed5205edbb258b3d8a97315dde9b5 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 30 Mar 2022 12:33:56 +0300
Subject: [PATCH 110/113] make all clickable icons into actual buttons

---
 src/components/importer/importer.vue          | 18 +++++++++-----
 src/components/login_form/login_form.vue      | 12 ++++++----
 src/components/mfa_form/recovery_form.vue     | 12 ++++++----
 src/components/mfa_form/totp_form.vue         | 14 +++++++----
 src/components/notification/notification.vue  | 24 ++++++++++++-------
 .../notifications/notifications.scss          |  4 ----
 6 files changed, 53 insertions(+), 31 deletions(-)

diff --git a/src/components/importer/importer.vue b/src/components/importer/importer.vue
index ddc3010e..5df238e2 100644
--- a/src/components/importer/importer.vue
+++ b/src/components/importer/importer.vue
@@ -20,20 +20,26 @@
     >
       {{ submitButtonLabel || $t('importer.submit') }}
     </button>
-    <div v-if="success">
+    <button
+      v-if="success"
+      class="button-unstyled"
+      @click="dismiss"
+    >
       <FAIcon
         icon="times"
-        @click="dismiss"
       />
       <p>{{ successMessage || $t('importer.success') }}</p>
-    </div>
-    <div v-else-if="error">
+    </button>
+    <button
+      v-else-if="error"
+      class="button-unstyled"
+      @click="dismiss"
+    >
       <FAIcon
         icon="times"
-        @click="dismiss"
       />
       <p>{{ errorMessage || $t('importer.error') }}</p>
-    </div>
+    </button>
   </div>
 </template>
 
diff --git a/src/components/login_form/login_form.vue b/src/components/login_form/login_form.vue
index bfabb946..87fa37c6 100644
--- a/src/components/login_form/login_form.vue
+++ b/src/components/login_form/login_form.vue
@@ -76,11 +76,15 @@
     >
       <div class="alert error">
         {{ error }}
-        <FAIcon
-          class="fa-scale-110 fa-old-padding"
-          icon="times"
+        <button
+          class="button-unstyled"
           @click="clearError"
-        />
+        >
+          <FAIcon
+            class="fa-scale-110 fa-old-padding"
+            icon="times"
+          />
+        </button>
       </div>
     </div>
   </div>
diff --git a/src/components/mfa_form/recovery_form.vue b/src/components/mfa_form/recovery_form.vue
index 7c594228..a9cf39aa 100644
--- a/src/components/mfa_form/recovery_form.vue
+++ b/src/components/mfa_form/recovery_form.vue
@@ -56,11 +56,15 @@
     >
       <div class="alert error">
         {{ error }}
-        <FAIcon
-          class="fa-scale-110 fa-old-padding"
-          icon="times"
+        <button
+          class="button-unstyled"
           @click="clearError"
-        />
+        >
+          <FAIcon
+            class="fa-scale-110 fa-old-padding"
+            icon="times"
+          />
+        </button>
       </div>
     </div>
   </div>
diff --git a/src/components/mfa_form/totp_form.vue b/src/components/mfa_form/totp_form.vue
index 4ee13992..709eb9b8 100644
--- a/src/components/mfa_form/totp_form.vue
+++ b/src/components/mfa_form/totp_form.vue
@@ -58,12 +58,16 @@
     >
       <div class="alert error">
         {{ error }}
-        <FAIcon
-          size="lg"
-          class="fa-scale-110 fa-old-padding"
-          icon="times"
+        <button
+          class="button-unstyled"
           @click="clearError"
-        />
+        >
+          <FAIcon
+            size="lg"
+            class="fa-scale-110 fa-old-padding"
+            icon="times"
+          />
+        </button>
       </div>
     </div>
   </div>
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index ff7a21f1..9ecb034f 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -172,18 +172,26 @@
             v-if="notification.type === 'follow_request'"
             style="white-space: nowrap;"
           >
-            <FAIcon
-              icon="check"
-              class="fa-scale-110 fa-old-padding follow-request-accept"
+            <button
+              class="button-unstyled"
               :title="$t('tool_tip.accept_follow_request')"
               @click="approveUser()"
-            />
-            <FAIcon
-              icon="times"
-              class="fa-scale-110 fa-old-padding follow-request-reject"
+            >
+              <FAIcon
+                icon="check"
+                class="fa-scale-110 fa-old-padding follow-request-accept"
+              />
+            </button>
+            <button
+              class="button-unstyled"
               :title="$t('tool_tip.reject_follow_request')"
               @click="denyUser()"
-            />
+            >
+              <FAIcon
+                icon="times"
+                class="fa-scale-110 fa-old-padding follow-request-reject"
+              />
+            </button>
           </div>
         </div>
         <div
diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss
index 9e5663ed..a285027d 100644
--- a/src/components/notifications/notifications.scss
+++ b/src/components/notifications/notifications.scss
@@ -64,8 +64,6 @@
   }
 
   .follow-request-accept {
-    cursor: pointer;
-
     &:hover {
       color: $fallback--text;
       color: var(--text, $fallback--text);
@@ -73,8 +71,6 @@
   }
 
   .follow-request-reject {
-    cursor: pointer;
-
     &:hover {
       color: $fallback--cRed;
       color: var(--cRed, $fallback--cRed);

From dadf2f407fb242fe3091e7e60f227718c5e0c9cf Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 30 Mar 2022 18:00:24 +0300
Subject: [PATCH 111/113] fix importer

---
 src/components/importer/importer.vue | 44 +++++++++++++++-------------
 1 file changed, 24 insertions(+), 20 deletions(-)

diff --git a/src/components/importer/importer.vue b/src/components/importer/importer.vue
index 5df238e2..2a63b31a 100644
--- a/src/components/importer/importer.vue
+++ b/src/components/importer/importer.vue
@@ -20,26 +20,30 @@
     >
       {{ submitButtonLabel || $t('importer.submit') }}
     </button>
-    <button
-      v-if="success"
-      class="button-unstyled"
-      @click="dismiss"
-    >
-      <FAIcon
-        icon="times"
-      />
-      <p>{{ successMessage || $t('importer.success') }}</p>
-    </button>
-    <button
-      v-else-if="error"
-      class="button-unstyled"
-      @click="dismiss"
-    >
-      <FAIcon
-        icon="times"
-      />
-      <p>{{ errorMessage || $t('importer.error') }}</p>
-    </button>
+    <div v-if="success">
+      <button
+        class="button-unstyled"
+        @click="dismiss"
+      >
+        <FAIcon
+          icon="times"
+        />
+      </button>
+      {{ ' ' }}
+      <span>{{ successMessage || $t('importer.success') }}</span>
+    </div>
+    <div v-else-if="error">
+      <button
+        class="button-unstyled"
+        @click="dismiss"
+      >
+        <FAIcon
+          icon="times"
+        />
+      </button>
+      {{ ' ' }}
+      <span>{{ errorMessage || $t('importer.error') }}</span>
+    </div>
   </div>
 </template>
 

From afbe1a96ac9356202f7533d7178ce3a1e6f2ece1 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 30 Mar 2022 23:48:06 +0300
Subject: [PATCH 112/113] fix some mishaps i noticed during self-review

---
 src/components/chat_message/chat_message.js                 | 1 +
 src/components/post_status_form/post_status_form.js         | 6 ++++++
 src/components/selectable_list/selectable_list.vue          | 4 ++--
 .../user_reporting_modal/user_reporting_modal.vue           | 2 +-
 src/hocs/with_load_more/with_load_more.jsx                  | 1 -
 5 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/components/chat_message/chat_message.js b/src/components/chat_message/chat_message.js
index eb195bc1..5bac7736 100644
--- a/src/components/chat_message/chat_message.js
+++ b/src/components/chat_message/chat_message.js
@@ -27,6 +27,7 @@ const ChatMessage = {
     'chatViewItem',
     'hoveredMessageChain'
   ],
+  emits: ['hover'],
   components: {
     Popover,
     Attachment,
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index fe07309f..42c1335e 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -78,6 +78,12 @@ const PostStatusForm = {
     'emojiPickerPlacement',
     'optimisticPosting'
   ],
+  emits: [
+    'posted',
+    'resize',
+    'mediaplay'
+    'mediapause'
+  ],
   components: {
     MediaUpload,
     EmojiInput,
diff --git a/src/components/selectable_list/selectable_list.vue b/src/components/selectable_list/selectable_list.vue
index 6d4d0629..3c80660e 100644
--- a/src/components/selectable_list/selectable_list.vue
+++ b/src/components/selectable_list/selectable_list.vue
@@ -8,7 +8,7 @@
         <Checkbox
           :model-value="allSelected"
           :indeterminate="someSelected"
-          @change="toggleAll"
+          @update:model-value="toggleAll"
         >
           {{ $t('selectable_list.select_all') }}
         </Checkbox>
@@ -32,7 +32,7 @@
           <div class="selectable-list-checkbox-wrapper">
             <Checkbox
               :model-value="isSelected(item)"
-              @change="checked => toggle(checked, item)"
+              @update:model-value="checked => toggle(checked, item)"
             />
           </div>
           <slot
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index cd7b52c4..cc456365 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -54,7 +54,7 @@
                 />
                 <Checkbox
                   :model-value="isChecked(item.id)"
-                  @change="checked => toggleStatus(checked, item.id)"
+                  @update:model-value="checked => toggleStatus(checked, item.id)"
                 />
               </div>
             </template>
diff --git a/src/hocs/with_load_more/with_load_more.jsx b/src/hocs/with_load_more/with_load_more.jsx
index 705991ca..c0ae1856 100644
--- a/src/hocs/with_load_more/with_load_more.jsx
+++ b/src/hocs/with_load_more/with_load_more.jsx
@@ -81,7 +81,6 @@ const withLoadMore = ({
       }
     },
     render () {
-      console.log(this.$listeners)
       const props = {
         ...this.$props,
         [childPropName]: this.entries

From a0099ecb6699f02667e7cae39c688e4c0e86f30c Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 30 Mar 2022 23:54:11 +0300
Subject: [PATCH 113/113] oops

---
 src/components/post_status_form/post_status_form.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index 42c1335e..84a9e29e 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -81,7 +81,7 @@ const PostStatusForm = {
   emits: [
     'posted',
     'resize',
-    'mediaplay'
+    'mediaplay',
     'mediapause'
   ],
   components: {