From 8ff0bb937bd8cd6fd3a7626b18d3654c4dd2d676 Mon Sep 17 00:00:00 2001
From: Kasper Seweryn <github@wvffle.net>
Date: Mon, 2 May 2022 10:57:33 +0200
Subject: [PATCH] Remove $set and $delete

---
 front/src/components/Sidebar.vue                      | 2 +-
 front/src/components/auth/SignupForm.vue              | 6 ++----
 front/src/components/manage/library/EditsCardList.vue | 4 ++--
 front/src/main.ts                                     | 3 ---
 front/src/shims-vue2.d.ts                             | 8 --------
 front/src/store/auth.js                               | 7 +++----
 6 files changed, 8 insertions(+), 22 deletions(-)
 delete mode 100644 front/src/shims-vue2.d.ts

diff --git a/front/src/components/Sidebar.vue b/front/src/components/Sidebar.vue
index 4c062b928..91089c7d3 100644
--- a/front/src/components/Sidebar.vue
+++ b/front/src/components/Sidebar.vue
@@ -118,8 +118,8 @@
                 {{ $store.state.ui.notifications.inbox + additionalNotifications }}
               </div>
               <user-menu
-                :width="width"
                 v-bind="$attrs"
+                :width="width"
               />
             </div>
           </div>
diff --git a/front/src/components/auth/SignupForm.vue b/front/src/components/auth/SignupForm.vue
index 9922aaf58..2524acb20 100644
--- a/front/src/components/auth/SignupForm.vue
+++ b/front/src/components/auth/SignupForm.vue
@@ -126,18 +126,16 @@
         <textarea
           v-if="field.input_type === 'long_text'"
           :id="`custom-field-${idx}`"
-          :value="customFields[field.label]"
+          v-model="customFields[field.label]"
           :required="field.required || null"
           rows="5"
-          @input="$set(customFields, field.label, $event.target.value)"
         />
         <input
           v-else
           :id="`custom-field-${idx}`"
+          v-model="customFields[field.label]"
           type="text"
-          :value="customFields[field.label]"
           :required="field.required || null"
-          @input="$set(customFields, field.label, $event.target.value)"
         >
       </div>
     </template>
diff --git a/front/src/components/manage/library/EditsCardList.vue b/front/src/components/manage/library/EditsCardList.vue
index b3abcb979..9266fa565 100644
--- a/front/src/components/manage/library/EditsCardList.vue
+++ b/front/src/components/manage/library/EditsCardList.vue
@@ -242,10 +242,10 @@ export default {
         }
         axios.get(config.url, { params: { id: uniq(config.ids), hidden: 'null' } }).then((response) => {
           response.data.results.forEach((e) => {
-            self.$set(self.targets[k], e.id, {
+            self.targets[k][e.id] = {
               payload: e,
               currentState: edits.getCurrentStateForObj(e, edits.getConfigs.bind(self)()[k])
-            })
+            }
           })
         }, error => {
           self.errors = error.backendErrors
diff --git a/front/src/main.ts b/front/src/main.ts
index 1761f9c0a..dfbfac936 100644
--- a/front/src/main.ts
+++ b/front/src/main.ts
@@ -50,9 +50,6 @@ Promise.all(modules).finally(() => {
 })
 
 // TODO (wvffle): Migrate to pinia
-// TODO (wvffle): Remove global Vue (Only vuex files affected)
-// TODO (wvffle): Remove shims-vue2.d.ts
-// TODO (wvffle): Replace $set and $delete with reactive()
 // TODO (wvffle): Check for mixin merging: https://v3-migration.vuejs.org/breaking-changes/data-option.html#mixin-merge-behavior-change=
 // TODO (wvffle): Use emits options: https://v3-migration.vuejs.org/breaking-changes/emits-option.html
 // TODO (wvffle): Find all array watchers and make them deep
diff --git a/front/src/shims-vue2.d.ts b/front/src/shims-vue2.d.ts
deleted file mode 100644
index c6cee3ec4..000000000
--- a/front/src/shims-vue2.d.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-declare module 'vue' {
-  import { CompatVue } from '@vue/runtime-dom'
-  const Vue: CompatVue
-  export default Vue
-  export * from '@vue/runtime-dom'
-  const { configureCompat } = Vue
-  export { configureCompat }
-}
diff --git a/front/src/store/auth.js b/front/src/store/auth.js
index 12baa8fb2..b0359b7b1 100644
--- a/front/src/store/auth.js
+++ b/front/src/store/auth.js
@@ -1,4 +1,3 @@
-import Vue from 'vue'
 import axios from 'axios'
 import useLogger from '~/composables/useLogger'
 
@@ -12,8 +11,8 @@ function getDefaultScopedTokens () {
 
 function asForm (obj) {
   const data = new FormData()
-  Object.entries(obj).forEach((e) => {
-    data.set(e[0], e[1])
+  Object.entries(obj).forEach(([key, value]) => {
+    data.set(key, value)
   })
   return data
 }
@@ -112,7 +111,7 @@ export default {
     },
     profilePartialUpdate: (state, payload) => {
       Object.keys(payload).forEach((k) => {
-        Vue.set(state.profile, k, payload[k])
+        state.profile[k] = payload[k]
       })
     },
     oauthApp: (state, payload) => {