pass 3 - mapState updates

src/components/login_form/login_form.js

@@ -17,23 +17,16 @@ const LoginForm = {
     error: false,
   }),
   computed: {
-    isPasswordAuth() {
-      return this.requiredPassword
-    },
-    isTokenAuth() {
-      return this.requiredToken
-    },
+    ...mapState(useInstanceStore, ['server'])
     ...mapStores(useOAuthStore),
     ...mapState({
       registrationOpen: (state) => useInstanceStore().registrationOpen,
-      instance: (state) => useInstanceStore(),
       loggingIn: (state) => state.users.loggingIn,
     }),
-    ...mapPiniaState(useAuthFlowStore, [
-      'requiredPassword',
-      'requiredToken',
-      'requiredMFA',
-    ]),
+    ...mapPiniaState(useAuthFlowStore, {
+      isTokenAuth: (store) => store.requiredToken,
+      isPasswordAuth: (store) => !store.requiredToken,
+    }),
   },
   methods: {
     ...mapActions(useAuthFlowStore, ['requireMFA', 'login']),
@@ -42,7 +35,7 @@ const LoginForm = {
     },
     submitToken() {
       const data = {
-        instance: this.instance.server,
+        instance: this.server,
         commit: this.$store.commit,
       }
 
@@ -70,7 +63,7 @@ const LoginForm = {
         oauthApi
           .getTokenWithCredentials({
             ...app,
-            instance: this.instance.server,
+            instance: this.server,
             username: this.user.username,
             password: this.user.password,
           })

src/components/mfa_form/recovery_form.js

@@ -1,7 +1,7 @@
-import { mapActions, mapState as mapPiniaState, mapStores } from 'pinia'
-import { mapState } from 'vuex'
+import { mapActions, mapState, mapStores } from 'pinia'
 
 import { useAuthFlowStore } from 'src/stores/auth_flow.js'
+import { useInstanceStore } from 'src/stores/instance.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 import mfaApi from '../../services/new_api/mfa.js'
 
@@ -16,13 +16,10 @@ export default {
     error: false,
   }),
   computed: {
-    ...mapPiniaState(useAuthFlowStore, {
-      authSettings: (store) => store.settings,
-    }),
     ...mapStores(useOAuthStore),
-    ...mapState({
-      instance: 'instance',
-    }),
+    ...mapState(useOAuthStore, ['clientId','clientSecret']),
+    ...mapState(useAuthFlowStore, ['settings']),
+    ...mapState(useInstanceStore, ['server']),
   },
   methods: {
     ...mapActions(useAuthFlowStore, ['requireTOTP', 'abortMFA', 'login']),
@@ -37,13 +34,11 @@ export default {
     },
 
     submit() {
-      const { clientId, clientSecret } = this.oauthStore
-
       const data = {
-        clientId,
-        clientSecret,
-        instance: this.instance.server,
-        mfaToken: this.authSettings.mfa_token,
+        clientId: this.clientId,
+        clientSecret: this.clientSecret,
+        instance: this.server,
+        mfaToken: this.settings.mfa_token,
         code: this.code,
       }
 

src/components/mfa_form/totp_form.js

@@ -1,7 +1,7 @@
-import { mapActions, mapState as mapPiniaState, mapStores } from 'pinia'
-import { mapState } from 'vuex'
+import { mapActions, mapState, mapStores } from 'pinia'
 
 import { useAuthFlowStore } from 'src/stores/auth_flow.js'
+import { useInstanceStore } from 'src/stores/instance.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 import mfaApi from '../../services/new_api/mfa.js'
 
@@ -16,9 +16,10 @@ export default {
     error: false,
   }),
   computed: {
-    ...mapPiniaState(useAuthFlowStore, {
+    ...mapState(useAuthFlowStore, {
       authSettings: (store) => store.settings,
     }),
+    ...mapState(useInstanceStore, ['server'])
     ...mapStores(useOAuthStore),
     ...mapState({
       instance: 'instance',
@@ -42,7 +43,7 @@ export default {
       const data = {
         clientId,
         clientSecret,
-        instance: this.instance.server,
+        instance: this.server,
         mfaToken: this.authSettings.mfa_token,
         code: this.code,
       }

src/components/password_reset/password_reset.js

@@ -23,9 +23,9 @@ const passwordReset = {
     ...mapState({
       signedIn: (state) => !!state.users.currentUser,
     }),
-    ...mapPiniaState(useInstanceStore, ['server']),
+    ...mapPiniaState(useInstanceStore, ['server', 'mailerEnabled']),
     mailerEnabled() {
-      return this.instance.mailerEnabled
+      return this.mailerEnabled
     },
   },
   created() {

src/modules/users.js

@@ -646,7 +646,6 @@ const users = {
 
     logout(store) {
       const oauth = useOAuthStore()
-      const { instance } = store.rootState
 
       // NOTE: No need to verify the app still exists, because if it doesn't,
       // the token will be invalid too
@@ -655,7 +654,7 @@ const users = {
         .then((app) => {
           const params = {
             app,
-            instance: instance.server,
+            instance: useInstanceStore().server,
             token: oauth.userToken,
           }