From 6e50a510eba43bc3303917debe8503f93418fde7 Mon Sep 17 00:00:00 2001
From: Ferdinand Thiessen <rpm@fthiessen.de>
Date: Sat, 30 Jan 2021 16:53:56 +0100
Subject: [PATCH] [Vue3] More fixes in setup and MainUserSettings

---
 .eslintrc.js                                  |  4 +--
 package.json                                  |  3 +--
 quasar.conf.js                                |  6 ++---
 .../components/settings/MainUserSettings.vue  | 27 ++++++++++++-------
 tsconfig.json                                 |  3 +--
 yarn.lock                                     | 24 +++++------------
 6 files changed, 30 insertions(+), 37 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 7454ebf..f6738c5 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -38,8 +38,8 @@ module.exports = {
     // Uncomment any of the lines below to choose desired strictness,
     // but leave only one uncommented!
     // See https://eslint.vuejs.org/rules/#available-rules
-    'plugin:vue/vue3-essential', // Priority A: Essential (Error Prevention)
-    // 'plugin:vue/vue3-strongly-recommended', // Priority B: Strongly Recommended (Improving Readability)
+    // 'plugin:vue/vue3-essential', // Priority A: Essential (Error Prevention)
+    'plugin:vue/vue3-strongly-recommended', // Priority B: Strongly Recommended (Improving Readability)
     // 'plugin:vue/vue3-recommended', // Priority C: Recommended (Minimizing Arbitrary Choices and Cognitive Overhead)
 
     // https://github.com/prettier/eslint-config-prettier#installation
diff --git a/package.json b/package.json
index b403274..895df4c 100644
--- a/package.json
+++ b/package.json
@@ -25,8 +25,7 @@
     "@types/webpack-env": "^1.16.0",
     "@typescript-eslint/eslint-plugin": "^4.8.2",
     "@typescript-eslint/parser": "^4.8.2",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^7.15.0",
+    "eslint": "^7.18.0",
     "eslint-config-prettier": "^6.15.0",
     "eslint-plugin-vue": "^7.5.0",
     "eslint-webpack-plugin": "^2.4.3",
diff --git a/quasar.conf.js b/quasar.conf.js
index 5c1f04c..a398ad9 100644
--- a/quasar.conf.js
+++ b/quasar.conf.js
@@ -7,10 +7,10 @@
 // https://quasar.dev/quasar-cli/quasar-conf-js
 
 /* eslint-env node */
-const ESLintPlugin = require('eslint-webpack-plugin')
-const { configure } = require('quasar/wrappers');
+import ESLintPlugin from 'eslint-webpack-plugin';
+import { configure } from 'quasar/wrappers';
 
-module.exports = configure(function (/* ctx */) {
+export default configure(function (/* ctx */) {
   return {
     // https://quasar.dev/quasar-cli/supporting-ts
     // https://quasar.dev/quasar-cli/supporting-ts
diff --git a/src/plugins/user/components/settings/MainUserSettings.vue b/src/plugins/user/components/settings/MainUserSettings.vue
index 2063ada..e1b096e 100644
--- a/src/plugins/user/components/settings/MainUserSettings.vue
+++ b/src/plugins/user/components/settings/MainUserSettings.vue
@@ -65,7 +65,7 @@
         hint="Bilddateien, max. 200 KiB"
         @rejected="onAvatarRejected"
       >
-        <template v-slot:append>
+        <template #append>
           <q-icon name="mdi-file-image" @click.stop />
         </template>
       </q-file>
@@ -107,25 +107,31 @@
 </template>
 
 <script lang="ts">
+// https://github.com/vuejs/vue-next/issues/3130
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
-
-import { computed, defineComponent, ref, onBeforeMount } from 'vue';
 import { useStore } from 'vuex';
-import { hasPermission } from 'src/utils/permission';
-import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
 import { Notify } from 'quasar';
 import { UserSessionState } from '../../store';
+import { hasPermission } from 'src/utils/permission';
+import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
+import { defineComponent, computed, ref, onBeforeMount } from 'vue';
 
 export default defineComponent({
   name: 'MainUserSettings',
-  components: { IsoDateInput: IsoDateInput },
+  components: { IsoDateInput },
   props: {
-    newUser: { type: Boolean, default: false },
-    user: { type: Object, required: true },
+    user: {
+      required: true,
+      type: Object,
+    },
+    newUser: { type: Boolean, required: true },
+  },
+  emits: {
+    'update:user': (payload: FG.User) => !!payload,
   },
   setup(props, { emit }) {
     const store = useStore<UserSessionState>();
-    const user_model = ref<FG.User>(<FG.User>props.user);
+    const user_model = ref(<FG.User>props.user);
 
     onBeforeMount(() => {
       store.dispatch('users/getRoles', false).catch((error) => {
@@ -158,7 +164,7 @@ export default defineComponent({
     const new_password2 = ref('');
 
     function save() {
-      let changed = user_model.value;
+      let changed: FG.User = user_model.value;
       if (typeof changed.birthday === 'string') changed.birthday = new Date(changed.birthday);
       changed = Object.assign(changed, {
         password: password.value,
@@ -169,6 +175,7 @@ export default defineComponent({
         });
       }
 
+      // TODO: investigate this issue
       // eslint-disable-next-line @typescript-eslint/no-unsafe-call
       emit('update:user', changed);
 
diff --git a/tsconfig.json b/tsconfig.json
index b0b5c9c..d625cce 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,8 +1,7 @@
 {
   "extends": "@quasar/app/tsconfig-preset",
+  "target": "esnext",
   "compilerOptions": {
     "baseUrl": ".",
-    "types": ["node", "webpack-env", "@quasar/app"],
-    "lib": ["DOM", "ES2019"]
  }
 }
diff --git a/yarn.lock b/yarn.lock
index 5fd3cf3..8b028fa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -246,7 +246,7 @@
     chalk "^2.0.0"
     js-tokens "^4.0.0"
 
-"@babel/parser@^7.12.0", "@babel/parser@^7.12.10", "@babel/parser@^7.12.11", "@babel/parser@^7.12.7", "@babel/parser@^7.7.0":
+"@babel/parser@^7.12.0", "@babel/parser@^7.12.10", "@babel/parser@^7.12.11", "@babel/parser@^7.12.7":
   version "7.12.11"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.12.11.tgz#9ce3595bcd74bc5c466905e86c535b8b25011e79"
   integrity sha512-N3UxG+uuF4CMYoNj8AhnbAcJF0PiuJ9KHuy1lQmkYsxTer/MAH9UBNHsBoAX/4s6NvlDD047No8mYVGGzLL4hg==
@@ -853,7 +853,7 @@
     "@babel/parser" "^7.12.7"
     "@babel/types" "^7.12.7"
 
-"@babel/traverse@^7.10.4", "@babel/traverse@^7.12.1", "@babel/traverse@^7.12.10", "@babel/traverse@^7.12.5", "@babel/traverse@^7.7.0":
+"@babel/traverse@^7.10.4", "@babel/traverse@^7.12.1", "@babel/traverse@^7.12.10", "@babel/traverse@^7.12.5":
   version "7.12.12"
   resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.12.12.tgz#d0cd87892704edd8da002d674bc811ce64743376"
   integrity sha512-s88i0X0lPy45RrLM8b9mz8RPH5FqO9G9p7ti59cToE44xFm1Q+Pjh5Gq4SXBbtb88X7Uy7pexeqRIQDDMNkL0w==
@@ -868,7 +868,7 @@
     globals "^11.1.0"
     lodash "^4.17.19"
 
-"@babel/types@^7.10.4", "@babel/types@^7.10.5", "@babel/types@^7.12.0", "@babel/types@^7.12.1", "@babel/types@^7.12.10", "@babel/types@^7.12.11", "@babel/types@^7.12.12", "@babel/types@^7.12.5", "@babel/types@^7.12.7", "@babel/types@^7.4.4", "@babel/types@^7.7.0":
+"@babel/types@^7.10.4", "@babel/types@^7.10.5", "@babel/types@^7.12.0", "@babel/types@^7.12.1", "@babel/types@^7.12.10", "@babel/types@^7.12.11", "@babel/types@^7.12.12", "@babel/types@^7.12.5", "@babel/types@^7.12.7", "@babel/types@^7.4.4":
   version "7.12.12"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.12.12.tgz#4608a6ec313abbd87afa55004d373ad04a96c299"
   integrity sha512-lnIX7piTxOH22xE7fDXDbSHg9MM1/6ORnafpJmov5rs0kX5g4BZxeXNJLXsMRiO0U5Rb8/FvMS6xlTnTHvxonQ==
@@ -2109,18 +2109,6 @@ axios@^0.21.1:
   dependencies:
     follow-redirects "^1.10.0"
 
-babel-eslint@^10.1.0:
-  version "10.1.0"
-  resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
-  integrity sha512-ifWaTHQ0ce+448CYop8AdrQiBsGrnC+bMgfyKFdi6EsPLTAWG+QfyDeM6OH+FmWnKvEq5NnBMLvlBUPKQZoDSg==
-  dependencies:
-    "@babel/code-frame" "^7.0.0"
-    "@babel/parser" "^7.7.0"
-    "@babel/traverse" "^7.7.0"
-    "@babel/types" "^7.7.0"
-    eslint-visitor-keys "^1.0.0"
-    resolve "^1.12.0"
-
 babel-loader@^8.0.6:
   version "8.2.2"
   resolved "https://registry.yarnpkg.com/babel-loader/-/babel-loader-8.2.2.tgz#9363ce84c10c9a40e6c753748e1441b60c8a0b81"
@@ -4150,7 +4138,7 @@ eslint-utils@^2.0.0, eslint-utils@^2.1.0:
   dependencies:
     eslint-visitor-keys "^1.1.0"
 
-eslint-visitor-keys@^1.0.0, eslint-visitor-keys@^1.1.0, eslint-visitor-keys@^1.3.0:
+eslint-visitor-keys@^1.1.0, eslint-visitor-keys@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e"
   integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==
@@ -4171,7 +4159,7 @@ eslint-webpack-plugin@^2.4.3:
     micromatch "^4.0.2"
     schema-utils "^3.0.0"
 
-eslint@^7.15.0:
+eslint@^7.18.0:
   version "7.18.0"
   resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.18.0.tgz#7fdcd2f3715a41fe6295a16234bd69aed2c75e67"
   integrity sha512-fbgTiE8BfUJZuBeq2Yi7J3RB3WGUQ9PNuNbmgi6jt9Iv8qrkxfy19Ds3OpL1Pm7zg3BtTVhvcUZbIRQ0wmSjAQ==
@@ -8539,7 +8527,7 @@ resolve-url@^0.2.1:
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
   integrity sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=
 
-resolve@^1.10.0, resolve@^1.12.0, resolve@^1.13.1, resolve@^1.15.1:
+resolve@^1.10.0, resolve@^1.13.1, resolve@^1.15.1:
   version "1.19.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.19.0.tgz#1af5bf630409734a067cae29318aac7fa29a267c"
   integrity sha512-rArEXAgsBG4UgRGcynxWIWKFvh/XZCcS8UJdHhwy91zwAvCZIbcs+vAbflgBnNjYMs/i/i+/Ux6IZhML1yPvxg==