use OAuthStore directly

src/components/bookmark_folder_edit/bookmark_folder_edit.js

@@ -1,8 +1,8 @@
 import EmojiPicker from 'src/components/emoji_picker/emoji_picker.vue'
 
 import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { fetchBookmarkFolders } from 'src/services/api/api.service.js'
 
@@ -26,7 +26,7 @@ const BookmarkFolderEdit = {
     if (!this.id) return
 
     fetchBookmarkFolders({
-      credentials: useCredentialsStore().current,
+      credentials: useOAuthStore().token,
     }).then((folders) => {
       const folder = folders.find((folder) => folder.id === this.id)
       if (!folder) return

src/components/chat/chat.js

@@ -16,8 +16,8 @@ import {
   isScrollable,
 } from './chat_layout_utils.js'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import {
   chatMessages,
@@ -277,7 +277,7 @@ const Chat = {
         id: chatId,
         maxId,
         sinceId,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((messages) => {
         // Clear the current chat in case we're recovering from a ws connection loss.
         if (isFirstFetch) {
@@ -312,7 +312,7 @@ const Chat = {
         try {
           chat = await getOrCreateChat({
             accountId: this.recipientId,
-            credentials: useCredentialsStore().current,
+            credentials: useOAuthStore().token,
           })
         } catch (e) {
           console.error('Error creating or getting a chat', e)
@@ -381,7 +381,7 @@ const Chat = {
 
       sendChatMessage({
         params,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((data) => {
           this.$store.dispatch('addChatMessages', {

src/components/chat_new/chat_new.js

@@ -3,7 +3,7 @@ import { mapGetters, mapState } from 'vuex'
 import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { chats } from 'src/services/api/api.service.js'
 
@@ -27,7 +27,7 @@ const chatNew = {
   },
   async created() {
     const { chats } = await chats({
-      credentials: useCredentialsStore().current,
+      credentials: useOAuthStore().token,
     })
     chats.forEach((chat) => this.suggestions.push(chat.account))
   },

src/components/conversation/conversation.js

@@ -7,9 +7,9 @@ import QuickViewSettings from 'src/components/quick_view_settings/quick_view_set
 import ThreadTree from 'src/components/thread_tree/thread_tree.vue'
 import { WSConnectionStatus } from '../../services/api/api.service.js'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInterfaceStore } from 'src/stores/interface'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { fetchConversation, fetchStatus } from 'src/services/api/api.service.js'
 
@@ -441,7 +441,7 @@ const conversation = {
       if (this.status) {
         fetchConversation({
           id: this.statusId,
-          credentials: useCredentialsStore().current,
+          credentials: useOAuthStore().token,
         }).then(({ ancestors, descendants }) => {
           this.$store.dispatch('addNewStatuses', { statuses: ancestors })
           this.$store.dispatch('addNewStatuses', { statuses: descendants })
@@ -451,13 +451,14 @@ const conversation = {
         this.loadStatusError = null
         fetchStatus({
           id: this.statusId,
-          credentials: useCredentialsStore().current,
+          credentials: useOAuthStore().token,
         })
           .then((status) => {
             this.$store.dispatch('addNewStatuses', { statuses: [status] })
             this.fetchConversation()
           })
           .catch((error) => {
+            console.error(error)
             this.loadStatusError = error
           })
       }

src/components/follow_request_card/follow_request_card.js

@@ -3,8 +3,8 @@ import { defineAsyncComponent } from 'vue'
 import { notificationsFromStore } from '../../services/notification_utils/notification_utils.js'
 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { approveUser, denyUser } from 'src/services/api/api.service.js'
 
@@ -53,7 +53,7 @@ const FollowRequestCard = {
     doApprove() {
       approveUser({
         id: this.user.id,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
       this.$store.dispatch('removeFollowRequest', this.user)
 
@@ -79,7 +79,7 @@ const FollowRequestCard = {
 
       denyUser({
         id: this.user.id,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then(() => {
         this.$store.dispatch('dismissNotificationLocal', { id: notifId })
         this.$store.dispatch('removeFollowRequest', this.user)

src/components/notification/notification.js

@@ -13,9 +13,9 @@ import {
   highlightStyle,
 } from '../../services/user_highlighter/user_highlighter.js'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
 
 import { approveUser, denyUser } from 'src/services/api/api.service.js'
@@ -146,7 +146,7 @@ const Notification = {
     doApprove() {
       approveUser({
         id: this.user.id,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
       this.$store.dispatch('removeFollowRequest', this.user)
       this.$store.dispatch('markSingleNotificationAsSeen', {
@@ -170,7 +170,7 @@ const Notification = {
     doDeny() {
       denyUser({
         id: this.user.id,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then(() => {
         this.$store.dispatch('dismissNotificationLocal', {
           id: this.notification.id,

src/components/remote_user_resolver/remote_user_resolver.js

@@ -1,4 +1,4 @@
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { fetchUser } from 'src/services/api/api.service.js'
 
@@ -14,7 +14,7 @@ const RemoteUserResolver = {
       const id = this.$route.params.username + '@' + this.$route.params.hostname
       fetchUser({
         id,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((externalUser) => {
           if (externalUser.error) {

src/components/settings_modal/helpers/emoji_editing_popover.vue

@@ -153,7 +153,7 @@ import Popover from 'components/popover/popover.vue'
 import SelectComponent from 'components/select/select.vue'
 import { defineAsyncComponent } from 'vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import {
   addNewEmojiFile,
@@ -257,7 +257,7 @@ export default {
         newShortcode: this.editedShortcode,
         newFilename: this.editedFile,
         force: false,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((resp) => {
           if (resp.error !== undefined) {
@@ -281,7 +281,7 @@ export default {
             : this.emojiAddr(this.file),
         shortcode: this.editedShortcode,
         filename: this.editedFile,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((resp) => resp.json())
         .then((resp) => {
@@ -308,7 +308,7 @@ export default {
       deleteEmojiFile({
         packName: this.packName,
         shortcode: this.shortcode,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((resp) => resp.json())
         .then((resp) => {

src/components/settings_modal/tabs/appearance_tab.js

@@ -10,9 +10,9 @@ import SharedComputedObject from '../helpers/shared_computed_object.js'
 import UnitSetting from '../helpers/unit_setting.vue'
 import Preview from './old_theme_tab/theme_preview.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { normalizeThemeData, useInterfaceStore } from 'src/stores/interface.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { updateProfileImages } from 'src/services/api/api.service.js'
 import { newImporter } from 'src/services/export_import/export_import.js'
@@ -488,7 +488,7 @@ const AppearanceTab = {
       this.backgroundUploading = true
       updateProfileImages({
         background,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((data) => {
           this.$store.commit('addNewUsers', [data])

src/components/settings_modal/tabs/composing_tab.js

@@ -11,10 +11,10 @@ import IntegerSetting from '../helpers/integer_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import UnitSetting from '../helpers/unit_setting.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
 
 import { updateProfile } from 'src/services/api/api.service.js'
@@ -168,7 +168,7 @@ const ComposingTab = {
 
       updateProfile({
         params,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((user) => {
         this.$store.commit('addNewUsers', [user])
         this.$store.commit('setCurrentUser', user)

src/components/settings_modal/tabs/data_import_export_tab.js

@@ -4,7 +4,7 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Exporter from 'src/components/exporter/exporter.vue'
 import Importer from 'src/components/importer/importer.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useOAuthTokensStore } from 'src/stores/oauth_tokens.js'
 
 import {
@@ -47,23 +47,23 @@ const DataImportExportTab = {
     getFollowsContent() {
       return exportFriends({
         id: this.user.id,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then(this.generateExportableUsersContent)
     },
     getBlocksContent() {
       return fetchBlocks({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then(this.generateExportableUsersContent)
     },
     getMutesContent() {
       return fetchMutes({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then(this.generateExportableUsersContent)
     },
     importFollows(file) {
       return importFollows({
         file,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((status) => {
         if (!status) {
           throw new Error('failed')
@@ -73,7 +73,7 @@ const DataImportExportTab = {
     importBlocks(file) {
       return importBlocks({
         file,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((status) => {
         if (!status) {
           throw new Error('failed')
@@ -83,7 +83,7 @@ const DataImportExportTab = {
     importMutes(file) {
       return importMutes({
         file,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((status) => {
         if (!status) {
           throw new Error('failed')
@@ -105,7 +105,7 @@ const DataImportExportTab = {
     },
     addBackup() {
       addBackup({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then(() => {
           this.addedBackup = true
@@ -119,7 +119,7 @@ const DataImportExportTab = {
     },
     fetchBackups() {
       listBackups({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((res) => {
           this.backups = res

src/components/settings_modal/tabs/general_tab.js

@@ -8,11 +8,11 @@ import FloatSetting from '../helpers/float_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import UnitSetting from '../helpers/unit_setting.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useLocalConfigStore } from 'src/stores/local_config.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
 
 import { updateProfile } from 'src/services/api/api.service.js'
@@ -62,7 +62,7 @@ const GeneralTab = {
 
       updateProfile({
         params,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((user) => {
         this.$store.commit('addNewUsers', [user])
         this.$store.commit('setCurrentUser', user)

src/components/settings_modal/tabs/mutes_and_blocks_tab.js

@@ -9,8 +9,8 @@ import MuteCard from 'src/components/mute_card/mute_card.vue'
 import ProgressButton from 'src/components/progress_button/progress_button.vue'
 import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useOAuthTokensStore } from 'src/stores/oauth_tokens.js'
 
 import { importBlocks, importFollows } from 'src/services/api/api.service.js'
@@ -59,7 +59,7 @@ const MutesAndBlocks = {
     importFollows(file) {
       return importFollows({
         file,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((status) => {
         if (!status) {
           throw new Error('failed')
@@ -69,7 +69,7 @@ const MutesAndBlocks = {
     importBlocks(file) {
       return importBlocks({
         file,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((status) => {
         if (!status) {
           throw new Error('failed')

src/components/settings_modal/tabs/notifications_tab.js

@@ -1,7 +1,7 @@
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { updateNotificationSettings } from 'src/services/api/api.service.js'
 
@@ -32,7 +32,7 @@ const NotificationsTab = {
   methods: {
     updateNotificationSettings() {
       updateNotificationSettings({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
         settings: this.notificationSettings,
       })
     },

src/components/settings_modal/tabs/profile_tab.js

@@ -3,7 +3,7 @@ import UserCard from 'src/components/user_card/user_card.vue'
 import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { updateProfile } from 'src/services/api/api.service.js'
 
@@ -41,7 +41,7 @@ const ProfileTab = {
       }
       updateProfile({
         params,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((user) => {
           this.$store.commit('addNewUsers', [user])

src/components/settings_modal/tabs/security_tab/mfa.js

@@ -5,7 +5,7 @@ import Confirm from './confirm.vue'
 import RecoveryCodes from './mfa_backup_codes.vue'
 import TOTP from './mfa_totp.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import {
   generateMfaBackupCodes,
@@ -94,7 +94,7 @@ const Mfa = {
       this.backupCodes.codes = []
 
       return generateMfaBackupCodes({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((res) => {
         this.backupCodes.codes = res.codes
         this.backupCodes.inProgress = false
@@ -121,7 +121,7 @@ const Mfa = {
       this.setupState.state = 'setupOTP'
       this.setupState.setupOTPState = 'prepare'
       mfaSetupOTP({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((res) => {
         this.otpSettings = res
         this.setupState.setupOTPState = 'confirm'
@@ -133,7 +133,7 @@ const Mfa = {
       mfaConfirmOTP({
         token: this.otpConfirmToken,
         password: this.currentPassword,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((res) => {
         if (res.error) {
           this.error = res.error
@@ -162,7 +162,7 @@ const Mfa = {
     // fetch settings from server
     async fetchSettings() {
       const result = await settingsMFA({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
       if (result.error) return
       this.settings = result.settings

src/components/settings_modal/tabs/security_tab/mfa_totp.js

@@ -2,7 +2,7 @@ import { mapState } from 'vuex'
 
 import Confirm from './confirm.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { mfaDisableOTP } from 'src/services/api/api.service.js'
 
@@ -39,7 +39,7 @@ export default {
       this.inProgress = true
       mfaDisableOTP({
         password: this.currentPassword,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then((res) => {
         this.inProgress = false
         if (res.error) {

src/components/settings_modal/tabs/security_tab/security_tab.js

@@ -2,9 +2,9 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
 import ProgressButton from 'src/components/progress_button/progress_button.vue'
 import Mfa from './mfa.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
 
 import {
@@ -76,7 +76,7 @@ const SecurityTab = {
     },
     deleteAccount() {
       deleteAccount({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
         password: this.deleteAccountConfirmPasswordInput,
       }).then((res) => {
         if (res.status === 'success') {
@@ -92,7 +92,7 @@ const SecurityTab = {
         password: this.changePasswordInputs[0],
         newPassword: this.changePasswordInputs[1],
         newPasswordConfirmation: this.changePasswordInputs[2],
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }
       changePassword(params).then((res) => {
         if (res.status === 'success') {
@@ -109,7 +109,7 @@ const SecurityTab = {
       const params = {
         email: this.newEmail,
         password: this.changeEmailPassword,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }
       changeEmail(params).then((res) => {
         if (res.status === 'success') {
@@ -125,7 +125,7 @@ const SecurityTab = {
       const params = {
         targetAccount: this.moveAccountTarget,
         password: this.moveAccountPassword,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }
       moveAccount(params).then((res) => {
         if (res.status === 'success') {
@@ -140,13 +140,13 @@ const SecurityTab = {
     removeAlias(alias) {
       deleteAlias({
         alias,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }).then(() => this.fetchAliases())
     },
     addAlias() {
       addAlias({
         alias: this.addAliasTarget,
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then(() => {
           this.addedAlias = true
@@ -161,7 +161,7 @@ const SecurityTab = {
     },
     fetchAliases() {
       listAliases({
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       })
         .then((res) => {
           this.aliases = res.aliases

src/components/user_card/user_card.js

@@ -16,13 +16,13 @@ import Select from 'src/components/select/select.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 import UserLink from 'src/components/user_link/user_link.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useEmojiStore } from 'src/stores/emoji.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useInterfaceStore } from 'src/stores/interface'
 import { useMediaViewerStore } from 'src/stores/media_viewer'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { usePostStatusStore } from 'src/stores/post_status'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
 

src/components/user_reporting_modal/user_reporting_modal.js

@@ -5,7 +5,7 @@ import List from 'src/components/list/list.vue'
 import Modal from 'src/components/modal/modal.vue'
 import UserLink from 'src/components/user_link/user_link.vue'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 import { useReportsStore } from 'src/stores/reports.js'
 
 import { reportUser } from 'src/services/api/api.service.js'
@@ -31,6 +31,7 @@ const UserReportingModal = {
       return !!this.$store.state.users.currentUser
     },
     isOpen() {
+      console.log(this.reportModal)
       return this.isLoggedIn && this.reportModal.activated
     },
     userId() {
@@ -73,7 +74,7 @@ const UserReportingModal = {
         comment: this.comment,
         forward: this.forward,
         statusIds: [...this.statusIdsToReport],
-        credentials: useCredentialsStore().current,
+        credentials: useOAuthStore().token,
       }
       reportUser({ ...params })
         .then(() => {

src/components/who_to_follow/who_to_follow.js

@@ -1,8 +1,8 @@
 import FollowCard from 'src/components/follow_card/follow_card.vue'
 import apiService from '../../services/api/api.service.js'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { fetchUser, suggestions } from 'src/services/api/api.service.js'
 
@@ -23,7 +23,7 @@ const WhoToFollow = {
       reply.forEach(({ id }) => {
         fetchUser({
           id,
-          credentials: useCredentialsStore().current,
+          credentials: useOAuthStore().token,
         }).then((externalUser) => {
           if (!externalUser.error) {
             this.$store.commit('addNewUsers', [externalUser])
@@ -33,7 +33,7 @@ const WhoToFollow = {
       })
     },
     getWhoToFollow() {
-      const credentials = useCredentialsStore().current
+      const credentials = useOAuthStore().token
       if (credentials) {
         suggestions({ credentials }).then((reply) => {
           this.showWhoToFollow(reply)

src/components/who_to_follow_panel/who_to_follow_panel.js

@@ -1,8 +1,8 @@
 import { shuffle } from 'lodash'
 
-import { useCredentialsStore } from 'src/stores/credentials.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { fetchUser, suggestions } from 'src/services/api/api.service.js'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
@@ -20,7 +20,7 @@ function showWhoToFollow(panel, reply) {
 
     fetchUser({
       id: name,
-      credentials: useCredentialsStore().current,
+      credentials: useOAuthStore().token,
     }).then((externalUser) => {
       if (!externalUser.error) {
         panel.$store.commit('addNewUsers', [externalUser])