diff --git a/changelog.d/streaming.add b/changelog.d/streaming.add
new file mode 100644
index 000000000..c6e7de171
--- /dev/null
+++ b/changelog.d/streaming.add
@@ -0,0 +1 @@
+More timelines now can utilize WebSocket streaming
diff --git a/changelog.d/streaming.fix b/changelog.d/streaming.fix
new file mode 100644
index 000000000..660a6694f
--- /dev/null
+++ b/changelog.d/streaming.fix
@@ -0,0 +1 @@
+switches between streaming and polling should be more reliable now
diff --git a/changelog.d/streaming_indicator.add b/changelog.d/streaming_indicator.add
new file mode 100644
index 000000000..f2abe04a1
--- /dev/null
+++ b/changelog.d/streaming_indicator.add
@@ -0,0 +1,3 @@
+Added an indicator next to instance's name showing WebSocket connection status (if enabled).
+Timeline no longer show "loading" indicator at the bottom when fetching newer posts.
+Added small indicator on top of timeline when new posts are being fetched
diff --git a/src/App.js b/src/App.js
index d7a63bd8a..ed3d43e4a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -21,6 +21,7 @@ import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.j
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useShoutStore } from 'src/stores/shout.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 // Helper to unwrap reactive proxies
 window.toValue = (x) => JSON.parse(JSON.stringify(x))
@@ -153,11 +154,8 @@ export default {
         ...(navbarColumnStretch ? ['-column-stretch'] : []),
       ]
     },
-    currentUser() {
-      return this.$store.state.users.currentUser
-    },
     userBackground() {
-      return this.currentUser.background_image
+      return this.currentUser?.background_image
     },
     foreignProfileBackground() {
       return (
@@ -246,6 +244,7 @@ export default {
       'styleDataUsed',
       'layoutType',
     ]),
+    ...mapState(useUsersStore, ['currentUser']),
     ...mapState(useInstanceStore, ['styleDataUsed']),
     ...mapState(useInstanceCapabilitiesStore, [
       'suggestionsEnabled',
diff --git a/src/App.vue b/src/App.vue
index 84a6f7d3d..bd19c5c10 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -26,7 +26,7 @@
         class="column -scrollable"
         :class="{ '-show-scrollbar': showScrollbars }"
       >
-        <user-panel />
+        <UserPanel />
         <template v-if="layoutType !== 'mobile'">
           <NavPanel />
           <InstanceSpecificPanel v-if="showInstanceSpecificPanel" />
diff --git a/src/api/helpers.js b/src/api/helpers.js
index 326275495..f23960ed9 100644
--- a/src/api/helpers.js
+++ b/src/api/helpers.js
@@ -63,7 +63,7 @@ export const paramsString = (params = {}) => {
 }
 
 export const promisedRequest = async ({
-  method,
+  method = 'GET',
   url,
   payload,
   formData,
@@ -124,7 +124,7 @@ export const promisedRequest = async ({
   const { ok, status } = response
 
   if (ok) {
-    return { response, status, data }
+    return { response, status, data, timestamp: Date.now() }
   } else {
     throw new StatusCodeError(response.status, data, { url, options }, response)
   }
diff --git a/src/api/public.js b/src/api/public.js
index 5684298e4..839196b9e 100644
--- a/src/api/public.js
+++ b/src/api/public.js
@@ -13,12 +13,12 @@ const MASTODON_REGISTRATION_URL = '/api/v1/accounts'
 const MASTODON_PASSWORD_RESET_URL = ({ email }) =>
   `/auth/password${paramsString({ email })}`
 
-const MASTODON_FOLLOWING_URL = (
+export const MASTODON_FOLLOWING_URL = (
   id,
   { minId, maxId, sinceId, limit, withRelationships },
 ) =>
   `/api/v1/accounts/${id}/following${paramsString({ minId, maxId, sinceId, limit, withRelationships })}`
-const MASTODON_FOLLOWERS_URL = (
+export const MASTODON_FOLLOWERS_URL = (
   id,
   { minId, maxId, sinceId, limit, withRelationships },
 ) =>
@@ -26,15 +26,17 @@ const MASTODON_FOLLOWERS_URL = (
 
 export const MASTODON_STATUS_URL = (id) => `/api/v1/statuses/${id}`
 const MASTODON_STATUS_CONTEXT_URL = (id) => `/api/v1/statuses/${id}/context`
-const MASTODON_STATUS_SOURCE_URL = (id) => `/api/v1/statuses/${id}/source`
-const MASTODON_STATUS_HISTORY_URL = (id) => `/api/v1/statuses/${id}/history`
+export const MASTODON_STATUS_SOURCE_URL = (id) =>
+  `/api/v1/statuses/${id}/source`
+export const MASTODON_STATUS_HISTORY_URL = (id) =>
+  `/api/v1/statuses/${id}/history`
 const MASTODON_USER_URL = '/api/v1/accounts'
 const MASTODON_USER_LOOKUP_URL = ({ acct }) =>
   `/api/v1/accounts/lookup${paramsString({ acct })}`
 const MASTODON_POLL_URL = (id = '') => `/api/v1/polls/${id}`
-const MASTODON_STATUS_FAVORITEDBY_URL = (id) =>
+export const MASTODON_STATUS_FAVORITEDBY_URL = (id) =>
   `/api/v1/statuses/${id}/favourited_by`
-const MASTODON_STATUS_REBLOGGEDBY_URL = (id) =>
+export const MASTODON_STATUS_REBLOGGEDBY_URL = (id) =>
   `/api/v1/statuses/${id}/reblogged_by`
 const MASTODON_SEARCH_2 = ({
   q,
@@ -51,7 +53,7 @@ const MASTODON_SEARCH_2 = ({
 const MASTODON_USER_SEARCH_URL = ({ q, resolve }) =>
   `/api/v1/accounts/search${paramsString({ q, resolve })}`
 const MASTODON_KNOWN_DOMAIN_LIST_URL = '/api/v1/instance/peers'
-const PLEROMA_EMOJI_REACTIONS_URL = (id) =>
+export const PLEROMA_EMOJI_REACTIONS_URL = (id) =>
   `/api/v1/pleroma/statuses/${id}/reactions`
 const PLEROMA_SCROBBLES_URL = (id, { maxId, sinceId, minId, limit, offset }) =>
   `/api/v1/pleroma/accounts/${id}/scrobbles${paramsString({ maxId, sinceId, minId, limit, offset })}`
@@ -174,15 +176,21 @@ export const fetchStatusSource = ({ id, credentials }) =>
     credentials,
   }).then(({ data, ...rest }) => ({ ...rest, data: parseSource(data) }))
 
-export const fetchStatusHistory = ({ status, credentials }) =>
+export const fetchStatusHistory = ({ id, credentials }) =>
   promisedRequest({
-    url: MASTODON_STATUS_HISTORY_URL(status.id),
+    url: MASTODON_STATUS_HISTORY_URL(id),
     credentials,
   }).then(({ data, ...rest }) => {
-    return [...data].reverse().map((item) => {
-      item.originalStatus = status
-      return { ...rest, data: parseStatus(item) }
-    })
+    return {
+      ...rest,
+      data: [...data].reverse().map((item) => {
+        // History data is missing a lot of stuff present in original
+        // but we're really only missing the id for the timeago, the
+        // rest seem to render just fine.
+        item.id = id
+        return parseStatus(item)
+      }),
+    }
   })
 
 export const listEmojiPacks = ({ page, pageSize, credentials }) =>
diff --git a/src/api/timelines.js b/src/api/timelines.js
index 0679b1eec..568b97a4f 100644
--- a/src/api/timelines.js
+++ b/src/api/timelines.js
@@ -115,6 +115,7 @@ export const fetchTimeline = ({
     publicAndExternal: MASTODON_PUBLIC_TIMELINE,
     dms: MASTODON_DIRECT_MESSAGES_TIMELINE_URL,
     user: MASTODON_USER_TIMELINE_URL,
+    userPinned: MASTODON_USER_TIMELINE_URL,
     media: MASTODON_USER_TIMELINE_URL,
     list: MASTODON_LIST_TIMELINE_URL,
     favorites: MASTODON_USER_FAVORITES_TIMELINE_URL,
@@ -130,6 +131,7 @@ export const fetchTimeline = ({
 
   const twoArgs = new Set([
     'user',
+    'userPinned',
     'media',
     'list',
     'publicFavorites',
@@ -147,6 +149,7 @@ export const fetchTimeline = ({
   const id = (() => {
     switch (timeline) {
       case 'user':
+      case 'userPinned':
       case 'media':
         return userId
       case 'list':
@@ -163,6 +166,9 @@ export const fetchTimeline = ({
   if (timeline === 'media') {
     params.onlyMedia = true
   }
+  if (timeline === 'userPinned') {
+    params.pinned = true
+  }
   if (timeline === 'public') {
     params.local = true
   }
diff --git a/src/api/user.js b/src/api/user.js
index ce9da977d..ec1763bb4 100644
--- a/src/api/user.js
+++ b/src/api/user.js
@@ -18,7 +18,7 @@ const CHANGE_PASSWORD_URL = '/api/pleroma/change_password'
 const MOVE_ACCOUNT_URL = '/api/pleroma/move_account'
 const ALIASES_URL = '/api/pleroma/aliases'
 const NOTIFICATION_SETTINGS_URL = '/api/pleroma/notification_settings'
-const NOTIFICATION_READ_URL = '/api/v1/pleroma/notifications/read'
+export const NOTIFICATION_READ_URL = '/api/v1/pleroma/notifications/read'
 
 const MFA_SETTINGS_URL = '/api/pleroma/accounts/mfa'
 const MFA_BACKUP_CODES_URL = '/api/pleroma/accounts/mfa/backup_codes'
@@ -27,15 +27,16 @@ const MFA_SETUP_OTP_URL = '/api/pleroma/accounts/mfa/setup/totp'
 const MFA_CONFIRM_OTP_URL = '/api/pleroma/accounts/mfa/confirm/totp'
 const MFA_DISABLE_OTP_URL = '/api/pleroma/accounts/mfa/totp'
 
-const MASTODON_DISMISS_NOTIFICATION_URL = (id) =>
+export const MASTODON_DISMISS_NOTIFICATION_URL = (id) =>
   `/api/v1/notifications/${id}/dismiss`
-const MASTODON_FAVORITE_URL = (id) => `/api/v1/statuses/${id}/favourite`
-const MASTODON_UNFAVORITE_URL = (id) => `/api/v1/statuses/${id}/unfavourite`
-const MASTODON_RETWEET_URL = (id) => `/api/v1/statuses/${id}/reblog`
-const MASTODON_UNRETWEET_URL = (id) => `/api/v1/statuses/${id}/unreblog`
-const MASTODON_DELETE_URL = (id) => `/api/v1/statuses/${id}`
-const MASTODON_FOLLOW_URL = (id) => `/api/v1/accounts/${id}/follow`
-const MASTODON_UNFOLLOW_URL = (id) => `/api/v1/accounts/${id}/unfollow`
+export const MASTODON_FAVORITE_URL = (id) => `/api/v1/statuses/${id}/favourite`
+export const MASTODON_UNFAVORITE_URL = (id) =>
+  `/api/v1/statuses/${id}/unfavourite`
+export const MASTODON_RETWEET_URL = (id) => `/api/v1/statuses/${id}/reblog`
+export const MASTODON_UNRETWEET_URL = (id) => `/api/v1/statuses/${id}/unreblog`
+export const MASTODON_DELETE_URL = (id) => `/api/v1/statuses/${id}`
+export const MASTODON_FOLLOW_URL = (id) => `/api/v1/accounts/${id}/follow`
+export const MASTODON_UNFOLLOW_URL = (id) => `/api/v1/accounts/${id}/unfollow`
 
 const MASTODON_FOLLOW_REQUESTS_URL = '/api/v1/follow_requests'
 const MASTODON_APPROVE_USER_URL = (id) =>
@@ -43,49 +44,54 @@ const MASTODON_APPROVE_USER_URL = (id) =>
 const MASTODON_DENY_USER_URL = (id) => `/api/v1/follow_requests/${id}/reject`
 const MASTODON_USER_RELATIONSHIPS_URL = ({ id, withSuspended }) =>
   `/api/v1/accounts/relationships/${paramsString({ id, withSuspended })}`
-const MASTODON_USER_IN_LISTS = (id) => `/api/v1/accounts/${id}/lists`
+export const MASTODON_USER_IN_LISTS = (id) => `/api/v1/accounts/${id}/lists`
 export const MASTODON_LIST_URL = (id = '') => `/api/v1/lists/${id}`
 export const MASTODON_LIST_ACCOUNTS_URL = (id) => `/api/v1/lists/${id}/accounts`
-const MASTODON_USER_BLOCKS_URL = ({
+export const MASTODON_USER_BLOCKS_URL = ({
   maxId,
   sinceId,
   limit,
   withRelationships,
 }) =>
   `/api/v1/blocks/${paramsString({ maxId, sinceId, limit, withRelationships })}`
-const MASTODON_USER_MUTES_URL = ({
+export const MASTODON_USER_MUTES_URL = ({
   maxId,
   sinceId,
   limit,
   withRelationships,
 }) =>
   `/api/v1/mutes/${paramsString({ maxId, sinceId, limit, withRelationships })}`
-const MASTODON_BLOCK_USER_URL = (id) => `/api/v1/accounts/${id}/block`
-const MASTODON_UNBLOCK_USER_URL = (id) => `/api/v1/accounts/${id}/unblock`
-const MASTODON_MUTE_USER_URL = (id) => `/api/v1/accounts/${id}/mute`
-const MASTODON_UNMUTE_USER_URL = (id) => `/api/v1/accounts/${id}/unmute`
-const MASTODON_REMOVE_USER_FROM_FOLLOWERS = (id) =>
+export const MASTODON_BLOCK_USER_URL = (id) => `/api/v1/accounts/${id}/block`
+export const MASTODON_UNBLOCK_USER_URL = (id) =>
+  `/api/v1/accounts/${id}/unblock`
+export const MASTODON_MUTE_USER_URL = (id) => `/api/v1/accounts/${id}/mute`
+export const MASTODON_UNMUTE_USER_URL = (id) => `/api/v1/accounts/${id}/unmute`
+export const MASTODON_REMOVE_USER_FROM_FOLLOWERS_URL = (id) =>
   `/api/v1/accounts/${id}/remove_from_followers`
-const MASTODON_USER_NOTE_URL = (id) => `/api/v1/accounts/${id}/note`
-const MASTODON_BOOKMARK_STATUS_URL = (id) => `/api/v1/statuses/${id}/bookmark`
-const MASTODON_UNBOOKMARK_STATUS_URL = (id) =>
+export const MASTODON_USER_NOTE_URL = (id) => `/api/v1/accounts/${id}/note`
+export const MASTODON_BOOKMARK_STATUS_URL = (id) =>
+  `/api/v1/statuses/${id}/bookmark`
+export const MASTODON_UNBOOKMARK_STATUS_URL = (id) =>
   `/api/v1/statuses/${id}/unbookmark`
 const MASTODON_POST_STATUS_URL = '/api/v1/statuses'
 const MASTODON_MEDIA_UPLOAD_URL = '/api/v1/media'
 const MASTODON_VOTE_URL = (id) => `/api/v1/polls/${id}/votes`
 const MASTODON_PROFILE_UPDATE_URL = '/api/v1/accounts/update_credentials'
 const MASTODON_REPORT_USER_URL = '/api/v1/reports'
-const MASTODON_PIN_OWN_STATUS = (id) => `/api/v1/statuses/${id}/pin`
-const MASTODON_UNPIN_OWN_STATUS = (id) => `/api/v1/statuses/${id}/unpin`
-const MASTODON_MUTE_CONVERSATION = (id) => `/api/v1/statuses/${id}/mute`
-const MASTODON_UNMUTE_CONVERSATION = (id) => `/api/v1/statuses/${id}/unmute`
-const MASTODON_DOMAIN_BLOCKS_URL = '/api/v1/domain_blocks'
+export const MASTODON_PIN_OWN_STATUS_URL = (id) => `/api/v1/statuses/${id}/pin`
+export const MASTODON_UNPIN_OWN_STATUS_URL = (id) =>
+  `/api/v1/statuses/${id}/unpin`
+export const MASTODON_MUTE_CONVERSATION_URL = (id) =>
+  `/api/v1/statuses/${id}/mute`
+export const MASTODON_UNMUTE_CONVERSATION_URL = (id) =>
+  `/api/v1/statuses/${id}/unmute`
+export const MASTODON_DOMAIN_BLOCKS_URL = '/api/v1/domain_blocks'
 const MASTODON_ANNOUNCEMENTS_URL = '/api/v1/announcements'
 const MASTODON_ANNOUNCEMENTS_DISMISS_URL = (id) =>
   `/api/v1/announcements/${id}/dismiss`
-const PLEROMA_EMOJI_REACT_URL = (id, emoji) =>
+export const PLEROMA_EMOJI_REACT_URL = (id, emoji) =>
   `/api/v1/pleroma/statuses/${id}/reactions/${emoji}`
-const PLEROMA_EMOJI_UNREACT_URL = (id, emoji) =>
+export const PLEROMA_EMOJI_UNREACT_URL = (id, emoji) =>
   `/api/v1/pleroma/statuses/${id}/reactions/${emoji}`
 const PLEROMA_BACKUP_URL = '/api/v1/pleroma/backups'
 const PLEROMA_BOOKMARK_FOLDERS_URL = '/api/v1/pleroma/bookmark_folders'
@@ -143,39 +149,39 @@ export const bookmarkStatus = ({ id, credentials, ...options }) =>
     payload: {
       folder_id: options.folder_id,
     },
-  })
+  }).then(({ data, ...rest }) => ({ ...rest, data: parseStatus(data) }))
 
 export const unbookmarkStatus = ({ id, credentials }) =>
   promisedRequest({
     url: MASTODON_UNBOOKMARK_STATUS_URL(id),
     credentials,
     method: 'POST',
-  })
+  }).then(({ data, ...rest }) => ({ ...rest, data: parseStatus(data) }))
 
 export const pinOwnStatus = ({ id, credentials }) =>
   promisedRequest({
-    url: MASTODON_PIN_OWN_STATUS(id),
+    url: MASTODON_PIN_OWN_STATUS_URL(id),
     credentials,
     method: 'POST',
   }).then(({ data, ...rest }) => ({ ...rest, data: parseStatus(data) }))
 
 export const unpinOwnStatus = ({ id, credentials }) =>
   promisedRequest({
-    url: MASTODON_UNPIN_OWN_STATUS(id),
+    url: MASTODON_UNPIN_OWN_STATUS_URL(id),
     credentials,
     method: 'POST',
   }).then(({ data, ...rest }) => ({ ...rest, data: parseStatus(data) }))
 
 export const muteConversation = ({ id, credentials }) =>
   promisedRequest({
-    url: MASTODON_MUTE_CONVERSATION(id),
+    url: MASTODON_MUTE_CONVERSATION_URL(id),
     credentials,
     method: 'POST',
   }).then(({ data, ...rest }) => ({ ...rest, data: parseStatus(data) }))
 
 export const unmuteConversation = ({ id, credentials }) =>
   promisedRequest({
-    url: MASTODON_UNMUTE_CONVERSATION(id),
+    url: MASTODON_UNMUTE_CONVERSATION_URL(id),
     credentials,
     method: 'POST',
   }).then(({ data, ...rest }) => ({ ...rest, data: parseStatus(data) }))
@@ -656,7 +662,7 @@ export const fetchUserInLists = ({ id, credentials }) =>
 
 export const removeUserFromFollowers = ({ id, credentials }) =>
   promisedRequest({
-    url: MASTODON_REMOVE_USER_FROM_FOLLOWERS(id),
+    url: MASTODON_REMOVE_USER_FROM_FOLLOWERS_URL(id),
     credentials,
     method: 'POST',
   })
diff --git a/src/api/websocket.js b/src/api/websocket.js
index ae2e5358f..6f6cfa605 100644
--- a/src/api/websocket.js
+++ b/src/api/websocket.js
@@ -26,8 +26,26 @@ const PLEROMA_STREAMING_EVENTS = new Set([
   'pleroma:respond',
 ])
 
+export const WSConnectionStatus = Object.freeze({
+  JOINED: 1,
+  CLOSED: 2,
+  ERROR: 3,
+  DISABLED: 4,
+  STARTING: 5,
+  STARTING_INITIAL: 6,
+})
+
+export class WSEvent extends Event {
+  data
+
+  constructor(name, data, original) {
+    super(name)
+    this.data = data
+  }
+}
+
 // A thin wrapper around WebSocket API that allows adding a pre-processor to it
-// Uses EventTarget and a CustomEvent to proxy events
+// Uses EventTarget and a WSEvent to proxy events
 export const ProcessedWS = ({
   url,
   preprocessor = handleMastoWS,
@@ -39,9 +57,7 @@ export const ProcessedWS = ({
   if (!socket) throw new Error(`Failed to create socket ${id}`)
   const proxy = (original, eventName, processor = (a) => a) => {
     original.addEventListener(eventName, (eventData) => {
-      eventTarget.dispatchEvent(
-        new CustomEvent(eventName, { detail: processor(eventData) }),
-      )
+      eventTarget.dispatchEvent(new WSEvent(eventName, processor(eventData)))
     })
   }
   socket.addEventListener('open', (wsEvent) => {
@@ -75,7 +91,7 @@ export const ProcessedWS = ({
   /**/
 
   const onAuthenticated = () => {
-    eventTarget.dispatchEvent(new CustomEvent('pleroma:authenticated'))
+    eventTarget.dispatchEvent(new WSEvent('pleroma:authenticated'))
   }
 
   proxy(socket, 'open')
@@ -126,14 +142,14 @@ export const handleMastoWS = (
   const { data } = wsEvent
   if (!data) return
   const parsedEvent = JSON.parse(data)
-  const { event, payload } = parsedEvent
+  const { event, stream, payload } = parsedEvent
   if (
     MASTODON_STREAMING_EVENTS.has(event) ||
     PLEROMA_STREAMING_EVENTS.has(event)
   ) {
     // MastoBE and PleromaBE both send payload for delete as a PLAIN string
     if (event === 'delete') {
-      return { event, id: payload }
+      return { event, stream, id: payload }
     }
     const data = payload ? JSON.parse(payload) : null
     if (event === 'pleroma:respond') {
@@ -150,25 +166,16 @@ export const handleMastoWS = (
       }
       return null
     } else if (event === 'update') {
-      return { event, status: parseStatus(data) }
+      return { event, stream, status: parseStatus(data) }
     } else if (event === 'status.update') {
-      return { event, status: parseStatus(data) }
+      return { event, stream, status: parseStatus(data) }
     } else if (event === 'notification') {
-      return { event, notification: parseNotification(data) }
+      return { event, stream, notification: parseNotification(data) }
     } else if (event === 'pleroma:chat_update') {
-      return { event, chatUpdate: parseChat(data) }
+      return { event, stream, chatUpdate: parseChat(data) }
     }
   } else {
     console.warn('Unknown event', wsEvent)
     return null
   }
 }
-
-export const WSConnectionStatus = Object.freeze({
-  JOINED: 1,
-  CLOSED: 2,
-  ERROR: 3,
-  DISABLED: 4,
-  STARTING: 5,
-  STARTING_INITIAL: 6,
-})
diff --git a/src/boot/after_store.js b/src/boot/after_store.js
index 986586a80..3f2033ecc 100644
--- a/src/boot/after_store.js
+++ b/src/boot/after_store.js
@@ -29,6 +29,7 @@ import {
 import routes from './routes'
 
 import { useAuthFlowStore } from 'src/stores/auth_flow'
+import { useChatsStore } from 'src/stores/chats.js'
 import { useEmojiStore } from 'src/stores/emoji.js'
 import { useI18nStore } from 'src/stores/i18n'
 import { useInstanceStore } from 'src/stores/instance.js'
@@ -36,9 +37,12 @@ import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.j
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useLocalConfigStore } from 'src/stores/local_config.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import VBodyScrollLock from 'src/directives/body_scroll_lock'
 import {
@@ -454,7 +458,7 @@ const setConfig = async ({ store }) => {
 const checkOAuthToken = async ({ store }) => {
   const oauth = useOAuthStore()
   if (oauth.userToken) {
-    return store.dispatch('loginUser', oauth.userToken)
+    return useUsersStore().loginUser(oauth.userToken)
   }
   return
 }
@@ -541,7 +545,7 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
   window.highlightConfig = useUserHighlightStore()
 
   FaviconService.initFaviconService()
-  initServiceWorker(store)
+  initServiceWorker(useNotificationsStore())
 
   window.addEventListener('focus', () => updateFocus())
 
@@ -589,6 +593,11 @@ const afterStoreSetup = async ({ pinia, store, storageError, i18n }) => {
 
   useI18nStore().setI18n(i18n)
 
+  // Global WS handlers
+  useChatsStore().attachSocket()
+  useInterfaceStore().attachSocket()
+  useStatusesStore().attachSocket()
+
   app.use(router)
   app.use(store)
   app.use(i18n)
diff --git a/src/boot/routes.js b/src/boot/routes.js
index 5897fad92..04ad81000 100644
--- a/src/boot/routes.js
+++ b/src/boot/routes.js
@@ -1,22 +1,16 @@
 import AuthForm from 'src/components/auth_form/auth_form.js'
-import BookmarkTimeline from 'src/components/bookmark_timeline/bookmark_timeline.vue'
-import BubbleTimeline from 'src/components/bubble_timeline/bubble_timeline.vue'
 import ConversationPage from 'src/components/conversation-page/conversation-page.vue'
-import DMs from 'src/components/dm_timeline/dm_timeline.vue'
-import FriendsTimeline from 'src/components/friends_timeline/friends_timeline.vue'
 import NavPanel from 'src/components/nav_panel/nav_panel.vue'
-import PublicAndExternalTimeline from 'src/components/public_and_external_timeline/public_and_external_timeline.vue'
-import PublicTimeline from 'src/components/public_timeline/public_timeline.vue'
-import QuotesTimeline from 'src/components/quotes_timeline/quotes_timeline.vue'
 import RemoteUserResolver from 'src/components/remote_user_resolver/remote_user_resolver.vue'
-import TagTimeline from 'src/components/tag_timeline/tag_timeline.vue'
+import Timeline from 'src/components/timeline/timeline.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useUsersStore } from 'src/stores/users.js'
 
-export default (store) => {
+export default () => {
   const validateAuthenticatedRoute = (to, from, next) => {
-    if (store.state.users.currentUser) {
+    if (useUsersStore().currentUser) {
       next()
     } else {
       next(
@@ -31,7 +25,7 @@ export default (store) => {
       path: '/',
       redirect: () => {
         return (
-          (store.state.users.currentUser
+          (useUsersStore().currentUser
             ? useInstanceStore().instanceIdentity.redirectRootLogin
             : useInstanceStore().instanceIdentity.redirectRootNoLogin) ||
           '/main/all'
@@ -41,22 +35,52 @@ export default (store) => {
     {
       name: 'public-external-timeline',
       path: '/main/all',
-      component: PublicAndExternalTimeline,
+      component: Timeline,
+      props: () => ({
+        timelineRef: { name: 'publicAndExternal' },
+      }),
     },
     {
       name: 'public-timeline',
       path: '/main/public',
-      component: PublicTimeline,
+      component: Timeline,
+      props: () => ({
+        timelineRef: { name: 'public' },
+      }),
     },
     {
       name: 'friends',
       path: '/main/friends',
-      component: FriendsTimeline,
+      component: Timeline,
       beforeEnter: validateAuthenticatedRoute,
+      props: () => ({
+        timelineRef: { name: 'friends' },
+      }),
+    },
+    {
+      name: 'tag-timeline',
+      path: '/tag/:id',
+      component: Timeline,
+      props: (route) => ({
+        timelineRef: { name: 'tag', argument: route.params.id },
+      }),
+    },
+    {
+      name: 'bookmarks',
+      path: '/bookmarks',
+      component: Timeline,
+      props: (route) => ({
+        timelineRef: { name: 'bookmarks', argument: null },
+      }),
+    },
+    {
+      name: 'bubble',
+      path: '/bubble',
+      component: Timeline,
+      props: () => ({
+        timelineRef: { name: 'bubble' },
+      }),
     },
-    { name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline },
-    { name: 'bookmarks', path: '/bookmarks', component: BookmarkTimeline },
-    { name: 'bubble', path: '/bubble', component: BubbleTimeline },
     {
       name: 'conversation',
       path: '/notice/:id',
@@ -71,7 +95,14 @@ export default (store) => {
       meta: { dontScroll: true },
       beforeEnter: validateAuthenticatedRoute,
     },
-    { name: 'quotes', path: '/notice/:id/quotes', component: QuotesTimeline },
+    {
+      name: 'quotes',
+      path: '/notice/:id/quotes',
+      component: Timeline,
+      props: (route) => ({
+        timelineRef: { name: 'quotes', argument: route.params.id },
+      }),
+    },
     {
       name: 'remote-user-profile-acct',
       path: '/remote-users/:_(@)?:username([^/@]+)@:hostname([^/@]+)',
@@ -104,8 +135,11 @@ export default (store) => {
     {
       name: 'dms',
       path: '/users/:username/dms',
-      component: DMs,
+      component: Timeline,
       beforeEnter: validateAuthenticatedRoute,
+      props: () => ({
+        timelineRef: { name: 'dms' },
+      }),
     },
     {
       name: 'registration',
@@ -202,8 +236,10 @@ export default (store) => {
     {
       name: 'lists-timeline',
       path: '/lists/:id',
-      component: () =>
-        import('src/components/lists_timeline/lists_timeline.vue'),
+      component: Timeline,
+      props: (route) => ({
+        timelineRef: { name: 'list', argument: route.params.id },
+      }),
     },
     {
       name: 'lists-edit',
@@ -237,7 +273,10 @@ export default (store) => {
     {
       name: 'bookmark-folder',
       path: '/bookmarks/:id',
-      component: BookmarkTimeline,
+      component: Timeline,
+      props: (route) => ({
+        timelineRef: { name: 'bookmarks', argument: route.params.id },
+      }),
     },
     {
       name: 'bookmark-folder-edit',
diff --git a/src/components/account_actions/account_actions.js b/src/components/account_actions/account_actions.js
index 9b4775b97..bc29d3f6a 100644
--- a/src/components/account_actions/account_actions.js
+++ b/src/components/account_actions/account_actions.js
@@ -8,6 +8,7 @@ import UserListMenu from 'src/components/user_list_menu/user_list_menu.vue'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useReportsStore } from 'src/stores/reports'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faEllipsisV } from '@fortawesome/free-solid-svg-icons'
@@ -47,10 +48,10 @@ const AccountActions = {
       this.showingConfirmBlock = false
     },
     showRepeats() {
-      this.$store.dispatch('showReblogs', this.user.id)
+      useUsersStore().showReblogs(this.user.id)
     },
     hideRepeats() {
-      this.$store.dispatch('hideReblogs', this.user.id)
+      useUsersStore().hideReblogs(this.user.id)
     },
     blockUser() {
       if (this.$refs.timedBlockDialog) {
@@ -64,11 +65,11 @@ const AccountActions = {
       }
     },
     doBlockUser() {
-      this.$store.dispatch('blockUser', { id: this.user.id })
+      useUsersStore().blockUser(this.user.id)
       this.hideConfirmBlock()
     },
     unblockUser() {
-      this.$store.dispatch('unblockUser', this.user.id)
+      useUsersStore().unblockUser(this.user.id)
     },
     removeUserFromFollowers() {
       if (!this.shouldConfirmRemoveUserFromFollowers) {
@@ -78,7 +79,7 @@ const AccountActions = {
       }
     },
     doRemoveUserFromFollowers() {
-      this.$store.dispatch('removeUserFromFollowers', this.user.id)
+      useUsersStore().removeUserFromFollowers(this.user.id)
       this.hideConfirmRemoveUserFromFollowers()
     },
     reportUser() {
@@ -88,8 +89,8 @@ const AccountActions = {
       this.$router.push({
         name: 'chat',
         params: {
-          username: this.$store.state.users.currentUser.screen_name,
-          recipient_id: this.user.id,
+          username: useUsersStore().currentUser.screen_name,
+          chatUserId: this.user.id,
         },
       })
     },
diff --git a/src/components/announcement/announcement.js b/src/components/announcement/announcement.js
index 6b45b2b90..e7d3d62cf 100644
--- a/src/components/announcement/announcement.js
+++ b/src/components/announcement/announcement.js
@@ -1,9 +1,10 @@
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import AnnouncementEditor from 'src/components/announcement_editor/announcement_editor.vue'
 import localeService from '../../services/locale/locale.service.js'
 
 import { useAnnouncementsStore } from 'src/stores/announcements.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const Announcement = {
   components: {
@@ -25,9 +26,7 @@ const Announcement = {
     announcement: Object,
   },
   computed: {
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useUsersStore, ['currentUser']),
     canEditAnnouncement() {
       return this.currentUser?.privileges.has(
         'announcements_manage_announcements',
diff --git a/src/components/announcements_page/announcements_page.js b/src/components/announcements_page/announcements_page.js
index 802e90cf6..1d4966df3 100644
--- a/src/components/announcements_page/announcements_page.js
+++ b/src/components/announcements_page/announcements_page.js
@@ -1,9 +1,10 @@
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import Announcement from 'src/components/announcement/announcement.vue'
 import AnnouncementEditor from 'src/components/announcement_editor/announcement_editor.vue'
 
 import { useAnnouncementsStore } from 'src/stores/announcements.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const AnnouncementsPage = {
   components: {
@@ -26,9 +27,7 @@ const AnnouncementsPage = {
     useAnnouncementsStore().fetchAnnouncements()
   },
   computed: {
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useUsersStore, ['currentUser']),
     announcements() {
       return useAnnouncementsStore().announcements
     },
diff --git a/src/components/avatar_list/avatar_list.js b/src/components/avatar_list/avatar_list.js
index 7806fba81..7c0a39ffd 100644
--- a/src/components/avatar_list/avatar_list.js
+++ b/src/components/avatar_list/avatar_list.js
@@ -1,14 +1,19 @@
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
 const AvatarList = {
-  props: ['users'],
+  props: {
+    userIds: Set,
+  },
   computed: {
     slicedUsers() {
-      return this.users ? this.users.slice(0, 15) : []
+      return [...(this.userIds ?? [])]
+        .slice(0, 15)
+        .map((id) => useUsersStore().findUser(id))
     },
   },
   components: {
diff --git a/src/components/avatar_list/avatar_list.vue b/src/components/avatar_list/avatar_list.vue
index 9252ba324..fde4e14c9 100644
--- a/src/components/avatar_list/avatar_list.vue
+++ b/src/components/avatar_list/avatar_list.vue
@@ -7,7 +7,7 @@
       class="avatars-item"
     >
       <UserAvatar
-        :user="user"
+        :user-id="user.id"
         class="avatar-small"
       />
     </router-link>
diff --git a/src/components/basic_user_card/basic_user_card.vue b/src/components/basic_user_card/basic_user_card.vue
index 39b269ea8..83b975f62 100644
--- a/src/components/basic_user_card/basic_user_card.vue
+++ b/src/components/basic_user_card/basic_user_card.vue
@@ -11,7 +11,7 @@
       >
         <UserAvatar
           class="user-avatar avatar"
-          :user="user"
+          :user-id="user.id"
           @click.prevent
         />
       </UserPopover>
@@ -41,7 +41,7 @@
           {{ $t('admin_dash.users.labels.handle_colon') }}
           {{ ' ' }}
         </strong>
-        <user-link
+        <UserLink
           class="basic-user-card-screen-name"
           :user="user"
         />
diff --git a/src/components/block_card/block_card.js b/src/components/block_card/block_card.js
index 6484accff..2ee578520 100644
--- a/src/components/block_card/block_card.js
+++ b/src/components/block_card/block_card.js
@@ -4,15 +4,16 @@ import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
 
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const BlockCard = {
   props: ['userId'],
   computed: {
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     relationship() {
-      return this.$store.getters.relationship(this.userId)
+      return useUsersStore().relationship(this.userId)
     },
     blocked() {
       return this.relationship.blocking
@@ -35,13 +36,13 @@ const BlockCard = {
   },
   methods: {
     unblockUser() {
-      this.$store.dispatch('unblockUser', this.user.id)
+      useUsersStore().unblockUser(this.user.id)
     },
     blockUser() {
       if (this.blockExpiration) {
         this.$refs.timedBlockDialog.optionallyPrompt()
       } else {
-        this.$store.dispatch('blockUser', { id: this.user.id })
+        useUsersStore().blockUser(this.user.id)
       }
     },
   },
diff --git a/src/components/bookmark_timeline/bookmark_timeline.js b/src/components/bookmark_timeline/bookmark_timeline.js
deleted file mode 100644
index bf633c18c..000000000
--- a/src/components/bookmark_timeline/bookmark_timeline.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const Bookmarks = {
-  created() {
-    this.$store.commit('clearTimeline', { timeline: 'bookmarks' })
-    this.$store.dispatch('startFetchingTimeline', {
-      timeline: 'bookmarks',
-      bookmarkFolderId: this.folderId || null,
-    })
-  },
-  components: {
-    Timeline,
-  },
-  computed: {
-    folderId() {
-      return this.$route.params.id
-    },
-    timeline() {
-      return this.$store.state.statuses.timelines.bookmarks
-    },
-  },
-  watch: {
-    folderId() {
-      this.$store.commit('clearTimeline', { timeline: 'bookmarks' })
-      this.$store.dispatch('stopFetchingTimeline', 'bookmarks')
-      this.$store.dispatch('startFetchingTimeline', {
-        timeline: 'bookmarks',
-        bookmarkFolderId: this.folderId || null,
-      })
-    },
-  },
-  unmounted() {
-    this.$store.commit('clearTimeline', { timeline: 'bookmarks' })
-    this.$store.dispatch('stopFetchingTimeline', 'bookmarks')
-  },
-}
-
-export default Bookmarks
diff --git a/src/components/bookmark_timeline/bookmark_timeline.vue b/src/components/bookmark_timeline/bookmark_timeline.vue
deleted file mode 100644
index cc86cf12e..000000000
--- a/src/components/bookmark_timeline/bookmark_timeline.vue
+++ /dev/null
@@ -1,10 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.bookmarks')"
-    :timeline="timeline"
-    :timeline-name="'bookmarks'"
-    :bookmark-folder-id="folderId"
-  />
-</template>
-
-<script src="./bookmark_timeline.js"></script>
diff --git a/src/components/bubble_timeline/bubble_timeline.js b/src/components/bubble_timeline/bubble_timeline.js
deleted file mode 100644
index fcbc31ad2..000000000
--- a/src/components/bubble_timeline/bubble_timeline.js
+++ /dev/null
@@ -1,20 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const BubbleTimeline = {
-  components: {
-    Timeline,
-  },
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.bubble
-    },
-  },
-  created() {
-    this.$store.dispatch('startFetchingTimeline', { timeline: 'bubble' })
-  },
-  unmounted() {
-    this.$store.dispatch('stopFetchingTimeline', 'bubble')
-  },
-}
-
-export default BubbleTimeline
diff --git a/src/components/bubble_timeline/bubble_timeline.vue b/src/components/bubble_timeline/bubble_timeline.vue
deleted file mode 100644
index 4aefa2729..000000000
--- a/src/components/bubble_timeline/bubble_timeline.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.bubble')"
-    :timeline="timeline"
-    :timeline-name="'bubble'"
-  />
-</template>
-
-<script src="./bubble_timeline.js"></script>
diff --git a/src/components/chat_list/chat_list.js b/src/components/chat_list/chat_list.js
index 446ccb70a..0b0c241e8 100644
--- a/src/components/chat_list/chat_list.js
+++ b/src/components/chat_list/chat_list.js
@@ -1,11 +1,11 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import ChatListItem from 'src/components/chat_list_item/chat_list_item.vue'
 import ChatNew from 'src/components/chat_new/chat_new.vue'
 import List from 'src/components/list/list.vue'
 
 import { useChatsStore } from 'src/stores/chats.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const ChatList = {
   components: {
@@ -14,10 +14,8 @@ const ChatList = {
     ChatNew,
   },
   computed: {
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
-    ...mapPiniaState(useChatsStore, ['sortedChatList']),
+    ...mapState(useUsersStore, ['currentUser']),
+    ...mapState(useChatsStore, ['sortedChatList']),
   },
   data() {
     return {
diff --git a/src/components/chat_list_item/chat_list_item.js b/src/components/chat_list_item/chat_list_item.js
index 8bb2afd93..09d5290a9 100644
--- a/src/components/chat_list_item/chat_list_item.js
+++ b/src/components/chat_list_item/chat_list_item.js
@@ -1,4 +1,4 @@
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import AvatarList from 'src/components/avatar_list/avatar_list.vue'
 import ChatTitle from 'src/components/chat_title/chat_title.vue'
@@ -6,6 +6,8 @@ import StatusBody from 'src/components/status_content/status_content.vue'
 import Timeago from 'src/components/timeago/timeago.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const ChatListItem = {
   name: 'ChatListItem',
   props: ['chat'],
@@ -17,9 +19,7 @@ const ChatListItem = {
     StatusBody,
   },
   computed: {
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useUsersStore, ['currentUser']),
     attachmentInfo() {
       if (this.chat.lastMessage.attachments.length === 0) {
         return
diff --git a/src/components/chat_list_item/chat_list_item.vue b/src/components/chat_list_item/chat_list_item.vue
index 236562df0..8f38f518f 100644
--- a/src/components/chat_list_item/chat_list_item.vue
+++ b/src/components/chat_list_item/chat_list_item.vue
@@ -5,7 +5,7 @@
   >
     <div class="chat-list-item-left">
       <UserAvatar
-        :user="chat.account"
+        :user-id="chat.account.id"
         height="48px"
         width="48px"
       />
diff --git a/src/components/chat_message/chat_message.js b/src/components/chat_message/chat_message.js
index aabdec31f..5d086aade 100644
--- a/src/components/chat_message/chat_message.js
+++ b/src/components/chat_message/chat_message.js
@@ -1,6 +1,5 @@
-import { mapState as mapPiniaState } from 'pinia'
+import { mapState } from 'pinia'
 import { defineAsyncComponent } from 'vue'
-import { mapState } from 'vuex'
 
 import Attachment from 'src/components/attachment/attachment.vue'
 import ChatMessageDate from 'src/components/chat_message_date/chat_message_date.vue'
@@ -20,6 +19,8 @@ import UserPopover from 'src/components/user_popover/user_popover.vue'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -79,7 +80,7 @@ const ChatMessage = {
       return this.isStatus ? this.message.user.id : this.message.account_id
     },
     author() {
-      return this.$store.getters.findUser(this.authorId)
+      return useUsersStore().findUser(this.authorId)
     },
     isCurrentUser() {
       // mini-hack/optimizaiton:
@@ -100,25 +101,21 @@ const ChatMessage = {
       return !this.message.in_reply_to_status_id
     },
     customReplyTo() {
-      return this.$store.state.statuses.allStatusesObject[
-        this.message.in_reply_to_status_id
-      ]
+      return useStatusesStore().allStatuses.get(
+        this.message.in_reply_to_status_id,
+      )
     },
     replyToName() {
       if (this.message.in_reply_to_screen_name) {
         return this.message.in_reply_to_screen_name
       } else {
-        const user = this.$store.getters.findUser(
-          this.message.in_reply_to_user_id,
-        )
+        const user = useUsersStore().findUser(this.message.in_reply_to_user_id)
         return user?.screen_name_ui
       }
     },
     replyProfileLink() {
       if (this.isCustomReply) {
-        const user = this.$store.getters.findUser(
-          this.message.in_reply_to_user_id,
-        )
+        const user = useUsersStore().findUser(this.message.in_reply_to_user_id)
         // FIXME Why user not found sometimes???
         return user ? user.statusnet_profile_url : 'NOT_FOUND'
       }
@@ -167,14 +164,12 @@ const ChatMessage = {
     },
 
     // Global stuff
-    ...mapPiniaState(useInterfaceStore, {
+    ...mapState(useInterfaceStore, {
       betterShadow: (store) => store.browserSupport.cssFilter,
     }),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-      restrictedNicknames: (state) => useInstanceStore().restrictedNicknames,
-    }),
-    ...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
+    ...mapState(useUsersStore, ['currentUser']),
+    ...mapState(useInstanceStore, ['restrictedNicknames']),
+    ...mapState(useMergedConfigStore, ['mergedConfig']),
   },
   data() {
     return {
diff --git a/src/components/chat_message/chat_message.vue b/src/components/chat_message/chat_message.vue
index 88ab2fc0a..a6700201d 100644
--- a/src/components/chat_message/chat_message.vue
+++ b/src/components/chat_message/chat_message.vue
@@ -83,7 +83,7 @@
           <UserAvatar
             v-if="author"
             :compact="true"
-            :user="author"
+            :user-id="author.id"
           />
         </UserPopover>
         <div
diff --git a/src/components/chat_new/chat_new.js b/src/components/chat_new/chat_new.js
index 00826ce66..4f015db6a 100644
--- a/src/components/chat_new/chat_new.js
+++ b/src/components/chat_new/chat_new.js
@@ -1,9 +1,11 @@
-import { mapGetters, mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useSearchStore } from 'src/stores/search.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { chats } from 'src/api/chats.js'
 
@@ -42,17 +44,14 @@ const chatNew = {
         return this.suggestions
       }
     },
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
-    ...mapGetters(['findUser']),
+    ...mapState(useUsersStore, ['currentUser', 'findUser']),
   },
   methods: {
     goBack() {
       this.$emit('cancel')
     },
     goToChat(user) {
-      this.$router.push({ name: 'chat', params: { recipient_id: user.id } })
+      this.$router.push({ name: 'chat', params: { chatUserId: user.id } })
     },
     onInput() {
       this.search(this.query)
@@ -73,7 +72,8 @@ const chatNew = {
       this.loading = true
       this.userIds = []
       this.$store
-        .dispatch('search', { q: query, resolve: true, type: 'accounts' })
+      useSearchStore()
+        .search({ q: query, resolve: true, type: 'accounts' })
         .then((data) => {
           this.loading = false
           this.userIds = data.accounts.map((a) => a.id)
diff --git a/src/components/chat_title/chat_title.vue b/src/components/chat_title/chat_title.vue
index 905a32d85..cae9064d2 100644
--- a/src/components/chat_title/chat_title.vue
+++ b/src/components/chat_title/chat_title.vue
@@ -10,7 +10,7 @@
     >
       <UserAvatar
         class="titlebar-avatar"
-        :user="user"
+        :user-id="user.id"
       />
     </UserPopover>
     <RichContent
diff --git a/src/components/chat_view/chat_view.js b/src/components/chat_view/chat_view.js
index a93a86ba5..a0abcb5fe 100644
--- a/src/components/chat_view/chat_view.js
+++ b/src/components/chat_view/chat_view.js
@@ -1,7 +1,6 @@
 import { get, maxBy, minBy, sortBy, throttle } from 'lodash'
-import { mapState as mapPiniaState } from 'pinia'
+import { mapState } from 'pinia'
 import { nextTick } from 'vue'
-import { mapState } from 'vuex'
 
 import ChatMessageList from 'src/components/chat_message_list/chat_message_list.vue'
 import ChatTitle from 'src/components/chat_title/chat_title.vue'
@@ -19,6 +18,9 @@ import { useChatsStore } from 'src/stores/chats.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import {
   chatMessages,
@@ -85,14 +87,18 @@ const Chat = {
 
       // Internal network stuff
       fetcher: null,
+      socket: null,
+      streaming: false,
+      fetching: true,
       errorLoadingChat: false,
       messageRetriers: {},
       idempotencyKeyIndex: {},
     }
   },
-  created() {
+  async created() {
     if (this.testMode) return
-    this.startFetching()
+    await this.activate()
+    this.attachSocket()
   },
   mounted() {
     window.addEventListener('resize', this.handleResize)
@@ -118,10 +124,14 @@ const Chat = {
         this.handleVisibilityChange,
         false,
       )
+
+    if (this.testMode) return
+    this.deactivate()
+    this.detachSocket()
   },
   computed: {
     conversationId() {
-      const status = this.$store.state.statuses.allStatusesObject[this.statusId]
+      const status = useStatusesStore().allStatuses.get(this.statusId)
       return get(
         status,
         'retweeted_status.statusnet_conversation_id',
@@ -157,17 +167,14 @@ const Chat = {
       if (this.isConversation) return false // Unsupported
       return (
         this.mergedConfig.useStreamingApi &&
-        this.mastoUserSocketStatus === WSConnectionStatus.JOINED
+        useStreamingStore().state === WSConnectionStatus.JOINED
       )
     },
-    ...mapPiniaState(useInterfaceStore, {
+    ...mapState(useInterfaceStore, {
       mobileLayout: (store) => store.layoutType === 'mobile',
     }),
-    ...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
-    ...mapState({
-      mastoUserSocketStatus: (state) => state.api.mastoUserSocketStatus,
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useMergedConfigStore, ['mergedConfig']),
+    ...mapState(useUsersStore, ['currentUser']),
   },
   watch: {
     messages(old, neu) {
@@ -226,16 +233,93 @@ const Chat = {
         return
       }
 
-      this.clear()
-      this.startFetching()
-    },
-    mastoUserSocketStatus(newValue) {
-      if (newValue === WSConnectionStatus.JOINED) {
-        this.fetchChat({ isFirstFetch: true })
-      }
+      this.deactivate()
+      this.activate()
     },
   },
   methods: {
+    async activate() {
+      if (!this.isConversation) {
+        try {
+          const result = await getOrCreateChat({
+            accountId: this.chatUserId,
+            credentials: useOAuthStore().token,
+          })
+          const { data } = result
+          useUsersStore().addNewUsers({ ...result, data: data.account })
+          data.account = useUsersStore().findUser(data.account.id)
+          this.chat = data
+          this.maxId = this.chat.lastMessage?.id
+        } catch (e) {
+          console.error('Error creating or getting a chat', e)
+          this.errorLoadingChat = true
+        }
+      }
+
+      if (this.isConversation || this.chat) {
+        this.startFetching('Chat activated', true)
+        this.$nextTick(() => {
+          this.scrollDown({ forceRead: true })
+        })
+      }
+    },
+    deactivate() {
+      this.clear()
+      if (this.fetching) {
+        this.stopFetching('Chat deactivated')
+      }
+    },
+    attachSocket() {
+      const et = new EventTarget()
+      const socket = {
+        name: 'chatview',
+        et,
+      }
+
+      et.addEventListener('update', this.onStreamMessage)
+      et.addEventListener('pleroma:chat_update', this.onChatUpdate)
+      et.addEventListener('open', this.onStreamConnect)
+      et.addEventListener('close', this.onStreamDisconnect)
+
+      this.socket = socket
+      useStreamingStore().addSubscriber(this.socket)
+    },
+    detachSocket() {
+      const { et } = this.socket
+
+      et.removeEventListener('update', this.onStreamMessage)
+      et.removeEventListener('pleroma:chat_update', this.onChatUpdate)
+      et.removeEventListener('open', this.onStreamConnect)
+      et.removeEventListener('close', this.onStreamDisconnect)
+
+      useStreamingStore().removeSubscriber(this.socket)
+    },
+
+    // Poll & Push
+    onStreamConnect() {
+      this.streaming = true
+      this.stopFetching('Socket connected')
+    },
+    onStreamDisconnect(closeEvent) {
+      this.streaming = false
+      this.startFetching('Socket disconnected')
+    },
+    startFetching(reason, isFirstFetch) {
+      console.debug('[Chat View] Started fetching', 'Reason:', reason)
+      this.fetcher = promiseInterval(
+        () => this.fetchChat({ fetchLatest: true }),
+        5000,
+      )
+      this.fetchChat({ isFirstFetch })
+      this.fetching = true
+    },
+    stopFetching(reason) {
+      console.debug('[Chat View] Stopped fetching', 'Reason:', reason)
+      this.fetcher.stop()
+      this.fetcher = null
+      this.fetching = false
+    },
+
     // Actions
     async readChat() {
       if (this.conversationId) return // Unsupported
@@ -259,18 +343,8 @@ const Chat = {
       this.lastReadMessageId = this.maxId
       this.newMessageCount = 0
     },
-    scrollDown(options = {}) {
-      const { behavior = 'auto', forceRead = false } = options
-      this.$nextTick(() => {
-        window.scrollTo({
-          top: document.documentElement.scrollHeight,
-          behavior,
-        })
-      })
-      if (forceRead) {
-        this.readChat()
-      }
-    },
+
+    // Clears
     cullOlder() {
       const maxIndex = this.messages.length
       const minIndex = maxIndex - 50
@@ -366,35 +440,16 @@ const Chat = {
         })
       }
     },
-    async startFetching() {
-      if (!this.isConversation) {
-        try {
-          const { data } = await getOrCreateChat({
-            accountId: this.chatUserId,
-            credentials: useOAuthStore().token,
-          })
-          this.$store.commit('addNewUsers', [data.account])
-          data.account = this.$store.getters.findUser(data.account.id)
-          this.chat = data
-        } catch (e) {
-          console.error('Error creating or getting a chat', e)
-          this.errorLoadingChat = true
-        }
-      }
-
-      if (this.isConversation || this.chat) {
-        this.$nextTick(() => {
-          this.scrollDown({ forceRead: true })
-        })
-        this.doStartFetching()
-      }
-    },
-    doStartFetching() {
-      this.fetcher = promiseInterval(
-        () => this.fetchChat({ fetchLatest: true }),
-        5000,
+    onStreamMessage({ data }) {
+      const messages = data.filter(
+        ({ statusnet_conversation_id }) =>
+          statusnet_conversation_id === this.conversationId,
       )
-      this.fetchChat({ isFirstFetch: true })
+      this.addMessages({ messages })
+    },
+    onChatUpdate({ data: { chatUpdate } }) {
+      const messages = [chatUpdate.lastMessage]
+      this.addMessages({ messages })
     },
     addMessages({ messages: newMessages }) {
       for (let i = 0; i < newMessages.length; i++) {
@@ -402,17 +457,23 @@ const Chat = {
 
         // Sanity check
         if (!this.isConversation && message.chat_id !== this.chat.id) {
+          // This is spammy, we get chat updates from a global chat update
+          // handler, which naturally receives updates for ALL chats.
+          // There is no way to subscribe to specific chat updates and listen
+          // to that in the API.
+          /*
           console.warn(
             `Chat message doesn't belong to current chat (id: ${this.chat.id})!!`,
             message,
           )
+          */
           return
         }
 
         // Clear any known pending messages
         if (message.idempotency_key) {
-          if (this.pendingMessagesIndex[message.idempotencyKeyIndex]) {
-            delete this.pendingMessagesIndex[message.idempotencyKeyIndex]
+          if (this.pendingMessagesIndex[message.idempotency_key]) {
+            delete this.pendingMessagesIndex[message.idempotency_key]
             this.pendingMessages = this.pendingMessages.filter(
               ({ idempotency_key }) =>
                 idempotency_key !== message.idempotency_key,
@@ -438,9 +499,6 @@ const Chat = {
         }
       }
     },
-    goBack() {
-      this.$router.back()
-    },
 
     // Optimistic posting (chats only)
     async sendMessage({ status, media, idempotencyKey }) {
@@ -621,6 +679,23 @@ const Chat = {
       })
     },
 
+    // Misc
+    scrollDown(options = {}) {
+      const { behavior = 'auto', forceRead = false } = options
+      this.$nextTick(() => {
+        window.scrollTo({
+          top: document.documentElement.scrollHeight,
+          behavior,
+        })
+      })
+      if (forceRead) {
+        this.readChat()
+      }
+    },
+    goBack() {
+      this.$router.back()
+    },
+
     // Ugly
     // TODO move to ChatMessage
     async deleteChatMessage({ chatId, messageId }) {
diff --git a/src/components/confirm_modal/mute_confirm.js b/src/components/confirm_modal/mute_confirm.js
index c2f5ff888..2247c2e91 100644
--- a/src/components/confirm_modal/mute_confirm.js
+++ b/src/components/confirm_modal/mute_confirm.js
@@ -4,6 +4,8 @@ import { defineAsyncComponent } from 'vue'
 import Select from 'src/components/select/select.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 export default {
   props: ['type', 'user', 'status'],
@@ -33,9 +35,7 @@ export default {
       return this.status.conversation_muted
     },
     domainIsMuted() {
-      return new Set(this.$store.state.users.currentUser.domainMutes).has(
-        this.domain,
-      )
+      return new Set(useUsersStore().currentUser.domainMutes).has(this.domain)
     },
     shouldConfirm() {
       switch (this.type) {
@@ -70,17 +70,17 @@ export default {
       switch (this.type) {
         case 'domain': {
           if (!this.domainIsMuted) {
-            this.$store.dispatch('muteDomain', this.domain)
+            useUsersStore().muteDomain(this.domain)
           } else {
-            this.$store.dispatch('unmuteDomain', this.domain)
+            useUsersStore().unmuteDomain(this.domain)
           }
           break
         }
         case 'conversation': {
           if (!this.conversationIsMuted) {
-            this.$store.dispatch('muteConversation', { id: this.status.id })
+            useStatusesStore().muteConversation(this.status.id)
           } else {
-            this.$store.dispatch('unmuteConversation', { id: this.status.id })
+            useStatusesStore().unmuteConversation(this.status.id)
           }
           break
         }
diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index ea5637944..4eb29bcd6 100644
--- a/src/components/conversation/conversation.js
+++ b/src/components/conversation/conversation.js
@@ -1,6 +1,5 @@
-import { clone, filter, findIndex, get, reduce } from 'lodash'
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { get, reduce } from 'lodash'
+import { mapState } from 'pinia'
 
 import ChatMessageList from 'src/components/chat_message_list/chat_message_list.vue'
 import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
@@ -9,9 +8,11 @@ import QuickViewSettings from 'src/components/quick_view_settings/quick_view_set
 import RichContent from 'src/components/rich_content/rich_content.jsx'
 import ThreadTree from 'src/components/thread_tree/thread_tree.vue'
 
-import { useInterfaceStore } from 'src/stores/interface'
+import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
 
 import { fetchConversation, fetchStatus } from 'src/api/public.js'
 import { WSConnectionStatus } from 'src/api/websocket.js'
@@ -51,20 +52,6 @@ const sortById = (a, b) => {
   }
 }
 
-const sortAndFilterConversation = (conversation, statusoid) => {
-  if (statusoid.type === 'retweet') {
-    conversation = filter(
-      conversation,
-      (status) =>
-        status.type === 'retweet' ||
-        status.id !== statusoid.retweeted_status.id,
-    )
-  } else {
-    conversation = filter(conversation, (status) => status.type !== 'retweet')
-  }
-  return conversation.filter(Boolean).sort(sortById)
-}
-
 const conversation = {
   props: {
     statusId: {
@@ -106,6 +93,7 @@ const conversation = {
       default: false,
     },
   },
+  emits: ['update:virtualHeight'],
   data() {
     return {
       focused: null,
@@ -114,6 +102,7 @@ const conversation = {
       inlineDivePosition: null,
       loadStatusError: null,
       unsuspendibleIds: new Set(),
+      virtualHeight: 120,
     }
   },
   created() {
@@ -121,7 +110,13 @@ const conversation = {
       this.fetchConversation()
     }
   },
+  mounted() {
+    this.updateVirtualHeight()
+  },
   computed: {
+    status() {
+      return useStatusesStore().allStatuses.get(this.statusId)
+    },
     maxDepthToShowByDefault() {
       // maxDepthInThread = max number of depths that is *visible*
       // since our depth starts with 0 and "showing" means "showing children"
@@ -160,14 +155,11 @@ const conversation = {
       return this.otherRepliesButtonPosition === 'inside'
     },
     suspendable() {
-      return this.unsuspendibleIds.size > 0
+      return this.unsuspendibleIds.size === 0
     },
-    hideStatus() {
+    hide() {
       return this.virtualHidden && this.suspendable
     },
-    status() {
-      return this.$store.state.statuses.allStatusesObject[this.statusId]
-    },
     originalStatusId() {
       if (this.status.retweeted_status) {
         return this.status.retweeted_status.id
@@ -187,15 +179,14 @@ const conversation = {
         return [this.status]
       }
 
-      const conversation = clone(
-        this.$store.state.statuses.conversationsObject[this.conversationId],
+      const conversation = useStatusesStore().conversations.get(
+        this.conversationId,
       )
-      const statusIndex = findIndex(conversation, { id: this.originalStatusId })
-      if (statusIndex !== -1) {
-        conversation[statusIndex] = this.status
-      }
 
-      return sortAndFilterConversation(conversation, this.status)
+      return [...conversation.keys()]
+        .map((k) => useStatusesStore().allStatuses.get(k))
+        .filter((status) => status.type != 'repeat') // Old backend behavior?
+        .toSorted(sortById)
     },
     statusMap() {
       return this.conversation.reduce((res, s) => {
@@ -375,8 +366,7 @@ const conversation = {
       return !!(this.expanded || this.isPage)
     },
     hiddenStyle() {
-      const height = this.status?.virtualHeight || '120px'
-      return this.virtualHidden ? { height } : {}
+      return { height: this.virtualHeight + 'px' }
     },
     threadDisplayStatus() {
       return this.conversation.reduce((a, k) => {
@@ -403,11 +393,11 @@ const conversation = {
     maybeFocused() {
       return this.isExpanded ? this.focused : null
     },
-    ...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
-    ...mapState({
-      mastoUserSocketStatus: (state) => state.api.mastoUserSocketStatus,
+    ...mapState(useMergedConfigStore, ['mergedConfig']),
+    ...mapState(useStreamingStore, {
+      mastoUserSocketStatus: (state) => state.state,
     }),
-    ...mapPiniaState(useInterfaceStore, {
+    ...mapState(useInterfaceStore, {
       mobileLayout: (store) => store.layoutType === 'mobile',
     }),
   },
@@ -441,10 +431,7 @@ const conversation = {
       }
     },
     virtualHidden() {
-      this.$store.dispatch('setVirtualHeight', {
-        statusId: this.statusId,
-        height: `${this.$el.clientHeight}px`,
-      })
+      this.updateVirtualHeight()
     },
   },
   methods: {
@@ -453,9 +440,12 @@ const conversation = {
         fetchConversation({
           id: this.statusId,
           credentials: useOAuthStore().token,
-        }).then(({ data: { ancestors, descendants } }) => {
-          this.$store.dispatch('addNewStatuses', { statuses: ancestors })
-          this.$store.dispatch('addNewStatuses', { statuses: descendants })
+        }).then(({ data: { ancestors, descendants }, timestamp }) => {
+          useStatusesStore().addNewStatuses({ statuses: ancestors, timestamp })
+          useStatusesStore().addNewStatuses({
+            statuses: descendants,
+            timestamp,
+          })
           this.setFocused(this.originalStatusId)
         })
       } else {
@@ -465,7 +455,7 @@ const conversation = {
           credentials: useOAuthStore().token,
         })
           .then(({ data: status }) => {
-            this.$store.dispatch('addNewStatuses', { statuses: [status] })
+            useStatusesStore().addNewStatuses({ statuses: [status] })
             this.fetchConversation()
           })
           .catch((error) => {
@@ -482,17 +472,17 @@ const conversation = {
       this.focused = id
 
       if (!this.streamingEnabled) {
-        this.$store.dispatch('fetchStatus', id)
+        useStatusesStore().fetchStatus(id)
       }
 
-      this.$store.dispatch('fetchFavsAndRepeats', id)
-      this.$store.dispatch('fetchEmojiReactionsBy', id)
+      useStatusesStore().fetchFavsAndRepeats(id)
+      useStatusesStore().fetchEmojiReactions(id)
     },
     toggleExpanded() {
       this.expanded = !this.expanded
     },
     getConversationId(statusId) {
-      const status = this.$store.state.statuses.allStatusesObject[statusId]
+      const status = useStatusesStore().allStatuses.get(statusId)
       return get(
         status,
         'retweeted_status.statusnet_conversation_id',
@@ -630,6 +620,18 @@ const conversation = {
         this.$router.push({ name: 'conversation', params: { id: data.id } })
       }
     },
+    updateVirtualHeight() {
+      if (this.hide) return // no updates when not rendering
+      if (!this.status) return // not loaded yet
+      this.$nextTick(() => {
+        this.virtualHeight = this.$refs.body.getBoundingClientRect().height
+        this.$emit('update:virtualHeight', {
+          id: this.status.id,
+          height: this.virtualHeight,
+          top: this.$el.clientTop,
+        })
+      })
+    },
   },
 }
 
diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue
index 0833c4f89..94c4db188 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -1,7 +1,6 @@
 <template>
   <div
-    v-if="!hideStatus"
-    :style="hiddenStyle"
+    v-if="!hide"
     class="Conversation"
     :class="{ '-expanded' : isExpanded, 'panel' : isExpanded }"
   >
@@ -40,6 +39,7 @@
     <div
       v-if="isPage && !status"
       class="conversation-body"
+      ref="body"
       :class="{ 'panel-body': isExpanded }"
     >
       <p v-if="!loadStatusError">
@@ -56,6 +56,7 @@
     <div
       v-else
       class="conversation-body"
+      ref="body"
       :class="{ 'panel-body': isExpanded }"
     >
       <div
@@ -99,7 +100,7 @@
               ref="statusComponent"
               class="conversation-status status-fadein panel-body"
 
-              :statusoid="status"
+              :status-id="status.id"
               :replies="getReplies(status.id)"
 
               :expandable="!isExpanded"
@@ -116,6 +117,7 @@
               @goto="setFocused"
               @dive="() => diveIntoStatus(status.id)"
               @suspendable-state-change="onStatusSuspendStateChange"
+              @height-change="updateVirtualHeight"
             />
             <div
               v-if="showOtherRepliesButtonBelowStatus && getReplies(status.id).length > 1"
@@ -152,7 +154,7 @@
           ref="statusComponent"
           :depth="0"
 
-          :status="status"
+          :status-id="status.id"
           :in-profile="inProfile"
           :conversation="conversation"
           :collapsable="collapsable"
@@ -174,6 +176,7 @@
           @goto="setFocused"
           @dive="diveIntoStatus"
           @suspendable-state-change="onStatusSuspendStateChange"
+          @height-change="updateVirtualHeight"
         />
       </div>
       <div
@@ -186,7 +189,7 @@
             :key="status.id"
             ref="statusComponent"
             class="conversation-status status-fadein panel-body"
-            :statusoid="status"
+            :status-id="status.id"
             :replies="getReplies(status.id)"
 
             :expandable="!isExpanded"
@@ -200,6 +203,7 @@
             @goto="setFocused"
             @toggle-expanded="toggleExpanded"
             @suspendable-state-change="onStatusSuspendStateChange"
+            @height-change="updateVirtualHeight"
           />
         </article>
       </div>
diff --git a/src/components/desktop_nav/desktop_nav.js b/src/components/desktop_nav/desktop_nav.js
index cc2c5aca9..15a5cfb15 100644
--- a/src/components/desktop_nav/desktop_nav.js
+++ b/src/components/desktop_nav/desktop_nav.js
@@ -5,6 +5,10 @@ import { defineAsyncComponent } from 'vue'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import { WSConnectionStatus } from 'src/api/websocket.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -14,6 +18,8 @@ import {
   faComments,
   faHome,
   faInfoCircle,
+  faPlug,
+  faPlugCircleXmark,
   faSearch,
   faSignInAlt,
   faSignOutAlt,
@@ -33,6 +39,8 @@ library.add(
   faTachometerAlt,
   faCog,
   faInfoCircle,
+  faPlug,
+  faPlugCircleXmark,
 )
 
 export default {
@@ -91,11 +99,23 @@ export default {
       sitename: (store) => store.instanceIdentity.name,
       hideSitename: (store) => store.instanceIdentity.hideSitename,
     }),
-    currentUser() {
-      return this.$store.state.users.currentUser
-    },
+    ...mapState(useUsersStore, ['currentUser']),
+    ...mapState(useStreamingStore, {
+      streamingConnected: (store) => store.state === WSConnectionStatus.JOINED,
+    }),
+    ...mapState(useMergedConfigStore, ['mergedConfig']),
     shouldConfirmLogout() {
-      return useMergedConfigStore().mergedConfig.modalOnLogout
+      return this.mergedConfig.modalOnLogout
+    },
+    streamingEnabled() {
+      return this.mergedConfig.useStreamingApi
+    },
+    streamingTooltip() {
+      if (this.streamingConnected) {
+        return this.$t('timeline.socket_reconnected')
+      } else {
+        return this.$t('timeline.socket_disconnected')
+      }
     },
   },
   methods: {
@@ -115,9 +135,9 @@ export default {
         this.showConfirmLogout()
       }
     },
-    doLogout() {
+    async doLogout() {
+      await useUsersStore().logout()
       this.$router.replace('/main/public')
-      this.$store.dispatch('logout')
       this.hideConfirmLogout()
     },
     onSearchBarToggled(hidden) {
diff --git a/src/components/desktop_nav/desktop_nav.vue b/src/components/desktop_nav/desktop_nav.vue
index 3883b3c6f..52370a57f 100644
--- a/src/components/desktop_nav/desktop_nav.vue
+++ b/src/components/desktop_nav/desktop_nav.vue
@@ -15,6 +15,24 @@
         >
           {{ sitename }}
         </router-link>
+        <div
+          class="nav-icon"
+          v-if="streamingEnabled"
+          :title="streamingTooltip"
+        >
+          <FAIcon
+            v-if="streamingConnected"
+            fixed-width
+            class="fa-scale-110 fa-old-padding"
+            icon="plug"
+          />
+          <FAIcon
+            v-else
+            fixed-width
+            class="fa-scale-110 fa-old-padding"
+            icon="plug-circle-xmark"
+          />
+        </div>
       </div>
       <router-link
         class="logo"
diff --git a/src/components/dm_timeline/dm_timeline.js b/src/components/dm_timeline/dm_timeline.js
deleted file mode 100644
index d54044ff7..000000000
--- a/src/components/dm_timeline/dm_timeline.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const DMs = {
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.dms
-    },
-  },
-  components: {
-    Timeline,
-  },
-}
-
-export default DMs
diff --git a/src/components/dm_timeline/dm_timeline.vue b/src/components/dm_timeline/dm_timeline.vue
deleted file mode 100644
index c4e4d0703..000000000
--- a/src/components/dm_timeline/dm_timeline.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.dms')"
-    :timeline="timeline"
-    :timeline-name="'dms'"
-  />
-</template>
-
-<script src="./dm_timeline.js"></script>
diff --git a/src/components/domain_mute_card/domain_mute_card.js b/src/components/domain_mute_card/domain_mute_card.js
index d83896618..7e61b8257 100644
--- a/src/components/domain_mute_card/domain_mute_card.js
+++ b/src/components/domain_mute_card/domain_mute_card.js
@@ -1,5 +1,7 @@
 import ProgressButton from 'src/components/progress_button/progress_button.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const DomainMuteCard = {
   props: ['domain'],
   components: {
@@ -7,18 +9,18 @@ const DomainMuteCard = {
   },
   computed: {
     user() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     muted() {
-      return this.user.domainMutes.includes(this.domain)
+      return this.user.domainMutes.has(this.domain)
     },
   },
   methods: {
     unmuteDomain() {
-      return this.$store.dispatch('unmuteDomain', this.domain)
+      return useUsersStore().unmuteDomain(this.domain)
     },
     muteDomain() {
-      return this.$store.dispatch('muteDomain', this.domain)
+      return useUsersStore().muteDomain(this.domain)
     },
   },
 }
diff --git a/src/components/draft/draft.js b/src/components/draft/draft.js
index 49e186eae..1c7f419c6 100644
--- a/src/components/draft/draft.js
+++ b/src/components/draft/draft.js
@@ -6,6 +6,7 @@ import PostStatusForm from 'src/components/post_status_form/post_status_form.vue
 import StatusContent from 'src/components/status_content/status_content.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faPollH } from '@fortawesome/free-solid-svg-icons'
@@ -65,7 +66,7 @@ const Draft = {
     },
     refStatus() {
       return this.draft.refId
-        ? this.$store.state.statuses.allStatusesObject[this.draft.refId]
+        ? useStatusesStore().allStatuses.get(this.draft.refId)
         : undefined
     },
     localCollapseSubjectDefault() {
diff --git a/src/components/edit_status_modal/edit_status_modal.js b/src/components/edit_status_modal/edit_status_modal.js
index 59c142d08..8ebbe9a2d 100644
--- a/src/components/edit_status_modal/edit_status_modal.js
+++ b/src/components/edit_status_modal/edit_status_modal.js
@@ -1,9 +1,11 @@
 import { get } from 'lodash'
+import { mapState } from 'pinia'
 import { defineAsyncComponent } from 'vue'
 
 import Modal from 'src/components/modal/modal.vue'
 
 import { useEditStatusStore } from 'src/stores/editStatus.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const EditStatusModal = {
   components: {
@@ -18,18 +20,16 @@ const EditStatusModal = {
     }
   },
   computed: {
-    isLoggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
     modalActivated() {
       return useEditStatusStore().modalActivated
     },
     isFormVisible() {
-      return this.isLoggedIn && !this.resettingForm && this.modalActivated
+      return this.loggedIn && !this.resettingForm && this.modalActivated
     },
     params() {
       return useEditStatusStore().params || {}
     },
+    ...mapState(useUsersStore, ['loggedIn']),
   },
   watch: {
     params(newVal, oldVal) {
diff --git a/src/components/emoji_input/suggestor.js b/src/components/emoji_input/suggestor.js
index c31cb6717..72e376648 100644
--- a/src/components/emoji_input/suggestor.js
+++ b/src/components/emoji_input/suggestor.js
@@ -1,3 +1,6 @@
+import { useSearchStore } from 'src/stores/search.js'
+import { useUsersStore } from 'src/stores/users.js'
+
 /**
  * suggest - generates a suggestor function to be used by emoji-input
  * data: object providing source information for specific types of suggestions:
@@ -69,7 +72,7 @@ export const suggestEmoji = (emojis) => (input, nameKeywordLocalizer) => {
     })
 }
 
-export const suggestUsers = ({ dispatch, state }) => {
+export const suggestUsers = () => {
   // Keep some persistent values in closure, most importantly for the
   // custom debounce to work. Lodash debounce does not return a promise.
   let suggestions = []
@@ -77,7 +80,7 @@ export const suggestUsers = ({ dispatch, state }) => {
   let timeout = null
   let cancelUserSearch = null
 
-  const userSearch = (query) => dispatch('searchUsers', { query })
+  const userSearch = (query) => useSearchStore().searchUsers({ query })
   const debounceUserSearch = (query) => {
     cancelUserSearch?.()
     return new Promise((resolve, reject) => {
@@ -105,7 +108,7 @@ export const suggestUsers = ({ dispatch, state }) => {
       await debounceUserSearch(noPrefix)
     }
 
-    const newSuggestions = state.users.users
+    const newSuggestions = [...useUsersStore().users.values()]
       .filter(
         (user) =>
           user.screen_name &&
diff --git a/src/components/emoji_reactions/emoji_reactions.js b/src/components/emoji_reactions/emoji_reactions.js
index acb5404c0..f9cc2e2fd 100644
--- a/src/components/emoji_reactions/emoji_reactions.js
+++ b/src/components/emoji_reactions/emoji_reactions.js
@@ -3,6 +3,8 @@ import UserListPopover from 'src/components/user_list_popover/user_list_popover.
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCheck, faMinus, faPlus } from '@fortawesome/free-solid-svg-icons'
@@ -35,12 +37,12 @@ const EmojiReactions = {
     },
     accountsForEmoji() {
       return this.status.emoji_reactions.reduce((acc, reaction) => {
-        acc[reaction.name] = reaction.accounts || []
+        acc.set(reaction.name, new Set(reaction.account_ids))
         return acc
-      }, {})
+      }, new Map())
     },
     loggedIn() {
-      return !!this.$store.state.users.currentUser
+      return !!useUsersStore().currentUser
     },
     remoteInteractionLink() {
       return useInstanceStore().getRemoteInteractionLink({
@@ -58,25 +60,22 @@ const EmojiReactions = {
     reactedWith(emoji) {
       return this.status.emoji_reactions.find((r) => r.name === emoji).me
     },
-    async fetchEmojiReactionsByIfMissing() {
+    async fetchEmojiReactionsIfMissing() {
       const hasNoAccounts = this.status.emoji_reactions.find((r) => !r.accounts)
       if (hasNoAccounts) {
-        return await this.$store.dispatch(
-          'fetchEmojiReactionsBy',
-          this.status.id,
-        )
+        return await useStatusesStore().fetchEmojiReactions(this.status.id)
       }
     },
     reactWith(emoji) {
-      this.$store.dispatch('reactWithEmoji', { id: this.status.id, emoji })
+      useStatusesStore().reactWithEmoji(this.status.id, emoji)
     },
     unreact(emoji) {
-      this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
+      useStatusesStore().unreactWithEmoji(this.status.id, emoji)
     },
     async emojiOnClick(emoji) {
       if (!this.loggedIn) return
 
-      await this.fetchEmojiReactionsByIfMissing()
+      await this.fetchEmojiReactionsIfMissing()
       if (this.reactedWith(emoji)) {
         this.unreact(emoji)
       } else {
diff --git a/src/components/emoji_reactions/emoji_reactions.vue b/src/components/emoji_reactions/emoji_reactions.vue
index 16c69fa40..8f830e8ae 100644
--- a/src/components/emoji_reactions/emoji_reactions.vue
+++ b/src/components/emoji_reactions/emoji_reactions.vue
@@ -52,11 +52,11 @@
         </FALayers>
       </component>
       <UserListPopover
-        :users="accountsForEmoji[reaction.name]"
+        :user-ids="accountsForEmoji.get(reaction.name)"
         class="emoji-reaction-popover"
         :normal-button="true"
         :trigger-attrs="counterTriggerAttrs(reaction)"
-        @show="fetchEmojiReactionsByIfMissing()"
+        @show="fetchEmojiReactionsIfMissing()"
       >
         <span class="emoji-reaction-counts">{{ reaction.count }}</span>
       </UserListPopover>
diff --git a/src/components/extra_notifications/extra_notifications.js b/src/components/extra_notifications/extra_notifications.js
index 24ed074af..851656ae5 100644
--- a/src/components/extra_notifications/extra_notifications.js
+++ b/src/components/extra_notifications/extra_notifications.js
@@ -6,6 +6,7 @@ import { useChatsStore } from 'src/stores/chats.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -52,7 +53,7 @@ const ExtraNotifications = {
       )
     },
     currentUser() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     ...mapGetters(['followRequestCount']),
     ...mapState(useAnnouncementsStore, {
diff --git a/src/components/follow_button/follow_button.js b/src/components/follow_button/follow_button.js
index 3fecc025f..e4d243ff9 100644
--- a/src/components/follow_button/follow_button.js
+++ b/src/components/follow_button/follow_button.js
@@ -1,11 +1,8 @@
 import { defineAsyncComponent } from 'vue'
 
-import {
-  requestFollow,
-  requestUnfollow,
-} from '../../services/follow_manipulate/follow_manipulate'
-
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
+
 export default {
   props: ['relationship', 'user', 'labelFollowing', 'buttonClass'],
   components: {
@@ -64,9 +61,11 @@ export default {
     },
     follow() {
       this.inProgress = true
-      requestFollow(this.relationship.id, this.$store).then(() => {
-        this.inProgress = false
-      })
+      useUsersStore()
+        .followUser(this.relationship.id)
+        .finally(() => {
+          this.inProgress = false
+        })
     },
     unfollow() {
       if (this.shouldConfirmUnfollow) {
@@ -76,15 +75,12 @@ export default {
       }
     },
     doUnfollow() {
-      const store = this.$store
       this.inProgress = true
-      requestUnfollow(this.relationship.id, store).then(() => {
-        this.inProgress = false
-        store.commit('removeStatus', {
-          timeline: 'friends',
-          userId: this.relationship.id,
+      useUsersStore()
+        .unfollowUser(this.relationship.id)
+        .finally(() => {
+          this.inProgress = false
         })
-      })
 
       this.hideConfirmUnfollow()
     },
diff --git a/src/components/follow_card/follow_card.js b/src/components/follow_card/follow_card.js
index 8fffbf730..3d9d895f0 100644
--- a/src/components/follow_card/follow_card.js
+++ b/src/components/follow_card/follow_card.js
@@ -3,6 +3,8 @@ import FollowButton from 'src/components/follow_button/follow_button.vue'
 import RemoteFollow from 'src/components/remote_follow/remote_follow.vue'
 import RemoveFollowerButton from 'src/components/remove_follower_button/remove_follower_button.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const FollowCard = {
   props: ['user', 'noFollowsYou'],
   components: {
@@ -13,13 +15,13 @@ const FollowCard = {
   },
   computed: {
     isMe() {
-      return this.$store.state.users.currentUser.id === this.user.id
+      return useUsersStore().currentUser?.id === this.user.id
     },
     loggedIn() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     relationship() {
-      return this.$store.getters.relationship(this.user.id)
+      return useUsersStore().relationships.get(this.user.id)
     },
   },
 }
diff --git a/src/components/follow_card/follow_card.vue b/src/components/follow_card/follow_card.vue
index bdb6b8092..d9a508a95 100644
--- a/src/components/follow_card/follow_card.vue
+++ b/src/components/follow_card/follow_card.vue
@@ -1,5 +1,5 @@
 <template>
-  <basic-user-card :user="user">
+  <BasicUserCard :user="user">
     <div class="follow-card-content-container">
       <span
         v-if="isMe || (!noFollowsYou && relationship.followed_by)"
@@ -30,7 +30,7 @@
         />
       </template>
     </div>
-  </basic-user-card>
+  </BasicUserCard>
 </template>
 
 <script src="./follow_card.js"></script>
diff --git a/src/components/follow_request_card/follow_request_card.js b/src/components/follow_request_card/follow_request_card.js
index 294dd2472..c4b43811a 100644
--- a/src/components/follow_request_card/follow_request_card.js
+++ b/src/components/follow_request_card/follow_request_card.js
@@ -1,9 +1,9 @@
 import { defineAsyncComponent } from 'vue'
 
-import { notificationsFromStore } from '../../services/notification_utils/notification_utils.js'
 import BasicUserCard from '../basic_user_card/basic_user_card.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { approveUser, denyUser } from 'src/api/user.js'
@@ -24,7 +24,7 @@ const FollowRequestCard = {
   },
   methods: {
     findFollowRequestNotificationId() {
-      const notif = notificationsFromStore(this.$store).find(
+      const notif = useNotificationsStore().data.find(
         (notif) =>
           notif.from_profile.id === this.user.id &&
           notif.type === 'follow_request',
@@ -55,16 +55,11 @@ const FollowRequestCard = {
         id: this.user.id,
         credentials: useOAuthStore().token,
       })
+      // TODO fix
       this.$store.dispatch('removeFollowRequest', this.user)
 
       const notifId = this.findFollowRequestNotificationId()
-      this.$store.dispatch('markSingleNotificationAsSeen', { id: notifId })
-      this.$store.dispatch('updateNotification', {
-        id: notifId,
-        updater: (notification) => {
-          notification.type = 'follow'
-        },
-      })
+      useNotificationsStore().markSingleNotificationAsSeen(notifId)
       this.hideApproveConfirmDialog()
     },
     denyUser() {
@@ -81,7 +76,8 @@ const FollowRequestCard = {
         id: this.user.id,
         credentials: useOAuthStore().token,
       }).then(() => {
-        this.$store.dispatch('dismissNotificationLocal', { id: notifId })
+        useNotificationsStore().dismissNotificationLocal(notifId)
+        // TODO fix
         this.$store.dispatch('removeFollowRequest', this.user)
       })
       this.hideDenyConfirmDialog()
diff --git a/src/components/friends_timeline/friends_timeline.js b/src/components/friends_timeline/friends_timeline.js
deleted file mode 100644
index b6bee7305..000000000
--- a/src/components/friends_timeline/friends_timeline.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const FriendsTimeline = {
-  components: {
-    Timeline,
-  },
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.friends
-    },
-  },
-}
-
-export default FriendsTimeline
diff --git a/src/components/friends_timeline/friends_timeline.vue b/src/components/friends_timeline/friends_timeline.vue
deleted file mode 100644
index 01a568123..000000000
--- a/src/components/friends_timeline/friends_timeline.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.timeline')"
-    :timeline="timeline"
-    :timeline-name="'friends'"
-  />
-</template>
-
-<script src="./friends_timeline.js"></script>
diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js
index d008c4b30..37873605f 100644
--- a/src/components/interactions/interactions.js
+++ b/src/components/interactions/interactions.js
@@ -1,6 +1,8 @@
 import Notifications from 'src/components/notifications/notifications.vue'
 import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const tabModeDict = {
   mentions: ['mention'],
   statuses: ['status'],
@@ -14,10 +16,9 @@ const tabModeDict = {
 const Interactions = {
   data() {
     return {
-      allowFollowingMove:
-        this.$store.state.users.currentUser.allow_following_move,
+      allowFollowingMove: useUsersStore().currentUser.allow_following_move,
       filterMode: tabModeDict.mentions,
-      canSeeReports: this.$store.state.users.currentUser.privileges.has(
+      canSeeReports: useUsersStore().currentUser.privileges.has(
         'reports_manage_reports',
       ),
     }
diff --git a/src/components/list/list.js b/src/components/list/list.js
index c7b924258..8abf02fd6 100644
--- a/src/components/list/list.js
+++ b/src/components/list/list.js
@@ -21,8 +21,8 @@ const List = {
       default: () => '',
     },
     preSelect: {
-      type: Array,
-      default: [],
+      type: Set,
+      default: new Set(),
     },
     nonInteractive: {
       type: Boolean,
@@ -48,7 +48,7 @@ const List = {
   data() {
     return {
       items: [],
-      selected: new Set(this.preSelect),
+      selected: new Set(this.preSelect), // clone
       loading: false,
       bottomedOut: true,
       error: null,
@@ -99,11 +99,11 @@ const List = {
       this.fetchFunction(this.page)
         .then((result) => {
           this.loading = false
-          this.bottomedOut = isEmpty(result.items)
+          this.bottomedOut = isEmpty(result)
           if (this.externalItems) return
           this.page += 1
-          this.total = result.count
-          this.items.push(...result.items)
+          this.total = result.length
+          this.items.push(...result)
         })
         .catch((error) => {
           this.loading = false
diff --git a/src/components/lists_edit/lists_edit.js b/src/components/lists_edit/lists_edit.js
index 7eb035091..cea9236a5 100644
--- a/src/components/lists_edit/lists_edit.js
+++ b/src/components/lists_edit/lists_edit.js
@@ -1,5 +1,4 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapGetters, mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 import ListsUserSearch from 'src/components/lists_user_search/lists_user_search.vue'
@@ -9,6 +8,7 @@ import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useListsStore } from 'src/stores/lists.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronLeft, faSearch } from '@fortawesome/free-solid-svg-icons'
@@ -47,8 +47,8 @@ const ListsNew = {
       .fetchListAccounts({ listId: this.id })
       .then(() => {
         this.membersUserIds = this.findListAccounts(this.id)
-        this.membersUserIds.forEach((userId) => {
-          this.$store.dispatch('fetchUserIfMissing', userId)
+        this.membersUserIds.forEach((id) => {
+          useUsersStore().fetchUserIfMissing({ id })
         })
       })
   },
@@ -66,11 +66,8 @@ const ListsNew = {
         .map((userId) => this.findUser(userId))
         .filter(Boolean)
     },
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
-    ...mapPiniaState(useListsStore, ['findListTitle', 'findListAccounts']),
-    ...mapGetters(['findUser']),
+    ...mapState(useUsersStore, ['currentUser', 'findUser']),
+    ...mapState(useListsStore, ['findListTitle', 'findListAccounts']),
   },
   methods: {
     onInput() {
diff --git a/src/components/lists_menu/lists_menu_content.js b/src/components/lists_menu/lists_menu_content.js
index 337ee4d4f..7c422d033 100644
--- a/src/components/lists_menu/lists_menu_content.js
+++ b/src/components/lists_menu/lists_menu_content.js
@@ -1,10 +1,10 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import { getListEntries } from 'src/components/navigation/filter.js'
 import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
 
 import { useListsStore } from 'src/stores/lists.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 export const ListsMenuContent = {
   props: ['showPin'],
@@ -12,12 +12,10 @@ export const ListsMenuContent = {
     NavigationEntry,
   },
   computed: {
-    ...mapPiniaState(useListsStore, {
+    ...mapState(useListsStore, {
       lists: getListEntries,
     }),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useUsersStore, ['currentUser']),
   },
 }
 
diff --git a/src/components/lists_timeline/lists_timeline.js b/src/components/lists_timeline/lists_timeline.js
deleted file mode 100644
index a06220a37..000000000
--- a/src/components/lists_timeline/lists_timeline.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-import { useListsStore } from 'src/stores/lists.js'
-
-const ListsTimeline = {
-  data() {
-    return {
-      listId: null,
-    }
-  },
-  components: {
-    Timeline,
-  },
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.list
-    },
-  },
-  watch: {
-    $route: function (route) {
-      if (route.name === 'lists-timeline' && route.params.id !== this.listId) {
-        this.listId = route.params.id
-        this.$store.dispatch('stopFetchingTimeline', 'list')
-        this.$store.commit('clearTimeline', { timeline: 'list' })
-        useListsStore().fetchList({ listId: this.listId })
-        this.$store.dispatch('startFetchingTimeline', {
-          timeline: 'list',
-          listId: this.listId,
-        })
-      }
-    },
-  },
-  created() {
-    this.listId = this.$route.params.id
-    useListsStore().fetchList({ listId: this.listId })
-    this.$store.dispatch('startFetchingTimeline', {
-      timeline: 'list',
-      listId: this.listId,
-    })
-  },
-  unmounted() {
-    this.$store.dispatch('stopFetchingTimeline', 'list')
-    this.$store.commit('clearTimeline', { timeline: 'list' })
-  },
-}
-
-export default ListsTimeline
diff --git a/src/components/lists_timeline/lists_timeline.vue b/src/components/lists_timeline/lists_timeline.vue
deleted file mode 100644
index 18156b812..000000000
--- a/src/components/lists_timeline/lists_timeline.vue
+++ /dev/null
@@ -1,10 +0,0 @@
-<template>
-  <Timeline
-    title="list.name"
-    :timeline="timeline"
-    :list-id="listId"
-    timeline-name="list"
-  />
-</template>
-
-<script src="./lists_timeline.js"></script>
diff --git a/src/components/lists_user_search/lists_user_search.js b/src/components/lists_user_search/lists_user_search.js
index aed3f1ce7..22568135a 100644
--- a/src/components/lists_user_search/lists_user_search.js
+++ b/src/components/lists_user_search/lists_user_search.js
@@ -2,6 +2,8 @@ import { debounce } from 'lodash'
 
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 
+import { useSearchStore } from 'src/stores/search.js'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronLeft, faSearch } from '@fortawesome/free-solid-svg-icons'
 
@@ -32,8 +34,8 @@ const ListsUserSearch = {
       this.loading = true
       this.$emit('loading')
       this.userIds = []
-      this.$store
-        .dispatch('search', {
+      useSearchStore()
+        .search({
           q: query,
           resolve: true,
           type: 'accounts',
diff --git a/src/components/login_form/login_form.js b/src/components/login_form/login_form.js
index 6c2750677..8801d2c2e 100644
--- a/src/components/login_form/login_form.js
+++ b/src/components/login_form/login_form.js
@@ -1,9 +1,9 @@
-import { mapActions, mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapActions, mapState } 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 { useUsersStore } from 'src/stores/users.js'
 
 import { getLoginUrl, getTokenWithCredentials } from 'src/api/oauth.js'
 
@@ -18,12 +18,10 @@ const LoginForm = {
     error: false,
   }),
   computed: {
-    ...mapState({
-      loggingIn: (state) => state.users.loggingIn,
-    }),
-    ...mapPiniaState(useOAuthStore, ['clientId', 'clientSecret']),
-    ...mapPiniaState(useInstanceStore, ['server', 'registrationOpen']),
-    ...mapPiniaState(useAuthFlowStore, {
+    ...mapState(useUsersStore, ['loggingIn']),
+    ...mapState(useOAuthStore, ['clientId', 'clientSecret']),
+    ...mapState(useInstanceStore, ['server', 'registrationOpen']),
+    ...mapState(useAuthFlowStore, {
       isTokenAuth: (store) => store.requiredToken,
       isPasswordAuth: (store) => !store.requiredToken,
     }),
diff --git a/src/components/mention_link/mention_link.js b/src/components/mention_link/mention_link.js
index 0309079e8..5db90ab41 100644
--- a/src/components/mention_link/mention_link.js
+++ b/src/components/mention_link/mention_link.js
@@ -1,5 +1,4 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import UnicodeDomainIndicator from 'src/components/unicode_domain_indicator/unicode_domain_indicator.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
@@ -12,6 +11,7 @@ import {
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
@@ -29,7 +29,7 @@ const MentionLink = {
   },
   props: {
     url: {
-      required: true,
+      required: false,
       type: String,
     },
     content: {
@@ -75,11 +75,11 @@ const MentionLink = {
   },
   computed: {
     user() {
-      return this.url && this.$store?.getters.findUserByUrl(this.url)
+      return this.url ? useUsersStore().findUserByUrl(this.url) : null
     },
     isYou() {
-      // FIXME why user !== currentUser???
-      return this.user?.id === this.currentUser.id
+      if (!this.currentUser) return false
+      return this.user === this.currentUser
     },
     userName() {
       return this.user && this.userNameFullUi.split('@')[0]
@@ -156,11 +156,9 @@ const MentionLink = {
     shouldFadeDomain() {
       return this.mergedConfig.mentionLinkFadeDomain
     },
-    ...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
-    ...mapPiniaState(useUserHighlightStore, ['highlight']),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useMergedConfigStore, ['mergedConfig']),
+    ...mapState(useUserHighlightStore, ['highlight']),
+    ...mapState(useUsersStore, ['currentUser']),
   },
 }
 
diff --git a/src/components/mention_link/mention_link.vue b/src/components/mention_link/mention_link.vue
index 0452cad58..33f0d9db7 100644
--- a/src/components/mention_link/mention_link.vue
+++ b/src/components/mention_link/mention_link.vue
@@ -31,7 +31,7 @@
           <UserAvatar
             v-if="shouldShowAvatar"
             class="mention-avatar"
-            :user="user"
+            :user-id="user.id"
           /><span
             class="shortName"
           >@<span
diff --git a/src/components/mentions/mentions.js b/src/components/mentions/mentions.js
deleted file mode 100644
index 48e06a950..000000000
--- a/src/components/mentions/mentions.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const Mentions = {
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.mentions
-    },
-  },
-  components: {
-    Timeline,
-  },
-}
-
-export default Mentions
diff --git a/src/components/mentions/mentions.vue b/src/components/mentions/mentions.vue
deleted file mode 100644
index 70f60bafe..000000000
--- a/src/components/mentions/mentions.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.interactions')"
-    :timeline="timeline"
-    :timeline-name="'mentions'"
-  />
-</template>
-
-<script src="./mentions.js"></script>
diff --git a/src/components/mobile_nav/mobile_nav.js b/src/components/mobile_nav/mobile_nav.js
index 4eb956f64..97645ca73 100644
--- a/src/components/mobile_nav/mobile_nav.js
+++ b/src/components/mobile_nav/mobile_nav.js
@@ -5,13 +5,15 @@ import NavigationPins from 'src/components/navigation/navigation_pins.vue'
 import GestureService from '../../services/gesture_service/gesture_service'
 import {
   countExtraNotifications,
-  unseenNotificationsFromStore,
+  unseenNotifications,
 } from '../../services/notification_utils/notification_utils'
 
 import { useAnnouncementsStore } from 'src/stores/announcements.js'
 import { useChatsStore } from 'src/stores/chats.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -53,11 +55,10 @@ const MobileNav = {
   },
   computed: {
     currentUser() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     unseenNotifications() {
-      return unseenNotificationsFromStore(
-        this.$store,
+      return unseenNotifications(
         useMergedConfigStore().mergedConfig.notificationVisibility,
         useMergedConfigStore().mergedConfig.ignoreInactionableSeen,
       )
@@ -144,12 +145,12 @@ const MobileNav = {
       }
     },
     doLogout() {
-      this.$router.replace('/main/public')
-      this.$store.dispatch('logout')
+      useUsersStore().logout()
       this.hideConfirmLogout()
+      this.$router.replace('/main/public')
     },
     markNotificationsAsSeen() {
-      this.$store.dispatch('markNotificationsAsSeen')
+      useNotificationsStore().markNotificationsAsSeen()
     },
     onScroll({ target: { scrollTop, clientHeight, scrollHeight } }) {
       this.notificationsAtTop = scrollTop > 0
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 4969352f6..0ffab6f78 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
@@ -1,7 +1,9 @@
 import { debounce } from 'lodash'
+import { mapState } from 'pinia'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { usePostStatusStore } from 'src/stores/post_status.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faPen } from '@fortawesome/free-solid-svg-icons'
@@ -33,9 +35,6 @@ const MobilePostStatusButton = {
     window.removeEventListener('resize', this.handleOSK)
   },
   computed: {
-    isLoggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
     isHidden() {
       if (HIDDEN_FOR_PAGES.has(this.$route.name)) {
         return true
@@ -51,6 +50,7 @@ const MobilePostStatusButton = {
     autohideFloatingPostButton() {
       return !!useMergedConfigStore().mergedConfig.autohideFloatingPostButton
     },
+    ...mapState(useUsersStore, ['loggedIn']),
   },
   watch: {
     autohideFloatingPostButton: function (isEnabled) {
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 32079c298..8b11f12d4 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,6 +1,6 @@
 <template>
   <button
-    v-if="isLoggedIn"
+    v-if="loggedIn"
     class="MobilePostButton button-default new-status-button"
     :class="{ 'hidden': isHidden, 'always-show': isPersistent }"
     :title="$t('post_status.new_status')"
diff --git a/src/components/moderation_tools/moderation_tools.js b/src/components/moderation_tools/moderation_tools.js
index 886ae9e0c..9b948e306 100644
--- a/src/components/moderation_tools/moderation_tools.js
+++ b/src/components/moderation_tools/moderation_tools.js
@@ -5,6 +5,7 @@ import Popover from 'src/components/popover/popover.vue'
 
 import { useAdminSettingsStore } from 'src/stores/admin_settings.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronDown } from '@fortawesome/free-solid-svg-icons'
@@ -405,7 +406,7 @@ const ModerationTools = {
       )
     },
     isAdmin() {
-      return this.$store.state.users.currentUser.role === 'admin'
+      return useUsersStore().currentUser.role === 'admin'
     },
   },
   methods: {
@@ -452,7 +453,7 @@ const ModerationTools = {
     },
     privileged(privilege) {
       if (this.isAdmin) return true
-      return this.$store.state.users.currentUser.privileges.has(privilege)
+      return useUsersStore().currentUser.privileges.has(privilege)
     },
     setTag(tag, value) {
       useAdminSettingsStore().setUsersTags({
diff --git a/src/components/mute_card/mute_card.js b/src/components/mute_card/mute_card.js
index 0d247930a..ca14eb9ca 100644
--- a/src/components/mute_card/mute_card.js
+++ b/src/components/mute_card/mute_card.js
@@ -1,14 +1,16 @@
 import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 import UserTimedFilterModal from 'src/components/user_timed_filter_modal/user_timed_filter_modal.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const MuteCard = {
   props: ['userId'],
   computed: {
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     relationship() {
-      return this.$store.getters.relationship(this.userId)
+      return useUsersStore().relationship(this.userId)
     },
     muted() {
       return this.relationship.muting
@@ -30,7 +32,7 @@ const MuteCard = {
   },
   methods: {
     unmuteUser() {
-      this.$store.dispatch('unmuteUser', this.userId)
+      useUsersStore().unmuteUser(this.user.id)
     },
     muteUser() {
       this.$refs.timedMuteDialog.optionallyPrompt()
diff --git a/src/components/nav_panel/nav_panel.js b/src/components/nav_panel/nav_panel.js
index 5a4a78ec4..c3e760efb 100644
--- a/src/components/nav_panel/nav_panel.js
+++ b/src/components/nav_panel/nav_panel.js
@@ -1,5 +1,5 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
+import { mapState as mapVuexState } from 'vuex'
 
 import BookmarkFoldersMenuContent from 'src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue'
 import Checkbox from 'src/components/checkbox/checkbox.vue'
@@ -14,6 +14,7 @@ import { useChatsStore } from 'src/stores/chats.js'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -110,29 +111,29 @@ const NavPanel = {
     },
   },
   computed: {
-    ...mapPiniaState(useAnnouncementsStore, {
+    ...mapState(useAnnouncementsStore, {
       unreadAnnouncementCount: 'unreadAnnouncementCount',
       supportsAnnouncements: (store) => store.supportsAnnouncements,
     }),
-    ...mapPiniaState(useInstanceCapabilitiesStore, [
+    ...mapState(useInstanceCapabilitiesStore, [
       'pleromaChatMessagesAvailable',
       'pleromaBookmarkFoldersAvailable',
       'localBubble',
     ]),
-    ...mapPiniaState(useInstanceStore, ['federating']),
-    ...mapPiniaState(useInstanceStore, {
+    ...mapState(useInstanceStore, ['federating']),
+    ...mapState(useInstanceStore, {
       privateMode: (store) => store.private,
     }),
-    ...mapPiniaState(useSyncConfigStore, {
+    ...mapState(useSyncConfigStore, {
       collapsed: (store) => store.prefsStorage.simple.collapseNav,
       pinnedItems: (store) =>
         new Set(store.prefsStorage.collections.pinnedNavItems),
     }),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
+    ...mapState(useUsersStore, ['currentUser']),
+    ...mapVuexState({
       followRequestCount: (state) => state.api.followRequests.length,
     }),
-    ...mapPiniaState(useChatsStore, ['unreadChatsCount']),
+    ...mapState(useChatsStore, ['unreadChatsCount']),
     timelinesItems() {
       return filterNavigation(
         Object.entries({ ...TIMELINES })
diff --git a/src/components/navigation/navigation_entry.js b/src/components/navigation/navigation_entry.js
index 7a43000ce..31bc28eb5 100644
--- a/src/components/navigation/navigation_entry.js
+++ b/src/components/navigation/navigation_entry.js
@@ -1,11 +1,11 @@
-import { mapState as mapPiniaState, mapStores } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState, mapStores } from 'pinia'
 
 import { routeTo } from 'src/components/navigation/navigation.js'
 import OptionalRouterLink from 'src/components/optional_router_link/optional_router_link.vue'
 
 import { useAnnouncementsStore } from 'src/stores/announcements.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faThumbtack } from '@fortawesome/free-solid-svg-icons'
@@ -44,10 +44,8 @@ const NavigationEntry = {
       return this.$store.getters
     },
     ...mapStores(useAnnouncementsStore),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
-    ...mapPiniaState(useSyncConfigStore, {
+    ...mapState(useUsersStore, ['currentUser']),
+    ...mapState(useSyncConfigStore, {
       pinnedItems: (store) =>
         new Set(store.prefsStorage.collections.pinnedNavItems),
     }),
diff --git a/src/components/navigation/navigation_pins.js b/src/components/navigation/navigation_pins.js
index c3649e4b3..2efa94ee4 100644
--- a/src/components/navigation/navigation_pins.js
+++ b/src/components/navigation/navigation_pins.js
@@ -1,5 +1,5 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
+import { mapState as mapVuexState } from 'vuex'
 
 import {
   filterNavigation,
@@ -18,6 +18,7 @@ import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useListsStore } from 'src/stores/lists'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -58,26 +59,26 @@ const NavPanel = {
     getters() {
       return this.$store.getters
     },
-    ...mapPiniaState(useListsStore, {
+    ...mapState(useListsStore, {
       lists: getListEntries,
     }),
-    ...mapPiniaState(useAnnouncementsStore, {
+    ...mapState(useAnnouncementsStore, {
       supportsAnnouncements: (store) => store.supportsAnnouncements,
     }),
-    ...mapPiniaState(useBookmarkFoldersStore, {
+    ...mapState(useBookmarkFoldersStore, {
       bookmarks: getBookmarkFolderEntries,
     }),
-    ...mapPiniaState(useSyncConfigStore, {
+    ...mapState(useSyncConfigStore, {
       pinnedItems: (store) =>
         new Set(store.prefsStorage.collections.pinnedNavItems),
     }),
-    ...mapPiniaState(useInstanceStore, ['privateMode', 'federating']),
-    ...mapPiniaState(useInstanceCapabilitiesStore, [
+    ...mapState(useInstanceStore, ['privateMode', 'federating']),
+    ...mapState(useInstanceCapabilitiesStore, [
       'pleromaChatMessagesAvailable',
       'localBubble',
     ]),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
+    ...mapState(useUsersStore, ['currentUser']),
+    ...mapVuexState({
       followRequestCount: (state) => state.api.followRequests.length,
     }),
     pinnedList() {
diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js
index 1bfe540a0..3c82f455c 100644
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@@ -1,5 +1,5 @@
+import { mapState } from 'pinia'
 import { defineAsyncComponent } from 'vue'
-import { mapState } from 'vuex'
 
 import Report from 'src/components/report/report.vue'
 import StatusContent from 'src/components/status_content/status_content.vue'
@@ -7,7 +7,7 @@ import Timeago from 'src/components/timeago/timeago.vue'
 import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 import UserLink from 'src/components/user_link/user_link.vue'
 import UserPopover from 'src/components/user_popover/user_popover.vue'
-import { isStatusNotification } from '../../services/notification_utils/notification_utils.js'
+import { isStatusNotification } from '../../services/notification_utils/notification_utils_sw.js'
 import {
   highlightClass,
   highlightStyle,
@@ -15,8 +15,11 @@ import {
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { approveUser, denyUser } from 'src/api/user.js'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
@@ -115,9 +118,6 @@ const Notification = {
         useInstanceStore().restrictedNicknames,
       )
     },
-    getUser(notification) {
-      return this.$store.state.users.usersObject[notification.from_profile.id]
-    },
     interacted() {
       this.$emit('interacted')
     },
@@ -148,16 +148,9 @@ const Notification = {
         id: this.user.id,
         credentials: useOAuthStore().token,
       })
+      // TODO Fix this
       this.$store.dispatch('removeFollowRequest', this.user)
-      this.$store.dispatch('markSingleNotificationAsSeen', {
-        id: this.notification.id,
-      })
-      this.$store.dispatch('updateNotification', {
-        id: this.notification.id,
-        updater: (notification) => {
-          notification.type = 'follow'
-        },
-      })
+      useNotificationsStore().markSingleNotificationAsSeen(this.notification.id)
       this.hideApproveConfirmDialog()
     },
     denyUser() {
@@ -172,15 +165,20 @@ const Notification = {
         id: this.user.id,
         credentials: useOAuthStore().token,
       }).then(() => {
-        this.$store.dispatch('dismissNotificationLocal', {
-          id: this.notification.id,
-        })
+        useNotificationsStore().dismissNotificationLocal(this.notification.id)
+        // TODO Fix this
         this.$store.dispatch('removeFollowRequest', this.user)
       })
       this.hideDenyConfirmDialog()
     },
   },
   computed: {
+    status() {
+      // Used for StatusContent
+      if (this.notification.status) {
+        return useStatusesStore().allStatuses.get(this.notification.status.id)
+      }
+    },
     userClass() {
       return highlightClass(this.notification.from_profile)
     },
@@ -194,19 +192,19 @@ const Notification = {
       )
     },
     user() {
-      return this.$store.getters.findUser(this.notification.from_profile.id)
+      return useUsersStore().findUser(this.notification.from_profile.id)
     },
     userProfileLink() {
       return this.generateUserProfileLink(this.user)
     },
     targetUser() {
-      return this.$store.getters.findUser(this.notification.target.id)
+      return useUsersStore().findUser(this.notification.target.id)
     },
     targetUserProfileLink() {
       return this.generateUserProfileLink(this.targetUser)
     },
     needMute() {
-      return this.$store.getters.relationship(this.user.id).muting
+      return useUsersStore().relationship(this.user.id).muting
     },
     isStatusNotification() {
       return isStatusNotification(this.notification.type)
@@ -229,9 +227,7 @@ const Notification = {
     shouldConfirmDeny() {
       return this.mergedConfig.modalOnDenyFollow
     },
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useUsersStore, ['currentUser']),
   },
 }
 
diff --git a/src/components/notification/notification.vue b/src/components/notification/notification.vue
index c526eef79..601e574db 100644
--- a/src/components/notification/notification.vue
+++ b/src/components/notification/notification.vue
@@ -6,7 +6,7 @@
     <Status
       class="Notification panel-body"
       :compact="true"
-      :statusoid="notification.status"
+      :status-id="notification.status?.id"
       @click="interacted"
     />
   </article>
@@ -24,7 +24,7 @@
       class="Notification container -muted"
     >
       <small>
-        <user-link
+        <UserLink
           :user="notification.from_profile"
           :at="false"
         />
@@ -57,7 +57,7 @@
           <UserAvatar
             class="post-avatar"
             :compact="true"
-            :user="notification.from_profile"
+            :user-id="notification.from_profile.id"
           />
         </UserPopover>
       </a>
@@ -215,7 +215,7 @@
           v-if="notification.type === 'follow' || notification.type === 'follow_request'"
           class="follow-text"
         >
-          <user-link
+          <UserLink
             class="follow-name"
             :user="notification.from_profile"
           />
@@ -249,7 +249,7 @@
           v-else-if="notification.type === 'move'"
           class="move-text"
         >
-          <user-link
+          <UserLink
             :user="notification.target"
           />
         </div>
@@ -261,7 +261,7 @@
           <StatusContent
             class="status-content"
             :compact="!statusExpanded"
-            :status="notification.status"
+            :status="status"
             :collapse="!statusExpanded"
             @click="onContentClick"
           />
diff --git a/src/components/notifications/notifications.js b/src/components/notifications/notifications.js
index feb59857e..2272c78af 100644
--- a/src/components/notifications/notifications.js
+++ b/src/components/notifications/notifications.js
@@ -7,17 +7,16 @@ import FaviconService from '../../services/favicon_service/favicon_service.js'
 import {
   ACTIONABLE_NOTIFICATION_TYPES,
   countExtraNotifications,
-  filteredNotificationsFromStore,
-  notificationsFromStore,
-  unseenNotificationsFromStore,
+  filteredNotifications,
+  unseenNotifications,
 } from '../../services/notification_utils/notification_utils.js'
-import notificationsFetcher from '../../services/notifications_fetcher/notifications_fetcher.service.js'
 import NotificationFilters from './notification_filters.vue'
 
 import { useAnnouncementsStore } from 'src/stores/announcements.js'
 import { useChatsStore } from 'src/stores/chats.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -53,7 +52,6 @@ const Notifications = {
   data() {
     return {
       showScrollTop: false,
-      bottomedOut: false,
       // How many seen notifications to display in the list. The more there are,
       // the heavier the page becomes. This count is increased when loading
       // older notifications, and cut back to default whenever hitting "Read!".
@@ -70,14 +68,13 @@ const Notifications = {
       return this.minimalMode ? '' : 'panel panel-default'
     },
     notifications() {
-      return notificationsFromStore(this.$store)
+      return useNotificationsStore().data
     },
     error() {
-      return this.$store.state.notifications.error
+      return useNotificationsStore().error
     },
     unseenNotifications() {
-      return unseenNotificationsFromStore(
-        this.$store,
+      return unseenNotifications(
         useMergedConfigStore().mergedConfig.notificationVisibility,
         useMergedConfigStore().mergedConfig.ignoreInactionableSeen,
       )
@@ -85,18 +82,15 @@ const Notifications = {
     filteredNotifications() {
       if (this.unseenAtTop) {
         return [
-          ...filteredNotificationsFromStore(
-            this.$store,
+          ...filteredNotifications(
             useMergedConfigStore().mergedConfig.notificationVisibility,
           ).filter((n) => this.shouldShowUnseen(n)),
-          ...filteredNotificationsFromStore(
-            this.$store,
+          ...filteredNotifications(
             useMergedConfigStore().mergedConfig.notificationVisibility,
           ).filter((n) => !this.shouldShowUnseen(n)),
         ]
       } else {
-        return filteredNotificationsFromStore(
-          this.$store,
+        return filteredNotifications(
           useMergedConfigStore().mergedConfig.notificationVisibility,
           this.filterMode,
         )
@@ -127,7 +121,10 @@ const Notifications = {
       )
     },
     loading() {
-      return this.$store.state.notifications.loading
+      return useNotificationsStore().fetcher.loading
+    },
+    bottomedOut() {
+      return useNotificationsStore().fetcher.bottomedOut
     },
     noHeading() {
       const { layoutType } = useInterfaceStore()
@@ -224,14 +221,14 @@ const Notifications = {
      */
     notificationClicked(notification) {
       const { id } = notification
-      this.$store.dispatch('notificationClicked', { id })
+      useNotificationsStore().notificationClicked(id)
     },
     notificationInteracted(notification) {
       const { id } = notification
-      this.$store.dispatch('markSingleNotificationAsSeen', { id })
+      useNotificationsStore().markSingleNotificationAsSeen(id)
     },
     markAsSeen() {
-      this.$store.dispatch('markNotificationsAsSeen')
+      useNotificationsStore().markNotificationsAsSeen()
       this.seenToDisplayCount = DEFAULT_SEEN_TO_DISPLAY_COUNT
     },
     fetchOlderNotifications() {
@@ -250,22 +247,7 @@ const Notifications = {
         this.seenToDisplayCount = seenCount
       }
 
-      const store = this.$store
-      const credentials = store.state.users.currentUser.credentials
-      store.commit('setNotificationsLoading', { value: true })
-      notificationsFetcher
-        .fetchAndUpdate({
-          store,
-          credentials,
-          older: true,
-        })
-        .then((notifs) => {
-          store.commit('setNotificationsLoading', { value: false })
-          if (notifs.length === 0) {
-            this.bottomedOut = true
-          }
-          this.seenToDisplayCount += notifs.length
-        })
+      useNotificationsStore().fetcher.fetchOlder()
     },
   },
 }
diff --git a/src/components/oauth_callback/oauth_callback.js b/src/components/oauth_callback/oauth_callback.js
index 04f79425e..824ab7bda 100644
--- a/src/components/oauth_callback/oauth_callback.js
+++ b/src/components/oauth_callback/oauth_callback.js
@@ -1,5 +1,6 @@
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { getToken } from 'src/api/oauth.js'
 
@@ -15,9 +16,10 @@ const oac = {
         clientSecret,
         instance: useInstanceStore().server,
         code: this.code,
-      }).then(({ data: result }) => {
+      }).then(async ({ data: result }) => {
         oauthStore.setToken(result.access_token)
-        this.$store.dispatch('loginUser', result.access_token)
+
+        await useUsersStore().loginUser(result.access_token)
         this.$router.push({ name: 'friends' })
       })
     }
diff --git a/src/components/password_reset/password_reset.js b/src/components/password_reset/password_reset.js
index b2e6e1093..54ad5c194 100644
--- a/src/components/password_reset/password_reset.js
+++ b/src/components/password_reset/password_reset.js
@@ -1,7 +1,7 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { resetPassword } from 'src/api/public.js'
 
@@ -21,13 +21,11 @@ const passwordReset = {
     error: null,
   }),
   computed: {
-    ...mapState({
-      signedIn: (state) => !!state.users.currentUser,
-    }),
-    ...mapPiniaState(useInstanceStore, ['mailerEnabled']),
+    ...mapState(useUsersStore, ['loggedIn']),
+    ...mapState(useInstanceStore, ['mailerEnabled']),
   },
   created() {
-    if (this.signedIn) {
+    if (this.loggedIn) {
       this.$router.push({ name: 'root' })
     }
   },
diff --git a/src/components/poll/poll.js b/src/components/poll/poll.js
index 0ce304a0a..ace31e8b8 100644
--- a/src/components/poll/poll.js
+++ b/src/components/poll/poll.js
@@ -5,6 +5,7 @@ import genRandomSeed from '../../services/random_seed/random_seed.service.js'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { usePollsStore } from 'src/stores/polls.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 export default {
   name: 'Poll',
@@ -64,7 +65,7 @@ export default {
       return useMergedConfigStore().mergedConfig.scaleMfm
     },
     loggedIn() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     showResults() {
       return this.poll.voted || this.expired || !this.loggedIn
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js
index ef012c9cf..4fb6f4746 100644
--- a/src/components/post_status_form/post_status_form.js
+++ b/src/components/post_status_form/post_status_form.js
@@ -31,6 +31,7 @@ import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMediaViewerStore } from 'src/stores/media_viewer.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { pollFormToMasto } from 'src/services/poll/poll.service.js'
 
@@ -570,9 +571,7 @@ const PostStatusForm = {
     },
 
     // Global stuff
-    currentUser() {
-      return this.$store.state.users.currentUser
-    },
+    ...mapState(useUsersStore, ['currentUser']),
     ...mapState(useMergedConfigStore, ['mergedConfig']),
     ...mapState(useInterfaceStore, {
       mobileLayout: (store) => store.mobileLayout,
diff --git a/src/components/post_status_modal/post_status_modal.js b/src/components/post_status_modal/post_status_modal.js
index e7001db9a..b241d913c 100644
--- a/src/components/post_status_modal/post_status_modal.js
+++ b/src/components/post_status_modal/post_status_modal.js
@@ -1,9 +1,11 @@
 import { get } from 'lodash'
+import { mapState } from 'pinia'
 
 import Modal from 'src/components/modal/modal.vue'
 import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
 
 import { usePostStatusStore } from 'src/stores/post_status.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const PostStatusModal = {
   components: {
@@ -16,18 +18,16 @@ const PostStatusModal = {
     }
   },
   computed: {
-    isLoggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
     modalActivated() {
       return usePostStatusStore().modalActivated
     },
     isFormVisible() {
-      return this.isLoggedIn && !this.resettingForm && this.modalActivated
+      return this.loggedIn && !this.resettingForm && this.modalActivated
     },
     params() {
       return usePostStatusStore().params || {}
     },
+    ...mapState(useUsersStore, ['loggedIn']),
   },
   watch: {
     params(newVal, oldVal) {
diff --git a/src/components/post_status_modal/post_status_modal.vue b/src/components/post_status_modal/post_status_modal.vue
index 919273c34..8a9be3dae 100644
--- a/src/components/post_status_modal/post_status_modal.vue
+++ b/src/components/post_status_modal/post_status_modal.vue
@@ -1,6 +1,6 @@
 <template>
   <Modal
-    v-if="isLoggedIn && !resettingForm"
+    v-if="loggedIn && !resettingForm"
     :is-open="modalActivated"
     class="post-form-modal-view"
     @backdrop-clicked="closeModal"
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
deleted file mode 100644
index 6dc8df02a..000000000
--- a/src/components/public_and_external_timeline/public_and_external_timeline.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const PublicAndExternalTimeline = {
-  components: {
-    Timeline,
-  },
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.publicAndExternal
-    },
-  },
-  created() {
-    this.$store.dispatch('startFetchingTimeline', {
-      timeline: 'publicAndExternal',
-    })
-  },
-  unmounted() {
-    this.$store.dispatch('stopFetchingTimeline', 'publicAndExternal')
-  },
-}
-
-export default PublicAndExternalTimeline
diff --git a/src/components/public_and_external_timeline/public_and_external_timeline.vue b/src/components/public_and_external_timeline/public_and_external_timeline.vue
deleted file mode 100644
index fcd915acb..000000000
--- a/src/components/public_and_external_timeline/public_and_external_timeline.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.twkn')"
-    :timeline="timeline"
-    :timeline-name="'publicAndExternal'"
-  />
-</template>
-
-<script src="./public_and_external_timeline.js"></script>
diff --git a/src/components/public_timeline/public_timeline.js b/src/components/public_timeline/public_timeline.js
deleted file mode 100644
index bbeae47af..000000000
--- a/src/components/public_timeline/public_timeline.js
+++ /dev/null
@@ -1,20 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const PublicTimeline = {
-  components: {
-    Timeline,
-  },
-  computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.public
-    },
-  },
-  created() {
-    this.$store.dispatch('startFetchingTimeline', { timeline: 'public' })
-  },
-  unmounted() {
-    this.$store.dispatch('stopFetchingTimeline', 'public')
-  },
-}
-
-export default PublicTimeline
diff --git a/src/components/public_timeline/public_timeline.vue b/src/components/public_timeline/public_timeline.vue
deleted file mode 100644
index 5720068df..000000000
--- a/src/components/public_timeline/public_timeline.vue
+++ /dev/null
@@ -1,9 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.public_tl')"
-    :timeline="timeline"
-    :timeline-name="'public'"
-  />
-</template>
-
-<script src="./public_timeline.js"></script>
diff --git a/src/components/quick_filter_settings/quick_filter_settings.js b/src/components/quick_filter_settings/quick_filter_settings.js
index 6c27f7e0a..13e97452e 100644
--- a/src/components/quick_filter_settings/quick_filter_settings.js
+++ b/src/components/quick_filter_settings/quick_filter_settings.js
@@ -6,6 +6,8 @@ import { useInterfaceStore } from 'src/stores/interface.js'
 import { useLocalConfigStore } from 'src/stores/local_config.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faFilter, faFont, faWrench } from '@fortawesome/free-solid-svg-icons'
@@ -26,13 +28,14 @@ const QuickFilterSettings = {
         path: 'replyVisibility',
         value: visibility,
       })
-      this.$store.dispatch('queueFlushAll')
+      useTimelinesStore().requireReloadAll()
     },
     openTab(tab) {
       useInterfaceStore().openSettingsModalTab(tab)
     },
   },
   computed: {
+    ...mapState(useUsersStore, ['loggedIn']),
     ...mapState(useMergedConfigStore, ['mergedConfig']),
     ...mapState(useInterfaceStore, {
       mobileLayout: (state) => state.layoutType === 'mobile',
@@ -53,9 +56,6 @@ const QuickFilterSettings = {
         return 'dropdown-item'
       }
     },
-    loggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
     replyVisibilitySelf: {
       get() {
         return this.mergedConfig.replyVisibility === 'self'
diff --git a/src/components/quick_view_settings/quick_view_settings.js b/src/components/quick_view_settings/quick_view_settings.js
index f809d241c..8dac64579 100644
--- a/src/components/quick_view_settings/quick_view_settings.js
+++ b/src/components/quick_view_settings/quick_view_settings.js
@@ -6,6 +6,7 @@ import QuickFilterSettings from 'src/components/quick_filter_settings/quick_filt
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -35,9 +36,7 @@ const QuickViewSettings = {
     ...mapState(useInterfaceStore, {
       mobileLayout: (state) => state.layoutType === 'mobile',
     }),
-    loggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
+    ...mapState(useUsersStore, ['loggedIn']),
     conversationDisplay: {
       get() {
         return this.mergedConfig.conversationDisplay
diff --git a/src/components/quote/quote.js b/src/components/quote/quote.js
index 439d3440a..1f230b488 100644
--- a/src/components/quote/quote.js
+++ b/src/components/quote/quote.js
@@ -1,3 +1,5 @@
+import { useStatusesStore } from 'src/stores/statuses.js'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
 
@@ -45,7 +47,7 @@ export default {
   computed: {
     quotedStatus() {
       return this.statusId
-        ? this.$store.state.statuses.allStatusesObject[this.statusId]
+        ? useStatusesStore().allStatuses.get(this.statusId)
         : undefined
     },
     shouldDisplayQuote() {
@@ -79,8 +81,8 @@ export default {
       this.fetchAttempted = true
       this.fetching = true
       this.$emit('loading', true)
-      this.$store
-        .dispatch('fetchStatus', this.statusId)
+      useStatusesStore()
+        .fetchStatus(this.statusId)
         .then(() => {
           this.displayQuote = true
         })
diff --git a/src/components/quote/quote_form.js b/src/components/quote/quote_form.js
index b350fb0e3..700119be8 100644
--- a/src/components/quote/quote_form.js
+++ b/src/components/quote/quote_form.js
@@ -4,6 +4,7 @@ import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Quote from './quote.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useSearchStore } from 'src/stores/search.js'
 
 export default {
   components: {
@@ -93,8 +94,8 @@ export default {
         this.$emit('update:id', notice[3])
       } else if (value) {
         this.loading = true
-        this.$store
-          .dispatch('search', {
+        useSearchStore()
+          .search({
             q: value,
             resolve: true,
             offset: 0,
diff --git a/src/components/quotes_timeline/quotes_timeline.js b/src/components/quotes_timeline/quotes_timeline.js
deleted file mode 100644
index f92f109be..000000000
--- a/src/components/quotes_timeline/quotes_timeline.js
+++ /dev/null
@@ -1,36 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const QuotesTimeline = {
-  created() {
-    this.$store.commit('clearTimeline', { timeline: 'quotes' })
-    this.$store.dispatch('startFetchingTimeline', {
-      timeline: 'quotes',
-      statusId: this.statusId,
-    })
-  },
-  components: {
-    Timeline,
-  },
-  computed: {
-    statusId() {
-      return this.$route.params.id
-    },
-    timeline() {
-      return this.$store.state.statuses.timelines.quotes
-    },
-  },
-  watch: {
-    statusId() {
-      this.$store.commit('clearTimeline', { timeline: 'quotes' })
-      this.$store.dispatch('startFetchingTimeline', {
-        timeline: 'quotes',
-        statusId: this.statusId,
-      })
-    },
-  },
-  unmounted() {
-    this.$store.dispatch('stopFetchingTimeline', 'quotes')
-  },
-}
-
-export default QuotesTimeline
diff --git a/src/components/quotes_timeline/quotes_timeline.vue b/src/components/quotes_timeline/quotes_timeline.vue
deleted file mode 100644
index 835abd12e..000000000
--- a/src/components/quotes_timeline/quotes_timeline.vue
+++ /dev/null
@@ -1,10 +0,0 @@
-<template>
-  <Timeline
-    :title="$t('nav.quotes')"
-    :timeline="timeline"
-    :timeline-name="'quotes'"
-    :status-id="statusId"
-  />
-</template>
-
-<script src='./quotes_timeline.js'></script>
diff --git a/src/components/registration/registration.js b/src/components/registration/registration.js
index ea07c662b..1dbc99859 100644
--- a/src/components/registration/registration.js
+++ b/src/components/registration/registration.js
@@ -1,14 +1,16 @@
 import useVuelidate from '@vuelidate/core'
 import { required, requiredIf, sameAs } from '@vuelidate/validators'
-import { mapState as mapPiniaState } from 'pinia'
-import { mapActions, mapState } from 'vuex'
+import { mapActions, mapState } from 'pinia'
 
 import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue'
 import TermsOfServicePanel from 'src/components/terms_of_service_panel/terms_of_service_panel.vue'
 import localeService from '../../services/locale/locale.service.js'
 
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
+import { getCaptcha, register } from 'src/api/public.js'
 import { DAY } from 'src/services/date_utils/date_utils.js'
 
 const registration = {
@@ -26,6 +28,9 @@ const registration = {
       reason: '',
       language: [''],
     },
+    signUpPending: false,
+    signUpErrors: [],
+    signUpNotice: {},
     captcha: {},
   }),
   components: {
@@ -58,7 +63,7 @@ const registration = {
     }
   },
   created() {
-    if ((!this.registrationOpen && !this.token) || this.signedIn) {
+    if ((!this.registrationOpen && !this.token) || this.loggedIn) {
       this.$router.push({ name: 'root' })
     }
 
@@ -100,7 +105,10 @@ const registration = {
         )
       )
     },
-    ...mapPiniaState(useInstanceStore, {
+    hasSignUpNotice(state) {
+      return this.signUpNotice.message
+    },
+    ...mapState(useInstanceStore, {
       registrationOpen: (store) => store.registrationOpen,
       embeddedToS: (store) => store.embeddedToS,
       termsOfService: (store) => store.tos,
@@ -109,16 +117,49 @@ const registration = {
       birthdayRequired: (store) => store.birthdayRequired,
       birthdayMinAge: (store) => store.birthdayMinAge,
     }),
-    ...mapState({
-      signedIn: (state) => !!state.users.currentUser,
-      isPending: (state) => state.users.signUpPending,
-      serverValidationErrors: (state) => state.users.signUpErrors,
-      signUpNotice: (state) => state.users.signUpNotice,
-      hasSignUpNotice: (state) => !!state.users.signUpNotice.message,
-    }),
+    ...mapState(useUsersStore, ['loggedIn']),
   },
   methods: {
-    ...mapActions(['signUp', 'getCaptcha']),
+    ...mapActions(useUsersStore, ['loginUser']),
+    getCaptcha(store) {
+      return getCaptcha({
+        credentials: useOAuthStore().token,
+      }).then(({ data }) => data)
+    },
+    async signUp(userInfo) {
+      const oauthStore = useOAuthStore()
+
+      this.signUpPending = true
+      this.signUpErrors = []
+      this.signUpNotice = {}
+
+      try {
+        const token = await oauthStore.ensureAppToken()
+        const { data } = await register({
+          credentials: token,
+          params: { ...userInfo },
+        })
+
+        if (data.access_token) {
+          this.signUpPending = false
+          oauthStore.setToken(data.access_token)
+          await this.loginUser(data.access_token)
+          return 'ok'
+        } else {
+          // Request succeeded, but user cannot login yet.
+          this.signUpErrors = []
+          this.signUpNotice = data
+          return 'request_sent'
+        }
+      } catch (e) {
+        const errors = e.message
+        this.signUpErrors = errors
+        this.signUpNotice = {}
+        throw e
+      } finally {
+        this.signUpPending = false
+      }
+    },
     async submit() {
       this.user.nickname = this.user.username
       this.user.token = this.token
diff --git a/src/components/registration/registration.vue b/src/components/registration/registration.vue
index b969a416e..0ad7c026a 100644
--- a/src/components/registration/registration.vue
+++ b/src/components/registration/registration.vue
@@ -28,7 +28,7 @@
                 <input
                   id="sign-up-username"
                   v-model.trim="v$.user.username.$model"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   :aria-required="true"
                   :placeholder="$t('registration.username_placeholder')"
@@ -56,7 +56,7 @@
                 <input
                   id="sign-up-fullname"
                   v-model.trim="v$.user.fullname.$model"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   :aria-required="true"
                   :placeholder="$t('registration.fullname_placeholder')"
@@ -84,7 +84,7 @@
                 <input
                   id="email"
                   v-model="v$.user.email.$model"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   type="email"
                   :aria-required="accountActivationRequired"
@@ -109,7 +109,7 @@
                 <textarea
                   id="bio"
                   v-model="user.bio"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   :placeholder="bioPlaceholder"
                 />
@@ -126,7 +126,7 @@
                 <input
                   id="sign-up-password"
                   v-model="user.password"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   type="password"
                   :aria-required="true"
@@ -154,7 +154,7 @@
                 <input
                   id="sign-up-password-confirmation"
                   v-model="user.confirm"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   type="password"
                   :aria-required="true"
@@ -187,7 +187,7 @@
                 <input
                   id="sign-up-birthday"
                   v-model="user.birthday"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   type="date"
                   :max="birthdayRequired ? birthdayMinAttr : undefined"
@@ -232,7 +232,7 @@
                 <textarea
                   id="reason"
                   v-model="user.reason"
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   class="input form-control"
                   :placeholder="reasonPlaceholder"
                 />
@@ -259,7 +259,7 @@
                   <input
                     id="captcha-answer"
                     v-model="captcha.solution"
-                    :disabled="isPending"
+                    :disabled="signUpPending"
                     class="input form-control"
                     type="text"
                     autocomplete="off"
@@ -285,7 +285,7 @@
               </div>
               <div class="form-group">
                 <button
-                  :disabled="isPending"
+                  :disabled="signUpPending"
                   type="submit"
                   class="btn button-default"
                 >
@@ -303,12 +303,12 @@
           <!-- eslint-enable vue/no-v-html -->
           </div>
           <div
-            v-if="serverValidationErrors.length"
+            v-if="signUpErrors.length"
             class="form-group"
           >
             <div class="alert error">
               <span
-                v-for="error in serverValidationErrors"
+                v-for="error in signUpErrors"
                 :key="error"
               >{{ error }}</span>
             </div>
diff --git a/src/components/remote_user_resolver/remote_user_resolver.js b/src/components/remote_user_resolver/remote_user_resolver.js
index 75304fe52..109b92761 100644
--- a/src/components/remote_user_resolver/remote_user_resolver.js
+++ b/src/components/remote_user_resolver/remote_user_resolver.js
@@ -1,4 +1,5 @@
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { fetchUser } from 'src/api/public.js'
 
@@ -16,17 +17,14 @@ const RemoteUserResolver = {
         id,
         credentials: useOAuthStore().token,
       })
-        .then(({ data: externalUser }) => {
-          if (externalUser.error) {
-            this.error = true
-          } else {
-            this.$store.commit('addNewUsers', [externalUser])
-            const id = externalUser.id
-            this.$router.replace({
-              name: 'external-user-profile',
-              params: { id },
-            })
-          }
+        .then((result) => {
+          const { data: externalUser } = result
+          useUsersStore().addNewUsers(result)
+          const id = externalUser.id
+          this.$router.replace({
+            name: 'external-user-profile',
+            params: { id },
+          })
         })
         .catch(() => {
           this.error = true
diff --git a/src/components/remove_follower_button/remove_follower_button.js b/src/components/remove_follower_button/remove_follower_button.js
index cbe92dce1..a0e7a0f13 100644
--- a/src/components/remove_follower_button/remove_follower_button.js
+++ b/src/components/remove_follower_button/remove_follower_button.js
@@ -1,6 +1,7 @@
 import { defineAsyncComponent } from 'vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 export default {
   props: ['user', 'relationship'],
@@ -43,9 +44,9 @@ export default {
     },
     doRemoveUserFromFollowers() {
       this.inProgress = true
-      this.$store
-        .dispatch('removeUserFromFollowers', this.relationship.id)
-        .then(() => {
+      useUsersStore()
+        .removeUserFromFollowers(this.relationship.id)
+        .finally(() => {
           this.inProgress = false
         })
       this.hideConfirmRemoveUserFromFollowers()
diff --git a/src/components/search/search.js b/src/components/search/search.js
index 1a5f8b51d..43a9b4f73 100644
--- a/src/components/search/search.js
+++ b/src/components/search/search.js
@@ -4,6 +4,10 @@ import Conversation from 'src/components/conversation/conversation.vue'
 import FollowCard from 'src/components/follow_card/follow_card.vue'
 import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 
+import { useSearchStore } from 'src/stores/search.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch, faSearch } from '@fortawesome/free-solid-svg-icons'
 
@@ -34,14 +38,14 @@ const Search = {
   },
   computed: {
     users() {
-      return this.userIds.map((userId) => this.$store.getters.findUser(userId))
+      return this.userIds.map((userId) => useUsersStore().findUser(userId))
     },
     visibleStatuses() {
-      const allStatusesObject = this.$store.state.statuses.allStatusesObject
+      const allStatuses = useStatusesStore().allStatuses
 
       return this.statuses.filter(
         (status) =>
-          allStatusesObject[status.id] && !allStatusesObject[status.id].deleted,
+          allStatuses.has(status.id) && !allStatuses.get(status.id).deleted,
       )
     },
   },
@@ -76,8 +80,8 @@ const Search = {
         this.lastStatusFetchCount = 0
       }
 
-      this.$store
-        .dispatch('search', {
+      useSearchStore()
+        .search({
           q: query,
           resolve: true,
           offset: this.statusesOffset,
diff --git a/src/components/search/search.vue b/src/components/search/search.vue
index 1f3982606..393b73fd1 100644
--- a/src/components/search/search.vue
+++ b/src/components/search/search.vue
@@ -119,7 +119,7 @@
         >
           <router-link
             class="list-item hashtag"
-            :to="{ name: 'tag-timeline', params: { tag: hashtag.name } }"
+            :to="{ name: 'tag-timeline', params: { id: hashtag.name } }"
           >
             <span class="name">
               #{{ hashtag.name }}
diff --git a/src/components/settings_modal/admin_tabs/admin_user_card.js b/src/components/settings_modal/admin_tabs/admin_user_card.js
index ba0f0e9f7..ae20d4cfe 100644
--- a/src/components/settings_modal/admin_tabs/admin_user_card.js
+++ b/src/components/settings_modal/admin_tabs/admin_user_card.js
@@ -1,6 +1,8 @@
 import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 import ModerationTools from 'src/components/moderation_tools/moderation_tools.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const AdminUserCard = {
   props: {
     userId: {
@@ -13,7 +15,7 @@ const AdminUserCard = {
   },
   computed: {
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     isAdmin() {
       return this.user.rights.admin
diff --git a/src/components/settings_modal/helpers/shared_computed_object.js b/src/components/settings_modal/helpers/shared_computed_object.js
index 4a3b9d4f8..123e77879 100644
--- a/src/components/settings_modal/helpers/shared_computed_object.js
+++ b/src/components/settings_modal/helpers/shared_computed_object.js
@@ -1,20 +1,20 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import { useAdminSettingsStore } from 'src/stores/admin_settings.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const SharedComputedObject = () => ({
-  ...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
-  ...mapPiniaState(useMergedConfigStore, {
+  ...mapState(useMergedConfigStore, ['mergedConfig']),
+  ...mapState(useMergedConfigStore, {
     expertLevel: (store) => store.mergedConfig.expertLevel,
   }),
-  ...mapPiniaState(useAdminSettingsStore, {
+  ...mapState(useAdminSettingsStore, {
     adminConfig: (store) => store.config,
     adminDraft: (store) => store.draft,
   }),
-  ...mapState({
-    user: (state) => state.users.currentUser,
+  ...mapState(useUsersStore, {
+    user: (store) => store.currentUser,
   }),
 })
 
diff --git a/src/components/settings_modal/helpers/vertical_tab_switcher.jsx b/src/components/settings_modal/helpers/vertical_tab_switcher.jsx
index 996939c00..2f3d5e28f 100644
--- a/src/components/settings_modal/helpers/vertical_tab_switcher.jsx
+++ b/src/components/settings_modal/helpers/vertical_tab_switcher.jsx
@@ -1,6 +1,6 @@
 // eslint-disable-next-line no-unused
 
-import { mapState as mapPiniaState } from 'pinia'
+import { mapState } from 'pinia'
 import { Fragment } from 'vue'
 
 import { FontAwesomeIcon as FAIcon } from '@fortawesome/vue-fontawesome'
@@ -60,7 +60,7 @@ export default {
         return this.$slots.default().findIndex(isWanted) === this.activeIndex
       }
     },
-    ...mapPiniaState(useInterfaceStore, {
+    ...mapState(useInterfaceStore, {
       mobileLayout: (store) => store.layoutType === 'mobile',
     }),
   },
diff --git a/src/components/settings_modal/settings_modal_admin_content.js b/src/components/settings_modal/settings_modal_admin_content.js
index 22ba0e16c..b9403c8e0 100644
--- a/src/components/settings_modal/settings_modal_admin_content.js
+++ b/src/components/settings_modal/settings_modal_admin_content.js
@@ -20,6 +20,7 @@ import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
 
 import { useAdminSettingsStore } from 'src/stores/admin_settings.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -97,10 +98,7 @@ const SettingsModalAdminContent = {
   },
   computed: {
     user() {
-      return this.$store.state.users.currentUser
-    },
-    isLoggedIn() {
-      return !!this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     open() {
       return useInterfaceStore().settingsModalState !== 'hidden'
diff --git a/src/components/settings_modal/settings_modal_user_content.js b/src/components/settings_modal/settings_modal_user_content.js
index 6e5d2addc..8fc8c3ebd 100644
--- a/src/components/settings_modal/settings_modal_user_content.js
+++ b/src/components/settings_modal/settings_modal_user_content.js
@@ -1,3 +1,5 @@
+import { mapState } from 'pinia'
+
 import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
 import AppearanceTab from './tabs/appearance_tab.vue'
 import ClutterTab from './tabs/clutter_tab.vue'
@@ -17,6 +19,7 @@ import StyleTab from './tabs/style_tab/style_tab.vue'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -74,9 +77,6 @@ const SettingsModalContent = {
     OldThemeTab,
   },
   computed: {
-    isLoggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
     open() {
       return useInterfaceStore().settingsModalState !== 'hidden'
     },
@@ -86,6 +86,7 @@ const SettingsModalContent = {
     expertLevel() {
       return useMergedConfigStore().mergedConfig.expertLevel
     },
+    ...mapState(useUsersStore, ['loggedIn']),
   },
   data() {
     return {
diff --git a/src/components/settings_modal/settings_modal_user_content.vue b/src/components/settings_modal/settings_modal_user_content.vue
index c958b9435..521750eca 100644
--- a/src/components/settings_modal/settings_modal_user_content.vue
+++ b/src/components/settings_modal/settings_modal_user_content.vue
@@ -14,7 +14,7 @@
       <GeneralTab />
     </div>
     <div
-      v-if="isLoggedIn"
+      v-if="loggedIn"
       :label="$t('settings.profile_tab')"
       icon="user"
       data-tab-name="profile"
@@ -23,7 +23,7 @@
       <ProfileTab />
     </div>
     <div
-      v-if="isLoggedIn"
+      v-if="loggedIn"
       :label="$t('settings.composing')"
       icon="pen-alt"
       data-tab-name="composing"
@@ -57,7 +57,7 @@
       <LayoutTab />
     </div>
     <div
-      v-if="isLoggedIn"
+      v-if="loggedIn"
       :full-width="true"
       :label="$t('settings.notifications')"
       icon="bell"
@@ -73,7 +73,7 @@
       <FilteringTab />
     </div>
     <div
-      v-if="isLoggedIn"
+      v-if="loggedIn"
       :label="$t('settings.mutes_and_blocks')"
       icon="eye-slash"
       data-tab-name="mutesAndBlocks"
@@ -90,7 +90,7 @@
       <ClutterTab />
     </div>
     <div
-      v-if="isLoggedIn"
+      v-if="loggedIn"
       :label="$t('settings.security_tab')"
       icon="lock"
       data-tab-name="security"
@@ -98,7 +98,7 @@
       <SecurityTab />
     </div>
     <div
-      v-if="isLoggedIn"
+      v-if="loggedIn"
       :label="$t('settings.data_import_export_tab')"
       icon="download"
       data-tab-name="dataImportExport"
diff --git a/src/components/settings_modal/tabs/appearance_tab.js b/src/components/settings_modal/tabs/appearance_tab.js
index 647c90c47..f3bcf19c0 100644
--- a/src/components/settings_modal/tabs/appearance_tab.js
+++ b/src/components/settings_modal/tabs/appearance_tab.js
@@ -13,6 +13,7 @@ import Preview from './old_theme_tab/theme_preview.vue'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { normalizeThemeData, useInterfaceStore } from 'src/stores/interface.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfileImages } from 'src/api/user.js'
 import { newImporter } from 'src/services/export_import/export_import.js'
@@ -220,7 +221,7 @@ const AppearanceTab = {
   },
   computed: {
     isDefaultBackground() {
-      return !this.$store.state.users.currentUser.background_image
+      return !useUsersStore().currentUser?.background_image
     },
     switchInProgress() {
       return useInterfaceStore().themeChangeInProgress
@@ -282,7 +283,7 @@ const AppearanceTab = {
     instanceWallpaperUsed() {
       return (
         useInstanceStore().instanceIdentity.background &&
-        !this.$store.state.users.currentUser.background_image
+        !useUsersStore().currentUser?.background_image
       )
     },
     customThemeVersion() {
@@ -490,9 +491,8 @@ const AppearanceTab = {
         background,
         credentials: useOAuthStore().token,
       })
-        .then(({ data }) => {
-          this.$store.commit('addNewUsers', [data])
-          this.$store.commit('setCurrentUser', data)
+        .then((result) => {
+          useUsersStore().addNewUsers(result)
           this.backgroundPreview = null
           this.backgroundError = null
         })
diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue
index 1343a36d5..e01a2b803 100644
--- a/src/components/settings_modal/tabs/appearance_tab.vue
+++ b/src/components/settings_modal/tabs/appearance_tab.vue
@@ -162,9 +162,9 @@
             <div class="fun-monitor-display-bezel button-default">
               <div class="fun-monitor-display-screen input">
                 <img
-                  v-if="backgroundPreview || user.background_image || instanceWallpaper"
+                  v-if="backgroundPreview || user?.background_image || instanceWallpaper"
                   class="fun-monitor-display-screen-image"
-                  :src="backgroundPreview || user.background_image || instanceWallpaper"
+                  :src="backgroundPreview || user?.background_image || instanceWallpaper"
                 >
                 <div
                   v-else
diff --git a/src/components/settings_modal/tabs/clutter_tab.js b/src/components/settings_modal/tabs/clutter_tab.js
index 87269eb99..1b3a41285 100644
--- a/src/components/settings_modal/tabs/clutter_tab.js
+++ b/src/components/settings_modal/tabs/clutter_tab.js
@@ -11,6 +11,7 @@ import UnitSetting from '../helpers/unit_setting.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
 
 const ClutterTab = {
   components: {
@@ -35,7 +36,7 @@ const ClutterTab = {
   // Updating nested properties
   watch: {
     replyVisibility() {
-      this.$store.dispatch('queueFlushAll')
+      useTimelinesStore().requireReloadAll()
     },
   },
 }
diff --git a/src/components/settings_modal/tabs/composing_tab.js b/src/components/settings_modal/tabs/composing_tab.js
index 1586c87bf..3e734e6e9 100644
--- a/src/components/settings_modal/tabs/composing_tab.js
+++ b/src/components/settings_modal/tabs/composing_tab.js
@@ -13,9 +13,11 @@ import UnitSetting from '../helpers/unit_setting.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useInterfaceStore } from 'src/stores/interface.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 { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfile } from 'src/api/user.js'
 import localeService from 'src/services/locale/locale.service.js'
@@ -92,7 +94,7 @@ const ComposingTab = {
           HTMLMediaElement.prototype,
           'audioTracks',
         ),
-      emailLanguage: this.$store.state.users.currentUser.language || [''],
+      emailLanguage: useUsersStore().currentUser.language || [''],
     }
   },
   components: {
@@ -138,10 +140,10 @@ const ComposingTab = {
     clearCache(key) {
       clearCache(key)
         .then(() => {
-          this.$store.dispatch('settingsSaved', { success: true })
+          useInterfaceStore().settingsSaved({ success: true })
         })
         .catch((error) => {
-          this.$store.dispatch('settingsSaved', { error })
+          useInterfaceStore().settingsSaved({ error })
         })
     },
     tooSmall() {
@@ -169,9 +171,8 @@ const ComposingTab = {
       updateProfile({
         params,
         credentials: useOAuthStore().token,
-      }).then(({ data: user }) => {
-        this.$store.commit('addNewUsers', [user])
-        this.$store.commit('setCurrentUser', user)
+      }).then((result) => {
+        useUsersStore().addNewUsers(result)
       })
     },
     updateFont(key, value) {
diff --git a/src/components/settings_modal/tabs/data_import_export_tab.js b/src/components/settings_modal/tabs/data_import_export_tab.js
index 7fc6adefd..243ff5888 100644
--- a/src/components/settings_modal/tabs/data_import_export_tab.js
+++ b/src/components/settings_modal/tabs/data_import_export_tab.js
@@ -1,4 +1,4 @@
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 import Exporter from 'src/components/exporter/exporter.vue'
@@ -6,6 +6,7 @@ import Importer from 'src/components/importer/importer.vue'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useOAuthTokensStore } from 'src/stores/oauth_tokens.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import {
   addBackup,
@@ -39,9 +40,7 @@ const DataImportExportTab = {
     Checkbox,
   },
   computed: {
-    ...mapState({
-      user: (state) => state.users.currentUser,
-    }),
+    ...mapState(useUsersStore, ['currentUser']),
   },
   methods: {
     getFollowsContent() {
diff --git a/src/components/settings_modal/tabs/developer_tab.js b/src/components/settings_modal/tabs/developer_tab.js
index 9a6258638..9697233d5 100644
--- a/src/components/settings_modal/tabs/developer_tab.js
+++ b/src/components/settings_modal/tabs/developer_tab.js
@@ -4,6 +4,7 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
 
 import { cacheKey, clearCache, emojiCacheKey } from 'src/services/sw/sw.js'
 
@@ -35,10 +36,10 @@ const VersionTab = {
     clearCache(key) {
       clearCache(key)
         .then(() => {
-          this.$store.dispatch('settingsSaved', { success: true })
+          useInterfaceStore().settingsSaved({ success: true })
         })
         .catch((error) => {
-          this.$store.dispatch('settingsSaved', { error })
+          useInterfaceStore().settingsSaved({ error })
         })
     },
   },
diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js
index 3a9cad6d2..601483106 100644
--- a/src/components/settings_modal/tabs/filtering_tab.js
+++ b/src/components/settings_modal/tabs/filtering_tab.js
@@ -15,6 +15,7 @@ import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.j
 import { useInterfaceStore } from 'src/stores/interface'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
 
 import {
   newExporter,
@@ -265,7 +266,7 @@ const FilteringTab = {
   // Updating nested properties
   watch: {
     replyVisibility() {
-      this.$store.dispatch('queueFlushAll')
+      useTimelinesStore().requireReloadAll()
     },
     muteFiltersObject() {
       this.muteFiltersDraftObject = cloneDeep(
diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js
index 3ab3846d2..a81d89eaa 100644
--- a/src/components/settings_modal/tabs/general_tab.js
+++ b/src/components/settings_modal/tabs/general_tab.js
@@ -12,7 +12,9 @@ import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.j
 import { useLocalConfigStore } from 'src/stores/local_config.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfile } from 'src/api/user.js'
 import localeService from 'src/services/locale/locale.service.js'
@@ -25,7 +27,7 @@ const GeneralTab = {
         value: mode,
         label: this.$t(`settings.absolute_time_format_12h_${mode}`),
       })),
-      emailLanguage: this.$store.state.users.currentUser.language || [''],
+      emailLanguage: useUsersStore().currentUser?.language || [''],
     }
   },
   components: {
@@ -62,14 +64,23 @@ const GeneralTab = {
       updateProfile({
         params,
         credentials: useOAuthStore().token,
-      }).then(({ data: user }) => {
-        this.$store.commit('addNewUsers', [user])
-        this.$store.commit('setCurrentUser', user)
+      }).then((result) => {
+        useUsersStore().addNewUsers(result)
       })
     },
     updateFont(path, value) {
       useLocalConfigStore().set({ path, value })
     },
+    toggleStreaming(value) {
+      // Streaming is not available for the unauthenticated
+      if (!useOAuthStore().token) return
+
+      if (value) {
+        useStreamingStore().initSocket()
+      } else {
+        useStreamingStore().stopSocket()
+      }
+    },
   },
 }
 
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index 9ccde0b2c..208777fda 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -129,6 +129,7 @@
             path="useStreamingApi"
             :local="true"
             expert="1"
+            @update:model-value="toggleStreaming"
           >
             {{ $t('settings.useStreamingApi') }}
           </BooleanSetting>
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 61d3e42f7..719d3a7e3 100644
--- a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
+++ b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
@@ -12,6 +12,8 @@ import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useOAuthTokensStore } from 'src/stores/oauth_tokens.js'
+import { useSearchStore } from 'src/stores/search.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { importBlocks, importFollows } from 'src/api/user.js'
 
@@ -40,21 +42,21 @@ const MutesAndBlocks = {
       return useInstanceStore().knownDomains
     },
     user() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     blocks() {
-      return get(this.$store.state.users.currentUser, 'blockIds', [])
+      return get(this.user, 'blockIds', [])
     },
     mutes() {
-      return get(this.$store.state.users.currentUser, 'muteIds', [])
+      return get(this.user, 'muteIds', [])
     },
     domains() {
-      return get(this.$store.state.users.currentUser, 'domainMutes', [])
+      return get(this.user, 'domainMutes', [])
     },
   },
   methods: {
     fetchItems(group) {
-      return () => this.$store.dispatch('fetch' + group, this.userId)
+      return () => useUsersStore()['fetch' + group](this.userId)
     },
     importFollows(file) {
       return importFollows({
@@ -94,35 +96,35 @@ const MutesAndBlocks = {
     },
     filterUnblockedUsers(userIds) {
       return reject(userIds, (userId) => {
-        const relationship = this.$store.getters.relationship(this.userId)
+        const relationship = useUsersStore().relationship(this.userId)
         return relationship.blocking || userId === this.user.id
       })
     },
     filterUnMutedUsers(userIds) {
       return reject(userIds, (userId) => {
-        const relationship = this.$store.getters.relationship(this.userId)
+        const relationship = useUsersStore().relationship(this.userId)
         return relationship.muting || userId === this.user.id
       })
     },
     queryUserIds(query) {
-      return this.$store
-        .dispatch('searchUsers', { query })
+      return useSearchStore()
+        .searchUsers({ query })
         .then((users) => map(users, 'id'))
     },
     blockUsers(ids) {
-      return this.$store.dispatch('blockUsers', ids)
+      return useUsersStore().blockUsers(ids)
     },
     unblockUsers(ids) {
-      return this.$store.dispatch('unblockUsers', ids)
+      return useUsersStore().unblockUsers(ids)
     },
     muteUsers(ids) {
-      return this.$store.dispatch('muteUsers', ids)
+      return useUsersStore().muteUsers(ids)
     },
     unmuteUsers(ids) {
-      return this.$store.dispatch('unmuteUsers', ids)
+      return useUsersStore().unmuteUsers(ids)
     },
     filterUnMutedDomains(urls) {
-      return urls.filter((url) => !this.user.domainMutes.includes(url))
+      return urls.filter((url) => !this.user.domainMutes.has(url))
     },
     queryKnownDomains(query) {
       return new Promise((resolve) => {
@@ -132,7 +134,7 @@ const MutesAndBlocks = {
       })
     },
     unmuteDomains(domains) {
-      return this.$store.dispatch('unmuteDomains', domains)
+      return useUsersStore().unmuteDomains(domains)
     },
   },
 }
diff --git a/src/components/settings_modal/tabs/notifications_tab.js b/src/components/settings_modal/tabs/notifications_tab.js
index a666d42e3..468ede0ce 100644
--- a/src/components/settings_modal/tabs/notifications_tab.js
+++ b/src/components/settings_modal/tabs/notifications_tab.js
@@ -2,6 +2,7 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateNotificationSettings } from 'src/api/user.js'
 
@@ -9,8 +10,7 @@ const NotificationsTab = {
   data() {
     return {
       activeTab: 'profile',
-      notificationSettings:
-        this.$store.state.users.currentUser.notification_settings,
+      notificationSettings: useUsersStore().currentUser.notification_settings,
       newDomainToMute: '',
     }
   },
@@ -19,7 +19,7 @@ const NotificationsTab = {
   },
   computed: {
     user() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     canReceiveReports() {
       if (!this.user) {
diff --git a/src/components/settings_modal/tabs/profile_tab.js b/src/components/settings_modal/tabs/profile_tab.js
index 844e223c9..07a77f308 100644
--- a/src/components/settings_modal/tabs/profile_tab.js
+++ b/src/components/settings_modal/tabs/profile_tab.js
@@ -4,6 +4,7 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfile } from 'src/api/user.js'
 
@@ -20,7 +21,7 @@ const ProfileTab = {
   data() {
     return {
       // Whether user is locked or not
-      locked: this.$store.state.users.currentUser.locked,
+      locked: useUsersStore().currentUser.locked,
     }
   },
   components: {
@@ -30,7 +31,7 @@ const ProfileTab = {
   },
   computed: {
     user() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     ...SharedComputedObject(),
   },
@@ -43,9 +44,8 @@ const ProfileTab = {
         params,
         credentials: useOAuthStore().token,
       })
-        .then(({ data: user }) => {
-          this.$store.commit('addNewUsers', [user])
-          this.$store.commit('setCurrentUser', user)
+        .then((result) => {
+          useUsersStore().addNewUsers(result)
         })
         .catch((error) => {
           this.displayUploadError(error)
diff --git a/src/components/settings_modal/tabs/security_tab/security_tab.js b/src/components/settings_modal/tabs/security_tab/security_tab.js
index a2571bd54..b0b72a4e9 100644
--- a/src/components/settings_modal/tabs/security_tab/security_tab.js
+++ b/src/components/settings_modal/tabs/security_tab/security_tab.js
@@ -5,6 +5,7 @@ import Mfa from './mfa.vue'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useOAuthTokensStore } from 'src/stores/oauth_tokens'
+import { useUsersStore } from 'src/stores/users.js'
 
 import {
   addAlias,
@@ -52,7 +53,7 @@ const SecurityTab = {
   },
   computed: {
     user() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     pleromaExtensionsAvailable() {
       return useInstanceCapabilitiesStore().pleromaExtensionsAvailable
@@ -79,7 +80,7 @@ const SecurityTab = {
         password: this.deleteAccountConfirmPasswordInput,
       }).then(({ data: res }) => {
         if (res.status === 'success') {
-          this.$store.dispatch('logout')
+          useUsersStore().logout()
           this.$router.push({ name: 'root' })
         } else {
           this.deleteAccountError = res.error
@@ -171,7 +172,7 @@ const SecurityTab = {
         })
     },
     logout() {
-      this.$store.dispatch('logout')
+      useUsersStore().logout()
       this.$router.replace('/')
     },
     revokeToken(id) {
diff --git a/src/components/side_drawer/side_drawer.js b/src/components/side_drawer/side_drawer.js
index a1dca8161..2d2886d58 100644
--- a/src/components/side_drawer/side_drawer.js
+++ b/src/components/side_drawer/side_drawer.js
@@ -4,7 +4,7 @@ import { mapGetters } from 'vuex'
 import { USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
 import UserCard from 'src/components/user_card/user_card.vue'
 import GestureService from '../../services/gesture_service/gesture_service'
-import { unseenNotificationsFromStore } from '../../services/notification_utils/notification_utils'
+import { unseenNotifications } from '../../services/notification_utils/notification_utils'
 
 import { useAnnouncementsStore } from 'src/stores/announcements'
 import { useChatsStore } from 'src/stores/chats.js'
@@ -13,6 +13,7 @@ import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.j
 import { useInterfaceStore } from 'src/stores/interface'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useShoutStore } from 'src/stores/shout'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -70,14 +71,13 @@ const SideDrawer = {
   },
   computed: {
     currentUser() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     shout() {
       return useShoutStore().joined
     },
     unseenNotifications() {
-      return unseenNotificationsFromStore(
-        this.$store,
+      return unseenNotifications(
         useMergedConfigStore().mergedConfig.notificationVisibility,
         useMergedConfigStore().mergedConfig.ignoreInactionableSeen,
       )
diff --git a/src/components/staff_panel/staff_panel.js b/src/components/staff_panel/staff_panel.js
index b736bb9f9..7ceda1e41 100644
--- a/src/components/staff_panel/staff_panel.js
+++ b/src/components/staff_panel/staff_panel.js
@@ -1,16 +1,15 @@
 import { groupBy, map } from 'lodash'
-import { mapGetters, mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import BasicUserCard from 'src/components/basic_user_card/basic_user_card.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const StaffPanel = {
   created() {
     const nicknames = useInstanceStore().staffAccounts
-    nicknames.forEach((nickname) =>
-      this.$store.dispatch('fetchUserIfMissing', nickname),
-    )
+    nicknames.forEach((name) => useUsersStore().fetchUserIfMissing({ name }))
   },
   components: {
     BasicUserCard,
@@ -27,10 +26,8 @@ const StaffPanel = {
         { role: 'moderator', users: groupedStaffAccounts.moderator },
       ].filter((group) => group.users)
     },
-    ...mapGetters(['findUserByName']),
-    ...mapState({
-      staffAccounts: (state) => useInstanceStore().staffAccounts,
-    }),
+    ...mapState(useUsersStore, ['findUserByName']),
+    ...mapState(useInstanceStore, ['staffAccounts']),
   },
 }
 
diff --git a/src/components/status/status.js b/src/components/status/status.js
index a33d29525..814b3e3c8 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -1,4 +1,3 @@
-import { uniqBy } from 'lodash'
 import { defineAsyncComponent } from 'vue'
 
 import AvatarList from 'src/components/avatar_list/avatar_list.vue'
@@ -23,8 +22,11 @@ import {
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useScrobblesStore } from 'src/stores/scrobbles.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
@@ -92,6 +94,7 @@ const Status = {
     StatusActionButtons,
   },
   props: {
+    statusId: String,
     statusoid: Object,
     replies: Array,
 
@@ -101,7 +104,6 @@ const Status = {
     isPreview: Boolean,
     noHeading: Boolean,
     inlineExpanded: Boolean,
-    showPinned: Boolean,
     inProfile: Boolean,
     inConversation: Boolean,
     inQuote: Boolean,
@@ -114,21 +116,59 @@ const Status = {
 
     threadDisplayStatus: String,
   },
-  emits: ['goto', 'dive', 'toggleExpanded', 'suspendableStateChange'],
+  emits: [
+    'goto',
+    'dive',
+    'toggleExpanded',
+    'suspendableStateChange',
+    'heightChange',
+  ],
   data() {
     return {
       replying: false,
       unmuted: false,
-      userExpanded: false,
       mediaPlaying: new Set(),
       error: null,
       headTailLinks: null,
     }
   },
+  created() {
+    useScrobblesStore().getLatestScrobble(this.status.user.id)
+  },
   computed: {
+    // Whatever we're given to work with
+    status() {
+      return this.statusoid ?? useStatusesStore().allStatuses.get(this.statusId)
+    },
+    // Status repeated
+    repeatedStatus() {
+      if (this.status.retweeted_status === undefined) return undefined
+      return useStatusesStore().allStatuses.get(this.status.retweeted_status.id)
+    },
+    // THE repeat
+    repeatStatus() {
+      if (this.isRepeat) {
+        return this.status
+      } else {
+        return null
+      }
+    },
+    mainStatus() {
+      if (this.isRepeat) {
+        return this.repeatedStatus
+      } else {
+        return this.status
+      }
+    },
+    repeater() {
+      return useUsersStore().findUser(this.status.user.id)
+    },
+    user() {
+      return useUsersStore().findUser(this.mainStatus.user.id)
+    },
     showReasonMutedThread() {
       return (
-        (this.status.thread_muted || this.status.reblog?.thread_muted) &&
+        (this.mainStatus.thread_muted || this.repeatStatus?.thread_muted) &&
         !this.inConversation
       )
     },
@@ -142,73 +182,58 @@ const Status = {
       return this.mergedConfig.scaleMfm
     },
     repeaterClass() {
-      const user = this.statusoid.user
-      return highlightClass(user)
+      return highlightClass(this.repeater)
     },
     userClass() {
-      const user = this.retweet
-        ? this.statusoid.retweeted_status.user
-        : this.statusoid.user
-      return highlightClass(user)
+      return highlightClass(this.user)
     },
-    deleted() {
-      return this.statusoid.deleted
+    isDeleted() {
+      return this.status.deleted
     },
     repeaterStyle() {
-      const user = this.statusoid.user
-      return highlightStyle(useUserHighlightStore().get(user.screen_name))
+      return highlightStyle(
+        useUserHighlightStore().get(this.repeater.screen_name),
+      )
+    },
+    favoritedBy() {
+      return useStatusesStore().favs.get(this.mainStatus.id) ?? new Set()
+    },
+    repeatedBy() {
+      return useStatusesStore().repeats.get(this.mainStatus.id) ?? new Set()
     },
     userStyle() {
       if (this.noHeading) return
-      const user = this.retweet
-        ? this.statusoid.retweeted_status.user
-        : this.statusoid.user
-      return highlightStyle(useUserHighlightStore().get(user.screen_name))
+      return highlightStyle(useUserHighlightStore().get(this.user.screen_name))
     },
     userProfileLink() {
-      return this.generateUserProfileLink(
-        this.status.user.id,
-        this.status.user.screen_name,
-      )
+      return this.generateUserProfileLink(this.user.id, this.user.screen_name)
     },
     replyProfileLink() {
       if (this.isReply) {
-        const user = this.$store.getters.findUser(
-          this.status.in_reply_to_user_id,
+        const user = useUsersStore().findUser(
+          this.mainStatus.in_reply_to_user_id,
         )
-        // FIXME Why user not found sometimes???
-        return user ? user.statusnet_profile_url : 'NOT_FOUND'
+
+        // User referenced in post might not be yet present in store
+        // since their data is not included in status data, just the id
+        return user?.statusnet_profile_url
       }
     },
-    retweet() {
-      return !!this.statusoid.retweeted_status
+    isRepeat() {
+      return !!this.repeatedStatus
     },
-    retweeterUser() {
-      return this.statusoid.user
+    repeaterName() {
+      return this.status.user.name || this.status.user.screen_name_ui
     },
-    retweeter() {
-      return this.statusoid.user.name || this.statusoid.user.screen_name_ui
+    repeaterHtml() {
+      return this.status.user.name
     },
-    retweeterHtml() {
-      return this.statusoid.user.name
-    },
-    retweeterProfileLink() {
+    repeaterProfileLink() {
       return this.generateUserProfileLink(
-        this.statusoid.user.id,
-        this.statusoid.user.screen_name,
+        this.repeater.id,
+        this.repeater.screen_name,
       )
     },
-    status() {
-      if (this.retweet) {
-        return this.statusoid.retweeted_status
-      } else {
-        return this.statusoid
-      }
-    },
-    statusFromGlobalRepository() {
-      // NOTE: Consider to replace status with statusFromGlobalRepository
-      return this.$store.state.statuses.allStatusesObject[this.status.id]
-    },
     loggedIn() {
       return !!this.currentUser
     },
@@ -223,9 +248,6 @@ const Status = {
     botStatus() {
       return this.status.user.actor_type === 'Service'
     },
-    showActorTypeIndicator() {
-      return !this.hideBotIndication
-    },
     sensitiveStatus() {
       return this.status.nsfw
     },
@@ -234,14 +256,14 @@ const Status = {
       const writtenSet = new Set(
         this.headTailLinks.writtenMentions.map((_) => _.url),
       )
-      return this.status.attentions
+      return this.mainStatus.attentions
         .filter((attn) => {
           // no reply user
           return (
-            attn.id !== this.status.in_reply_to_user_id &&
+            attn.id !== this.mainStatus.in_reply_to_user_id &&
             // no self-replies
             attn.statusnet_profile_url !==
-              this.status.user.statusnet_profile_url &&
+              this.mainStatus.user.statusnet_profile_url &&
             // don't include if mentions is written
             !writtenSet.has(attn.statusnet_profile_url)
           )
@@ -258,7 +280,7 @@ const Status = {
     muteReasons() {
       return [
         this.userIsMuted ? 'user' : null,
-        this.status.thread_muted ? 'thread' : null,
+        this.mainStatus.thread_muted ? 'thread' : null,
         this.muteFilterHits.length > 0 ? 'filtered' : null,
         this.muteBotStatuses && this.botStatus ? 'bot' : null,
         this.muteSensitiveStatuses && this.sensitiveStatus ? 'nsfw' : null,
@@ -302,39 +324,37 @@ const Status = {
     },
     muted() {
       if (this.ignoreMute) return false
-      if (this.statusoid.user.id === this.currentUser.id) return false
+      if (this.status.user.id === this.currentUser?.id) return false
       return !this.unmuted && !this.shouldNotMute && this.muteReasons.length > 0
     },
     userIsMuted() {
-      if (this.statusoid.user.id === this.currentUser.id) return false
-      const { status } = this
-      const { reblog } = status
-      const relationship = this.$store.getters.relationship(status.user.id)
-      const relationshipReblog =
-        reblog && this.$store.getters.relationship(reblog.user.id)
+      if (!this.currentUser) return false
+      if (this.user === this.currentUser) return false
+      if (this.repeater === this.currentUser) return false
+      const relationship = useUsersStore().relationship(this.user.id)
+      const relationshipRepeat = useUsersStore().relationship(this.repeater?.id)
       return (
-        (status.muted && !status.thread_muted) ||
+        (this.status.muted && !this.status.thread_muted) ||
         // Reprööt of a muted post according to BE
-        (reblog?.muted && !reblog.thread_muted) ||
+        (this.repeatedStatus?.muted && !this.repeatedStatus.thread_muted) ||
         // Muted user
         relationship.muting ||
         // Muted user of a reprööt
-        relationshipReblog?.muting
+        relationshipRepeat?.muting
       )
     },
     shouldNotMute() {
       if (this.ignoreMute) return true
       if (this.focused) return true
-      const { status } = this
-      const { reblog } = status
+      const { reblog } = this.mainStatus
       return (
         ((this.inProfile &&
           // Don't mute user's posts on user timeline (except reblogs)
-          ((!reblog && status.user.id === this.profileUserId) ||
+          ((!reblog && this.mainStatus.user.id === this.profileUserId) ||
             // Same as above but also allow self-reblogs
             reblog?.user.id === this.profileUserId)) ||
           // Don't mute statuses in muted conversation when said conversation is opened
-          (this.inConversation && status.thread_muted)) &&
+          (this.inConversation && this.mainStatus.thread_muted)) &&
         // No excuses if post has muted words
         !this.muteFilterHits.length > 0
       )
@@ -363,29 +383,25 @@ const Status = {
     },
     isReply() {
       return !!(
-        this.status.in_reply_to_status_id && this.status.in_reply_to_user_id
+        this.mainStatus.in_reply_to_status_id &&
+        this.mainStatus.in_reply_to_user_id
       )
     },
     replyToName() {
-      if (this.status.in_reply_to_screen_name) {
-        return this.status.in_reply_to_screen_name
+      if (this.mainStatus.in_reply_to_screen_name) {
+        return this.mainStatus.in_reply_to_screen_name
       } else {
-        const user = this.$store.getters.findUser(
-          this.status.in_reply_to_user_id,
+        const user = useUsersStore().findUser(
+          this.mainStatus.in_reply_to_user_id,
         )
         return user?.screen_name_ui
       }
     },
     combinedFavsAndRepeatsUsers() {
-      // Use the status from the global status repository since favs and repeats are saved in it
-      const combinedUsers = [].concat(
-        this.statusFromGlobalRepository.favoritedBy,
-        this.statusFromGlobalRepository.rebloggedBy,
-      )
-      return uniqBy(combinedUsers, 'id')
+      return new Set([...this.favoritedBy, ...this.repeatedBy])
     },
     tags() {
-      return this.status.tags
+      return [...this.status.tags]
         .filter((tagObj) => Object.hasOwn(tagObj, 'name'))
         .map((tagObj) => tagObj.name)
         .join(' ')
@@ -397,8 +413,8 @@ const Status = {
       return (
         !this.hidePostStats &&
         this.focused &&
-        (this.combinedFavsAndRepeatsUsers.length > 0 ||
-          this.statusFromGlobalRepository.quotes_count)
+        (this.combinedFavsAndRepeatsUsers.size > 0 ||
+          this.mainStatus.quotes_count)
       )
     },
     muteBotStatuses() {
@@ -411,7 +427,7 @@ const Status = {
       return this.mergedConfig.hideBotIndication
     },
     currentUser() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     mergedConfig() {
       return useMergedConfigStore().mergedConfig
@@ -429,19 +445,19 @@ const Status = {
       return this.$i18n.t('general.scope_in_timeline.' + this.status.visibility)
     },
     isEdited() {
-      return this.status.edited_at !== null
+      return this.mainStatus.edited_at !== null
     },
     editingAvailable() {
       return useInstanceCapabilitiesStore().editingAvailable
     },
     quoteId() {
-      return this.status.quote_id
+      return this.mainStatus.quote_id
     },
     quoteUrl() {
-      return this.status.quote_url
+      return this.mainStatus.quote_url
     },
     quoteVisible() {
-      return this.status.quote_visible
+      return this.mainStatus.quote_visible
     },
     quoteExpanded() {
       return !this.inQuote
@@ -517,9 +533,6 @@ const Status = {
     toggleMute() {
       this.unmuted = !this.unmuted
     },
-    toggleUserExpanded() {
-      this.userExpanded = !this.userExpanded
-    },
     generateUserProfileLink(id, name) {
       return generateProfileLink(
         id,
@@ -537,6 +550,7 @@ const Status = {
       this.headTailLinks = headTailLinks
     },
     toggleThreadDisplay() {
+      // FIXME
       this.controlledToggleThreadDisplay()
     },
     scrollIfFocused(focused) {
@@ -555,33 +569,45 @@ const Status = {
         }
       }
     },
+    onTransitionEnd() {
+      this.$nextTick(() => {
+        this.$emit('heightChange')
+      })
+    },
   },
   watch: {
+    status: {
+      deep: true,
+      handler() {
+        this.$emit('heightChange')
+      },
+    },
+    unmuted() {
+      this.$emit('heightChange')
+    },
+    error() {
+      this.$emit('heightChange')
+    },
+    replying() {
+      this.$emit('heightChange')
+    },
     focused: function (id) {
       this.scrollIfFocused(id)
     },
-    'status.repeat_num': function (num) {
+    'mainStatus.repeat_num': function (num) {
       // refetch repeats when repeat_num is changed in any way
-      if (
-        this.focused &&
-        this.statusFromGlobalRepository.rebloggedBy &&
-        this.statusFromGlobalRepository.rebloggedBy.length !== num
-      ) {
-        this.$store.dispatch('fetchRepeats', this.status.id)
+      if (this.focused && this.repeatedBy.size !== num) {
+        useStatusesStore().fetchRepeats(this.mainStatus.id)
       }
     },
-    'status.fave_num': function (num) {
+    'mainStatus.fave_num': function (num) {
       // refetch favs when fave_num is changed in any way
-      if (
-        this.focused &&
-        this.statusFromGlobalRepository.favoritedBy &&
-        this.statusFromGlobalRepository.favoritedBy.length !== num
-      ) {
-        this.$store.dispatch('fetchFavs', this.status.id)
+      if (this.focused && this.favoritedBy.size !== num) {
+        useStatusesStore().fetchFavs(this.mainStatus.id)
       }
     },
     isSuspendable: function (suspend) {
-      this.$emit('suspendableStateChange', { id: this.statusoid.id, suspend })
+      this.$emit('suspendableStateChange', { id: this.status.id, suspend })
     },
   },
 }
diff --git a/src/components/status/status.vue b/src/components/status/status.vue
index c1d340975..db303daae 100644
--- a/src/components/status/status.vue
+++ b/src/components/status/status.vue
@@ -22,12 +22,12 @@
       <div class="status-container muted">
         <small class="status-username">
           <FAIcon
-            v-if="muted && retweet"
+            v-if="muted && isRepeat"
             class="fa-scale-110 fa-old-padding repeat-icon"
             icon="retweet"
           />
-          <user-link
-            :user="status.user"
+          <UserLink
+            :user="repeater"
             :at="false"
           />
         </small>
@@ -47,39 +47,37 @@
     </template>
     <template v-else>
       <div
-        v-if="retweet && !noHeading && !inConversation"
+        v-if="isRepeat && !noHeading && !inConversation"
         :class="[repeaterClass, { highlighted: repeaterStyle }]"
         :style="[repeaterStyle]"
         class="status-container repeat-info"
       >
         <UserAvatar
-          v-if="retweet"
           class="left-side repeater-avatar"
-          :show-actor-type-indicator="showActorTypeIndicator"
-          :user="statusoid.user"
+          :user-id="repeater.id"
         />
         <div class="right-side faint">
           <bdi
             class="status-username repeater-name"
-            :title="retweeter"
+            :title="repeaterName"
           >
             <router-link
-              v-if="retweeterHtml"
-              :to="retweeterProfileLink"
+              v-if="repeaterHtml"
+              :to="repeaterProfileLink"
             >
               <RichContent
-                :html="retweeterHtml"
-                :emoji="retweeterUser.emoji"
+                :html="repeaterHtml"
+                :emoji="repeater.emoji"
                 :allow-non-square-emoji="allowNonSquareEmoji"
                 :pause-mfm="pauseMfm"
                 :scale-mfm="scaleMfm"
-                :is-local="retweeterUser.is_local"
+                :is-local="repeater.is_local"
               />
             </router-link>
             <router-link
               v-else
-              :to="retweeterProfileLink"
-            >{{ retweeter }}</router-link>
+              :to="repeaterProfileLink"
+            >{{ repeaterName }}</router-link>
           </bdi>
           <div class="repeat-label">
             <FAIcon
@@ -93,8 +91,8 @@
       </div>
 
       <div
-        v-if="!deleted"
-        :class="[userClass, { highlighted: userStyle, '-repeat': retweet && !inConversation }]"
+        v-if="!isDeleted"
+        :class="[userClass, { highlighted: userStyle, '-repeat': isRepeat && !inConversation }]"
         :style="[ userStyle ]"
         class="status-container"
         :data-tags="tags"
@@ -104,25 +102,24 @@
           class="left-side"
         >
           <a
-            v-if="status.user?.name"
+            v-if="user.name"
             :href="$router.resolve(userProfileLink).href"
             @click.prevent
           >
             <UserPopover
-              :user-id="status.user.id"
+              :user-id="user.id"
               :overlay-centers="true"
             >
               <UserAvatar
                 class="post-avatar"
-                :show-actor-type-indicator="showActorTypeIndicator"
                 :compact="compact"
-                :user="status?.user"
+                :user-id="user.id"
               />
             </UserPopover>
           </a>
           <UserAvatar
             v-else
-            :user="status?.user"
+            :user-id="user.id"
             class="post-avatar"
             :compact="compact"
             :title="$t('status.unknown_user_info')"
@@ -135,44 +132,44 @@
           >
             <div class="heading-name-row">
               <div
-                v-if="status.user"
+                v-if="user"
                 class="heading-left"
               >
                 <h4
-                  v-if="status.user.name_html"
+                  v-if="user.name_html"
                   class="status-username"
-                  :title="status.user.name"
+                  :title="user.name"
                 >
                   <RichContent
-                    :html="status.user.name"
-                    :emoji="status.user.emoji"
+                    :html="user.name"
+                    :emoji="user.emoji"
                     :allow-non-square-emoji="allowNonSquareEmoji"
-                    :is-local="status.user.is_local"
+                    :is-local="user.is_local"
                   />
                 </h4>
                 <h4
                   v-else
                   class="status-username"
-                  :title="status.user.name"
+                  :title="user.name"
                 >
-                  {{ status.user.name }}
+                  {{ user.name }}
                 </h4>
-                <user-link
+                <UserLink
                   class="account-name"
-                  :title="status.user.screen_name_ui"
-                  :user="status.user"
+                  :title="user.screen_name_ui"
+                  :user="user"
                   :at="false"
                 />
                 <img
-                  v-if="!!(status.user && status.user.favicon)"
+                  v-if="!!(user && user.favicon)"
                   class="status-favicon"
-                  :src="status.user.favicon"
+                  :src="user.favicon"
                 >
               </div>
 
               <span class="heading-right">
                 <span
-                  v-if="showPinned"
+                  v-if="mainStatus.pinned"
                   class="pin"
                 >
                   <FAIcon
@@ -186,12 +183,12 @@
                   :to="{ name: 'conversation', params: { id: status.id } }"
                 >
                   <Timeago
-                    :time="status.created_at"
+                    :time="mainStatus.created_at"
                     :auto-update="60"
                   />
                 </router-link>
                 <span
-                  v-if="status.visibility"
+                  v-if="mainStatus.visibility"
                   class="visibility-icon"
                   :title="visibilityLocalized"
                 >
@@ -307,10 +304,10 @@
                   <template #replyToWithIcon>
                     <StatusPopover
                       v-if="!isPreview"
-                      :status-id="status.parent_visible && status.in_reply_to_status_id"
+                      :status-id="mainStatus.parent_visible && mainStatus.in_reply_to_status_id"
                       class="reply-to-popover"
                       style="min-width: 0;"
-                      :class="{ '-strikethrough': !status.parent_visible }"
+                      :class="{ '-strikethrough': !mainStatus.parent_visible }"
                     >
                       <button
                         class="button-unstyled reply-to"
@@ -399,7 +396,7 @@
                 <template #time>
                   <Timeago
                     template-key="time.in_past"
-                    :time="status.edited_at"
+                    :time="mainStatus.edited_at"
                     :auto-update="60"
                     :long-format="true"
                   />
@@ -410,7 +407,7 @@
 
           <StatusContent
             ref="content"
-            :status="status"
+            :status="mainStatus"
             :focused="focused"
             :in-conversation="inConversation"
             @mediaplay="addMediaPlaying($event)"
@@ -457,38 +454,41 @@
             </StatusPopover>
           </div>
 
-          <transition name="fade">
+          <Transition
+            @after-leave="onTransitionEnd"
+            name="fade"
+          >
             <div
               v-if="shouldDisplayFavsAndRepeats"
               class="favs-repeated-users"
             >
               <div class="stats">
                 <UserListPopover
-                  v-if="statusFromGlobalRepository.rebloggedBy && statusFromGlobalRepository.rebloggedBy.length > 0"
-                  :users="statusFromGlobalRepository.rebloggedBy"
+                  v-if="repeatedBy.size > 0"
+                  :user-ids="repeatedBy"
                 >
                   <div class="stat-count">
                     <a class="stat-title">{{ $t('status.repeats') }}</a>
                     <div class="stat-number">
-                      {{ statusFromGlobalRepository.rebloggedBy.length }}
+                      {{ repeatedBy.size }}
                     </div>
                   </div>
                 </UserListPopover>
                 <UserListPopover
-                  v-if="statusFromGlobalRepository.favoritedBy && statusFromGlobalRepository.favoritedBy.length > 0"
-                  :users="statusFromGlobalRepository.favoritedBy"
+                  v-if="favoritedBy.size > 0"
+                  :user-ids="favoritedBy"
                 >
                   <div
                     class="stat-count"
                   >
                     <a class="stat-title">{{ $t('status.favorites') }}</a>
                     <div class="stat-number">
-                      {{ statusFromGlobalRepository.favoritedBy.length }}
+                      {{ favoritedBy.size }}
                     </div>
                   </div>
                 </UserListPopover>
                 <router-link
-                  v-if="statusFromGlobalRepository.quotes_count > 0"
+                  v-if="mainStatus.quotes_count > 0"
                   :to="{ name: 'quotes', params: { id: status.id } }"
                 >
                   <div
@@ -496,26 +496,26 @@
                   >
                     <a class="stat-title">{{ $t('status.quotes') }}</a>
                     <div class="stat-number">
-                      {{ statusFromGlobalRepository.quotes_count }}
+                      {{ mainStatus.quotes_count }}
                     </div>
                   </div>
                 </router-link>
                 <div class="avatar-row">
-                  <AvatarList :users="combinedFavsAndRepeatsUsers" />
+                  <AvatarList :user-ids="combinedFavsAndRepeatsUsers" />
                 </div>
               </div>
             </div>
-          </transition>
+          </Transition>
 
           <EmojiReactions
             v-if="(mergedConfig.emojiReactionsOnTimeline || focused) && (!noHeading && !isPreview)"
-            :status="status"
+            :status="mainStatus"
           />
 
           <StatusActionButtons
             v-if="!noHeading && !isPreview"
             class="status-action-buttons"
-            :status="status"
+            :status="mainStatus"
             :replying="replying"
             @toggle-replying="toggleReplyForm"
           />
@@ -529,7 +529,6 @@
           <UserAvatar
             class="post-avatar"
             :compact="compact"
-            :show-actor-type-indicator="showActorTypeIndicator"
           />
         </div>
         <div class="right-side">
@@ -546,10 +545,11 @@
           ref="postStatusForm"
           class="reply-body"
           :closeable="true"
-          :replied-status="status"
+          :replied-status="mainStatus"
           @posted="closeReplyForm"
           @draft-done="closeReplyForm"
           @close-accepted="closeReplyForm"
+          @resize="$emit('heightChange')"
         />
       </div>
     </template>
diff --git a/src/components/status_action_buttons/action_button.js b/src/components/status_action_buttons/action_button.js
index 68c10efa2..97c9ac692 100644
--- a/src/components/status_action_buttons/action_button.js
+++ b/src/components/status_action_buttons/action_button.js
@@ -5,6 +5,8 @@ import EmojiPicker from '../emoji_picker/emoji_picker.vue'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -98,7 +100,7 @@ export default {
       ]
     },
     userIsMuted() {
-      return this.$store.getters.relationship(this.status.user.id).muting
+      return useUsersStore().relationship(this.status.user.id).muting
     },
     threadIsMuted() {
       return this.status.thread_muted
@@ -139,9 +141,9 @@ export default {
         (r) => r.name === emoji,
       )
       if (existingReaction?.me) {
-        this.$store.dispatch('unreactWithEmoji', { id: this.status.id, emoji })
+        useStatusesStore().unreactWithEmoji(this.status.id, emoji)
       } else {
-        this.$store.dispatch('reactWithEmoji', { id: this.status.id, emoji })
+        useStatusesStore().reactWithEmoji(this.status.id, emoji)
       }
     },
     onShowEmojiPicker() {
diff --git a/src/components/status_action_buttons/action_button_container.js b/src/components/status_action_buttons/action_button_container.js
index d031bd6e9..fce80d9f0 100644
--- a/src/components/status_action_buttons/action_button_container.js
+++ b/src/components/status_action_buttons/action_button_container.js
@@ -4,6 +4,8 @@ import Popover from 'src/components/popover/popover.vue'
 import ActionButton from './action_button.vue'
 
 import { useAdminSettingsStore } from 'src/stores/admin_settings.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
 
@@ -48,7 +50,7 @@ export default {
   emits: ['emojiPickerShown'],
   mounted() {
     if (this.button.name === 'mute') {
-      this.$store.dispatch('fetchDomainMutes')
+      useUsersStore().fetchDomainMutes()
     }
   },
   data() {
@@ -71,7 +73,7 @@ export default {
       return this.status.user
     },
     userIsMuted() {
-      return this.$store.getters.relationship(this.user.id).muting
+      return useUsersStore().relationship(this.user.id).muting
     },
     conversationIsMuted() {
       return this.status.thread_muted
@@ -80,9 +82,7 @@ export default {
       return this.user.fqn.split('@')[1]
     },
     domainIsMuted() {
-      return new Set(this.$store.state.users.currentUser.domainMutes).has(
-        this.domain,
-      )
+      return new Set(useUsersStore().currentUser.domainMutes).has(this.domain)
     },
     availableScopes() {
       return ['private', 'unlisted', 'direct', 'public'].filter((scope) => {
@@ -106,13 +106,13 @@ export default {
       }
     },
     unmuteUser() {
-      return this.$store.dispatch('unmuteUser', this.user.id)
+      return useUsersStore().unmuteUser(this.user.id)
     },
     unmuteConversation() {
-      return this.$store.dispatch('unmuteConversation', { id: this.status.id })
+      return useStatusesStore().unmuteConversation(this.status.id)
     },
     unmuteDomain() {
-      return this.$store.dispatch('unmuteDomain', this.domain)
+      return useUsersStore().unmuteDomain(this.domain)
     },
     toggleUserMute() {
       if (this.userIsMuted) {
diff --git a/src/components/status_action_buttons/buttons_definitions.js b/src/components/status_action_buttons/buttons_definitions.js
index 6c94b43a5..762b5be6a 100644
--- a/src/components/status_action_buttons/buttons_definitions.js
+++ b/src/components/status_action_buttons/buttons_definitions.js
@@ -3,6 +3,7 @@ import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useReportsStore } from 'src/stores/reports.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 import { useStatusHistoryStore } from 'src/stores/statusHistory.js'
 
 const PRIVATE_SCOPES = new Set(['private', 'direct'])
@@ -34,9 +35,10 @@ export const BUTTONS = [
     name: 'retweet',
     label: ({ status }) =>
       status.repeated ? 'tool_tip.unrepeat' : 'tool_tip.repeat',
-    icon({ status, currentUser }) {
+    icon({ status, loggedIn, currentUser }) {
       if (
-        currentUser.id !== status.user.id &&
+        loggedIn &&
+        status.user.id !== currentUser.id &&
         PRIVATE_SCOPES.has(status.visibility)
       ) {
         return 'lock'
@@ -52,7 +54,7 @@ export const BUTTONS = [
       (currentUser.id === status.user.id ||
         !PRIVATE_SCOPES.has(status.visibility)),
     toggleable: true,
-    confirm: ({ status, getters }) =>
+    confirm: ({ status }) =>
       !status.repeated && useMergedConfigStore().mergedConfig.modalOnRepeat,
     confirmStrings: {
       title: 'status.repeat_confirm_title',
@@ -60,11 +62,11 @@ export const BUTTONS = [
       confirm: 'status.repeat_confirm_accept_button',
       cancel: 'status.repeat_confirm_cancel_button',
     },
-    action({ status, dispatch }) {
+    action({ status }) {
       if (!status.repeated) {
-        return dispatch('retweet', { id: status.id })
+        return useStatusesStore().retweet(status.id)
       } else {
-        return dispatch('unretweet', { id: status.id })
+        return useStatusesStore().unretweet(status.id)
       }
     },
   },
@@ -82,11 +84,11 @@ export const BUTTONS = [
     counter: ({ status }) => status.fave_num,
     anonLink: true,
     toggleable: true,
-    action({ status, dispatch }) {
+    action({ status }) {
       if (!status.favorited) {
-        return dispatch('favorite', { id: status.id })
+        return useStatusesStore().favorite(status.id)
       } else {
-        return dispatch('unfavorite', { id: status.id })
+        return useStatusesStore().unfavorite(status.id)
       }
     },
   },
@@ -112,7 +114,7 @@ export const BUTTONS = [
     if: ({ loggedIn }) => loggedIn,
     toggleable: false,
     dropdown: true,
-    action({ status, dispatch, emit }) {
+    action({ status, emit }) {
       /* prevent hiding */
     },
   },
@@ -130,11 +132,11 @@ export const BUTTONS = [
         PUBLIC_SCOPES.has(status.visibility)
       )
     },
-    action({ status, dispatch }) {
+    action({ status }) {
       if (status.pinned) {
-        return dispatch('unpinStatus', status.id)
+        return useStatusesStore().unpinStatus(status.id)
       } else {
-        return dispatch('pinStatus', status.id)
+        return useStatusesStore().pinStatus(status.id)
       }
     },
   },
@@ -150,11 +152,11 @@ export const BUTTONS = [
     label: ({ status }) =>
       status.bookmarked ? 'status.unbookmark' : 'status.bookmark',
     if: ({ loggedIn }) => loggedIn,
-    action({ status, dispatch }) {
+    action({ status }) {
       if (status.bookmarked) {
-        return dispatch('unbookmark', { id: status.id })
+        return useStatusesStore().unbookmark(status.id)
       } else {
-        return dispatch('bookmark', { id: status.id })
+        return useStatusesStore().bookmark(status.id)
       }
     },
   },
@@ -165,27 +167,14 @@ export const BUTTONS = [
     name: 'editHistory',
     icon: 'history',
     label: 'status.status_history',
-    if({ status, state }) {
+    if({ status }) {
       return (
         useInstanceCapabilitiesStore().editingAvailable &&
         status.edited_at !== null
       )
     },
     action({ status }) {
-      const originalStatus = { ...status }
-      const stripFieldsList = [
-        'attachments',
-        'created_at',
-        'emojis',
-        'text',
-        'raw_html',
-        'nsfw',
-        'poll',
-        'summary',
-        'summary_raw_html',
-      ]
-      stripFieldsList.forEach((p) => delete originalStatus[p])
-      useStatusHistoryStore().openStatusHistoryModal(originalStatus)
+      useStatusHistoryStore().openModal(status.id)
       return Promise.resolve()
     },
   },
@@ -196,26 +185,28 @@ export const BUTTONS = [
     name: 'edit',
     icon: 'pen',
     label: 'status.edit',
-    if({ status, loggedIn, currentUser, state }) {
+    if({ status, loggedIn, currentUser }) {
       return (
         loggedIn &&
         useInstanceCapabilitiesStore().editingAvailable &&
         status.user.id === currentUser.id
       )
     },
-    action({ dispatch, status }) {
-      return dispatch('fetchStatusSource', { id: status.id }).then((data) =>
-        useEditStatusStore().openEditStatusModal({
-          statusId: status.id,
-          statusSubject: data.spoiler_text,
-          statusText: data.text,
-          statusIsSensitive: status.nsfw,
-          statusPoll: status.poll,
-          statusFiles: [...status.attachments],
-          statusVisibility: status.visibility,
-          statusContentType: data.content_type,
-        }),
-      )
+    action({ status }) {
+      return useStatusesStore()
+        .fetchStatusSource(status.id)
+        .then((data) =>
+          useEditStatusStore().openEditStatusModal({
+            statusId: status.id,
+            statusSubject: data.spoiler_text,
+            statusText: data.text,
+            statusIsSensitive: status.nsfw,
+            statusPoll: status.poll,
+            statusFiles: [...status.attachments],
+            statusVisibility: status.visibility,
+            statusContentType: data.content_type,
+          }),
+        )
     },
   },
   {
@@ -260,15 +251,15 @@ export const BUTTONS = [
           currentUser.privileges.has('messages_delete'))
       )
     },
-    confirm: ({ getters }) => useMergedConfigStore().mergedConfig.modalOnDelete,
+    confirm: () => useMergedConfigStore().mergedConfig.modalOnDelete,
     confirmStrings: {
       title: 'status.delete_confirm_title',
       body: 'status.delete_confirm',
       confirm: 'status.delete_confirm_accept_button',
       cancel: 'status.delete_confirm_cancel_button',
     },
-    action({ dispatch, status }) {
-      return dispatch('deleteStatus', { id: status.id })
+    action({ status }) {
+      return useStatusesStore().deleteStatus(status.id)
     },
   },
   {
@@ -287,7 +278,7 @@ export const BUTTONS = [
     },
     toggleable: false,
     dropdown: true,
-    action({ status, dispatch, emit }) {
+    action({ status, emit }) {
       /* prevent hiding */
     },
   },
@@ -298,7 +289,7 @@ export const BUTTONS = [
     name: 'share',
     icon: 'share-alt',
     label: 'status.copy_link',
-    action({ state, status, router }) {
+    action({ status, router }) {
       navigator.clipboard.writeText(
         [
           useInstanceStore().server,
diff --git a/src/components/status_action_buttons/status_action_buttons.js b/src/components/status_action_buttons/status_action_buttons.js
index 73ac6ff7e..bbbdb79e5 100644
--- a/src/components/status_action_buttons/status_action_buttons.js
+++ b/src/components/status_action_buttons/status_action_buttons.js
@@ -6,6 +6,7 @@ import ActionButtonContainer from './action_button_container.vue'
 import { BUTTONS } from './buttons_definitions.js'
 
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import genRandomSeed from 'src/services/random_seed/random_seed.service.js'
 
@@ -88,7 +89,7 @@ const StatusActionButtons = {
       return this.buttons.filter((x) => !this.pinnedItems.has(x.name))
     },
     currentUser() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     funcArg() {
       return {
@@ -168,7 +169,7 @@ const StatusActionButtons = {
       useSyncConfigStore().pushSyncConfig()
     },
     getComponent(button) {
-      if (!this.$store.state.users.currentUser && button.anonLink) {
+      if (!useUsersStore().currentUser && button.anonLink) {
         return 'a'
       } else if (button.action == null && button.link != null) {
         return 'a'
diff --git a/src/components/status_body/status_body.js b/src/components/status_body/status_body.js
index dc74426ca..d361f3a9a 100644
--- a/src/components/status_body/status_body.js
+++ b/src/components/status_body/status_body.js
@@ -3,6 +3,7 @@ import { mapState } from 'pinia'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -154,7 +155,7 @@ const StatusBody = {
   mounted() {
     this.status.attentions?.forEach((attn) => {
       const { id } = attn
-      this.$store.dispatch('fetchUserIfMissing', id)
+      useUsersStore().fetchUserIfMissing({ id })
     })
   },
   methods: {
@@ -171,7 +172,7 @@ const StatusBody = {
           if (!cleanedString.startsWith('@')) return
           const handle = cleanedString.slice(1)
           const host = url.replace(/^https?:\/\//, '').replace(/\/.+?$/, '')
-          this.$store.dispatch('fetchUserIfMissing', `${handle}@${host}`)
+          useUsersStore().fetchUserIfMissing({ name: `${handle}@${host}` })
         })
       /* This is a bit of a hack to make current tall status detector work
        * with rich mentions. Invisible mentions are detected at RichContent level
diff --git a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js
index c2f070b6d..5e2c71b65 100644
--- a/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js
+++ b/src/components/status_bookmark_folder_menu/status_bookmark_folder_menu.js
@@ -3,6 +3,7 @@ import { mapState } from 'pinia'
 import Popover from 'src/components/popover/popover.vue'
 
 import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronRight, faFolder } from '@fortawesome/free-solid-svg-icons'
@@ -30,8 +31,8 @@ const StatusBookmarkFolderMenu = {
     toggleFolder(id) {
       const value = id === this.folderId ? null : id
 
-      this.$store
-        .dispatch('bookmark', { id: this.status.id, bookmark_folder_id: value })
+      useStatusesStore()
+        .bookmark(this.status.id, value)
         .then(() => this.$emit('success'))
         .catch((err) => this.$emit('error', err.error.error))
     },
diff --git a/src/components/status_content/status_content.js b/src/components/status_content/status_content.js
index 209abee99..60e2f8522 100644
--- a/src/components/status_content/status_content.js
+++ b/src/components/status_content/status_content.js
@@ -1,5 +1,4 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import Attachment from 'src/components/attachment/attachment.vue'
 import Gallery from 'src/components/gallery/gallery.vue'
@@ -9,6 +8,7 @@ import StatusBody from 'src/components/status_body/status_body.vue'
 
 import { useMediaViewerStore } from 'src/stores/media_viewer.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -84,10 +84,8 @@ const StatusContent = {
     maxThumbnails() {
       return this.mergedConfig.maxThumbnails
     },
-    ...mapPiniaState(useMergedConfigStore, ['mergedConfig']),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useMergedConfigStore, ['mergedConfig']),
+    ...mapState(useUsersStore, ['currentUser']),
   },
   components: {
     Attachment,
diff --git a/src/components/status_history_modal/status_history_modal.js b/src/components/status_history_modal/status_history_modal.js
index c165fe411..644e657fe 100644
--- a/src/components/status_history_modal/status_history_modal.js
+++ b/src/components/status_history_modal/status_history_modal.js
@@ -1,12 +1,14 @@
-import { get } from 'lodash'
+import { mapState } from 'pinia'
 
 import Modal from 'src/components/modal/modal.vue'
+import Status from 'src/components/status/status.vue'
 
 import { useStatusHistoryStore } from 'src/stores/statusHistory.js'
 
 const StatusHistoryModal = {
   components: {
     Modal,
+    Status,
   },
   data() {
     return {
@@ -14,48 +16,14 @@ const StatusHistoryModal = {
     }
   },
   computed: {
-    modalActivated() {
-      return useStatusHistoryStore().modalActivated
-    },
-    params() {
-      return useStatusHistoryStore().params
-    },
-    statusId() {
-      return this.params.id
-    },
     historyCount() {
-      return this.statuses.length
-    },
-    history() {
-      return this.statuses
-    },
-  },
-  watch: {
-    params(newVal, oldVal) {
-      const newStatusId = get(newVal, 'id') !== get(oldVal, 'id')
-      if (newStatusId) {
-        this.resetHistory()
-      }
-
-      if (
-        newStatusId ||
-        get(newVal, 'edited_at') !== get(oldVal, 'edited_at')
-      ) {
-        this.fetchStatusHistory()
-      }
+      return this.history.length
     },
+    ...mapState(useStatusHistoryStore, ['modalActivated', 'history']),
   },
   methods: {
-    resetHistory() {
-      this.statuses = []
-    },
-    fetchStatusHistory() {
-      this.$store.dispatch('fetchStatusHistory', this.params).then((data) => {
-        this.statuses = data
-      })
-    },
     closeModal() {
-      useStatusHistoryStore().closeStatusHistoryModal()
+      useStatusHistoryStore().closeModal()
     },
   },
 }
diff --git a/src/components/status_history_modal/status_history_modal.vue b/src/components/status_history_modal/status_history_modal.vue
index 282878b52..ee5f77fd2 100644
--- a/src/components/status_history_modal/status_history_modal.vue
+++ b/src/components/status_history_modal/status_history_modal.vue
@@ -15,7 +15,7 @@
           v-if="historyCount > 0"
           class="history-body"
         >
-          <status
+          <Status
             v-for="status in history"
             :key="status.id"
             :statusoid="status"
diff --git a/src/components/status_popover/status_popover.js b/src/components/status_popover/status_popover.js
index 95da91ba7..e9fc2398d 100644
--- a/src/components/status_popover/status_popover.js
+++ b/src/components/status_popover/status_popover.js
@@ -1,7 +1,7 @@
-import { find } from 'lodash'
-
 import Popover from 'src/components/popover/popover.vue'
 
+import { useStatusesStore } from 'src/stores/statuses.js'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
 
@@ -17,7 +17,7 @@ const StatusPopover = {
   },
   computed: {
     status() {
-      return find(this.$store.state.statuses.allStatuses, { id: this.statusId })
+      return useStatusesStore().allStatuses.get(this.statusId)
     },
   },
   components: {
@@ -30,8 +30,8 @@ const StatusPopover = {
           this.error = true
           return
         }
-        this.$store
-          .dispatch('fetchStatus', this.statusId)
+        useStatusesStore()
+          .fetchStatus(this.statusId)
           .then(() => (this.error = false))
           .catch(() => (this.error = true))
       }
diff --git a/src/components/status_popover/status_popover.vue b/src/components/status_popover/status_popover.vue
index ccfb06c02..a17b41675 100644
--- a/src/components/status_popover/status_popover.vue
+++ b/src/components/status_popover/status_popover.vue
@@ -14,7 +14,7 @@
       <Status
         v-if="status"
         :is-preview="true"
-        :statusoid="status"
+        :status-id="statusId"
         :compact="true"
         :ignore-mute="true"
       />
diff --git a/src/components/still-image/still-image-emoji-popover.js b/src/components/still-image/still-image-emoji-popover.js
index 6db72c49f..fc3f3bc0a 100644
--- a/src/components/still-image/still-image-emoji-popover.js
+++ b/src/components/still-image/still-image-emoji-popover.js
@@ -5,6 +5,7 @@ import { mapState } from 'pinia'
 import { useAdminSettingsStore } from 'src/stores/admin_settings'
 import { useEmojiStore } from 'src/stores/emoji'
 import { useInterfaceStore } from 'src/stores/interface'
+import { useUsersStore } from 'src/stores/users.js'
 
 export default {
   components: { Popover, SelectComponent },
@@ -25,7 +26,7 @@ export default {
   },
   computed: {
     isUserAdmin() {
-      return this.$store.state.users.currentUser?.rights.admin
+      return useUsersStore().currentUser?.rights.admin
     },
     ...mapState(useEmojiStore, ['adminPacksLocal', 'adminPacksLocalLoading']),
   },
diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx
index 01913f709..b21d4eb04 100644
--- a/src/components/tab_switcher/tab_switcher.jsx
+++ b/src/components/tab_switcher/tab_switcher.jsx
@@ -101,6 +101,10 @@ export default {
         classesTab.push('active')
         classesWrapper.push('active')
       }
+      if (props.disabled) {
+        classesTab.push('disabled')
+        classesWrapper.push('disabled')
+      }
       if (props.image) {
         return (
           <div class={classesWrapper.join(' ')}>
diff --git a/src/components/tag_timeline/tag_timeline.js b/src/components/tag_timeline/tag_timeline.js
deleted file mode 100644
index e82e86cfd..000000000
--- a/src/components/tag_timeline/tag_timeline.js
+++ /dev/null
@@ -1,36 +0,0 @@
-import Timeline from 'src/components/timeline/timeline.vue'
-
-const TagTimeline = {
-  created() {
-    this.$store.commit('clearTimeline', { timeline: 'tag' })
-    this.$store.dispatch('startFetchingTimeline', {
-      timeline: 'tag',
-      tag: this.tag,
-    })
-  },
-  components: {
-    Timeline,
-  },
-  computed: {
-    tag() {
-      return this.$route.params.tag
-    },
-    timeline() {
-      return this.$store.state.statuses.timelines.tag
-    },
-  },
-  watch: {
-    tag() {
-      this.$store.commit('clearTimeline', { timeline: 'tag' })
-      this.$store.dispatch('startFetchingTimeline', {
-        timeline: 'tag',
-        tag: this.tag,
-      })
-    },
-  },
-  unmounted() {
-    this.$store.dispatch('stopFetchingTimeline', 'tag')
-  },
-}
-
-export default TagTimeline
diff --git a/src/components/thread_tree/thread_tree.js b/src/components/thread_tree/thread_tree.js
index 75232a259..6bcfa469f 100644
--- a/src/components/thread_tree/thread_tree.js
+++ b/src/components/thread_tree/thread_tree.js
@@ -11,7 +11,7 @@ const ThreadTree = {
   name: 'ThreadTree',
   props: {
     depth: Number,
-    status: Object,
+    statusId: String,
     inProfile: Boolean,
     conversation: Array,
     collapsable: Boolean,
@@ -30,31 +30,13 @@ const ThreadTree = {
     totalReplyCount: Object,
     totalReplyDepth: Object,
   },
-  emits: ['suspendableStateChange', 'goto', 'dive'],
+  emits: ['suspendableStateChange', 'goto', 'dive', 'heightChange'],
   computed: {
-    reverseLookupTable() {
-      return this.conversation.reduce(
-        (table, status, index) => {
-          table[status.id] = index
-          return table
-        },
-        {
-          /* no-op */
-        },
-      )
-    },
     currentReplies() {
-      return this.getReplies(this.status.id).map(({ id }) =>
-        this.statusById(id),
-      )
+      return this.getReplies(this.statusId).map(({ id }) => id)
     },
     threadShowing() {
-      return this.threadDisplayStatus[this.status.id] === 'showing'
-    },
-  },
-  methods: {
-    statusById(id) {
-      return this.conversation[this.reverseLookupTable[id]]
+      return this.threadDisplayStatus[this.statusId] === 'showing'
     },
   },
 }
diff --git a/src/components/thread_tree/thread_tree.vue b/src/components/thread_tree/thread_tree.vue
index 556858ad7..be95f8698 100644
--- a/src/components/thread_tree/thread_tree.vue
+++ b/src/components/thread_tree/thread_tree.vue
@@ -1,38 +1,39 @@
 <template>
   <article class="thread-tree">
     <Status
-      :key="status.id"
+      :key="statusId"
       ref="statusComponent"
-      :statusoid="status"
-      :replies="getReplies(status.id)"
+      :status-id="statusId"
+      :replies="getReplies(statusId)"
       :inline-expanded="collapsable && isExpanded"
       :expandable="!isExpanded"
       :show-pinned="pinnedStatusIdsObject && pinnedStatusIdsObject[status.id]"
       :in-conversation="isExpanded"
-      :focused="focused === status.id || focused === status.retweeted_status?.id"
+      :focused="focused === statusId"
       :in-profile="inProfile"
       :profile-user-id="profileUserId"
       class="conversation-status conversation-status-treeview status-fadein panel-body"
 
       :simple-tree="simple"
-      :thread-display-status="threadDisplayStatus[status.id]"
+      :thread-display-status="threadDisplayStatus[statusId]"
       :can-dive="canDive"
 
-      @dive="$emit('dive', status.id)"
-      @goto="$emit('goto', status.id)"
+      @dive="$emit('dive', statusId)"
+      @goto="$emit('goto', statusId)"
       @toggle-expanded="toggleExpanded"
       @suspendable-state-change="e => $emit('suspendableStateChange', e)"
+      @height-change="e => $emit('heightChange', e)"
     />
     <div
       v-if="currentReplies.length > 0 && threadShowing"
       class="thread-tree-replies"
     >
       <ThreadTree
-        v-for="replyStatus in currentReplies"
-        :key="replyStatus.id"
+        v-for="replyStatusId in currentReplies"
+        :key="replyStatusId"
         ref="childComponent"
         :depth="depth + 1"
-        :status="replyStatus"
+        :status-id="replyStatusId"
 
         :in-profile="inProfile"
         :conversation="conversation"
@@ -55,6 +56,7 @@
         @goto="(e) => $emit('goto', e)"
         @dive="(e) => $emit('dive', e)"
         @suspendable-state-change="e => $emit('suspendableStateChange', e)"
+        @height-change="e => $emit('heightChange', e)"
       />
     </div>
     <div
@@ -67,7 +69,7 @@
         tag="button"
         keypath="status.thread_follow_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
-        @click.prevent="$emit('dive', status.id)"
+        @click.prevent="$emit('dive', statusId)"
       >
         <template #icon>
           <FAIcon
@@ -76,7 +78,7 @@
         </template>
         <template #text>
           <span>
-            {{ $t('status.thread_follow', { numStatus: totalReplyCount[status.id] }, totalReplyCount[status.id]) }}
+            {{ $t('status.thread_follow', { numStatus: totalReplyCount[statusId] }, totalReplyCount[statusId]) }}
           </span>
         </template>
       </i18n-t>
@@ -86,7 +88,7 @@
         tag="button"
         keypath="status.thread_show_full_with_icon"
         class="button-unstyled -link thread-tree-show-replies-button"
-        @click.prevent="showThreadRecursively(status.id)"
+        @click.prevent="showThreadRecursively(statusId)"
       >
         <template #icon>
           <FAIcon
@@ -95,7 +97,7 @@
         </template>
         <template #text>
           <span>
-            {{ $t('status.thread_show_full', { numStatus: totalReplyCount[status.id], depth: totalReplyDepth[status.id] }, totalReplyCount[status.id]) }}
+            {{ $t('status.thread_show_full', { numStatus: totalReplyCount[statusId], depth: totalReplyDepth[statusId] }, totalReplyCount[statusId]) }}
           </span>
         </template>
       </i18n-t>
diff --git a/src/components/timeline/timeline.js b/src/components/timeline/timeline.js
index c3f4d381d..38ee99931 100644
--- a/src/components/timeline/timeline.js
+++ b/src/components/timeline/timeline.js
@@ -1,4 +1,4 @@
-import { debounce, keyBy, throttle } from 'lodash'
+import { debounce, throttle } from 'lodash'
 import { mapState } from 'pinia'
 
 import Conversation from 'src/components/conversation/conversation.vue'
@@ -9,8 +9,8 @@ import TimelineMenu from 'src/components/timeline_menu/timeline_menu.vue'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
-
-import timelineFetcher from 'src/services/timeline_fetcher/timeline_fetcher.service.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -25,27 +25,19 @@ import {
 library.add(faCircleNotch, faCog, faMinus, faArrowUp, faCirclePlus, faCheck)
 
 const Timeline = {
-  props: [
-    'timeline',
-    'timelineName',
-    'title',
-    'userId',
-    'listId',
-    'statusId',
-    'bookmarkFolderId',
-    'tag',
-    'embedded',
-    'count',
-    'pinnedStatusIds',
-    'inProfile',
-    'footerSlipgate', // reference to an element where we should put our footer
-  ],
+  props: {
+    timelineRef: Object,
+    footerSlipgate: Object, // reference to an element where we should put our footer
+    embedded: Boolean,
+    inProfile: Boolean,
+    skipPinned: Boolean,
+    hideEmpty: Boolean,
+  },
   data() {
     return {
       showScrollTop: false,
       paused: false,
       unfocused: false,
-      bottomedOut: false,
       virtualScrollIndex: 0,
       blockingClicks: false,
     }
@@ -58,34 +50,33 @@ const Timeline = {
     QuickViewSettings,
   },
   computed: {
-    filteredVisibleStatuses() {
-      return this.timeline.visibleStatuses.filter(
-        (status) =>
-          this.timelineName !== 'user' ||
-          (status.id >= this.timeline.minId &&
-            status.id <= this.timeline.maxId),
-      )
+    timeline() {
+      return useTimelinesStore()[this.timelineRef.name]
     },
-    filteredPinnedStatusIds() {
-      return (this.pinnedStatusIds || []).filter(
-        (statusId) => this.timeline.statusesObject[statusId],
-      )
+    filteredVisibleStatuses() {
+      return this.timeline.order
+        .filter((id) => this.timeline.visibleStatusIds.has(id))
+        .map((id) => useStatusesStore().allStatuses.get(id))
+        .filter(({ pinned }) => (this.skipPinned ? !pinned : true))
+    },
+    count() {
+      return this.timeline.order.length
     },
     newStatusCount() {
       return this.timeline.newStatusCount
     },
     showLoadButton() {
-      return this.timeline.newStatusCount > 0 || this.timeline.flushMarker !== 0
+      return this.timeline.newStatusCount > 0 || this.timeline.reloadNeeded
     },
     loadButtonString() {
-      if (this.timeline.flushMarker !== 0) {
+      if (this.timeline.reloadNeeded) {
         return this.$t('timeline.reload')
       } else {
         return `${this.$t('timeline.show_new')} (${this.newStatusCount})`
       }
     },
     mobileLoadButtonString() {
-      if (this.timeline.flushMarker !== 0) {
+      if (this.timeline.reloadNeeded) {
         return '+'
       } else {
         return this.newStatusCount > 99 ? '∞' : this.newStatusCount
@@ -110,18 +101,18 @@ const Timeline = {
         ),
       }
     },
-    // id map of statuses which need to be hidden in the main list due to pinning logic
-    pinnedStatusIdsObject() {
-      return keyBy(this.pinnedStatusIds)
-    },
     statusesToDisplay() {
-      const amount = this.timeline.visibleStatuses.length
+      if (!this.virtualScrollingEnabled) {
+        return new Set(this.filteredVisibleStatuses.map(({ id }) => id))
+      }
+
+      const amount = this.timeline.visibleStatusIds.size
       const statusesPerSide = Math.ceil(Math.max(3, window.innerHeight / 80))
-      const nonPinnedIndex =
-        this.virtualScrollIndex - this.filteredPinnedStatusIds.length
-      const min = Math.max(0, nonPinnedIndex - statusesPerSide)
-      const max = Math.min(amount, nonPinnedIndex + statusesPerSide)
-      return this.timeline.visibleStatuses.slice(min, max).map((_) => _.id)
+      const min = Math.max(0, this.virtualScrollIndex - statusesPerSide)
+      const max = Math.min(amount, this.virtualScrollIndex + statusesPerSide)
+      return new Set(
+        this.filteredVisibleStatuses.slice(min, max).map(({ id }) => id),
+      )
     },
     virtualScrollingEnabled() {
       return useMergedConfigStore().mergedConfig.virtualScrolling
@@ -131,27 +122,7 @@ const Timeline = {
     }),
   },
   created() {
-    const store = this.$store
-    const credentials = store.state.users.currentUser.credentials
-    const showImmediately = this.timeline.visibleStatuses.length === 0
-
-    window.addEventListener('scroll', this.handleScroll)
-
-    if (store.state.api.fetchers[this.timelineName]) {
-      return false
-    }
-
-    timelineFetcher.fetchAndUpdate({
-      store,
-      credentials,
-      timeline: this.timelineName,
-      showImmediately,
-      userId: this.userId,
-      listId: this.listId,
-      statusId: this.statusId,
-      bookmarkFolderId: this.bookmarkFolderId,
-      tag: this.tag,
-    })
+    this.timelineChange(this.timelineRef)
   },
   mounted() {
     if (document.hidden !== undefined) {
@@ -163,9 +134,11 @@ const Timeline = {
       this.unfocused = document.hidden
     }
     window.addEventListener('keydown', this.handleShortKey)
+    window.addEventListener('scroll', this.handleScroll)
     setTimeout(this.determineVisibleStatuses, 250)
   },
   unmounted() {
+    this.timelineChange(null, this.timelineRef)
     window.removeEventListener('scroll', this.handleScroll)
     window.removeEventListener('keydown', this.handleShortKey)
     if (document.hidden !== undefined)
@@ -174,12 +147,20 @@ const Timeline = {
         this.handleVisibilityChange,
         false,
       )
-    this.$store.commit('setLoading', {
-      timeline: this.timelineName,
-      value: false,
-    })
   },
   methods: {
+    timelineChange(newTimeline, oldTimeline) {
+      const sameName = newTimeline?.name === oldTimeline?.name
+      const sameArgument = newTimeline?.argument === oldTimeline?.argument
+      if (sameName && sameArgument) return
+
+      if (oldTimeline) {
+        useTimelinesStore().deactivate(oldTimeline.name)
+      }
+      if (newTimeline) {
+        useTimelinesStore().activate(newTimeline.name, newTimeline.argument)
+      }
+    },
     stopBlockingClicks: debounce(function () {
       this.blockingClicks = false
     }, 1000),
@@ -195,52 +176,19 @@ const Timeline = {
       if (e.key === '.') this.showNewStatuses()
     },
     showNewStatuses() {
-      if (this.timeline.flushMarker !== 0) {
-        this.$store.commit('clearTimeline', {
-          timeline: this.timelineName,
-          excludeUserId: true,
-        })
-        this.$store.commit('queueFlush', { timeline: this.timelineName, id: 0 })
-        if (this.timelineName === 'user') {
-          this.$store.dispatch('fetchPinnedStatuses', this.userId)
-        }
+      if (this.timeline.reloadNeeded) {
+        useTimelinesStore().clearTimeline(this.timelineRef.name)
         this.fetchOlderStatuses()
       } else {
         this.blockClicksTemporarily()
-        this.$store.commit('showNewStatuses', { timeline: this.timelineName })
+        useTimelinesStore().showNewStatuses(this.timelineRef.name)
         this.paused = false
       }
       window.scrollTo({ top: 0 })
     },
     fetchOlderStatuses: throttle(
       function () {
-        const store = this.$store
-        const credentials = store.state.users.currentUser.credentials
-        store.commit('setLoading', { timeline: this.timelineName, value: true })
-        timelineFetcher
-          .fetchAndUpdate({
-            store,
-            credentials,
-            timeline: this.timelineName,
-            older: true,
-            showImmediately: true,
-            userId: this.userId,
-            listId: this.listId,
-            statusId: this.statusId,
-            bookmarkFolderId: this.bookmarkFolderId,
-            tag: this.tag,
-          })
-          .then(({ statuses }) => {
-            if (statuses?.length === 0) {
-              this.bottomedOut = true
-            }
-          })
-          .finally(() =>
-            store.commit('setLoading', {
-              timeline: this.timelineName,
-              value: false,
-            }),
-          )
+        this.timeline.fetcher.fetchOlder()
       },
       1000,
       this,
@@ -250,13 +198,12 @@ const Timeline = {
       if (!this.virtualScrollingEnabled) return
 
       const statuses = this.$refs.timeline.children
+      if (statuses.length === 0) return
       const cappedScrollIndex = Math.max(
         0,
         Math.min(this.virtualScrollIndex, statuses.length - 1),
       )
 
-      if (statuses.length === 0) return
-
       const height = Math.max(document.body.offsetHeight, window.pageYOffset)
 
       const centerOfScreen = window.pageYOffset + window.innerHeight * 0.5
@@ -295,11 +242,11 @@ const Timeline = {
       this.virtualScrollIndex = approxIndex
     },
     scrollLoad() {
+      // TODO simplify this logic
       const bodyBRect = document.body.getBoundingClientRect()
       const height = Math.max(bodyBRect.height, -bodyBRect.y)
       if (
-        this.timeline.loading === false &&
-        this.$el.offsetHeight > 0 &&
+        !this.timeline.fetcher.loadingOlder &&
         window.innerHeight + window.pageYOffset >= height - 750
       ) {
         this.fetchOlderStatuses()
@@ -314,6 +261,9 @@ const Timeline = {
     },
   },
   watch: {
+    timelineRef(newTimeline, oldTimeline) {
+      this.timelineChange(newTimeline, oldTimeline)
+    },
     filteredVisibleStatuses() {
       this.determineVisibleStatuses()
     },
diff --git a/src/components/timeline/timeline.scss b/src/components/timeline/timeline.scss
index 2dd66328d..984129bf4 100644
--- a/src/components/timeline/timeline.scss
+++ b/src/components/timeline/timeline.scss
@@ -4,6 +4,14 @@
     backdrop-filter: none;
   }
 
+  .timeline-placeholder {
+    background: var(--background);
+    display: flex;
+    place-items: center;
+    place-content: center;
+    padding: 5em;
+  }
+
   .alert-badge {
     font-size: 0.75em;
     line-height: 1;
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index 287934657..5b34551bc 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -1,13 +1,24 @@
 <template>
-  <div :class="['Timeline', classes.root]">
+  <!-- there is a brief moment during logout when old timeline gets forcibly deactivated -->
+  <div v-if="timeline.fetcher" :class="['Timeline', classes.root]">
     <div
       v-if="!embedded"
       :class="classes.header"
     >
       <TimelineMenu
         v-if="!embedded"
-        :timeline-name="timelineName"
+        :timeline-name="timelineRef.name"
       />
+      <div
+        v-if="timeline.fetcher.loadingNewer && !showLoadButton"
+        class="loadingIndicator"
+      >
+        <FAIcon
+          fixed-width
+          icon="circle-notch"
+          spin
+        />
+      </div>
       <ScrollTopButton />
       <template v-if="mobileLayout">
         <div
@@ -29,7 +40,7 @@
           </button>
         </div>
         <div
-          v-else
+          v-else-if="!timeline.fetcher.loadingNewer"
           class="loadmore-text faint veryfaint rightside-icon"
           :title="$t('timeline.up_to_date')"
           :aria-disabled="true"
@@ -71,17 +82,6 @@
         class="timeline"
         role="feed"
       >
-        <Conversation
-          v-for="statusId in filteredPinnedStatusIds"
-          :key="statusId + '-pinned'"
-          role="listitem"
-          class="status-fadein"
-          :status-id="statusId"
-          :pinned-status-ids-object="pinnedStatusIdsObject"
-          :in-profile="inProfile"
-          :profile-user-id="userId"
-          collapsable
-        />
         <Conversation
           v-for="status in filteredVisibleStatuses"
           :key="status.id"
@@ -89,40 +89,43 @@
           class="status-fadein"
           :status-id="status.id"
           :in-profile="inProfile"
-          :profile-user-id="userId"
-          :virtual-hidden="virtualScrollingEnabled && !statusesToDisplay.includes(status.id)"
+          :profile-user-id="timelineRef.argument"
+          :virtual-hidden="virtualScrollingEnabled && !statusesToDisplay.has(status.id)"
           collapsable
         />
       </div>
+      <template v-if="!hideEmpty && count === 0">
+        <div
+          v-if="timeline.fetcher.loadingNewer || timeline.fetcher.loadingOlder"
+          class="timeline-placeholder"
+        >
+          <FAIcon
+            icon="circle-notch"
+            spin
+            size="4x"
+          />
+        </div>
+        <div
+          v-else
+          class="timeline-placeholder faint"
+        >
+          {{ $t('timeline.no_statuses') }}
+        </div>
+      </template>
     </div>
-    <div :class="classes.footer">
+    <div v-if="!embedded || footerSlipgate" :class="classes.footer">
       <teleport
         :to="footerSlipgate"
         :disabled="!embedded || !footerSlipgate"
       >
         <div
-          v-if="count===0"
-          class="new-status-notification text-center faint"
-        >
-          {{ $t('timeline.no_statuses') }}
-        </div>
-        <div
-          v-else-if="bottomedOut"
+          v-if="timeline.fetcher.bottomedOut"
           class="new-status-notification text-center faint"
         >
           {{ $t('timeline.no_more_statuses') }}
         </div>
-        <button
-          v-else-if="!timeline.loading"
-          class="button-unstyled -link"
-          @click.prevent="fetchOlderStatuses()"
-        >
-          <div class="new-status-notification text-center">
-            {{ $t('timeline.load_older') }}
-          </div>
-        </button>
         <div
-          v-else
+          v-else-if="timeline.fetcher.loadingOlder"
           class="new-status-notification text-center"
         >
           <FAIcon
@@ -131,6 +134,15 @@
             size="lg"
           />
         </div>
+        <button
+          v-else-if="timeline.minId !== ''"
+          class="button-unstyled -link"
+          @click.prevent="fetchOlderStatuses()"
+        >
+          <div class="new-status-notification text-center">
+            {{ $t('timeline.load_older') }}
+          </div>
+        </button>
       </teleport>
       <!-- spacer to avoid having empty shrug -->
       <span v-if="embedded && footerSlipgate" />
diff --git a/src/components/timeline_menu/timeline_menu.js b/src/components/timeline_menu/timeline_menu.js
index ee6fa8f20..185a127c4 100644
--- a/src/components/timeline_menu/timeline_menu.js
+++ b/src/components/timeline_menu/timeline_menu.js
@@ -1,5 +1,4 @@
-import { mapState as mapPiniaState } from 'pinia'
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import BookmarkFoldersMenuContent from 'src/components/bookmark_folders_menu/bookmark_folders_menu_content.vue'
 import ListsMenuContent from 'src/components/lists_menu/lists_menu_content.vue'
@@ -13,6 +12,7 @@ import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useInterfaceStore } from 'src/stores/interface'
 import { useListsStore } from 'src/stores/lists'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronDown } from '@fortawesome/free-solid-svg-icons'
@@ -62,16 +62,30 @@ const TimelineMenu = {
         (route === 'bookmark-folder' || route === 'bookmarks')
       )
     },
-    ...mapPiniaState(useInstanceCapabilitiesStore, [
+    timelineName() {
+      const route = this.$route.name
+      if (route === 'tag-timeline') {
+        return '#' + this.$route.params.tag
+      }
+      if (route === 'lists-timeline') {
+        return useListsStore().findListTitle(this.$route.params.id)
+      }
+      if (route === 'bookmark-folder') {
+        return useBookmarkFoldersStore().findBookmarkFolderName(
+          this.$route.params.id,
+        )
+      }
+      const i18nkey = timelineNames(this.bookmarkFolders)[this.$route.name]
+      return i18nkey ? this.$t(i18nkey) : route
+    },
+    ...mapState(useInstanceCapabilitiesStore, [
       'pleromaChatMessagesAvailable',
       'pleromaBookmarkFoldersAvailable',
       'bookmarkFolders',
       'localBubble',
     ]),
-    ...mapPiniaState(useInstanceStore, ['privateMode', 'federating']),
-    ...mapState({
-      currentUser: (state) => state.users.currentUser,
-    }),
+    ...mapState(useInstanceStore, ['privateMode', 'federating']),
+    ...mapState(useUsersStore, ['currentUser']),
     timelinesList() {
       return filterNavigation(
         Object.entries(TIMELINES).map(([k, v]) => ({ ...v, name: k })),
@@ -105,22 +119,6 @@ const TimelineMenu = {
         event.stopPropagation()
       }
     },
-    timelineName() {
-      const route = this.$route.name
-      if (route === 'tag-timeline') {
-        return '#' + this.$route.params.tag
-      }
-      if (route === 'lists-timeline') {
-        return useListsStore().findListTitle(this.$route.params.id)
-      }
-      if (route === 'bookmark-folder') {
-        return useBookmarkFoldersStore().findBookmarkFolderName(
-          this.$route.params.id,
-        )
-      }
-      const i18nkey = timelineNames(this.bookmarkFolders)[this.$route.name]
-      return i18nkey ? this.$t(i18nkey) : route
-    },
   },
 }
 
diff --git a/src/components/timeline_menu/timeline_menu.vue b/src/components/timeline_menu/timeline_menu.vue
index 717c8a8e8..6a56e8741 100644
--- a/src/components/timeline_menu/timeline_menu.vue
+++ b/src/components/timeline_menu/timeline_menu.vue
@@ -30,7 +30,7 @@
     </template>
     <template #trigger>
       <span class="button-unstyled timeline-menu-title">
-        <h1 class="title timeline-title">{{ timelineName() }}</h1>
+        <h1 class="title timeline-title">{{ timelineName }}</h1>
         <span>
           <FAIcon
             size="sm"
diff --git a/src/components/update_notification/update_notification.js b/src/components/update_notification/update_notification.js
index 2a9fb7f60..6e60a6457 100644
--- a/src/components/update_notification/update_notification.js
+++ b/src/components/update_notification/update_notification.js
@@ -3,6 +3,7 @@ import Modal from 'src/components/modal/modal.vue'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import pleromaTanFoxMask from 'src/assets/pleromatan_apology_fox_mask.png'
 import pleromaTanMask from 'src/assets/pleromatan_apology_mask.png'
@@ -41,7 +42,7 @@ const UpdateNotification = {
     shouldShow() {
       return (
         !useInstanceStore().disableUpdateNotification &&
-        this.$store.state.users.currentUser &&
+        useUsersStore().currentUser &&
         useSyncConfigStore().flagStorage.updateCounter <
           CURRENT_UPDATE_COUNTER &&
         !useMergedConfigStore().mergedConfig.dontShowUpdateNotifs
diff --git a/src/components/user_avatar/user_avatar.js b/src/components/user_avatar/user_avatar.js
index 3ab0ee9e7..4f15d4926 100644
--- a/src/components/user_avatar/user_avatar.js
+++ b/src/components/user_avatar/user_avatar.js
@@ -1,5 +1,7 @@
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
+import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faPeopleGroup, faRobot } from '@fortawesome/free-solid-svg-icons'
@@ -8,10 +10,10 @@ library.add(faRobot, faPeopleGroup)
 
 const UserAvatar = {
   props: {
-    // User object to show avatar of
-    user: {
+    // UserID of a user to show avatar of
+    userId: {
       required: true,
-      type: Object,
+      type: String,
     },
     // Use less space and use alternative roundness
     compact: {
@@ -19,12 +21,6 @@ const UserAvatar = {
       type: Boolean,
       default: false,
     },
-    // Show small icon indicating if account is a bot or group
-    showActorTypeIndicator: {
-      required: false,
-      type: Boolean,
-      default: false,
-    },
     // Override avatar image URL, useful for profile editing
     url: {
       required: false,
@@ -39,7 +35,14 @@ const UserAvatar = {
       betterShadow: useInterfaceStore().browserSupport.cssFilter,
     }
   },
-  components: {},
+  computed: {
+    user() {
+      return useUsersStore().findUser(this.userId)
+    },
+    showActorTypeIndicator() {
+      return !useMergedConfigStore().mergedConfig.hideBotIndication
+    },
+  },
   methods: {
     imgSrc(src) {
       return !src || this.showPlaceholder ? this.defaultAvatar : src
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index b6e720c6f..739c1579b 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -25,6 +25,7 @@ import { useMediaViewerStore } from 'src/stores/media_viewer'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { usePostStatusStore } from 'src/stores/post_status'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfile } from 'src/api/user.js'
 import { propsToNative } from 'src/services/attributes_helper/attributes_helper.service.js'
@@ -158,7 +159,7 @@ export default {
     ),
   },
   data() {
-    const user = this.$store.getters.findUser(this.userId)
+    const user = useUsersStore().findUser(this.userId)
 
     return {
       followRequestInProgress: false,
@@ -192,7 +193,7 @@ export default {
     }
   },
   created() {
-    this.$store.dispatch('fetchUserRelationship', this.user.id)
+    useUsersStore().fetchUserRelationship(this.user.id)
   },
   computed: {
     escapedNewBio() {
@@ -228,23 +229,23 @@ export default {
         : ['Person', 'Service']
     },
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     role() {
       return this.user.role
     },
     relationship() {
-      return this.$store.getters.relationship(this.userId)
+      return useUsersStore().relationship(this.userId)
     },
     isOtherUser() {
-      return this.user.id !== this.$store.state.users.currentUser.id
+      return this.user.id !== useUsersStore().currentUser?.id
     },
     subscribeUrl() {
       const serverUrl = new URL(this.user.statusnet_profile_url)
       return `${serverUrl.protocol}//${serverUrl.host}/main/ostatus`
     },
     loggedIn() {
-      return this.$store.state.users.currentUser
+      return useUsersStore().currentUser
     },
     dailyAvg() {
       const days = Math.ceil(
@@ -394,17 +395,15 @@ export default {
     isDefaultAvatar() {
       const baseAvatar = useInstanceStore().instanceIdenitity.defaultAvatar
       return (
-        !this.$store.state.users.currentUser.profile_image_url ||
-        this.$store.state.users.currentUser.profile_image_url.includes(
-          baseAvatar,
-        )
+        !useUsersStore().currentUser.profile_image_url ||
+        useUsersStore().currentUser.profile_image_url.includes(baseAvatar)
       )
     },
     isDefaultBanner() {
       const baseBanner = useInstanceStore().instanceIdentity.defaultBanner
       return (
-        !this.$store.state.users.currentUser.cover_photo ||
-        this.$store.state.users.currentUser.cover_photo.includes(baseBanner)
+        !useUsersStore().currentUser.cover_photo ||
+        useUsersStore().currentUser.cover_photo.includes(baseBanner)
       )
     },
     fieldsLimits() {
@@ -455,13 +454,13 @@ export default {
       this.$refs.timedMuteDialog.optionallyPrompt()
     },
     unmuteUser() {
-      this.$store.dispatch('unmuteUser', this.user.id)
+      return useUsersStore().unmuteUser(this.user.id)
     },
     subscribeUser() {
-      return this.$store.dispatch('subscribeUser', this.user.id)
+      return useUsersStore().subscribeUser(this.user.id)
     },
     unsubscribeUser() {
-      return this.$store.dispatch('unsubscribeUser', this.user.id)
+      return useUsersStore().unsubscribeUser(this.user.id)
     },
     linkClicked({ target }) {
       if (target.tagName === 'SPAN') {
@@ -557,7 +556,7 @@ export default {
       return
     },
     resetState() {
-      const user = this.$store.state.users.currentUser
+      const user = useUsersStore().currentUser
 
       this.newName = user.name_unescaped
       this.newBio = ldUnescape(user.description)
@@ -603,11 +602,10 @@ export default {
       }
 
       updateProfile({ params })
-        .then(({ data: user }) => {
+        .then(({ data: user, ...rest }) => {
           this.newFields.splice(this.newFields.length)
           merge(this.newFields, user.fields)
-          this.$store.commit('addNewUsers', [user])
-          this.$store.commit('setCurrentUser', user)
+          useUsersStore().addNewUsers({ data: user, ...rest })
           this.resetState()
         })
         .catch((error) => {
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index e6c6485f7..525a22833 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -23,7 +23,7 @@
             class="user-info-avatar -link"
             @click="zoomAvatar"
           >
-            <UserAvatar :user="user" />
+            <UserAvatar :user-id="user.id" />
             <div class="user-info-avatar -link -overlay">
               <FAIcon
                 class="fa-scale-110 fa-old-padding"
@@ -38,7 +38,7 @@
             @click="changeAvatar"
           >
             <UserAvatar
-              :user="user"
+              :user-id="user.id"
               :url="avatarImgSrc"
             />
             <div class="user-info-avatar -link -overlay">
@@ -51,7 +51,7 @@
           <UserAvatar
             v-else-if="typeof avatarAction === 'function'"
             class="user-info-avatar"
-            :user="user"
+            :user-id="user.id"
             @click="avatarAction"
           />
           <router-link
@@ -59,7 +59,7 @@
             class="user-info-avatar"
             :to="userProfileLink(user)"
           >
-            <UserAvatar :user="user" />
+            <UserAvatar :user-id="user.id" />
           </router-link>
           <div class="user-summary">
             <div class="top-line">
diff --git a/src/components/user_list_menu/user_list_menu.js b/src/components/user_list_menu/user_list_menu.js
index b36175276..d04cdf692 100644
--- a/src/components/user_list_menu/user_list_menu.js
+++ b/src/components/user_list_menu/user_list_menu.js
@@ -3,6 +3,7 @@ import { mapState } from 'pinia'
 import Popover from 'src/components/popover/popover.vue'
 
 import { useListsStore } from 'src/stores/lists.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faChevronRight } from '@fortawesome/free-solid-svg-icons'
@@ -18,7 +19,7 @@ const UserListMenu = {
     Popover,
   },
   created() {
-    this.$store.dispatch('fetchUserInLists', this.user.id)
+    useUsersStore().fetchUserInLists(this.user.id)
   },
   computed: {
     ...mapState(useListsStore, {
@@ -49,7 +50,7 @@ const UserListMenu = {
             if (!response.ok) {
               return
             }
-            this.$store.dispatch('fetchUserInLists', this.user.id)
+            useUsersStore().fetchUserInLists(this.user.id)
           })
       } else {
         useListsStore()
@@ -58,7 +59,7 @@ const UserListMenu = {
             if (!response.ok) {
               return
             }
-            this.$store.dispatch('fetchUserInLists', this.user.id)
+            useUsersStore().fetchUserInLists(this.user.id)
           })
       }
     },
diff --git a/src/components/user_list_popover/user_list_popover.js b/src/components/user_list_popover/user_list_popover.js
index 84107d6b1..f5a403be2 100644
--- a/src/components/user_list_popover/user_list_popover.js
+++ b/src/components/user_list_popover/user_list_popover.js
@@ -4,6 +4,7 @@ import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
@@ -14,15 +15,22 @@ library.add(faCircleNotch)
 
 const UserListPopover = {
   name: 'UserListPopover',
-  props: ['users'],
+  props: {
+    userIds: Set,
+  },
   components: {
     UnicodeDomainIndicator,
     Popover,
     UserAvatar,
   },
   computed: {
+    users() {
+      return [...this.userIds]
+        .map((id) => useUsersStore().findUser(id))
+        .filter(Boolean)
+    },
     usersCapped() {
-      return this.users.slice(0, 16)
+      return [...this.users].slice(0, 16)
     },
     allowNonSquareEmoji() {
       return useMergedConfigStore().mergedConfig.nonSquareEmoji
diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue
index ddeb6f6f6..b5677bcab 100644
--- a/src/components/user_list_popover/user_list_popover.vue
+++ b/src/components/user_list_popover/user_list_popover.vue
@@ -9,7 +9,7 @@
     </template>
     <template #content>
       <div class="user-list-popover">
-        <template v-if="users.length">
+        <template v-if="userIds.size > 0">
           <router-link
             v-for="(user) in usersCapped"
             :key="user.id"
@@ -17,7 +17,7 @@
             class="user-list-row"
           >
             <UserAvatar
-              :user="user"
+              :user-id="user.id"
               class="avatar-small"
               :compact="true"
             />
diff --git a/src/components/user_note/user_note.js b/src/components/user_note/user_note.js
index bd246e9b3..dab3ac9f6 100644
--- a/src/components/user_note/user_note.js
+++ b/src/components/user_note/user_note.js
@@ -1,5 +1,7 @@
 import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const UserNote = {
   props: {
     user: Object,
@@ -29,11 +31,8 @@ const UserNote = {
     finalizeEditing() {
       this.frozen = true
 
-      this.$store
-        .dispatch('editUserNote', {
-          id: this.user.id,
-          comment: this.localNote,
-        })
+      useUsersStore()
+        .editUserNote(this.user.id, this.localNote)
         .then(() => {
           this.frozen = false
           this.editing = false
diff --git a/src/components/user_panel/user_panel.js b/src/components/user_panel/user_panel.js
index 08270a1c6..ed74c86c7 100644
--- a/src/components/user_panel/user_panel.js
+++ b/src/components/user_panel/user_panel.js
@@ -1,15 +1,14 @@
-import { mapState } from 'vuex'
+import { mapState } from 'pinia'
 
 import AuthForm from 'src/components/auth_form/auth_form.js'
 import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
 import UserCard from 'src/components/user_card/user_card.vue'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 const UserPanel = {
   computed: {
-    signedIn() {
-      return this.user
-    },
-    ...mapState({ user: (state) => state.users.currentUser }),
+    ...mapState(useUsersStore, ['currentUser', 'loggedIn']),
   },
   components: {
     PostStatusForm,
diff --git a/src/components/user_panel/user_panel.vue b/src/components/user_panel/user_panel.vue
index 0f9260c4a..3dc1ef933 100644
--- a/src/components/user_panel/user_panel.vue
+++ b/src/components/user_panel/user_panel.vue
@@ -1,12 +1,12 @@
 <template>
   <aside class="user-panel">
     <div
-      v-if="signedIn"
+      v-if="loggedIn"
       key="user-panel-signed"
       class="panel panel-default signed-in"
     >
       <UserCard
-        :user-id="user.id"
+        :user-id="currentUser.id"
         :hide-bio="true"
       />
       <PostStatusForm />
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index eb1d8e068..521de0775 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -9,6 +9,8 @@ import UserCard from 'src/components/user_card/user_card.vue'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
@@ -36,30 +38,21 @@ const UserProfile = {
     useInterfaceStore().setForeignProfileBackground(this.user?.background_image)
   },
   unmounted() {
-    this.stopFetching()
     useInterfaceStore().setForeignProfileBackground(null)
-    this.$store.dispatch('clearFollowers', this.userId)
-    this.$store.dispatch('clearFriends', this.userId)
+    useUsersStore().clearFollowLists(this.userId)
   },
   computed: {
-    timeline() {
-      return this.$store.state.statuses.timelines.user
-    },
     favorites() {
-      return this.$store.state.statuses.timelines.favorites
+      return useTimelinesStore().favorites
     },
     media() {
-      return this.$store.state.statuses.timelines.media
+      return useTimelinesStore().media
     },
     isUs() {
-      return (
-        this.userId &&
-        this.$store.state.users.currentUser.id &&
-        this.userId === this.$store.state.users.currentUser.id
-      )
+      return this.userId && this.userId === useUsersStore().currentUser?.id
     },
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     isExternal() {
       return this.$route.name === 'external-user-profile'
@@ -81,18 +74,14 @@ const UserProfile = {
       return useMergedConfigStore().mergedConfig.compactProfiles
     },
     friends() {
-      return get(
-        this.$store.getters.findUser(this.userId),
-        'friendIds',
-        [],
-      ).map((id) => this.$store.getters.findUser(id))
+      return [
+        ...useUsersStore().relationshipsLists.friends.get(this.user).keys(),
+      ].map((id) => useUsersStore().findUser(id))
     },
     followers() {
-      return get(
-        this.$store.getters.findUser(this.userId),
-        'followerIds',
-        [],
-      ).map((id) => this.$store.getters.findUser(id))
+      return [
+        ...useUsersStore().relationshipsLists.followers.get(this.user).keys(),
+      ].map((id) => useUsersStore().findUser(id))
     },
   },
   methods: {
@@ -101,30 +90,13 @@ const UserProfile = {
     },
     fetchUsers(group) {
       return () =>
-        this.$store
-          .dispatch('fetch' + group, this.userId)
+        useUsersStore()
+          ['fetch' + group](this.userId)
           .then((result) => ({ items: result }))
     },
     load(userNameOrId) {
-      const startFetchingTimeline = (timeline, userId) => {
-        // Clear timeline only if load another user's profile
-        if (userId !== this.$store.state.statuses.timelines[timeline].userId) {
-          this.$store.commit('clearTimeline', { timeline })
-        }
-        this.$store.dispatch('startFetchingTimeline', { timeline, userId })
-      }
-
       const loadById = (userId) => {
         this.userId = userId
-        startFetchingTimeline('user', userId)
-        startFetchingTimeline('media', userId)
-        if (this.isUs) {
-          startFetchingTimeline('favorites')
-        } else if (!this.user.hide_favorites) {
-          startFetchingTimeline('favorites', userId)
-        }
-        // Fetch all pinned statuses immediately
-        this.$store.dispatch('fetchPinnedStatuses', userId)
       }
 
       // Reset view
@@ -136,15 +108,17 @@ const UserProfile = {
 
       // Check if user data is already loaded in store
       const user = maybeId
-        ? this.$store.getters.findUser(maybeId)
-        : this.$store.getters.findUserByName(maybeName)
+        ? useUsersStore().findUser(maybeId)
+        : useUsersStore().findUserByName(maybeName)
+
       if (user) {
         loadById(user.id)
       } else {
-        ;(maybeId
-          ? this.$store.dispatch('fetchUser', maybeId)
-          : this.$store.dispatch('fetchUserByName', maybeName)
-        )
+        const promise = maybeId
+          ? useUsersStore().fetchUser(maybeId)
+          : useUsersStore().fetchUserByName(maybeName)
+
+        promise
           .then(({ id }) => loadById(id))
           .catch((reason) => {
             const errorMessage = get(reason, 'error.error')
@@ -159,13 +133,7 @@ const UserProfile = {
           })
       }
     },
-    stopFetching() {
-      this.$store.dispatch('stopFetchingTimeline', 'user')
-      this.$store.dispatch('stopFetchingTimeline', 'favorites')
-      this.$store.dispatch('stopFetchingTimeline', 'media')
-    },
     switchUser(userNameOrId) {
-      this.stopFetching()
       this.load(userNameOrId)
     },
     onTabSwitch(tab) {
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 6ca0c39bd..43d91b8e5 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -8,32 +8,40 @@
         <UserCard
           :user-id="userId"
           :switcher="true"
-          :selected="timeline.viewing"
           :compact="compactProfiles"
           avatar-action="zoom"
           :has-note-editor="true"
         />
       </div>
       <tab-switcher
+        v-if="userId"
         :active-tab="tab"
         :render-only-focused="true"
         :on-switch="onTabSwitch"
       >
-        <Timeline
-          key="statuses"
-          :label="$t('user_card.statuses')"
-          :count="user.statuses_count"
-          :embedded="true"
-          :title="$t('user_profile.timeline_title')"
-          :timeline="timeline"
-          timeline-name="user"
-          :user-id="userId"
-          :pinned-status-ids="user.pinnedStatusIds"
-          :in-profile="true"
-          :footer-slipgate="footerRef"
-        />
         <div
-          v-if="followsTabVisible"
+          key="statuses"
+          class="statuses"
+          :label="$t('user_card.statuses')"
+          :title="$t('user_profile.timeline_title')"
+        >
+          <Timeline
+            key="statuses"
+            :timeline-ref="{ name: 'userPinned', argument: userId }"
+            embedded
+            in-profile
+            hide-empty
+          />
+          <Timeline
+            :timeline-ref="{ name: 'user', argument: userId }"
+            embedded
+            in-profile
+            skip-pinned
+            :footer-slipgate="footerRef"
+          />
+        </div>
+        <div
+          v-if="followsTabVisible && user"
           key="followees"
           class="panel-body"
           :label="$t('user_card.followees')"
@@ -49,7 +57,7 @@
           </List>
         </div>
         <div
-          v-if="followersTabVisible"
+          v-if="followersTabVisible && user"
           key="followers"
           class="panel-body"
           :label="$t('user_card.followers')"
@@ -70,26 +78,21 @@
         <Timeline
           key="media"
           :label="$t('user_card.media')"
-          :disabled="!media.visibleStatuses.length"
-          :embedded="true"
           :title="$t('user_card.media')"
-          timeline-name="media"
-          :timeline="media"
-          :user-id="userId"
-          :in-profile="true"
+          :timeline-ref="{ name: 'media', argument: userId }"
+          embedded
+          in-profile
           :footer-slipgate="footerRef"
         />
         <Timeline
           v-if="favoritesTabVisible"
           key="favorites"
           :label="$t('user_card.favorites')"
-          :disabled="!favorites.visibleStatuses.length"
-          :embedded="true"
           :title="$t('user_card.favorites')"
-          timeline-name="favorites"
-          :timeline="favorites"
-          :user-id="isUs ? undefined : userId"
-          :in-profile="true"
+          :timeline-ref="{ name: 'favorites', argument: userId }"
+          :argument="isUs ? undefined : userId"
+          embedded
+          in-profile
           :footer-slipgate="footerRef"
         />
       </tab-switcher>
diff --git a/src/components/user_profile/user_profile_admin_view.js b/src/components/user_profile/user_profile_admin_view.js
index da2c6c322..8fbac29c4 100644
--- a/src/components/user_profile/user_profile_admin_view.js
+++ b/src/components/user_profile/user_profile_admin_view.js
@@ -5,6 +5,7 @@ import UserCard from 'src/components/user_card/user_card.vue'
 
 import { useAdminSettingsStore } from 'src/stores/admin_settings.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
@@ -19,7 +20,7 @@ const UserProfileAdminView = {
     }
   },
   created() {
-    this.$store.dispatch('fetchUserIfMissing', this.userId)
+    useUsersStore().fetchUserIfMissing({ id: this.userId })
     useInterfaceStore().setForeignProfileBackground(this.user?.background_image)
   },
   updated() {
@@ -38,7 +39,7 @@ const UserProfileAdminView = {
       }
     },
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     userId() {
       return this.$route.params.id
@@ -46,10 +47,12 @@ const UserProfileAdminView = {
   },
   methods: {
     fetchStatuses(page) {
-      return useAdminSettingsStore().fetchStatuses({
-        ...this.fetchOptions,
-        page,
-      })
+      return useAdminSettingsStore()
+        .fetchStatuses({
+          ...this.fetchOptions,
+          page,
+        })
+        .then(({ items }) => items)
     },
   },
   components: {
diff --git a/src/components/user_reporting_modal/user_reporting_modal.js b/src/components/user_reporting_modal/user_reporting_modal.js
index 017a17efa..7094d3ef7 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.js
+++ b/src/components/user_reporting_modal/user_reporting_modal.js
@@ -7,6 +7,7 @@ import UserLink from 'src/components/user_link/user_link.vue'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useReportsStore } from 'src/stores/reports.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { reportUser } from 'src/api/user.js'
 
@@ -27,17 +28,14 @@ const UserReportingModal = {
     }
   },
   computed: {
-    isLoggedIn() {
-      return !!this.$store.state.users.currentUser
-    },
     isOpen() {
-      return this.isLoggedIn && this.reportModal.activated
+      return this.loggedIn && this.reportModal.activated
     },
     userId() {
       return this.reportModal.userId
     },
     user() {
-      return this.$store.getters.findUser(this.userId)
+      return useUsersStore().findUser(this.userId)
     },
     remoteInstance() {
       return (
@@ -46,6 +44,7 @@ const UserReportingModal = {
       )
     },
     ...mapState(useReportsStore, ['reportModal']),
+    ...mapState(useUsersStore, ['loggedIn']),
   },
   watch: {
     userId: 'resetState',
@@ -55,7 +54,7 @@ const UserReportingModal = {
       // Reset state
       this.comment = ''
       this.forward = false
-      this.statusIdsToReport = new Set(this.reportModal.preTickedIds)
+      this.statusIdsToReport = new Set(this.reportModal.preTickedIds) // cloning
       this.processing = false
       this.error = false
     },
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index a028ebeb6..7e58516c3 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -52,8 +52,9 @@
         </div>
         <div class="user-reporting-panel-right">
           <List
-            :external-items="reportModal.statuses"
+            :external-items="reportModal.statusIds"
             :pre-select="reportModal.preTickedIds"
+            :get-key="(item) => item"
             selectable
             @select="onListSelect"
           >
@@ -61,7 +62,7 @@
               <Status
                 :in-conversation="false"
                 :focused="false"
-                :statusoid="item"
+                :status-id="item"
               />
             </template>
           </List>
diff --git a/src/components/user_timed_filter_modal/user_timed_filter_modal.js b/src/components/user_timed_filter_modal/user_timed_filter_modal.js
index f0c150999..360c73ee8 100644
--- a/src/components/user_timed_filter_modal/user_timed_filter_modal.js
+++ b/src/components/user_timed_filter_modal/user_timed_filter_modal.js
@@ -5,6 +5,7 @@ import Select from 'src/components/select/select.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { durationStrToMs } from 'src/services/date_utils/date_utils.js'
 
@@ -64,13 +65,6 @@ const UserTimedFilterModal = {
     expirySeconds() {
       return Math.floor(durationStrToMs(this.expiryString) / 1000)
     },
-    requestBody() {
-      const object = { id: this.user.id }
-      if (!this.forever) {
-        object.expiresIn = this.expirySeconds
-      }
-      return object
-    },
   },
   watch: {
     expiration(newVal) {
@@ -89,7 +83,10 @@ const UserTimedFilterModal = {
     },
     accept() {
       if (this.isMute) {
-        this.$store.dispatch('muteUser', this.requestBody)
+        useUsersStore().muteUser(
+          this.user.id,
+          this.forever ? undefined : this.expirySeconds,
+        )
         if (this.dontAskAgain) {
           useSyncConfigStore().setSimplePrefAndSave({
             path: 'onMuteDefaultAction',
@@ -97,7 +94,10 @@ const UserTimedFilterModal = {
           })
         }
       } else {
-        this.$store.dispatch('blockUser', this.requestBody)
+        useUsersStore().blockUser(
+          this.user.id,
+          this.forever ? undefined : this.expirySeconds,
+        )
         if (this.dontAskAgain) {
           useSyncConfigStore().setSimplePrefAndSave({
             path: 'onBlockDefaultAction',
diff --git a/src/components/who_to_follow/who_to_follow.js b/src/components/who_to_follow/who_to_follow.js
index 28b63c973..d528f67d5 100644
--- a/src/components/who_to_follow/who_to_follow.js
+++ b/src/components/who_to_follow/who_to_follow.js
@@ -1,6 +1,7 @@
 import FollowCard from 'src/components/follow_card/follow_card.vue'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { fetchUser, suggestions } from 'src/api/public.js'
 
@@ -22,11 +23,10 @@ const WhoToFollow = {
         fetchUser({
           id,
           credentials: useOAuthStore().token,
-        }).then(({ data: externalUser }) => {
-          if (!externalUser.error) {
-            this.$store.commit('addNewUsers', [externalUser])
-            this.users.push(externalUser)
-          }
+        }).then((result) => {
+          const [user] = useUsersStore().addNewUsers(result)
+
+          this.users.push(user)
         })
       })
     },
diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.js b/src/components/who_to_follow_panel/who_to_follow_panel.js
index 7a65ba39d..107ec42f7 100644
--- a/src/components/who_to_follow_panel/who_to_follow_panel.js
+++ b/src/components/who_to_follow_panel/who_to_follow_panel.js
@@ -1,57 +1,19 @@
 import { shuffle } from 'lodash'
 
 import { useInstanceStore } from 'src/stores/instance.js'
-import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { fetchUser, suggestions } from 'src/api/public.js'
 import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator'
 
-function showWhoToFollow(panel, reply) {
-  const shuffled = shuffle(reply)
-
-  panel.usersToFollow.forEach((toFollow, index) => {
-    const user = shuffled[index]
-    const img = user.avatar || useInstanceStore().instanceIdentity.defaultAvatar
-    const name = user.acct
-
-    toFollow.img = img
-    toFollow.name = name
-
-    fetchUser({
-      id: name,
-      credentials: useOAuthStore().token,
-    }).then(({ data: externalUser }) => {
-      if (!externalUser.error) {
-        panel.$store.commit('addNewUsers', [externalUser])
-        toFollow.id = externalUser.id
-      }
-    })
-  })
-}
-
-function getWhoToFollow(panel) {
-  const credentials = panel.$store.state.users.currentUser.credentials
-  if (credentials) {
-    panel.usersToFollow.forEach((toFollow) => {
-      toFollow.name = 'Loading...'
-    })
-    suggestions({ credentials }).then(({ data: reply }) => {
-      showWhoToFollow(panel, reply)
-    })
-  }
-}
-
 const WhoToFollowPanel = {
   data: () => ({
     usersToFollow: [],
   }),
   computed: {
-    user: function () {
-      return this.$store.state.users.currentUser.screen_name
-    },
-    suggestionsEnabled() {
-      return useInstanceCapabilitiesStore().suggestionsEnabled
+    user() {
+      return useUsersStore().currentUser.screen_name
     },
   },
   methods: {
@@ -62,23 +24,53 @@ const WhoToFollowPanel = {
         useInstanceStore().restrictedNicknames,
       )
     },
-  },
-  watch: {
-    user: function () {
-      if (this.suggestionsEnabled) {
-        getWhoToFollow(this)
-      }
+    getWhoToFollow() {
+      this.usersToFollow.forEach((toFollow) => {
+        toFollow.name = 'Loading...'
+      })
+
+      suggestions({ credentials: useOAuthStore().token }).then(
+        ({ data: reply }) => {
+          this.showWhoToFollow(reply)
+        },
+      )
+    },
+    showWhoToFollow(reply) {
+      const shuffled = shuffle(reply)
+
+      this.usersToFollow.forEach((toFollow, index) => {
+        const user = shuffled[index]
+        const img =
+          user.avatar || useInstanceStore().instanceIdentity.defaultAvatar
+        const name = user.acct
+
+        toFollow.img = img
+        toFollow.name = name
+
+        fetchUser({
+          id: name,
+          credentials: useOAuthStore().token,
+        }).then((result) => {
+          const { data: externalUser } = result
+          useUsersStore().addNewUsers(result)
+          toFollow.id = externalUser.id
+        })
+      })
     },
   },
-  mounted: function () {
+  watch: {
+    user() {
+      this.getWhoToFollow()
+    },
+  },
+  mounted() {
     this.usersToFollow = new Array(3).fill().map(() => ({
       img: useInstanceStore().instanceIdentity.defaultAvatar,
       name: '',
       id: 0,
     }))
-    if (this.suggestionsEnabled) {
-      getWhoToFollow(this)
-    }
+
+    this.getWhoToFollow()
   },
 }
 
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 4b257be9f..0e861fe77 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -1633,6 +1633,7 @@
     "no_more_statuses": "No more statuses",
     "no_statuses": "No statuses",
     "socket_reconnected": "Realtime connection established",
+    "socket_disconnected": "Realtime connection unavaialable",
     "socket_broke": "Realtime connection lost: CloseEvent code {0}",
     "quick_view_settings": "Quick view settings",
     "quick_filter_settings": "Quick filter settings",
@@ -1730,6 +1731,7 @@
     "more_actions": "More actions on this status",
     "loading": "Loading...",
     "load_error": "Unable to load status: {error}",
+    "interact_error": "Error interacting with status: {error}",
     "admin_change_scope": "Change visibility",
     "mark_as_sensitive": "Sensitive",
     "mark_as_non-sensitive": "Non-sensitive"
diff --git a/src/lib/persisted_state.js b/src/lib/persisted_state.js
index 5fcf259aa..a4dfe7d00 100644
--- a/src/lib/persisted_state.js
+++ b/src/lib/persisted_state.js
@@ -16,8 +16,6 @@ const defaultReducer = (state, paths) =>
 
 const saveImmedeatelyActions = [
   'markNotificationsAsSeen',
-  'clearCurrentUser',
-  'setCurrentUser',
   'setHighlight',
   'setOption',
   'setClientData',
@@ -75,19 +73,13 @@ export default function createPersistedState({
             setState(key, reducer(cloneDeep(state), paths), storage).then(
               (success) => {
                 if (success !== undefined) {
-                  if (
-                    mutation.type === 'setOption' ||
-                    mutation.type === 'setCurrentUser'
-                  ) {
+                  if (mutation.type === 'setOption') {
                     useInterfaceStore().settingsSaved({ success })
                   }
                 }
               },
               (error) => {
-                if (
-                  mutation.type === 'setOption' ||
-                  mutation.type === 'setCurrentUser'
-                ) {
+                if (mutation.type === 'setOption') {
                   useInterfaceStore().settingsSaved({ error })
                 }
               },
diff --git a/src/lib/push_notifications_plugin.js b/src/lib/push_notifications_plugin.js
index f4dcb1dbc..ad546922d 100644
--- a/src/lib/push_notifications_plugin.js
+++ b/src/lib/push_notifications_plugin.js
@@ -1,22 +1,18 @@
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 export const piniaPushNotificationsPlugin = ({ store }) => {
-  if (
-    store.$id !== 'sync_config' &&
-    store.$id !== 'instance' &&
-    store.$id !== 'interface'
-  )
-    return
+  const validActions = {
+    sync_config: new Set(['setPreference']),
+    interface: new Set(['setNotificationPermission', 'onLogin', 'onLogout']),
+  }
+
+  if (!validActions[store.$id]) return // Not applicable to the store
 
   store.$onAction(({ name: actionName, args }) => {
-    if (
-      store.$id === 'interface' &&
-      actionName !== 'setNotificationPermission' &&
-      actionName !== 'setLoginStatus'
-    )
-      return
+    if (!validActions[store.$id].has(actionName)) return // Not applicable to action
 
     // Initial state
     let vapidPublicKey = useInstanceStore().vapidPublicKey
@@ -25,7 +21,7 @@ export const piniaPushNotificationsPlugin = ({ store }) => {
       useInterfaceStore().notificationPermission === 'granted'
     let permissionPresent =
       useInterfaceStore().notificationPermission !== undefined
-    let user = !!window.vuex.state.users.currentUser
+    let user = useUsersStore().loggedIn
 
     if (store.$id === 'instance') {
       if (actionName === 'set' && args[0].path === 'vapidPublicKey') {
@@ -41,9 +37,7 @@ export const piniaPushNotificationsPlugin = ({ store }) => {
     if (store.$id === 'interface') {
       if (actionName === 'setNotificationPermission') {
         permissionGranted = args[0] === 'granted'
-      } else if (actionName === 'setLoginStatus') {
-        user = args[0]
-      } else {
+      } else if (actionName !== 'onLogin' && actionName !== 'onLogout') {
         return
       }
     } else if (store.$id === 'sync_config') {
@@ -59,35 +53,9 @@ export const piniaPushNotificationsPlugin = ({ store }) => {
     }
 
     if (permissionGranted && enabled && user) {
-      return window.vuex.dispatch('registerPushNotifications')
+      return useInterfaceStore().registerPushNotifications()
     } else {
-      return window.vuex.dispatch('unregisterPushNotifications')
-    }
-  })
-}
-
-export const vuexPushNotificationsPlugin = (store) => {
-  store.subscribe((mutation, state) => {
-    // Initial state
-    const vapidPublicKey = useInstanceStore().vapidPublicKey
-    const enabled = useMergedConfigStore().mergedConfig.webPushNotifications
-    const permissionGranted =
-      useInterfaceStore().notificationPermission === 'granted'
-    const permissionPresent =
-      useInterfaceStore().notificationPermission !== undefined
-    const user = state.users.currentUser
-
-    if (!permissionPresent || !vapidPublicKey) return
-
-    if (
-      mutation.type === 'setCurrentUser' ||
-      mutation.type === 'clearCurrentUser'
-    ) {
-      if (user && permissionGranted && enabled) {
-        return store.dispatch('registerPushNotifications')
-      } else {
-        return store.dispatch('unregisterPushNotifications')
-      }
+      return useInterfaceStore().unregisterPushNotifications()
     }
   })
 }
diff --git a/src/main.js b/src/main.js
index 44b01aabb..735725250 100644
--- a/src/main.js
+++ b/src/main.js
@@ -20,10 +20,7 @@ import messages from './i18n/messages.js'
 import createPersistedState, {
   piniaPersistPlugin,
 } from './lib/persisted_state.js'
-import {
-  piniaPushNotificationsPlugin,
-  vuexPushNotificationsPlugin,
-} from './lib/push_notifications_plugin.js'
+import { piniaPushNotificationsPlugin } from './lib/push_notifications_plugin.js'
 import vuexModules from './modules/index.js'
 
 import { piniaLanguagePlugin } from 'src/lib/language.js'
@@ -41,7 +38,7 @@ const i18n = createI18n({
 messages.setLanguage(i18n.global, currentLocale)
 
 const persistedStateOptions = {
-  paths: ['users.lastLoginName', 'oauth', 'config'],
+  paths: ['oauth', 'config'],
 }
 
 ;(async () => {
@@ -72,7 +69,7 @@ const persistedStateOptions = {
 
   try {
     let storageError
-    const plugins = [vuexPushNotificationsPlugin]
+    const plugins = []
     const pinia = createPinia()
     pinia.use(piniaPersistPlugin())
     pinia.use(piniaLanguagePlugin)
diff --git a/src/modules/api.js b/src/modules/api.js
index 6d0c41d48..290fbfc27 100644
--- a/src/modules/api.js
+++ b/src/modules/api.js
@@ -1,32 +1,15 @@
 import { Socket } from 'phoenix'
 
-import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
-
-import { useChatsStore } from 'src/stores/chats.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
-import { useInterfaceStore } from 'src/stores/interface.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useShoutStore } from 'src/stores/shout.js'
 
-import { fetchTimeline } from 'src/api/timelines.js'
-import {
-  getMastodonSocketURI,
-  ProcessedWS,
-  WSConnectionStatus,
-} from 'src/api/websocket.js'
 import followRequestFetcher from 'src/services/follow_request_fetcher/follow_request_fetcher.service'
-import notificationsFetcher from 'src/services/notifications_fetcher/notifications_fetcher.service.js'
-import timelineFetcher from 'src/services/timeline_fetcher/timeline_fetcher.service.js'
-
-const retryTimeout = (multiplier) => 1000 * multiplier
 
 const api = {
   state: {
-    retryMultiplier: 1,
     fetchers: {},
     socket: null,
-    mastoUserSocket: null,
-    mastoUserSocketStatus: null,
     followRequests: [],
   },
   getters: {
@@ -49,257 +32,8 @@ const api = {
     setFollowRequests(state, value) {
       state.followRequests = value
     },
-    setMastoUserSocketStatus(state, value) {
-      state.mastoUserSocketStatus = value
-    },
-    incrementRetryMultiplier(state) {
-      state.retryMultiplier = Math.max(++state.retryMultiplier, 3)
-    },
-    resetRetryMultiplier(state) {
-      state.retryMultiplier = 1
-    },
   },
   actions: {
-    /**
-     * Global MastoAPI socket control, in future should disable ALL sockets/(re)start relevant sockets
-     *
-     * @param {Boolean} [initial] - whether this enabling happened at boot time or not
-     */
-    enableMastoSockets(store, initial) {
-      const { state, dispatch, commit } = store
-      // Do not initialize unless nonexistent or closed
-      if (
-        state.mastoUserSocket &&
-        ![WebSocket.CLOSED, WebSocket.CLOSING].includes(
-          state.mastoUserSocket.getState(),
-        )
-      ) {
-        return
-      }
-      if (initial) {
-        commit('setMastoUserSocketStatus', WSConnectionStatus.STARTING_INITIAL)
-      } else {
-        commit('setMastoUserSocketStatus', WSConnectionStatus.STARTING)
-      }
-      return dispatch('startMastoUserSocket')
-    },
-    disableMastoSockets(store) {
-      const { state, dispatch, commit } = store
-      if (!state.mastoUserSocket) return
-      commit('setMastoUserSocketStatus', WSConnectionStatus.DISABLED)
-      return dispatch('stopMastoUserSocket')
-    },
-
-    // MastoAPI 'User' sockets
-    startMastoUserSocket(store) {
-      return new Promise((resolve, reject) => {
-        try {
-          const { state, commit, dispatch, rootState } = store
-          const timelineData = rootState.statuses.timelines.friends
-
-          const credentials = useOAuthStore().token
-          const url = getMastodonSocketURI({ credentials })
-
-          state.mastoUserSocket = ProcessedWS({
-            url,
-            id: 'Unified',
-            credentials,
-          })
-
-          state.mastoUserSocket.addEventListener(
-            'pleroma:authenticated',
-            () => {
-              state.mastoUserSocket.subscribe('user')
-            },
-          )
-          state.mastoUserSocket.addEventListener(
-            'message',
-            ({ detail: message }) => {
-              if (!message) return // pings
-              if (message.event === 'notification') {
-                dispatch('addNewNotifications', {
-                  notifications: [message.notification],
-                  older: false,
-                })
-              } else if (message.event === 'update') {
-                dispatch('addNewStatuses', {
-                  statuses: [message.status],
-                  userId: false,
-                  showImmediately: timelineData.visibleStatuses.length === 0,
-                  timeline: 'friends',
-                })
-              } else if (message.event === 'status.update') {
-                dispatch('addNewStatuses', {
-                  statuses: [message.status],
-                  userId: false,
-                  showImmediately:
-                    message.status.id in timelineData.visibleStatusesObject,
-                  timeline: 'friends',
-                })
-              } else if (message.event === 'delete') {
-                dispatch('deleteStatusById', message.id)
-              } else if (message.event === 'pleroma:chat_update') {
-                // The setTimeout wrapper is a temporary band-aid to avoid duplicates for the user's own messages when doing optimistic sending.
-                // The cause of the duplicates is the WS event arriving earlier than the HTTP response.
-                // This setTimeout wrapper can be removed once the commit `8e41baff` is in the stable Pleroma release.
-                // (`8e41baff` adds the idempotency key to the chat message entity, which PleromaFE uses when it's available, and it makes this artificial delay unnecessary).
-                setTimeout(() => {
-                  dispatch('addChatMessages', {
-                    chatId: message.chatUpdate.id,
-                    messages: [message.chatUpdate.lastMessage],
-                  })
-                  dispatch('updateChat', { chat: message.chatUpdate })
-                  maybeShowChatNotification(store, message.chatUpdate)
-                }, 100)
-              }
-            },
-          )
-          state.mastoUserSocket.addEventListener('open', () => {
-            // Do not show notification when we just opened up the page
-            if (
-              state.mastoUserSocketStatus !==
-              WSConnectionStatus.STARTING_INITIAL
-            ) {
-              useInterfaceStore().pushGlobalNotice({
-                level: 'success',
-                messageKey: 'timeline.socket_reconnected',
-                timeout: 5000,
-              })
-            }
-            // Stop polling if we were errored or disabled
-            if (
-              new Set([
-                WSConnectionStatus.ERROR,
-                WSConnectionStatus.DISABLED,
-              ]).has(state.mastoUserSocketStatus)
-            ) {
-              dispatch('stopFetchingTimeline', { timeline: 'friends' })
-              dispatch('stopFetchingNotifications')
-              useChatsStore().stopFetchingChats()
-            }
-            commit('resetRetryMultiplier')
-            commit('setMastoUserSocketStatus', WSConnectionStatus.JOINED)
-          })
-          state.mastoUserSocket.addEventListener(
-            'error',
-            ({ detail: error }) => {
-              console.error('Error in MastoAPI websocket:', error)
-              // TODO is this needed?
-              dispatch('clearOpenedChats')
-            },
-          )
-          state.mastoUserSocket.addEventListener(
-            'close',
-            ({ detail: closeEvent }) => {
-              const ignoreCodes = new Set([
-                1000, // Normal (intended) closure
-                1001, // Going away
-              ])
-              const { code } = closeEvent
-              if (ignoreCodes.has(code)) {
-                console.debug(
-                  `Not restarting socket becasue of closure code ${code} is in ignore list`,
-                )
-                commit('setMastoUserSocketStatus', WSConnectionStatus.CLOSED)
-              } else {
-                console.warn(
-                  `MastoAPI websocket disconnected, restarting. CloseEvent code: ${code}`,
-                )
-                setTimeout(() => {
-                  dispatch('startMastoUserSocket')
-                }, retryTimeout(state.retryMultiplier))
-                commit('incrementRetryMultiplier')
-                if (state.mastoUserSocketStatus !== WSConnectionStatus.ERROR) {
-                  dispatch('startFetchingTimeline', { timeline: 'friends' })
-                  dispatch('startFetchingNotifications')
-                  useChatsStore().startFetchingChats()
-                  useInterfaceStore().pushGlobalNotice({
-                    level: 'error',
-                    messageKey: 'timeline.socket_broke',
-                    messageArgs: [code],
-                    timeout: 5000,
-                  })
-                }
-                commit('setMastoUserSocketStatus', WSConnectionStatus.ERROR)
-              }
-              dispatch('clearOpenedChats')
-            },
-          )
-          resolve()
-        } catch (e) {
-          reject(e)
-        }
-      })
-    },
-    stopMastoUserSocket({ state, dispatch }) {
-      dispatch('startFetchingTimeline', { timeline: 'friends' })
-      dispatch('startFetchingNotifications')
-      useChatsStore().startFetchingChats()
-      state.mastoUserSocket.close()
-    },
-
-    // Timelines
-    startFetchingTimeline(
-      store,
-      {
-        timeline = 'friends',
-        tag = false,
-        userId = false,
-        listId = false,
-        statusId = false,
-        bookmarkFolderId = false,
-      },
-    ) {
-      if (
-        timeline === 'favourites' &&
-        !useInstanceCapabilitiesStore().pleromaPublicFavouritesAvailable
-      )
-        return
-      if (store.state.fetchers[timeline]) return
-
-      const fetcher = timelineFetcher.startFetching({
-        timeline,
-        store,
-        userId,
-        listId,
-        statusId,
-        bookmarkFolderId,
-        tag,
-        credentials: useOAuthStore().token,
-      })
-
-      store.commit('addFetcher', { fetcherName: timeline, fetcher })
-    },
-    stopFetchingTimeline(store, timeline) {
-      const fetcher = store.state.fetchers[timeline]
-      if (!fetcher) return
-      store.commit('removeFetcher', { fetcherName: timeline, fetcher })
-    },
-
-    fetchTimeline(store, { timeline, ...rest }) {
-      fetchTimeline({
-        store,
-        timeline,
-        ...rest,
-        credentials: useOAuthStore().token,
-      })
-    },
-
-    // Notifications
-    startFetchingNotifications(store) {
-      if (store.state.fetchers.notifications) return
-      const fetcher = notificationsFetcher.startFetching({
-        store,
-        credentials: useOAuthStore().token,
-      })
-      store.commit('addFetcher', { fetcherName: 'notifications', fetcher })
-    },
-    stopFetchingNotifications(store) {
-      const fetcher = store.state.fetchers.notifications
-      if (!fetcher) return
-      store.commit('removeFetcher', { fetcherName: 'notifications', fetcher })
-    },
-
     // Follow requests
     startFetchingFollowRequests(store) {
       if (store.state.fetchers.followRequests) return
diff --git a/src/modules/index.js b/src/modules/index.js
index c8f3dce39..6aa236257 100644
--- a/src/modules/index.js
+++ b/src/modules/index.js
@@ -1,14 +1,8 @@
 import api from './api.js'
 import drafts from './drafts.js'
-import notifications from './notifications.js'
 import profileConfig from './profileConfig.js'
-import statuses from './statuses.js'
-import users from './users.js'
 
 export default {
-  statuses,
-  notifications,
-  users,
   api,
   profileConfig,
   drafts,
diff --git a/src/modules/notifications.js b/src/modules/notifications.js
deleted file mode 100644
index eb73b2024..000000000
--- a/src/modules/notifications.js
+++ /dev/null
@@ -1,197 +0,0 @@
-import {
-  closeAllDesktopNotifications,
-  closeDesktopNotification,
-} from '../services/desktop_notification_utils/desktop_notification_utils.js'
-import {
-  isStatusNotification,
-  isValidNotification,
-  maybeShowNotification,
-} from '../services/notification_utils/notification_utils.js'
-
-import { useI18nStore } from 'src/stores/i18n.js'
-import { useMergedConfigStore } from 'src/stores/merged_config.js'
-import { useOAuthStore } from 'src/stores/oauth.js'
-import { useReportsStore } from 'src/stores/reports.js'
-import { useSyncConfigStore } from 'src/stores/sync_config.js'
-
-import { dismissNotification, markNotificationsAsSeen } from 'src/api/user.js'
-
-const emptyNotifications = () => ({
-  desktopNotificationSilence: true,
-  maxId: 0,
-  minId: Number.POSITIVE_INFINITY,
-  data: [],
-  idStore: {},
-  loading: false,
-})
-
-export const defaultState = () => ({
-  ...emptyNotifications(),
-})
-
-export const notifications = {
-  state: defaultState(),
-  mutations: {
-    addNewNotifications(state, { notifications }) {
-      notifications.forEach((notification) => {
-        state.data.push(notification)
-        state.idStore[notification.id] = notification
-      })
-    },
-    clearNotifications(state) {
-      const blankState = defaultState()
-      Object.keys(state).forEach((k) => {
-        state[k] = blankState[k]
-      })
-    },
-    updateNotificationsMinMaxId(state, id) {
-      state.maxId = id > state.maxId ? id : state.maxId
-      state.minId = id < state.minId ? id : state.minId
-    },
-    setNotificationsLoading(state, { value }) {
-      state.loading = value
-    },
-    setNotificationsSilence(state, { value }) {
-      state.desktopNotificationSilence = value
-    },
-    markNotificationsAsSeen(state) {
-      state.data.forEach((notification) => {
-        notification.seen = true
-      })
-    },
-    markSingleNotificationAsSeen(state, { id }) {
-      const notification = state.idStore[id]
-      if (notification) notification.seen = true
-    },
-    dismissNotification(state, { id }) {
-      state.data = state.data.filter((n) => n.id !== id)
-      delete state.idStore[id]
-    },
-    updateNotification(state, { id, updater }) {
-      const notification = state.idStore[id]
-      notification && updater(notification)
-    },
-  },
-  actions: {
-    addNewNotifications(store, { notifications }) {
-      const { commit, dispatch, state, rootState } = store
-      const validNotifications = notifications.filter((notification) => {
-        // If invalid notification, update ids but don't add it to store
-        if (!isValidNotification(notification)) {
-          console.error('Invalid notification:', notification)
-          commit('updateNotificationsMinMaxId', notification.id)
-          return false
-        }
-        return true
-      })
-
-      commit(
-        'addNewUsers',
-        validNotifications.map((notification) => notification.from_profile),
-      )
-
-      const statusNotifications = validNotifications.filter(
-        (notification) =>
-          isStatusNotification(notification.type) && notification.status,
-      )
-
-      // Synchronous commit to add all the statuses
-      commit('addNewStatuses', {
-        statuses: statusNotifications.map(
-          (notification) => notification.status,
-        ),
-      })
-
-      // Update references to statuses in notifications to ones in the store
-      statusNotifications.forEach((notification) => {
-        const id = notification.status.id
-        const referenceStatus = rootState.statuses.allStatusesObject[id]
-
-        if (referenceStatus) {
-          notification.status = referenceStatus
-        }
-      })
-
-      validNotifications.forEach((notification) => {
-        if (notification.type === 'pleroma:report') {
-          useReportsStore().addReport(notification.report)
-        }
-
-        if (notification.type === 'pleroma:emoji_reaction') {
-          dispatch('fetchEmojiReactionsBy', notification.status.id)
-        }
-
-        // Only add a new notification if we don't have one for the same action
-        if (!Object.hasOwn(state.idStore, notification.id)) {
-          commit('updateNotificationsMinMaxId', notification.id)
-          commit('addNewNotifications', { notifications: [notification] })
-
-          maybeShowNotification(
-            store,
-            useMergedConfigStore().mergedConfig.notificationVisibility,
-            Object.values(useSyncConfigStore().prefsStorage.simple.muteFilters),
-            notification,
-            useI18nStore().i18n,
-          )
-        } else if (notification.seen) {
-          state.idStore[notification.id].seen = true
-        }
-      })
-    },
-    notificationClicked({ state, dispatch }, { id }) {
-      const notification = state.idStore[id]
-      const { type, seen } = notification
-
-      if (!seen) {
-        switch (type) {
-          case 'mention':
-          case 'pleroma:report':
-          case 'follow_request':
-            break
-          default:
-            dispatch('markSingleNotificationAsSeen', { id })
-        }
-      }
-    },
-    setNotificationsLoading({ commit }, { value }) {
-      commit('setNotificationsLoading', { value })
-    },
-    setNotificationsSilence({ commit }, { value }) {
-      commit('setNotificationsSilence', { value })
-    },
-    markNotificationsAsSeen({ rootState, state, commit }) {
-      commit('markNotificationsAsSeen')
-      markNotificationsAsSeen({
-        id: state.maxId,
-        credentials: rootState.users.currentUser.credentials,
-      }).then(() => {
-        closeAllDesktopNotifications(rootState)
-      })
-    },
-    markSingleNotificationAsSeen({ rootState, commit }, { id }) {
-      commit('markSingleNotificationAsSeen', { id })
-      markNotificationsAsSeen({
-        single: true,
-        id,
-        credentials: rootState.users.currentUser.credentials,
-      }).then(() => {
-        closeDesktopNotification(rootState, { id })
-      })
-    },
-    dismissNotificationLocal({ commit }, { id }) {
-      commit('dismissNotification', { id })
-    },
-    dismissNotification({ rootState, commit }, { id }) {
-      commit('dismissNotification', { id })
-      dismissNotification({
-        id,
-        credentials: useOAuthStore().token,
-      })
-    },
-    updateNotification({ commit }, { id, updater }) {
-      commit('updateNotification', { id, updater })
-    },
-  },
-}
-
-export default notifications
diff --git a/src/modules/profileConfig.js b/src/modules/profileConfig.js
index 3fca7d6a8..8b9c77425 100644
--- a/src/modules/profileConfig.js
+++ b/src/modules/profileConfig.js
@@ -1,6 +1,7 @@
 import { get, set } from 'lodash'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateNotificationSettings, updateProfile } from 'src/api/user.js'
 
@@ -10,9 +11,8 @@ const defaultApi = ({ rootState, commit }, { path, value }) => {
   return updateProfile({
     params,
     credentials: useOAuthStore().token,
-  }).then(({ data: result }) => {
-    commit('addNewUsers', [result])
-    commit('setCurrentUser', result)
+  }).then((result) => {
+    useUsersStore().addNewUsers(result)
   })
 }
 
diff --git a/src/modules/statuses.js b/src/modules/statuses.js
deleted file mode 100644
index a41213d65..000000000
--- a/src/modules/statuses.js
+++ /dev/null
@@ -1,901 +0,0 @@
-import {
-  each,
-  find,
-  findIndex,
-  first,
-  last,
-  maxBy,
-  merge,
-  minBy,
-  omitBy,
-  remove,
-} from 'lodash'
-
-import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
-import { useInterfaceStore } from 'src/stores/interface.js'
-import { useOAuthStore } from 'src/stores/oauth.js'
-
-import {
-  fetchEmojiReactions,
-  fetchFavoritedByUsers,
-  fetchPinnedStatuses,
-  fetchRebloggedByUsers,
-  fetchScrobbles,
-  fetchStatus,
-  fetchStatusHistory,
-  fetchStatusSource,
-  search2,
-} from 'src/api/public.js'
-import {
-  bookmarkStatus,
-  deleteStatus,
-  favorite,
-  muteConversation,
-  pinOwnStatus,
-  reactWithEmoji,
-  retweet,
-  unbookmarkStatus,
-  unfavorite,
-  unmuteConversation,
-  unpinOwnStatus,
-  unreactWithEmoji,
-  unretweet,
-} from 'src/api/user.js'
-
-const emptyTl = (userId = 0) => ({
-  statuses: [],
-  statusesObject: {},
-  faves: [],
-  visibleStatuses: [],
-  visibleStatusesObject: {},
-  newStatusCount: 0,
-  maxId: '',
-  minId: '',
-  minVisibleId: 0,
-  loading: false,
-  followers: [],
-  friends: [],
-  userId,
-  flushMarker: 0,
-})
-
-export const defaultState = () => ({
-  allStatuses: [],
-  scrobblesNextFetch: {},
-  allStatusesObject: {},
-  conversationsObject: {},
-  maxId: '',
-  favorites: new Set(),
-  timelines: {
-    mentions: emptyTl(),
-    public: emptyTl(),
-    user: emptyTl(),
-    favorites: emptyTl(),
-    media: emptyTl(),
-    publicAndExternal: emptyTl(),
-    friends: emptyTl(),
-    tag: emptyTl(),
-    dms: emptyTl(),
-    bookmarks: emptyTl(),
-    list: emptyTl(),
-    bubble: emptyTl(),
-  },
-})
-
-export const prepareStatus = (status) => {
-  // Set deleted flag
-  status.deleted = false
-
-  // To make the array reactive
-  status.attachments = status.attachments || []
-
-  return status
-}
-
-const mergeOrAdd = (arr, obj, item) => {
-  const oldItem = obj[item.id]
-
-  if (oldItem) {
-    // We already have this, so only merge the new info.
-    // We ignore null values to avoid overwriting existing properties with missing data
-    // we also skip 'user' because that is handled by users module
-    merge(
-      oldItem,
-      omitBy(item, (v, k) => v === null || k === 'user'),
-    )
-    // Reactivity fix.
-    oldItem.attachments.splice(oldItem.attachments.length)
-    return { item: oldItem, new: false }
-  } else {
-    // This is a new item, prepare it
-    prepareStatus(item)
-    arr.push(item)
-    obj[item.id] = item
-    return { item, new: true }
-  }
-}
-
-const sortById = (a, b) => {
-  const seqA = Number(a.id)
-  const seqB = Number(b.id)
-  const isSeqA = !Number.isNaN(seqA)
-  const isSeqB = !Number.isNaN(seqB)
-  if (isSeqA && isSeqB) {
-    return seqA > seqB ? -1 : 1
-  } else if (isSeqA && !isSeqB) {
-    return 1
-  } else if (!isSeqA && isSeqB) {
-    return -1
-  } else {
-    return a.id > b.id ? -1 : 1
-  }
-}
-
-const sortTimeline = (timeline) => {
-  timeline.visibleStatuses = timeline.visibleStatuses.sort(sortById)
-  timeline.statuses = timeline.statuses.sort(sortById)
-  timeline.minVisibleId = last(timeline.visibleStatuses)?.id
-  return timeline
-}
-
-const getLatestScrobble = (state, user) => {
-  const scrobblesSupport =
-    useInstanceCapabilitiesStore().pleromaScrobblesAvailable
-
-  if (!scrobblesSupport || !user.name || user.id === 'undefined') {
-    return
-  }
-
-  if (
-    state.scrobblesNextFetch[user.id] &&
-    state.scrobblesNextFetch[user.id] > Date.now()
-  ) {
-    return
-  }
-
-  state.scrobblesNextFetch[user.id] = Date.now() + 24 * 60 * 60 * 1000
-  if (!scrobblesSupport) return
-  fetchScrobbles({ accountId: user.id })
-    .then(({ data: scrobbles }) => {
-      if (scrobbles?.error) {
-        useInstanceCapabilitiesStore().set('pleromaScrobblesAvailable', false)
-        return
-      }
-
-      if (scrobbles.length > 0) {
-        user.latestScrobble = scrobbles[0]
-
-        state.scrobblesNextFetch[user.id] = Date.now() + 60 * 1000
-      }
-    })
-    .catch((e) => {
-      console.warn('cannot fetch scrobbles', e)
-    })
-}
-
-// Add status to the global storages (arrays and objects maintaining statuses) except timelines
-const addStatusToGlobalStorage = (state, data) => {
-  getLatestScrobble(state, data.user)
-  const result = mergeOrAdd(state.allStatuses, state.allStatusesObject, data)
-  if (result.new) {
-    // Add to conversation
-    const status = result.item
-    const conversationsObject = state.conversationsObject
-    const conversationId = status.statusnet_conversation_id
-    if (conversationsObject[conversationId]) {
-      conversationsObject[conversationId].push(status)
-    } else {
-      conversationsObject[conversationId] = [status]
-    }
-  }
-  return result
-}
-
-const addNewStatuses = (
-  state,
-  {
-    statuses,
-    showImmediately = false,
-    timeline,
-    user = {},
-    noIdUpdate = false,
-    userId,
-    pagination = {},
-  },
-) => {
-  // Sanity check
-  if (!Array.isArray(statuses)) {
-    return false
-  }
-
-  const allStatuses = state.allStatuses
-  const timelineObject = state.timelines[timeline]
-
-  // Mismatch between API pagination and our internal minId/maxId tracking systems:
-  // pagination.maxId is the oldest of the returned statuses when fetching older,
-  // and pagination.minId is the newest when fetching newer. The names come directly
-  // from the arguments they're supposed to be passed as for the next fetch.
-  const minNew =
-    pagination.maxId || (statuses.length > 0 ? minBy(statuses, 'id').id : 0)
-  const maxNew =
-    pagination.minId || (statuses.length > 0 ? maxBy(statuses, 'id').id : 0)
-
-  const newer =
-    timeline &&
-    (maxNew > timelineObject.maxId || timelineObject.maxId === '') &&
-    statuses.length > 0
-  const older =
-    timeline &&
-    (minNew < timelineObject.minId || timelineObject.minId === '') &&
-    statuses.length > 0
-
-  if (!noIdUpdate && newer) {
-    timelineObject.maxId = maxNew
-  }
-  if (!noIdUpdate && older) {
-    timelineObject.minId = minNew
-  }
-
-  // This makes sure that user timeline won't get data meant for other
-  // user. I.e. opening different user profiles makes request which could
-  // return data late after user already viewing different user profile
-  if (
-    (timeline === 'user' || timeline === 'media') &&
-    timelineObject.userId !== userId
-  ) {
-    return
-  }
-
-  const addStatus = (data, showImmediately, addToTimeline = true) => {
-    const result = addStatusToGlobalStorage(state, data)
-    const status = result.item
-
-    if (result.new) {
-      // We are mentioned in a post
-      if (
-        status.type === 'status' &&
-        find(status.attentions, { id: user.id })
-      ) {
-        const mentions = state.timelines.mentions
-
-        // Add the mention to the mentions timeline
-        if (timelineObject !== mentions) {
-          mergeOrAdd(mentions.statuses, mentions.statusesObject, status)
-          mentions.newStatusCount += 1
-
-          sortTimeline(mentions)
-        }
-      }
-      if (status.visibility === 'direct') {
-        const dms = state.timelines.dms
-
-        mergeOrAdd(dms.statuses, dms.statusesObject, status)
-        dms.newStatusCount += 1
-
-        sortTimeline(dms)
-      }
-    }
-
-    // Decide if we should treat the status as new for this timeline.
-    let resultForCurrentTimeline
-    // Some statuses should only be added to the global status repository.
-    if (timeline && addToTimeline) {
-      resultForCurrentTimeline = mergeOrAdd(
-        timelineObject.statuses,
-        timelineObject.statusesObject,
-        status,
-      )
-    }
-
-    if (timeline && showImmediately) {
-      // Add it directly to the visibleStatuses, don't change
-      // newStatusCount
-      mergeOrAdd(
-        timelineObject.visibleStatuses,
-        timelineObject.visibleStatusesObject,
-        status,
-      )
-    } else if (timeline && addToTimeline && resultForCurrentTimeline.new) {
-      // Just change newStatuscount
-      timelineObject.newStatusCount += 1
-    }
-
-    if (status.quote) {
-      addStatus(
-        status.quote,
-        /* showImmediately = */ false,
-        /* addToTimeline = */ false,
-      )
-    }
-
-    return status
-  }
-
-  const favoriteStatus = (favorite) => {
-    const status = find(allStatuses, { id: favorite.in_reply_to_status_id })
-    if (status) {
-      // This is our favorite, so the relevant bit.
-      if (favorite.user.id === user.id) {
-        status.favorited = true
-      } else {
-        status.fave_num += 1
-      }
-    }
-    return status
-  }
-
-  const processors = {
-    status: (status) => {
-      addStatus(status, showImmediately)
-    },
-    edit: (status) => {
-      addStatus(status, showImmediately)
-    },
-    retweet: (status) => {
-      // RetweetedStatuses are never shown immediately
-      const retweetedStatus = addStatus(status.retweeted_status, false, false)
-
-      let retweet
-      // If the retweeted status is already there, don't add the retweet
-      // to the timeline.
-      if (
-        timeline &&
-        find(timelineObject.statuses, (s) => {
-          if (s.retweeted_status) {
-            return (
-              s.id === retweetedStatus.id ||
-              s.retweeted_status.id === retweetedStatus.id
-            )
-          } else {
-            return s.id === retweetedStatus.id
-          }
-        })
-      ) {
-        // Already have it visible (either as the original or another RT), don't add to timeline, don't show.
-        retweet = addStatus(status, false, false)
-      } else {
-        retweet = addStatus(status, showImmediately)
-      }
-
-      retweet.retweeted_status = retweetedStatus
-    },
-    favorite: (favorite) => {
-      // Only update if this is a new favorite.
-      // Ignore our own favorites because we get info about likes as response to like request
-      if (!state.favorites.has(favorite.id)) {
-        state.favorites.add(favorite.id)
-        favoriteStatus(favorite)
-      }
-    },
-    follow: () => {
-      // NOOP, it is known status but we don't do anything about it for now
-    },
-    default: (unknown) => {
-      console.warn('unknown status type', unknown)
-    },
-  }
-
-  each(statuses, (status) => {
-    const type = status.type
-    const processor = processors[type] || processors.default
-    processor(status)
-  })
-
-  // Keep the visible statuses sorted
-  if (timeline && !(timeline === 'bookmarks')) {
-    sortTimeline(timelineObject)
-  }
-}
-
-const removeStatus = (state, { timeline, userId }) => {
-  const timelineObject = state.timelines[timeline]
-  if (userId) {
-    remove(timelineObject.statuses, { user: { id: userId } })
-    remove(timelineObject.visibleStatuses, { user: { id: userId } })
-    timelineObject.minVisibleId =
-      timelineObject.visibleStatuses.length > 0
-        ? last(timelineObject.visibleStatuses).id
-        : 0
-    timelineObject.maxId =
-      timelineObject.statuses.length > 0 ? first(timelineObject.statuses).id : 0
-  }
-}
-
-export const mutations = {
-  addNewStatuses,
-  removeStatus,
-  showNewStatuses(state, { timeline }) {
-    const oldTimeline = state.timelines[timeline]
-
-    oldTimeline.newStatusCount = 0
-    oldTimeline.visibleStatuses = oldTimeline.statuses.slice(0, 50)
-    oldTimeline.minVisibleId = last(oldTimeline.visibleStatuses).id
-    oldTimeline.minId = oldTimeline.minVisibleId
-    oldTimeline.visibleStatusesObject = {}
-    each(oldTimeline.visibleStatuses, (status) => {
-      oldTimeline.visibleStatusesObject[status.id] = status
-    })
-  },
-  resetStatuses(state) {
-    const emptyState = defaultState()
-    Object.entries(emptyState).forEach(([key, value]) => {
-      state[key] = value
-    })
-  },
-  clearTimeline(state, { timeline, excludeUserId = false }) {
-    const userId = excludeUserId ? state.timelines[timeline].userId : undefined
-    state.timelines[timeline] = emptyTl(userId)
-  },
-  setFavorited(state, { status, value }) {
-    const newStatus = state.allStatusesObject[status.id]
-
-    if (newStatus.favorited !== value) {
-      if (value) {
-        newStatus.fave_num++
-      } else {
-        newStatus.fave_num--
-      }
-    }
-
-    newStatus.favorited = value
-  },
-  setFavoritedConfirm(state, { status, user }) {
-    const newStatus = state.allStatusesObject[status.id]
-    newStatus.favorited = status.favorited
-    newStatus.fave_num = status.fave_num
-    const index = findIndex(newStatus.favoritedBy, { id: user.id })
-    if (index !== -1 && !newStatus.favorited) {
-      newStatus.favoritedBy.splice(index, 1)
-    } else if (index === -1 && newStatus.favorited) {
-      newStatus.favoritedBy.push(user)
-    }
-  },
-  setMutedStatus(state, status) {
-    const newStatus = state.allStatusesObject[status.id]
-    newStatus.thread_muted = status.thread_muted
-
-    if (newStatus.thread_muted !== undefined) {
-      state.conversationsObject[newStatus.statusnet_conversation_id].forEach(
-        (status) => {
-          status.thread_muted = newStatus.thread_muted
-        },
-      )
-    }
-  },
-  setRetweeted(state, { status, value }) {
-    const newStatus = state.allStatusesObject[status.id]
-
-    if (newStatus.repeated !== value) {
-      if (value) {
-        newStatus.repeat_num++
-      } else {
-        newStatus.repeat_num--
-      }
-    }
-
-    newStatus.repeated = value
-  },
-  setRetweetedConfirm(state, { status, user }) {
-    const newStatus = state.allStatusesObject[status.id]
-    newStatus.repeated = status.repeated
-    newStatus.repeat_num = status.repeat_num
-    const index = findIndex(newStatus.rebloggedBy, { id: user.id })
-    if (index !== -1 && !newStatus.repeated) {
-      newStatus.rebloggedBy.splice(index, 1)
-    } else if (index === -1 && newStatus.repeated) {
-      newStatus.rebloggedBy.push(user)
-    }
-  },
-  setBookmarked(state, { status, value }) {
-    const newStatus = state.allStatusesObject[status.id]
-    newStatus.bookmarked = value
-    newStatus.bookmark_folder_id = status.bookmark_folder_id
-  },
-  setBookmarkedConfirm(state, { status }) {
-    const newStatus = state.allStatusesObject[status.id]
-    newStatus.bookmarked = status.bookmarked
-    if (status.pleroma)
-      newStatus.bookmark_folder_id = status.pleroma.bookmark_folder
-  },
-  setDeleted(state, { status }) {
-    const newStatus = state.allStatusesObject[status.id]
-    if (newStatus) newStatus.deleted = true
-  },
-  setManyDeleted(state, condition) {
-    Object.values(state.allStatusesObject).forEach((status) => {
-      if (condition(status)) {
-        status.deleted = true
-      }
-    })
-  },
-  setLoading(state, { timeline, value }) {
-    state.timelines[timeline].loading = value
-  },
-  setNsfw(state, { id, nsfw }) {
-    const newStatus = state.allStatusesObject[id]
-    newStatus.nsfw = nsfw
-  },
-  queueFlush(state, { timeline, id }) {
-    state.timelines[timeline].flushMarker = id
-  },
-  queueFlushAll(state) {
-    Object.keys(state.timelines).forEach((timeline) => {
-      state.timelines[timeline].flushMarker = state.timelines[timeline].maxId
-    })
-  },
-  addRepeats(state, { id, rebloggedByUsers, currentUser }) {
-    const newStatus = state.allStatusesObject[id]
-    newStatus.rebloggedBy = rebloggedByUsers.filter(Boolean)
-    // repeats stats can be incorrect based on polling condition, let's update them using the most recent data
-    newStatus.repeat_num = newStatus.rebloggedBy.length
-    newStatus.repeated = !!newStatus.rebloggedBy.find(
-      ({ id }) => currentUser.id === id,
-    )
-  },
-  addFavs(state, { id, favoritedByUsers, currentUser }) {
-    const newStatus = state.allStatusesObject[id]
-    newStatus.favoritedBy = favoritedByUsers.filter(Boolean)
-    // favorites stats can be incorrect based on polling condition, let's update them using the most recent data
-    newStatus.fave_num = newStatus.favoritedBy.length
-    newStatus.favorited = !!newStatus.favoritedBy.find(
-      ({ id }) => currentUser.id === id,
-    )
-  },
-  addEmojiReactionsBy(state, { id, emojiReactions }) {
-    const status = state.allStatusesObject[id]
-    status.emoji_reactions = emojiReactions
-  },
-  addOwnReaction(state, { id, emoji, currentUser }) {
-    const status = state.allStatusesObject[id]
-    const reactionIndex = findIndex(status.emoji_reactions, { name: emoji })
-    const reaction = status.emoji_reactions[reactionIndex] || {
-      name: emoji,
-      count: 0,
-      accounts: [],
-    }
-
-    const newReaction = {
-      ...reaction,
-      count: reaction.count + 1,
-      me: true,
-      accounts: [...reaction.accounts, currentUser],
-    }
-
-    // Update count of existing reaction if it exists, otherwise append at the end
-    if (reactionIndex >= 0) {
-      status.emoji_reactions[reactionIndex] = newReaction
-    } else {
-      status.emoji_reactions = [...status.emoji_reactions, newReaction]
-    }
-  },
-  removeOwnReaction(state, { id, emoji, currentUser }) {
-    const status = state.allStatusesObject[id]
-    const reactionIndex = findIndex(status.emoji_reactions, { name: emoji })
-    if (reactionIndex < 0) return
-
-    const reaction = status.emoji_reactions[reactionIndex]
-    const accounts = reaction.accounts || []
-
-    const newReaction = {
-      ...reaction,
-      count: reaction.count - 1,
-      me: false,
-      accounts: accounts.filter((acc) => acc.id !== currentUser.id),
-    }
-
-    if (newReaction.count > 0) {
-      status.emoji_reactions[reactionIndex] = newReaction
-    } else {
-      status.emoji_reactions = status.emoji_reactions.filter(
-        (r) => r.name !== emoji,
-      )
-    }
-  },
-  updateStatusWithPoll(state, { id, poll }) {
-    const status = state.allStatusesObject[id]
-    status.poll = poll
-  },
-  setVirtualHeight(state, { statusId, height }) {
-    state.allStatusesObject[statusId].virtualHeight = height
-  },
-}
-
-const statuses = {
-  state: defaultState(),
-  actions: {
-    addNewStatuses(
-      { rootState, commit },
-      {
-        statuses,
-        showImmediately = false,
-        timeline = false,
-        noIdUpdate = false,
-        userId,
-        pagination,
-      },
-    ) {
-      return commit('addNewStatuses', {
-        statuses,
-        showImmediately,
-        timeline,
-        noIdUpdate,
-        user: rootState.users.currentUser,
-        userId,
-        pagination,
-      })
-    },
-    fetchStatus({ rootState, dispatch }, id) {
-      return fetchStatus({ id }).then(({ data: status }) =>
-        dispatch('addNewStatuses', { statuses: [status] }),
-      )
-    },
-    fetchStatusSource({ rootState }, status) {
-      return fetchStatusSource({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      }).then(({ data }) => data)
-    },
-    fetchStatusHistory(_, status) {
-      return fetchStatusHistory({ status }).then(({ data }) => data)
-    },
-    deleteStatus({ rootState, commit }, status) {
-      deleteStatus({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      })
-        .then(() => {
-          commit('setDeleted', { status })
-        })
-        .catch((e) => {
-          useInterfaceStore().pushGlobalNotice({
-            level: 'error',
-            messageKey: 'status.delete_error',
-            messageArgs: [e.message],
-            timeout: 5000,
-          })
-        })
-    },
-    deleteStatusById({ rootState, commit }, id) {
-      const status = rootState.statuses.allStatusesObject[id]
-      commit('setDeleted', { status })
-    },
-    markStatusesAsDeleted({ commit }, condition) {
-      commit('setManyDeleted', condition)
-    },
-    favorite({ rootState, commit }, status) {
-      // Optimistic favoriting...
-      commit('setFavorited', { status, value: true })
-      favorite({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) =>
-        commit('setFavoritedConfirm', {
-          status,
-          user: rootState.users.currentUser,
-        }),
-      )
-    },
-    unfavorite({ rootState, commit }, status) {
-      // Optimistic unfavoriting...
-      commit('setFavorited', { status, value: false })
-      unfavorite({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) =>
-        commit('setFavoritedConfirm', {
-          status,
-          user: rootState.users.currentUser,
-        }),
-      )
-    },
-    fetchPinnedStatuses({ rootState, dispatch }, userId) {
-      fetchPinnedStatuses({
-        id: userId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: statuses }) =>
-        dispatch('addNewStatuses', {
-          statuses,
-          timeline: 'user',
-          userId,
-          showImmediately: true,
-          noIdUpdate: true,
-        }),
-      )
-    },
-    pinStatus({ rootState, dispatch }, statusId) {
-      return pinOwnStatus({
-        id: statusId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) =>
-        dispatch('addNewStatuses', { statuses: [status] }),
-      )
-    },
-    unpinStatus({ rootState, dispatch }, statusId) {
-      return unpinOwnStatus({
-        id: statusId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) =>
-        dispatch('addNewStatuses', { statuses: [status] }),
-      )
-    },
-    muteConversation({ rootState, commit }, { id: statusId }) {
-      return muteConversation({
-        id: statusId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) => commit('setMutedStatus', status))
-    },
-    unmuteConversation({ rootState, commit }, { id: statusId }) {
-      return unmuteConversation({
-        id: statusId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) => commit('setMutedStatus', status))
-    },
-    retweet({ rootState, commit }, status) {
-      // Optimistic retweeting...
-      commit('setRetweeted', { status, value: true })
-      retweet({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) =>
-        commit('setRetweetedConfirm', {
-          status: status.retweeted_status,
-          user: rootState.users.currentUser,
-        }),
-      )
-    },
-    unretweet({ rootState, commit }, status) {
-      // Optimistic unretweeting...
-      commit('setRetweeted', { status, value: false })
-      unretweet({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) =>
-        commit('setRetweetedConfirm', {
-          status,
-          user: rootState.users.currentUser,
-        }),
-      )
-    },
-    bookmark({ rootState, commit }, status) {
-      commit('setBookmarked', { status, value: true })
-      bookmarkStatus({
-        id: status.id,
-        folder_id: status.bookmark_folder_id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) => {
-        commit('setBookmarkedConfirm', { status })
-      })
-    },
-    unbookmark({ rootState, commit }, status) {
-      commit('setBookmarked', { status, value: false })
-      unbookmarkStatus({
-        id: status.id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: status }) => {
-        commit('setBookmarkedConfirm', { status })
-      })
-    },
-    queueFlush({ commit }, { timeline, id }) {
-      commit('queueFlush', { timeline, id })
-    },
-    queueFlushAll({ commit }) {
-      commit('queueFlushAll')
-    },
-    fetchFavsAndRepeats({ rootState, commit }, id) {
-      Promise.all([
-        fetchFavoritedByUsers({
-          id,
-          credentials: useOAuthStore().token,
-        }).then(({ data }) => data),
-        fetchRebloggedByUsers({
-          id,
-          credentials: useOAuthStore().token,
-        }).then(({ data }) => data),
-      ]).then(([favoritedByUsers, rebloggedByUsers]) => {
-        commit('addFavs', {
-          id,
-          favoritedByUsers,
-          currentUser: rootState.users.currentUser,
-        })
-        commit('addRepeats', {
-          id,
-          rebloggedByUsers,
-          currentUser: rootState.users.currentUser,
-        })
-      })
-    },
-    reactWithEmoji({ rootState, dispatch, commit }, { id, emoji }) {
-      const currentUser = rootState.users.currentUser
-      if (!currentUser) return
-
-      commit('addOwnReaction', { id, emoji, currentUser })
-      reactWithEmoji({
-        id,
-        emoji,
-        credentials: useOAuthStore().token,
-      }).then(() => {
-        dispatch('fetchEmojiReactionsBy', id)
-      })
-    },
-    unreactWithEmoji({ rootState, dispatch, commit }, { id, emoji }) {
-      const currentUser = rootState.users.currentUser
-      if (!currentUser) return
-
-      commit('removeOwnReaction', { id, emoji, currentUser })
-      unreactWithEmoji({
-        id,
-        emoji,
-        currentUser: rootState.users.currentUser,
-      }).then(() => {
-        dispatch('fetchEmojiReactionsBy', id)
-      })
-    },
-    fetchEmojiReactionsBy({ rootState, commit }, id) {
-      return fetchEmojiReactions({
-        id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: emojiReactions }) => {
-        commit('addEmojiReactionsBy', {
-          id,
-          emojiReactions,
-          currentUser: rootState.users.currentUser,
-        })
-      })
-    },
-    fetchFavs({ rootState, commit }, id) {
-      fetchFavoritedByUsers({
-        id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: favoritedByUsers }) =>
-        commit('addFavs', {
-          id,
-          favoritedByUsers,
-          currentUser: rootState.users.currentUser,
-        }),
-      )
-    },
-    fetchRepeats({ rootState, commit }, id) {
-      fetchRebloggedByUsers({
-        id,
-        credentials: useOAuthStore().token,
-      }).then(({ data: rebloggedByUsers }) =>
-        commit('addRepeats', {
-          id,
-          rebloggedByUsers,
-          currentUser: rootState.users.currentUser,
-        }),
-      )
-    },
-    search(store, { q, resolve, limit, offset, following, type }) {
-      return search2({
-        q,
-        resolve,
-        limit,
-        offset,
-        following,
-        type,
-        credentials: useOAuthStore().token,
-      }).then(({ data }) => {
-        store.commit('addNewUsers', data.accounts)
-        store.commit(
-          'addNewUsers',
-          data.statuses.map((s) => s.user).filter(Boolean),
-        )
-        store.dispatch('addNewStatuses', {
-          statuses: data.statuses,
-        })
-
-        data.statuses = data.statuses.map(
-          (s) => store.state.allStatusesObject[s.id],
-        )
-        return data
-      })
-    },
-    setVirtualHeight({ commit }, { statusId, height }) {
-      commit('setVirtualHeight', { statusId, height })
-    },
-  },
-  mutations,
-}
-
-export default statuses
diff --git a/src/modules/users.js b/src/modules/users.js
deleted file mode 100644
index 1238a63df..000000000
--- a/src/modules/users.js
+++ /dev/null
@@ -1,878 +0,0 @@
-import Cookies from 'js-cookie'
-import { compact, each, last, map, mergeWith } from 'lodash'
-
-import {
-  registerPushNotifications,
-  unregisterPushNotifications,
-} from '../services/sw/sw.js'
-import {
-  windowHeight,
-  windowWidth,
-} from '../services/window_utils/window_utils'
-
-import { useAnnouncementsStore } from 'src/stores/announcements.js'
-import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
-import { useChatsStore } from 'src/stores/chats.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.js'
-import { useListsStore } from 'src/stores/lists.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 { useUserHighlightStore } from 'src/stores/user_highlight.js'
-
-import { revokeToken } from 'src/api/oauth.js'
-import {
-  fetchFollowers,
-  fetchFriends,
-  fetchUser,
-  fetchUserByName,
-  getCaptcha,
-  register,
-  searchUsers,
-  verifyCredentials,
-} from 'src/api/public.js'
-import {
-  blockUser as apiBlockUser,
-  editUserNote as apiEditUserNote,
-  muteDomain as apiMuteDomain,
-  muteUser as apiMuteUser,
-  removeUserFromFollowers as apiRemoveUserFromFollowers,
-  unblockUser as apiUnblockUser,
-  unmuteDomain as apiUnmuteDomain,
-  unmuteUser as apiUnmuteUser,
-  fetchBlocks,
-  fetchDomainMutes,
-  fetchMutes,
-  fetchUserInLists,
-  fetchUserRelationship,
-  followUser,
-} from 'src/api/user.js'
-
-// TODO: Unify with mergeOrAdd in statuses.js
-export const mergeOrAdd = (arr, obj, item) => {
-  if (!item) {
-    return false
-  }
-  const oldItem = obj[item.id]
-  if (oldItem) {
-    // We already have this, so only merge the new info.
-    mergeWith(oldItem, item, mergeArrayLength)
-    return { item: oldItem, new: false }
-  } else {
-    // This is a new item, prepare it
-    arr.push(item)
-    obj[item.id] = item
-    return { item, new: true }
-  }
-}
-
-const mergeArrayLength = (oldValue, newValue) => {
-  if (Array.isArray(oldValue) && Array.isArray(newValue)) {
-    oldValue.length = newValue.length
-    return mergeWith(oldValue, newValue, mergeArrayLength)
-  }
-}
-
-const getNotificationPermission = async () => {
-  const Notification = window.Notification
-
-  if (!Notification) return null
-  if (Notification.permission === 'default')
-    return Notification.requestPermission()
-  return Notification.permission
-}
-
-const blockUser = (store, args) => {
-  const id = args.id
-  const expiresIn = typeof args === 'object' ? args.expiresIn : 0
-
-  const predictedRelationship = store.state.relationships[id] || { id }
-  store.commit('updateUserRelationship', [predictedRelationship])
-  store.commit('addBlockId', id)
-
-  return apiBlockUser({ id, expiresIn }).then(({ data: relationship }) => {
-    store.commit('updateUserRelationship', [relationship])
-    store.commit('addBlockId', id)
-
-    store.commit('removeStatus', { timeline: 'friends', userId: id })
-    store.commit('removeStatus', { timeline: 'public', userId: id })
-    store.commit('removeStatus', {
-      timeline: 'publicAndExternal',
-      userId: id,
-    })
-  })
-}
-
-const unblockUser = (store, id) => {
-  return apiUnblockUser({ id }).then(({ data: relationship }) =>
-    store.commit('updateUserRelationship', [relationship]),
-  )
-}
-
-const removeUserFromFollowers = (store, id) => {
-  return apiRemoveUserFromFollowers({ id }).then(({ data: relationship }) =>
-    store.commit('updateUserRelationship', [relationship]),
-  )
-}
-
-const editUserNote = (store, { id, comment }) => {
-  return apiEditUserNote({ id, comment }).then((relationship) =>
-    store.commit('updateUserRelationship', [relationship]),
-  )
-}
-
-const muteUser = (store, args) => {
-  const id = typeof args === 'object' ? args.id : args
-  const expiresIn = typeof args === 'object' ? args.expiresIn : 0
-
-  const predictedRelationship = store.state.relationships[id] || { id }
-  store.commit('updateUserRelationship', [predictedRelationship])
-  store.commit('addMuteId', id)
-
-  return apiMuteUser({
-    id,
-    expiresIn,
-    credentials: useOAuthStore().token,
-  }).then(({ data: relationship }) => {
-    store.commit('updateUserRelationship', [relationship])
-    store.commit('addMuteId', id)
-  })
-}
-
-const unmuteUser = (store, id) => {
-  const predictedRelationship = store.state.relationships[id] || { id }
-  predictedRelationship.muting = false
-  store.commit('updateUserRelationship', [predictedRelationship])
-
-  return apiUnmuteUser({ id }).then(({ data: relationship }) =>
-    store.commit('updateUserRelationship', [relationship]),
-  )
-}
-
-const hideReblogs = (store, userId) => {
-  return followUser({
-    id: userId,
-    reblogs: false,
-    credentials: useOAuthStore().token,
-  }).then(({ data: relationship }) =>
-    store.commit('updateUserRelationship', [relationship]),
-  )
-}
-
-const showReblogs = (store, userId) => {
-  return followUser({
-    id: userId,
-    reblogs: true,
-    credentials: useOAuthStore().token,
-  }).then(({ data: relationship }) =>
-    store.commit('updateUserRelationship', [relationship]),
-  )
-}
-
-const muteDomain = (store, domain) => {
-  return apiMuteDomain({
-    domain,
-    credentials: useOAuthStore().token,
-  }).then(() => store.commit('addDomainMute', domain))
-}
-
-const unmuteDomain = (store, domain) => {
-  return apiUnmuteDomain({
-    domain,
-    credentials: useOAuthStore().token,
-  }).then(() => store.commit('removeDomainMute', domain))
-}
-
-export const mutations = {
-  tagUser(state, { user: { id }, tag }) {
-    const user = state.usersObject[id]
-    user.tags.add(tag)
-  },
-  untagUser(state, { user: { id }, tag }) {
-    const user = state.usersObject[id]
-    user.tags.delete(tag)
-  },
-  updateRight(state, { user: { id }, right, value }) {
-    const user = state.usersObject[id]
-    const newRights = user.rights
-    newRights[right] = value
-    user.rights = newRights
-  },
-  updateUserAdminData(state, { user }) {
-    const { id } = user
-    const localUser = state.usersObject[id]
-    localUser.adminData = user
-    localUser.deactivated = !user.is_active
-    localUser.tags = new Set(user.tags)
-  },
-  setCurrentUser(state, user) {
-    state.lastLoginName = user.screen_name
-    state.currentUser = mergeWith(
-      state.currentUser || {},
-      user,
-      mergeArrayLength,
-    )
-  },
-  clearCurrentUser(state) {
-    state.currentUser = false
-    state.lastLoginName = false
-  },
-  beginLogin(state) {
-    state.loggingIn = true
-  },
-  endLogin(state) {
-    state.loggingIn = false
-  },
-  saveFriendIds(state, { id, friendIds }) {
-    const user = state.usersObject[id]
-    user.friendIds = [...new Set([...(user.friendIds || []), ...friendIds])]
-  },
-  saveFollowerIds(state, { id, followerIds }) {
-    const user = state.usersObject[id]
-    user.followerIds = [
-      ...new Set([...(user.followerIds || []), ...followerIds]),
-    ]
-  },
-  // Because frontend doesn't have a reason to keep these stuff in memory
-  // outside of viewing someones user profile.
-  clearFriends(state, userId) {
-    const user = state.usersObject[userId]
-    if (user) {
-      user.friendIds = []
-    }
-  },
-  clearFollowers(state, userId) {
-    const user = state.usersObject[userId]
-    if (user) {
-      user.followerIds = []
-    }
-  },
-  addNewUsers(state, users) {
-    each(users, (user) => {
-      if (user.relationship) {
-        state.relationships[user.relationship.id] = user.relationship
-      }
-      const res = mergeOrAdd(state.users, state.usersObject, user)
-      const item = res.item
-      if (res.new && item.screen_name && !item.screen_name.includes('@')) {
-        state.usersByNameObject[item.screen_name.toLowerCase()] = item
-      }
-    })
-  },
-  updateUserRelationship(state, relationships) {
-    relationships.forEach((relationship) => {
-      state.relationships[relationship.id] = relationship
-    })
-  },
-  updateUserInLists(state, { id, inLists }) {
-    state.usersObject[id].inLists = inLists
-  },
-  saveBlockIds(state, blockIds) {
-    state.currentUser.blockIds = blockIds
-  },
-  addBlockId(state, blockId) {
-    if (state.currentUser.blockIds.includes(blockId)) {
-      state.currentUser.blockIds.push(blockId)
-    }
-  },
-  setBlockIdsMaxId(state, blockIdsMaxId) {
-    state.currentUser.blockIdsMaxId = blockIdsMaxId
-  },
-  saveMuteIds(state, muteIds) {
-    state.currentUser.muteIds = muteIds
-  },
-  setMuteIdsMaxId(state, muteIdsMaxId) {
-    state.currentUser.muteIdsMaxId = muteIdsMaxId
-  },
-  addMuteId(state, muteId) {
-    if (state.currentUser.muteIds.includes(muteId)) {
-      state.currentUser.muteIds.push(muteId)
-    }
-  },
-  saveDomainMutes(state, domainMutes) {
-    state.currentUser.domainMutes = domainMutes
-  },
-  addDomainMute(state, domain) {
-    if (state.currentUser.domainMutes.includes(domain)) {
-      state.currentUser.domainMutes.push(domain)
-    }
-  },
-  removeDomainMute(state, domain) {
-    const index = state.currentUser.domainMutes.indexOf(domain)
-    if (index !== -1) {
-      state.currentUser.domainMutes.splice(index, 1)
-    }
-  },
-  setPinnedToUser(state, status) {
-    const user = state.usersObject[status.user.id]
-    user.pinnedStatusIds = user.pinnedStatusIds || []
-    const index = user.pinnedStatusIds.indexOf(status.id)
-
-    if (status.pinned && index === -1) {
-      user.pinnedStatusIds.push(status.id)
-    } else if (!status.pinned && index !== -1) {
-      user.pinnedStatusIds.splice(index, 1)
-    }
-  },
-  setUserForStatus(state, status) {
-    status.user = state.usersObject[status.user.id]
-  },
-  setUserForNotification(state, notification) {
-    if (notification.type !== 'follow') {
-      notification.action.user = state.usersObject[notification.action.user.id]
-    }
-    notification.from_profile = state.usersObject[notification.from_profile.id]
-  },
-  setColor(state, { user: { id }, highlighted }) {
-    const user = state.usersObject[id]
-    user.highlight = highlighted
-  },
-  signUpPending(state) {
-    state.signUpPending = true
-    state.signUpErrors = []
-    state.signUpNotice = {}
-  },
-  signUpSuccess(state) {
-    state.signUpPending = false
-  },
-  signUpFailure(state, errors) {
-    state.signUpPending = false
-    state.signUpErrors = errors
-    state.signUpNotice = {}
-  },
-  signUpNotice(state, notice) {
-    state.signUpPending = false
-    state.signUpErrors = []
-    state.signUpNotice = notice
-  },
-}
-
-export const getters = {
-  findUser: (state) => (query) => {
-    return state.usersObject[query]
-  },
-  findUserByName: (state) => (query) => {
-    return state.usersByNameObject[query.toLowerCase()]
-  },
-  findUserByUrl: (state) => (query) => {
-    return state.users.find(
-      (u) =>
-        u.statusnet_profile_url &&
-        u.statusnet_profile_url.toLowerCase() === query.toLowerCase(),
-    )
-  },
-  relationship: (state) => (id) => {
-    const rel = id && state.relationships[id]
-    return rel || { id, loading: true }
-  },
-}
-
-export const defaultState = {
-  loggingIn: false,
-  lastLoginName: false,
-  currentUser: false,
-  users: [],
-  usersObject: {},
-  usersByNameObject: {},
-  signUpPending: false,
-  signUpErrors: [],
-  signUpNotice: {},
-  relationships: {},
-}
-
-const users = {
-  state: defaultState,
-  mutations,
-  getters,
-  actions: {
-    async fetchUserIfMissing(store, id) {
-      const user = store.getters.findUser(id)
-      if (!user) {
-        return store.dispatch('fetchUser', id)
-      } else {
-        return user
-      }
-    },
-    updateUserAdminData(store, { userAdminData }) {
-      return store
-        .dispatch('fetchUserIfMissing', userAdminData.id)
-        .then((user) => {
-          user.adminData = userAdminData
-          store.commit('addNewUsers', [user])
-          return user
-        })
-    },
-    fetchUser(store, id) {
-      return fetchUser({
-        id,
-        credentials: useOAuthStore().token,
-      })
-        .then(({ data: user }) => {
-          store.commit('addNewUsers', [user])
-          return user
-        })
-        .catch((error) => {
-          if (error.statusCode === 404) {
-            console.warn(`User ${id} not found`)
-          } else {
-            throw error
-          }
-        })
-    },
-    fetchUserByName(store, name) {
-      return fetchUserByName({
-        name,
-        credentials: useOAuthStore().token,
-      }).then(({ data: user }) => {
-        store.commit('addNewUsers', [user])
-        return user
-      })
-    },
-    fetchUserRelationship(store, id) {
-      if (store.state.currentUser) {
-        fetchUserRelationship({
-          id,
-          credentials: useOAuthStore().token,
-        }).then(({ data: relationships }) =>
-          store.commit('updateUserRelationship', relationships),
-        )
-      }
-    },
-    fetchUserInLists(store, id) {
-      if (store.state.currentUser) {
-        fetchUserInLists({
-          id,
-          credentials: useOAuthStore().token,
-        }).then(({ data: inLists }) =>
-          store.commit('updateUserInLists', { id, inLists }),
-        )
-      }
-    },
-    fetchBlocks(store, args) {
-      const { reset } = args || {}
-
-      const maxId = store.state.currentUser.blockIdsMaxId
-      return fetchBlocks({
-        maxId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: blocks }) => {
-        if (reset) {
-          store.commit('saveBlockIds', map(blocks, 'id'))
-        } else {
-          map(blocks, 'id').map((id) => store.commit('addBlockId', id))
-        }
-        if (blocks.length) {
-          store.commit('setBlockIdsMaxId', last(blocks).id)
-        }
-        store.commit('addNewUsers', blocks)
-        return blocks
-      })
-    },
-    blockUser(store, data) {
-      return blockUser(store, data)
-    },
-    unblockUser(store, data) {
-      return unblockUser(store, data)
-    },
-    removeUserFromFollowers(store, id) {
-      return removeUserFromFollowers(store, id)
-    },
-    blockUsers(store, data = []) {
-      return Promise.all(data.map((d) => blockUser(store, d)))
-    },
-    unblockUsers(store, data = []) {
-      return Promise.all(data.map((d) => unblockUser(store, d)))
-    },
-    editUserNote(store, args) {
-      return editUserNote(store, args)
-    },
-    fetchMutes(store, args) {
-      const { reset } = args || {}
-
-      const maxId = store.state.currentUser.muteIdsMaxId
-      return fetchMutes({
-        maxId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: mutes }) => {
-        if (reset) {
-          store.commit('saveMuteIds', map(mutes, 'id'))
-        } else {
-          map(mutes, 'id').map((id) => store.commit('addMuteId', id))
-        }
-        if (mutes.length) {
-          store.commit('setMuteIdsMaxId', last(mutes).id)
-        }
-        store.commit('addNewUsers', mutes)
-        return mutes
-      })
-    },
-    muteUser(store, data) {
-      return muteUser(store, data)
-    },
-    unmuteUser(store, id) {
-      return unmuteUser(store, id)
-    },
-    hideReblogs(store, id) {
-      return hideReblogs(store, id)
-    },
-    showReblogs(store, id) {
-      return showReblogs(store, id)
-    },
-    muteUsers(store, data = []) {
-      return Promise.all(data.map((d) => muteUser(store, d)))
-    },
-    unmuteUsers(store, ids = []) {
-      return Promise.all(ids.map((d) => unmuteUser(store, d)))
-    },
-    fetchDomainMutes(store) {
-      return fetchDomainMutes({
-        credentials: useOAuthStore().token,
-      }).then(({ data: domainMutes }) => {
-        store.commit('saveDomainMutes', domainMutes)
-        return domainMutes
-      })
-    },
-    muteDomain(store, domain) {
-      return muteDomain(store, domain)
-    },
-    unmuteDomain(store, domain) {
-      return unmuteDomain(store, domain)
-    },
-    muteDomains(store, domains = []) {
-      return Promise.all(domains.map((domain) => muteDomain(store, domain)))
-    },
-    unmuteDomains(store, domain = []) {
-      return Promise.all(domain.map((domain) => unmuteDomain(store, domain)))
-    },
-    fetchFriends({ rootState, commit }, id) {
-      const user = rootState.users.usersObject[id]
-      const maxId = last(user.friendIds)
-      return fetchFriends({
-        id,
-        maxId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: friends }) => {
-        commit('addNewUsers', friends)
-        commit('saveFriendIds', { id, friendIds: map(friends, 'id') })
-        return friends
-      })
-    },
-    fetchFollowers({ rootState, commit }, id) {
-      const user = rootState.users.usersObject[id]
-      const maxId = last(user.followerIds)
-      return fetchFollowers({
-        id,
-        maxId,
-        credentials: useOAuthStore().token,
-      }).then(({ data: followers }) => {
-        commit('addNewUsers', followers)
-        commit('saveFollowerIds', { id, followerIds: map(followers, 'id') })
-        return followers
-      })
-    },
-    clearFriends({ commit }, userId) {
-      commit('clearFriends', userId)
-    },
-    clearFollowers({ commit }, userId) {
-      commit('clearFollowers', userId)
-    },
-    subscribeUser({ rootState, commit }, id) {
-      return followUser({
-        id,
-        notify: true,
-        credentials: useOAuthStore().token,
-      }).then(({ data: relationship }) =>
-        commit('updateUserRelationship', [relationship]),
-      )
-    },
-    unsubscribeUser({ rootState, commit }, id) {
-      return followUser({
-        id,
-        notify: false,
-        credentials: useOAuthStore().token,
-      }).then(({ data: relationship }) =>
-        commit('updateUserRelationship', [relationship]),
-      )
-    },
-    registerPushNotifications(store) {
-      const token = store.state.currentUser.credentials
-      const vapidPublicKey = useInstanceStore().vapidPublicKey
-      const isEnabled = useMergedConfigStore().mergedConfig.webPushNotifications
-      const notificationVisibility =
-        useMergedConfigStore().mergedConfig.notificationVisibility
-
-      registerPushNotifications(
-        isEnabled,
-        vapidPublicKey,
-        token,
-        notificationVisibility,
-      )
-    },
-    unregisterPushNotifications(store) {
-      const token = store.state.currentUser.credentials
-
-      unregisterPushNotifications(token)
-    },
-    addNewUsers({ commit }, users) {
-      commit('addNewUsers', users)
-    },
-    addNewStatuses(store, { statuses }) {
-      const users = map(statuses, 'user')
-      const retweetedUsers = compact(map(statuses, 'retweeted_status.user'))
-      const quotedUsers = compact(map(statuses, 'quote.user'))
-
-      store.commit('addNewUsers', users)
-      store.commit('addNewUsers', retweetedUsers)
-      store.commit('addNewUsers', quotedUsers)
-
-      each(statuses, (status) => {
-        // Reconnect users to statuses
-        store.commit('setUserForStatus', status)
-        // Set pinned statuses to user
-        store.commit('setPinnedToUser', status)
-      })
-      each(compact(map(statuses, 'retweeted_status')), (status) => {
-        // Reconnect users to retweets
-        store.commit('setUserForStatus', status)
-        // Set pinned retweets to user
-        store.commit('setPinnedToUser', status)
-      })
-    },
-    addNewNotifications(store, { notifications }) {
-      const users = map(notifications, 'from_profile')
-      const targetUsers = map(notifications, 'target').filter(Boolean)
-      const notificationIds = notifications.map((_) => _.id)
-      store.commit('addNewUsers', users)
-      store.commit('addNewUsers', targetUsers)
-
-      const notificationsObject = store.rootState.notifications.idStore
-      const relevantNotifications = Object.entries(notificationsObject)
-        .filter(([k]) => notificationIds.includes(k))
-        .map(([, val]) => val)
-
-      // Reconnect users to notifications
-      each(relevantNotifications, (notification) => {
-        store.commit('setUserForNotification', notification)
-      })
-    },
-    searchUsers({ rootState, commit }, { query }) {
-      return searchUsers({
-        query,
-        credentials: useOAuthStore().token,
-      }).then(({ data: users }) => {
-        commit('addNewUsers', users)
-        return users
-      })
-    },
-    async signUp(store, userInfo) {
-      const oauthStore = useOAuthStore()
-      store.commit('signUpPending')
-
-      try {
-        const token = await oauthStore.ensureAppToken()
-        const { data } = await register({
-          credentials: token,
-          params: { ...userInfo },
-        })
-
-        if (data.access_token) {
-          store.commit('signUpSuccess')
-          oauthStore.setToken(data.access_token)
-          await store.dispatch('loginUser', data.access_token)
-          return 'ok'
-        } else {
-          // Request succeeded, but user cannot login yet.
-          store.commit('signUpNotice', data)
-          return 'request_sent'
-        }
-      } catch (e) {
-        const errors = e.message
-        store.commit('signUpFailure', errors)
-        throw e
-      }
-    },
-    getCaptcha(store) {
-      return getCaptcha({
-        credentials: useOAuthStore().token,
-      }).then(({ data }) => data)
-    },
-
-    logout(store) {
-      const oauth = useOAuthStore()
-
-      // NOTE: No need to verify the app still exists, because if it doesn't,
-      // the token will be invalid too
-      return oauth
-        .ensureApp()
-        .then((app) => {
-          const params = {
-            app,
-            instance: useInstanceStore().server,
-            token: oauth.userToken,
-          }
-
-          return revokeToken(params)
-        })
-        .then(() => {
-          store.commit('clearCurrentUser')
-          store.dispatch('disconnectFromSocket')
-          store.dispatch('stopFetchingTimeline', 'friends')
-          store.dispatch('stopFetchingNotifications')
-          useListsStore().stopFetching()
-          useBookmarkFoldersStore().stopFetching()
-          store.dispatch('stopFetchingFollowRequests')
-          store.commit('clearNotifications')
-          store.commit('resetStatuses')
-          useChatsStore().resetChats()
-          oauth.clearToken()
-          Cookies.remove('__Host-pleroma_key', { path: '/' })
-          useInterfaceStore().setLastTimeline('public-timeline')
-          useInterfaceStore().setLayoutWidth(windowWidth())
-          useInterfaceStore().setLayoutHeight(windowHeight())
-        })
-    },
-    loginUser(store, accessToken) {
-      return new Promise((resolve, reject) => {
-        const commit = store.commit
-        const dispatch = store.dispatch
-
-        commit('beginLogin')
-
-        verifyCredentials({
-          credentials: useOAuthStore().token,
-        })
-          .then(({ data: user }) => {
-            // user.credentials = userCredentials
-            user.credentials = accessToken
-            user.blockIds = []
-            user.muteIds = []
-            user.domainMutes = []
-            commit('setCurrentUser', user)
-
-            useSyncConfigStore()
-              .initSyncConfig(user)
-              .then(() => {
-                useInterfaceStore()
-                  .applyTheme()
-                  .catch((e) => {
-                    console.error('Error setting theme', e)
-                  })
-              })
-            useUserHighlightStore().initUserHighlight(user)
-            commit('addNewUsers', [user])
-
-            useEmojiStore().fetchEmoji()
-
-            getNotificationPermission().then((permission) =>
-              useInterfaceStore().setNotificationPermission(permission),
-            )
-
-            // Do server-side storage migrations
-
-            // Debug snippet to clean up storage and reset migrations
-            /*
-            // Reset wordfilter
-            Object.keys(
-              useSyncConfigStore().prefsStorage.simple.muteFilters
-            ).forEach(key => {
-              useSyncConfigStore().unsetSimplePrefAndSave({ path: 'muteFilters.' + key, value: null })
-            })
-
-            // Reset flag to 0 to re-run migrations
-            useSyncConfigStore().setFlag({ flag: 'configMigration', value: 0 })
-            /**/
-
-            if (user.token) {
-              dispatch('setWsToken', user.token)
-
-              // Initialize the shout socket.
-              dispatch('initializeSocket')
-            }
-
-            const startPolling = () => {
-              // Start getting fresh posts.
-              dispatch('startFetchingTimeline', { timeline: 'friends' })
-
-              // Start fetching notifications
-              dispatch('startFetchingNotifications')
-
-              if (useInstanceCapabilitiesStore().pleromaChatMessagesAvailable) {
-                // Start fetching chats
-                useChatsStore().startFetchingChats()
-              }
-            }
-
-            useListsStore().startFetching()
-            useBookmarkFoldersStore().startFetching()
-
-            if (user.locked) {
-              dispatch('startFetchingFollowRequests')
-            }
-
-            if (useMergedConfigStore().mergedConfig.useStreamingApi) {
-              dispatch('fetchTimeline', {
-                timeline: 'friends',
-                sinceId: null,
-              })
-              dispatch('fetchNotifications', { sinceId: null })
-              dispatch('enableMastoSockets', true)
-                .catch((error) => {
-                  console.error(
-                    'Failed initializing MastoAPI Streaming socket',
-                    error,
-                  )
-                })
-                .then(() => {
-                  dispatch('fetchChats', { latest: true })
-                  setTimeout(
-                    () => dispatch('setNotificationsSilence', false),
-                    10000,
-                  )
-                })
-            } else {
-              startPolling()
-            }
-
-            // Start fetching things that don't need to block the UI
-            useAnnouncementsStore().startFetchingAnnouncements()
-
-            dispatch('fetchMutes')
-            dispatch('loadDrafts')
-
-            useInterfaceStore().setLayoutWidth(windowWidth())
-            useInterfaceStore().setLayoutHeight(windowHeight())
-
-            // Fetch our friends
-            fetchFriends({ id: user.id }).then(({ data: friends }) =>
-              commit('addNewUsers', friends),
-            )
-            commit('endLogin')
-            resolve()
-          })
-          .catch((error) => {
-            console.error(error)
-
-            // Authentication failed
-            commit('endLogin')
-
-            // remove authentication token on client/authentication errors
-            if ([400, 401, 403, 422].includes(error.statusCode)) {
-              useOAuthStore().clearToken()
-            }
-
-            commit('endLogin')
-            if (error.tatusCode === 401) {
-              throw new Error('Wrong username or password', error)
-            } else {
-              throw new Error('An error occurred, please try again', error)
-            }
-          })
-      })
-    },
-  },
-}
-
-export default users
diff --git a/src/services/chat_utils/chat_utils.js b/src/services/chat_utils/chat_utils.js
index bc02981cd..bbe74ce09 100644
--- a/src/services/chat_utils/chat_utils.js
+++ b/src/services/chat_utils/chat_utils.js
@@ -1,22 +1,28 @@
 import { showDesktopNotification } from '../desktop_notification_utils/desktop_notification_utils.js'
 
+import { useUsersStore } from 'src/stores/users.js'
+
 export const maybeShowChatNotification = (chat) => {
+  // No messages
   if (!chat.lastMessage) return
-  if (window.vuex.state.users.currentUser.id === chat.lastMessage.account_id)
-    return
+  // No unreads to display
+  if (chat.unread === 0) return
+  // Don't notify on outgoing message (shouldn't happen with condition above)
+  if (useUsersStore().currentUser.id === chat.lastMessage.account_id) return
 
   const opts = {
     tag: chat.lastMessage.id,
     title: chat.account.name,
     icon: chat.account.profile_image_url,
     body: chat.lastMessage.content,
+    type: 'chatMention',
   }
 
   if (chat.lastMessage.attachment?.type === 'image') {
     opts.image = chat.lastMessage.attachment.preview_url
   }
 
-  showDesktopNotification(window.vuex.state, opts)
+  showDesktopNotification(opts)
 }
 
 export const buildFakeMessage = ({
diff --git a/src/services/desktop_notification_utils/desktop_notification_utils.js b/src/services/desktop_notification_utils/desktop_notification_utils.js
index cf393aa77..aa5793080 100644
--- a/src/services/desktop_notification_utils/desktop_notification_utils.js
+++ b/src/services/desktop_notification_utils/desktop_notification_utils.js
@@ -4,14 +4,16 @@ import {
   showDesktopNotification as swDesktopNotification,
 } from '../sw/sw.js'
 
+import { useNotificationsStore } from 'src/stores/notifications.js'
+
 const state = { failCreateNotif: false }
 
-export const showDesktopNotification = (rootState, desktopNotificationOpts) => {
+export const showDesktopNotification = (desktopNotificationOpts) => {
   if (
     !('Notification' in window && window.Notification.permission === 'granted')
   )
     return
-  if (rootState.notifications.desktopNotificationSilence) {
+  if (useNotificationsStore().desktopNotificationSilence) {
     return
   }
 
@@ -30,7 +32,7 @@ export const showDesktopNotification = (rootState, desktopNotificationOpts) => {
   }
 }
 
-export const closeDesktopNotification = (rootState, { id }) => {
+export const closeDesktopNotification = (id) => {
   if (
     !('Notification' in window && window.Notification.permission === 'granted')
   )
diff --git a/src/services/entity_normalizer/entity_normalizer.service.js b/src/services/entity_normalizer/entity_normalizer.service.js
index 5b8fa5b57..88e2fd0a5 100644
--- a/src/services/entity_normalizer/entity_normalizer.service.js
+++ b/src/services/entity_normalizer/entity_normalizer.service.js
@@ -4,7 +4,7 @@ import { unescape as lodashUnescape } from 'lodash'
 import punycode from 'punycode.js'
 
 import { fileType } from '../file_type/file_type.service.js'
-import { isStatusNotification } from '../notification_utils/notification_utils.js'
+import { isStatusNotification } from '../notification_utils/notification_utils_sw.js'
 
 /** NOTICE! **
  * Do not initialize UI-generated data here.
@@ -27,6 +27,7 @@ export const parseUser = (data) => {
 
   output.screen_name = data.acct
   output.fqn = data.fqn
+  output.url = data.url
   output.statusnet_profile_url = data.url
 
   if (Object.hasOwn(data, 'mute_expires_at')) {
@@ -80,6 +81,9 @@ export const parseUser = (data) => {
 
   output.privileges = []
 
+  output.friendIds = new Set()
+  output.followerIds = new Set()
+
   if (data.pleroma) {
     if (data.pleroma.settings_store) {
       output.storage = data.pleroma.settings_store['pleroma-fe']
@@ -255,7 +259,7 @@ export const parseStatus = (data) => {
   output.raw_html = data.content
   output.emojis = data.emojis
 
-  output.tags = data.tags
+  output.tags = new Set(data.tags ?? [])
 
   output.edited_at = data.edited_at
 
@@ -328,6 +332,7 @@ export const parseStatus = (data) => {
   output.attentions = (data.mentions || []).map(parseUser)
 
   output.attachments = (data.media_attachments || []).map(parseAttachment)
+  output.deleted = false
 
   const retweetedStatus = data.reblog
   if (retweetedStatus) {
@@ -337,10 +342,6 @@ export const parseStatus = (data) => {
   output.favoritedBy = []
   output.rebloggedBy = []
 
-  if (Object.hasOwn(data, 'originalStatus')) {
-    Object.assign(output, data.originalStatus)
-  }
-
   return output
 }
 
@@ -384,10 +385,13 @@ export const parseLinkHeaderPagination = (linkHeader, opts = {}) => {
   const maxId = parsedLinkHeader.next?.max_id
   const minId = parsedLinkHeader.prev?.min_id
 
-  return {
-    maxId: flakeId ? maxId : Number.parseInt(maxId, 10),
-    minId: flakeId ? minId : Number.parseInt(minId, 10),
-  }
+  const result = {}
+  if (maxId !== undefined)
+    result.maxId = flakeId ? maxId : Number.parseInt(maxId, 10)
+  if (minId !== undefined)
+    result.minId = flakeId ? minId : Number.parseInt(minId, 10)
+
+  return result
 }
 
 export const parseChat = (chat) => {
diff --git a/src/services/follow_manipulate/follow_manipulate.js b/src/services/follow_manipulate/follow_manipulate.js
deleted file mode 100644
index 759ba67d9..000000000
--- a/src/services/follow_manipulate/follow_manipulate.js
+++ /dev/null
@@ -1,67 +0,0 @@
-import { useOAuthStore } from 'src/stores/oauth.js'
-
-import {
-  fetchUserRelationship,
-  followUser,
-  unfollowUser,
-} from 'src/api/user.js'
-
-const fetchRelationship = (attempt, userId, store) =>
-  new Promise((resolve, reject) => {
-    setTimeout(() => {
-      fetchUserRelationship({
-        id: userId,
-        credentials: useOAuthStore().token,
-      })
-        .then(({ data: relationship }) => {
-          store.commit('updateUserRelationship', [relationship])
-          return relationship
-        })
-        .then((relationship) =>
-          resolve([
-            relationship.following,
-            relationship.requested,
-            relationship.locked,
-            attempt,
-          ]),
-        )
-        .catch((e) => reject(e))
-    }, 500)
-  }).then(([following, sent, locked, attempt]) => {
-    if (!following && !(locked && sent) && attempt <= 3) {
-      // If we BE reports that we still not following that user - retry,
-      // increment attempts by one
-      fetchRelationship(++attempt, userId, store)
-    }
-  })
-
-export const requestFollow = async (userId, store) => {
-  const { data: updated } = await followUser({
-    id: userId,
-    credentials: useOAuthStore().token,
-  })
-
-  store.commit('updateUserRelationship', [updated])
-
-  if (updated.following || (updated.locked && updated.requested)) {
-    // If we get result immediately or the account is locked, just stop.
-    return
-  }
-
-  // But usually we don't get result immediately, so we ask server
-  // for updated user profile to confirm if we are following them
-  // Sometimes it takes several tries. Sometimes we end up not following
-  // user anyway, probably because they locked themselves and we
-  // don't know that yet.
-  // Recursive Promise, it will call itself up to 3 times.
-  return await fetchRelationship(1, updated, store)
-}
-
-export const requestUnfollow = async (userId, store) => {
-  const { data: updated } = await unfollowUser({
-    id: userId,
-    credentials: useOAuthStore().token,
-  })
-
-  return await store.commit('updateUserRelationship', [updated])
-}
diff --git a/src/services/follow_request_fetcher/follow_request_fetcher.service.js b/src/services/follow_request_fetcher/follow_request_fetcher.service.js
index e49206fcd..492c4e648 100644
--- a/src/services/follow_request_fetcher/follow_request_fetcher.service.js
+++ b/src/services/follow_request_fetcher/follow_request_fetcher.service.js
@@ -1,12 +1,15 @@
+import { useUsersStore } from 'src/stores/users.js'
+
 import { fetchFollowRequests } from 'src/api/user.js'
 import { promiseInterval } from 'src/services/promise_interval/promise_interval.js'
 
 const fetchAndUpdate = ({ store, credentials }) => {
   return fetchFollowRequests({ credentials })
     .then(
-      ({ data: requests }) => {
+      (result) => {
+        const { data: requests } = result
         store.commit('setFollowRequests', requests)
-        store.commit('addNewUsers', requests)
+        useUsersStore().addNewUsers(result)
       },
       (rej) => {
         console.error(rej)
diff --git a/src/services/notification_utils/notification_utils.js b/src/services/notification_utils/notification_utils.js
index 9e443bf8b..1fdb7bec1 100644
--- a/src/services/notification_utils/notification_utils.js
+++ b/src/services/notification_utils/notification_utils.js
@@ -1,7 +1,11 @@
 import { showDesktopNotification } from '../desktop_notification_utils/desktop_notification_utils.js'
 import { muteFilterHits } from '../status_parser/status_parser.js'
+import {
+  isStatusNotification,
+  prepareNotificationObject,
+} from './notification_utils_sw.js'
 
-import FaviconService from 'src/services/favicon_service/favicon_service.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
 
 export const ACTIONABLE_NOTIFICATION_TYPES = new Set([
   'mention',
@@ -9,10 +13,6 @@ export const ACTIONABLE_NOTIFICATION_TYPES = new Set([
   'follow_request',
 ])
 
-let cachedBadgeUrl = null
-
-export const notificationsFromStore = (store) => store.state.notifications.data
-
 const visibleTypes = (notificationVisibility) => {
   return [
     notificationVisibility.likes && 'like',
@@ -28,17 +28,6 @@ const visibleTypes = (notificationVisibility) => {
   ].filter(Boolean)
 }
 
-const statusNotifications = new Set([
-  'like',
-  'mention',
-  'status',
-  'repeat',
-  'pleroma:emoji_reaction',
-  'poll',
-])
-
-export const isStatusNotification = (type) => statusNotifications.has(type)
-
 export const isValidNotification = (notification) => {
   if (isStatusNotification(notification.type) && !notification.status) {
     return false
@@ -69,14 +58,11 @@ const isMutedNotification = (muteFilters, notification) => {
 }
 
 export const maybeShowNotification = (
-  store,
   notificationVisibility,
   muteFilters,
   notification,
   i18n,
 ) => {
-  const rootState = store.rootState || store.state
-
   if (notification.seen) return
   if (!visibleTypes(notificationVisibility).includes(notification.type)) return
   if (
@@ -86,28 +72,23 @@ export const maybeShowNotification = (
     return
 
   const notificationObject = prepareNotificationObject(notification, i18n)
-  showDesktopNotification(rootState, notificationObject)
+  showDesktopNotification(notificationObject)
 }
 
-export const filteredNotificationsFromStore = (
-  store,
-  notificationVisibility,
-  types,
-) => {
+export const filteredNotifications = (notificationVisibility, types) => {
   // map is just to clone the array since sort mutates it and it causes some issues
-  const sortedNotifications = notificationsFromStore(store).sort(sortById)
+  const sortedNotifications = useNotificationsStore().data.sort(sortById)
   // TODO implement sorting elsewhere and make it optional
   return sortedNotifications.filter((notification) =>
     (types || visibleTypes(notificationVisibility)).includes(notification.type),
   )
 }
 
-export const unseenNotificationsFromStore = (
-  store,
+export const unseenNotifications = (
   notificationVisibility,
   ignoreInactionableSeen,
 ) => {
-  return filteredNotificationsFromStore(store, notificationVisibility).filter(
+  return filteredNotifications(notificationVisibility).filter(
     ({ seen, type }) => {
       if (!ignoreInactionableSeen) return !seen
       if (seen) return false
@@ -116,70 +97,6 @@ export const unseenNotificationsFromStore = (
   )
 }
 
-export const prepareNotificationObject = (notification, i18n) => {
-  if (cachedBadgeUrl === null) {
-    const favicons = FaviconService.getOriginalFavicons()
-    const favicon = favicons[favicons.length - 1]
-    if (!favicon) {
-      cachedBadgeUrl = 'about:blank'
-    } else {
-      cachedBadgeUrl = favicon.favimg.src
-    }
-  }
-
-  const notifObj = {
-    tag: notification.id,
-    type: notification.type,
-    badge: cachedBadgeUrl,
-  }
-  const status = notification.status
-  const title = notification.from_profile.name
-  notifObj.title = title
-  notifObj.icon = notification.from_profile.profile_image_url
-  let i18nString
-  switch (notification.type) {
-    case 'like':
-      i18nString = 'favorited_you'
-      break
-    case 'status':
-      i18nString = 'subscribed_status'
-      break
-    case 'repeat':
-      i18nString = 'repeated_you'
-      break
-    case 'follow':
-      i18nString = 'followed_you'
-      break
-    case 'move':
-      i18nString = 'migrated_to'
-      break
-    case 'follow_request':
-      i18nString = 'follow_request'
-      break
-    case 'pleroma:report':
-      i18nString = 'submitted_report'
-      break
-    case 'poll':
-      i18nString = 'poll_ended'
-      break
-  }
-
-  if (notification.type === 'pleroma:emoji_reaction') {
-    notifObj.body = i18n.t('notifications.reacted_with', [notification.emoji])
-  } else if (i18nString) {
-    notifObj.body = i18n.t('notifications.' + i18nString)
-  } else if (isStatusNotification(notification.type)) {
-    notifObj.body = notification.status.text
-  }
-
-  // Shows first attached non-nsfw image, if any. Should add configuration for this somehow...
-  if (!status.nsfw && status?.attachments?.[0]?.mimetype.startsWith('image/')) {
-    notifObj.image = status.attachments[0].url
-  }
-
-  return notifObj
-}
-
 export const countExtraNotifications = (
   store,
   mergedConfig,
diff --git a/src/services/notification_utils/notification_utils_sw.js b/src/services/notification_utils/notification_utils_sw.js
new file mode 100644
index 000000000..59cfeb77a
--- /dev/null
+++ b/src/services/notification_utils/notification_utils_sw.js
@@ -0,0 +1,81 @@
+import FaviconService from 'src/services/favicon_service/favicon_service.js'
+
+const statusNotifications = new Set([
+  'like',
+  'mention',
+  'status',
+  'repeat',
+  'pleroma:emoji_reaction',
+  'poll',
+])
+
+let cachedBadgeUrl = null
+
+export const isStatusNotification = (type) => statusNotifications.has(type)
+
+export const prepareNotificationObject = (notification, i18n) => {
+  if (cachedBadgeUrl === null) {
+    const favicons = FaviconService.getOriginalFavicons()
+    const favicon = favicons[favicons.length - 1]
+    if (!favicon) {
+      cachedBadgeUrl = 'about:blank'
+    } else {
+      cachedBadgeUrl = favicon.favimg.src
+    }
+  }
+
+  const notifObj = {
+    tag: notification.id,
+    type: notification.type,
+    badge: cachedBadgeUrl,
+  }
+  const status = notification.status
+  const title = notification.from_profile.name
+  notifObj.title = title
+  notifObj.icon = notification.from_profile.profile_image_url
+  let i18nString
+  switch (notification.type) {
+    case 'like':
+      i18nString = 'favorited_you'
+      break
+    case 'status':
+      i18nString = 'subscribed_status'
+      break
+    case 'repeat':
+      i18nString = 'repeated_you'
+      break
+    case 'follow':
+      i18nString = 'followed_you'
+      break
+    case 'move':
+      i18nString = 'migrated_to'
+      break
+    case 'follow_request':
+      i18nString = 'follow_request'
+      break
+    case 'pleroma:report':
+      i18nString = 'submitted_report'
+      break
+    case 'poll':
+      i18nString = 'poll_ended'
+      break
+  }
+
+  if (notification.type === 'pleroma:emoji_reaction') {
+    notifObj.body = i18n.t('notifications.reacted_with', [notification.emoji])
+  } else if (i18nString) {
+    notifObj.body = i18n.t('notifications.' + i18nString)
+  } else if (isStatusNotification(notification.type)) {
+    notifObj.body = notification.status.text
+  }
+
+  // Shows first attached non-nsfw image, if any. Should add configuration for this somehow...
+  if (
+    !status?.nsfw &&
+    status?.attachments?.[0]?.mimetype.startsWith('image/')
+  ) {
+    notifObj.image = status.attachments[0].url
+  }
+
+  return notifObj
+}
diff --git a/src/services/notifications_fetcher/notifications_fetcher.service.js b/src/services/notifications_fetcher/notifications_fetcher.service.js
deleted file mode 100644
index 0e0bc0277..000000000
--- a/src/services/notifications_fetcher/notifications_fetcher.service.js
+++ /dev/null
@@ -1,128 +0,0 @@
-import { promiseInterval } from '../promise_interval/promise_interval.js'
-
-import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
-import { useInterfaceStore } from 'src/stores/interface.js'
-import { useMergedConfigStore } from 'src/stores/merged_config.js'
-
-import { fetchTimeline } from 'src/api/timelines.js'
-
-const update = ({ store, notifications, older }) => {
-  store.dispatch('addNewNotifications', { notifications, older })
-}
-//
-// For using include_types when fetching notifications.
-// Note: chat_mention excluded as pleroma-fe polls them separately
-const mastoApiNotificationTypes = new Set([
-  'mention',
-  'status',
-  'favourite',
-  'reblog',
-  'follow',
-  'follow_request',
-  'move',
-  'poll',
-  'pleroma:emoji_reaction',
-  'pleroma:report',
-])
-
-const fetchAndUpdate = ({ store, credentials, older = false, sinceId }) => {
-  const args = { credentials }
-  const rootState = store.rootState || store.state
-  const timelineData = rootState.notifications
-  const hideMutedPosts = useMergedConfigStore().mergedConfig.hideMutedPosts
-
-  if (useInstanceCapabilitiesStore().pleromaChatMessagesAvailable) {
-    mastoApiNotificationTypes.add('pleroma:chat_mention')
-  }
-
-  args.includeTypes = [...mastoApiNotificationTypes]
-  args.withMuted = !hideMutedPosts
-
-  args.timeline = 'notifications'
-  if (older) {
-    if (timelineData.minId !== Number.POSITIVE_INFINITY) {
-      args.maxId = timelineData.minId
-    }
-    return fetchNotifications({ store, args, older })
-  } else {
-    // fetch new notifications
-    if (
-      sinceId === undefined &&
-      timelineData.maxId !== Number.POSITIVE_INFINITY
-    ) {
-      args.sinceId = timelineData.maxId
-    } else if (sinceId !== null) {
-      args.sinceId = sinceId
-    }
-    const result = fetchNotifications({ store, args, older })
-
-    // If there's any unread notifications, try fetch notifications since
-    // the newest read notification to check if any of the unread notifs
-    // have changed their 'seen' state (marked as read in another session), so
-    // we can update the state in this session to mark them as read as well.
-    // The normal maxId-check does not tell if older notifications have changed
-    const notifications = timelineData.data
-    const readNotifsIds = notifications.filter((n) => n.seen).map((n) => n.id)
-    const unreadNotifsIds = notifications
-      .filter((n) => !n.seen)
-      .map((n) => n.id)
-
-    if (readNotifsIds.length > 0 && unreadNotifsIds.length > 0) {
-      const minId = Math.min(...unreadNotifsIds) // Oldest known unread notification
-      if (minId !== Infinity) {
-        args.sinceId = null // Don't use since_id since it sorta conflicts with min_id
-        args.minId = minId - 1 // go beyond
-        fetchNotifications({ store, args, older })
-      }
-    }
-
-    return result
-  }
-}
-
-const fetchNotifications = ({ store, args, older }) => {
-  return fetchTimeline(args)
-    .then((response) => {
-      const notifications = response.data
-      update({ store, notifications, older })
-      return notifications
-    })
-    .catch((error) => {
-      if (
-        error.statusCode === 400 &&
-        error.statusText.includes('Invalid value for enum')
-      ) {
-        error.statusText
-          .matchAll(/(\w+) - Invalid value for enum./g)
-          .toArray()
-          .map((x) => x[1])
-          .forEach((x) => mastoApiNotificationTypes.delete(x))
-        return fetchNotifications({ store, args, older })
-      }
-
-      useInterfaceStore().pushGlobalNotice({
-        level: 'error',
-        messageKey: 'notifications.error',
-        messageArgs: [error.message],
-        timeout: 5000,
-      })
-      console.error(error)
-    })
-}
-
-const startFetching = ({ credentials, store }) => {
-  // Initially there's set flag to silence all desktop notifications so
-  // that there won't spam of them when user just opened up the FE we
-  // reset that flag after a while to show new notifications once again.
-  setTimeout(() => store.dispatch('setNotificationsSilence', false), 10000)
-  const boundFetchAndUpdate = () => fetchAndUpdate({ credentials, store })
-  boundFetchAndUpdate()
-  return promiseInterval(boundFetchAndUpdate, 10000)
-}
-
-const notificationsFetcher = {
-  fetchAndUpdate,
-  startFetching,
-}
-
-export default notificationsFetcher
diff --git a/src/services/status_poster/status_poster.service.js b/src/services/status_poster/status_poster.service.js
index 9a26bd12f..f7877be15 100644
--- a/src/services/status_poster/status_poster.service.js
+++ b/src/services/status_poster/status_poster.service.js
@@ -1,5 +1,9 @@
 import { map } from 'lodash'
 
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
+
 import {
   editStatus as apiEditStatus,
   postStatus as apiPostStatus,
@@ -24,7 +28,7 @@ const postStatus = ({
   const mediaIds = map(media, 'id')
 
   return apiPostStatus({
-    credentials: store.state.users.currentUser.credentials,
+    credentials: useOAuthStore().token,
     status,
     spoilerText,
     visibility,
@@ -36,14 +40,18 @@ const postStatus = ({
     poll,
     preview,
     idempotencyKey,
-  }).then(({ data }) => {
-    if (!preview)
-      store.dispatch('addNewStatuses', {
+  }).then(({ data, timestamp }) => {
+    if (!preview) {
+      useStatusesStore().addNewStatuses({
+        timestamp,
         statuses: [data],
-        timeline: 'friends',
+      })
+      useTimelinesStore().addStatusesToTimeline('friends', undefined, {
+        statuses: [data.id],
         showImmediately: true,
         noIdUpdate: true, // To prevent missing notices on next pull.
       })
+    }
 
     return data
   })
@@ -63,7 +71,7 @@ const editStatus = ({
 
   return apiEditStatus({
     id: statusId,
-    credentials: store.state.users.currentUser.credentials,
+    credentials: useOAuthStore().token,
     status,
     spoilerText,
     sensitive,
@@ -71,10 +79,13 @@ const editStatus = ({
     mediaIds,
     contentType,
   })
-    .then(({ data }) => {
-      store.dispatch('addNewStatuses', {
+    .then(({ data, timestamp }) => {
+      useStatusesStore().addNewStatuses({
         statuses: [data],
-        timeline: 'friends',
+        timestamp,
+      })
+      useTimelinesStore().addStatusesToTimeline('friends', undefined, {
+        statuses: [data.id],
         showImmediately: true,
         noIdUpdate: true, // To prevent missing notices on next pull.
       })
@@ -90,12 +101,12 @@ const editStatus = ({
 }
 
 const uploadMedia = ({ store, formData }) => {
-  const credentials = store.state.users.currentUser.credentials
+  const credentials = useOAuthStore().token
   return apiUploadMedia({ credentials, formData }).then(({ data }) => data)
 }
 
 const setMediaDescription = ({ store, id, description }) => {
-  const credentials = store.state.users.currentUser.credentials
+  const credentials = useOAuthStore().token
   return apiSetMediaDescription({ credentials, id, description }).then(
     ({ data }) => data,
   )
diff --git a/src/services/sw/sw.js b/src/services/sw/sw.js
index ef8200a4d..303297449 100644
--- a/src/services/sw/sw.js
+++ b/src/services/sw/sw.js
@@ -94,16 +94,15 @@ function sendSubscriptionToBackEnd(
       return responseData
     })
 }
-export async function initServiceWorker(store) {
+export async function initServiceWorker(notificationsStore) {
   if (!isSWSupported()) return
   await getOrCreateServiceWorker()
   navigator.serviceWorker.addEventListener('message', (event) => {
-    const { dispatch } = store
     const { type, ...rest } = event.data
 
     switch (type) {
       case 'notificationClicked':
-        dispatch('notificationClicked', { id: rest.id })
+        notificationsStore.notificationClicked(rest.id)
     }
   })
 }
diff --git a/src/services/timeline_fetcher/timeline_fetcher.service.js b/src/services/timeline_fetcher/timeline_fetcher.service.js
deleted file mode 100644
index 80dbc75d0..000000000
--- a/src/services/timeline_fetcher/timeline_fetcher.service.js
+++ /dev/null
@@ -1,160 +0,0 @@
-import { camelCase } from 'lodash'
-
-import { promiseInterval } from '../promise_interval/promise_interval.js'
-
-import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
-import { useInterfaceStore } from 'src/stores/interface.js'
-import { useMergedConfigStore } from 'src/stores/merged_config.js'
-
-import { fetchTimeline } from 'src/api/timelines.js'
-
-const update = ({
-  store,
-  statuses,
-  timeline,
-  showImmediately,
-  userId,
-  listId,
-  pagination,
-}) => {
-  const ccTimeline = camelCase(timeline)
-
-  store.dispatch('addNewStatuses', {
-    timeline: ccTimeline,
-    userId,
-    listId,
-    statuses,
-    showImmediately,
-    pagination,
-  })
-}
-
-const fetchAndUpdate = ({
-  store,
-  credentials,
-  timeline = 'friends',
-  older = false,
-  showImmediately = false,
-  userId,
-  listId,
-  statusId,
-  bookmarkFolderId,
-  tag,
-  maxId,
-  sinceId,
-}) => {
-  const args = { timeline, credentials }
-  const rootState = store.rootState || store.state
-  const timelineData = rootState.statuses.timelines[camelCase(timeline)]
-  const { hideMutedPosts, replyVisibility } =
-    useMergedConfigStore().mergedConfig
-  const loggedIn = !!rootState.users.currentUser
-
-  if (older) {
-    // When minId = 0 we need to fetch without maxId param
-    args.maxId = maxId || timelineData.minId || null
-  } else {
-    if (sinceId === undefined) {
-      args.sinceId = timelineData.maxId
-    } else if (sinceId !== null) {
-      args.sinceId = sinceId
-    }
-  }
-
-  args.userId = userId
-  args.listId = listId
-  args.statusId = statusId
-  args.bookmarkFolderId = bookmarkFolderId
-  args.tag = tag
-  args.withMuted = !hideMutedPosts
-  if (
-    loggedIn &&
-    ['friends', 'public', 'publicAndExternal', 'bubble'].includes(timeline)
-  ) {
-    args.replyVisibility = replyVisibility
-  }
-
-  const numStatusesBeforeFetch = timelineData.statuses.length
-
-  return fetchTimeline(args)
-    .then((response) => {
-      const { data: statuses, pagination } = response
-      if (
-        !older &&
-        statuses.length >= 20 &&
-        !timelineData.loading &&
-        numStatusesBeforeFetch > 0
-      ) {
-        store.dispatch('queueFlush', { timeline, id: timelineData.maxId })
-      }
-      update({
-        store,
-        statuses,
-        timeline,
-        showImmediately,
-        userId,
-        listId,
-        pagination,
-      })
-      return { statuses, pagination }
-    })
-    .catch((error) => {
-      if (error.statusCode === 403 && timeline === 'favorites') {
-        useInstanceCapabilitiesStore().pleromaPublicFavouritesAvailable = false
-        return
-      }
-      useInterfaceStore().pushGlobalNotice({
-        level: 'error',
-        messageKey: 'timeline.error',
-        messageArgs: [error.message],
-        timeout: 5000,
-      })
-    })
-}
-
-const startFetching = ({
-  timeline = 'friends',
-  credentials,
-  store,
-  userId,
-  listId,
-  statusId,
-  bookmarkFolderId,
-  tag,
-}) => {
-  const rootState = store.rootState || store.state
-  const timelineData = rootState.statuses.timelines[camelCase(timeline)]
-  const showImmediately = timelineData.visibleStatuses.length === 0
-  timelineData.userId = userId
-  timelineData.listId = listId
-  timelineData.bookmarkFolderId = bookmarkFolderId
-  fetchAndUpdate({
-    timeline,
-    credentials,
-    store,
-    showImmediately,
-    userId,
-    listId,
-    statusId,
-    bookmarkFolderId,
-    tag,
-  })
-  const boundFetchAndUpdate = () =>
-    fetchAndUpdate({
-      timeline,
-      credentials,
-      store,
-      userId,
-      listId,
-      statusId,
-      bookmarkFolderId,
-      tag,
-    })
-  return promiseInterval(boundFetchAndUpdate, 10000)
-}
-const timelineFetcher = {
-  fetchAndUpdate,
-  startFetching,
-}
-
-export default timelineFetcher
diff --git a/src/stores/admin_settings.js b/src/stores/admin_settings.js
index 766da26fb..4961761e7 100644
--- a/src/stores/admin_settings.js
+++ b/src/stores/admin_settings.js
@@ -2,6 +2,8 @@ import { cloneDeep, differenceWith, get, isEqual, set } from 'lodash'
 import { defineStore } from 'pinia'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import {
   addNewEmojiFile,
@@ -362,6 +364,7 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
     async fetchStatuses(opts) {
       const {
         data: { total, activities },
+        timestamp,
       } = await listStatuses({
         credentials: useOAuthStore().token,
         opts,
@@ -369,7 +372,7 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
 
       const statuses = activities.map(parseStatus)
 
-      await window.vuex.dispatch('addNewStatuses', { statuses })
+      useStatusesStore().addNewStatuses({ statuses, timestamp })
 
       return {
         items: statuses,
@@ -377,13 +380,13 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
       }
     },
     async changeStatusScope(opts) {
-      const { data } = await changeStatusScope({
+      const { data, timestamp } = await changeStatusScope({
         credentials: useOAuthStore().token,
         opts,
       })
       const status = parseStatus(data)
 
-      await window.vuex.dispatch('addNewStatuses', { statuses: [status] })
+      useStatusesStore().addNewStatuses({ statuses: [status], timestamp })
     },
 
     // Users stuff
@@ -397,12 +400,14 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
 
       return {
         items: await Promise.all(
-          users.map(
-            async (userAdminData) =>
-              await window.vuex.dispatch('updateUserAdminData', {
-                userAdminData,
-              }),
-          ),
+          users.map(async (user) => {
+            const fullUser = await useUsersStore().fetchUserIfMissing({
+              id: user.id,
+            })
+
+            if (fullUser) useUsersStore().updateUserAdminData(user.id, user)
+            return fullUser
+          }),
         ),
         count,
       }
@@ -416,7 +421,8 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
         screen_name,
       })
 
-      window.vuex.commit('updateUserAdminData', { user: result.data })
+      const { data } = result
+      useUsersStore().updateUserAdminData(data.id, data)
     },
     async deleteUsers({ users }) {
       const screen_names = users.map((u) => u.screen_name)
@@ -428,11 +434,9 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
       })
 
       resultUserIds.data.forEach((userId) => {
-        window.vuex.dispatch(
-          'markStatusesAsDeleted',
-          (status) => userId === status.user.id,
-        )
-        // TODO when migrated to pinia, also remove user
+        useStatusesStore().wipeUserStatuses(userId)
+        // Users are technically never deleted, just deactivated
+        // so there's no real need to delete them from store.
       })
 
       return resultUserIds
@@ -489,7 +493,7 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
       })
 
       users.forEach((user) => {
-        window.vuex.commit('updateRight', { user, right, value })
+        useUsersStore().updateRight(user.id, right, value)
       })
     },
     async setUsersActivationStatus({ users, value }) {
@@ -503,7 +507,7 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
       })
 
       resultUsers.data.forEach((user) => {
-        window.vuex.commit('updateUserAdminData', { user })
+        useUsersStore().updateUserAdminData(user.id, user)
       })
     },
     async setUsersSuggestionStatus({ users, value }) {
@@ -517,7 +521,7 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
       })
 
       resultUsers.data.forEach((user) => {
-        window.vuex.commit('updateUserAdminData', { user })
+        useUsersStore().updateUserAdminData(user.id, user)
       })
     },
     async setUsersConfirmationStatus({ users }) {
@@ -543,7 +547,7 @@ export const useAdminSettingsStore = defineStore('adminSettings', {
       })
 
       resultUsers.data.forEach((user) => {
-        window.vuex.commit('updateUserAdminData', { user })
+        useUsersStore().updateUserAdminData(user.id, user)
       })
     },
     reloadEmoji() {
diff --git a/src/stores/announcements.js b/src/stores/announcements.js
index b09655755..c78e79853 100644
--- a/src/stores/announcements.js
+++ b/src/stores/announcements.js
@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { dismissAnnouncement, getAnnouncements } from 'src/api/user.js'
 
@@ -16,7 +17,7 @@ export const useAnnouncementsStore = defineStore('announcements', {
   }),
   getters: {
     unreadAnnouncementCount() {
-      if (!window.vuex.state.users.currentUser) {
+      if (!useUsersStore().currentUser) {
         return 0
       }
 
@@ -30,7 +31,7 @@ export const useAnnouncementsStore = defineStore('announcements', {
     async fetchAnnouncements() {
       if (!this.supportsAnnouncements) return
 
-      const currentUser = window.vuex.state.users.currentUser
+      const currentUser = useUsersStore().currentUser
       const isAdmin =
         currentUser &&
         currentUser.privileges.has('announcements_manage_announcements')
@@ -95,7 +96,7 @@ export const useAnnouncementsStore = defineStore('announcements', {
         this.announcements[index].read = true
       })
     },
-    startFetchingAnnouncements() {
+    startFetching() {
       if (this.fetchAnnouncementsTimer) {
         return
       }
@@ -108,7 +109,7 @@ export const useAnnouncementsStore = defineStore('announcements', {
 
       return this.fetchAnnouncements()
     },
-    stopFetchingAnnouncements() {
+    stopFetching() {
       const interval = this.fetchAnnouncementsTimer
       this.fetchAnnouncementsTimer = undefined
       clearInterval(interval)
diff --git a/src/stores/auth_flow.js b/src/stores/auth_flow.js
index 64df30f2a..6600fe3f8 100644
--- a/src/stores/auth_flow.js
+++ b/src/stores/auth_flow.js
@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const PASSWORD_STRATEGY = 'password'
 const TOKEN_STRATEGY = 'token'
@@ -62,8 +63,8 @@ export const useAuthFlowStore = defineStore('authFlow', {
       this.settings = {}
     },
     async login({ access_token: accessToken }) {
-      useOAuthStore().setToken(accessToken)
-      await window.vuex.dispatch('loginUser', accessToken, { root: true })
+      await useOAuthStore().setToken(accessToken)
+      await useUsersStore().loginUser(accessToken, { root: true })
       this.resetState()
     },
   },
diff --git a/src/stores/chats.js b/src/stores/chats.js
index 5ade0c126..32296ff4f 100644
--- a/src/stores/chats.js
+++ b/src/stores/chats.js
@@ -1,113 +1,95 @@
-import { find, omitBy, orderBy, sumBy } from 'lodash'
+import { orderBy, sumBy } from 'lodash'
 import { defineStore } from 'pinia'
 
 import { maybeShowChatNotification } from '../services/chat_utils/chat_utils.js'
 import { promiseInterval } from '../services/promise_interval/promise_interval.js'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { chats } from 'src/api/chats.js'
 
-const emptyChatList = () => ({
-  data: [],
-  idStore: {},
-})
-
 const defaultState = {
-  chatList: emptyChatList(),
-  chatListFetcher: null,
-}
-
-const getChatById = (state, id) => {
-  return find(state.chatList.data, { id })
+  data: new Map(),
+  fetcher: null,
 }
 
 export const useChatsStore = defineStore('chats', {
   state: () => ({ ...defaultState }),
   getters: {
     sortedChatList(state) {
-      return orderBy(state.chatList.data, ['updated_at'], ['desc'])
+      return orderBy([...state.data.values()], ['updated_at'], ['desc'])
     },
     unreadChatsCount(state) {
-      return sumBy(state.chatList.data, 'unread')
+      return sumBy([...state.data.values()], 'unread')
     },
   },
   actions: {
-    startFetchingChats() {
-      const fetcher = () => this.fetchChats()
-      this.setChatListFetcher(() => promiseInterval(fetcher, 5000))
+    attachSocket() {
+      const et = new EventTarget()
+      const socket = {
+        name: 'chats',
+        et,
+      }
+
+      et.addEventListener('pleroma:chat_update', ({ data: { chatUpdate } }) => {
+        this.updateChat(chatUpdate)
+      })
+
+      useStreamingStore().addSubscriber(socket)
     },
-    stopFetchingChats() {
-      this.setChatListFetcher(null)
+    startFetching() {
+      this.fetcher = promiseInterval(() => this.fetchChats(), 5000)
+      this.fetchChats()
+    },
+    stopFetching() {
+      this.fetcher?.stop()
+      this.fetcher = null
     },
     async fetchChats() {
-      const { data } = await chats({
-        credentials: useOAuthStore().token,
-      })
-
-      this.addNewChats(data)
-    },
-    setChatListFetcher(fetcher) {
-      const prevFetcher = this.chatListFetcher
-      if (prevFetcher) {
-        prevFetcher.stop()
-      }
-      this.chatListFetcher = fetcher?.()
+      this.addNewChats(
+        await chats({
+          credentials: useOAuthStore().token,
+        }),
+      )
     },
     resetChats() {
-      this.chatList = emptyChatList()
-      this.setChatListFetcher(null)
+      this.data = new Map()
     },
-    addNewChats(chats) {
-      window.vuex.commit(
-        'addNewUsers',
-        chats.map((k) => k.account).filter(Boolean),
-      )
-
-      chats.forEach((updatedChat) => {
-        const chat = getChatById(this, updatedChat.id)
-
-        if (chat) {
-          const isNewMessage =
-            chat.lastMessage?.id !== updatedChat.lastMessage?.id
-          chat.lastMessage = updatedChat.lastMessage
-          chat.unread = updatedChat.unread
-          chat.updated_at = updatedChat.updated_at
-          if (isNewMessage && chat.unread) {
-            maybeShowChatNotification(chat)
-          }
-        } else {
-          this.chatList.data.push(updatedChat)
-          this.chatList.idStore[updatedChat.id] = updatedChat
-        }
+    addNewChats(result) {
+      useUsersStore().addNewUsers({
+        ...result,
+        data: result.data.map((k) => k.account).filter(Boolean),
       })
+
+      // We do unshift in update so we reverse the chat list here
+      result.data.forEach((chat) => this.updateChat(chat))
     },
     readChat(id) {
-      const chat = getChatById(this, id)
+      const chat = this.data.get(id)
       if (chat) {
         chat.unread = 0
+      } else {
+        console.error(`Chat ${id} not found!`)
       }
     },
-    updateChat({ chat: updatedChat }) {
-      const chat = getChatById(this, updatedChat.id)
+    updateChat(updatedChat) {
+      const chat = this.data.get(updatedChat.id)
       if (chat) {
+        const isNewMessage =
+          chat.lastMessage?.id !== updatedChat.lastMessage?.id
         chat.lastMessage = updatedChat.lastMessage
         chat.unread = updatedChat.unread
         chat.updated_at = updatedChat.updated_at
+        if (isNewMessage) maybeShowChatNotification(chat)
+      } else {
+        this.data.set(updatedChat.id, updatedChat)
+        maybeShowChatNotification(updatedChat)
       }
-      if (!chat) {
-        this.chatList.data.unshift(updatedChat)
-      }
-      this.chatList.idStore[updatedChat.id] = updatedChat
     },
     deleteChat(id) {
-      this.chats.data = this.chats.data.filter(
-        (conversation) => conversation.last_status.id !== id,
-      )
-      this.chats.idStore = omitBy(
-        this.chats.idStore,
-        (conversation) => conversation.last_status.id === id,
-      )
+      this.data.delete(id)
     },
   },
 })
diff --git a/src/stores/emoji.js b/src/stores/emoji.js
index 8135a483e..1471f3dfb 100644
--- a/src/stores/emoji.js
+++ b/src/stores/emoji.js
@@ -3,6 +3,7 @@ import { defineStore } from 'pinia'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { listEmojiPacks } from 'src/api/public.js'
 import { ensureFinalFallback } from 'src/i18n/languages.js'
@@ -194,7 +195,7 @@ export const useEmojiStore = defineStore('emoji', {
     },
 
     async getAdminPacks(instance, listFunction) {
-      const currentUser = window.vuex.state.users.currentUser
+      const currentUser = useUsersStore().currentUser
 
       if (!currentUser.rights.admin) return
 
diff --git a/src/stores/fetchers/notifications_fetcher.js b/src/stores/fetchers/notifications_fetcher.js
new file mode 100644
index 000000000..5403d59c9
--- /dev/null
+++ b/src/stores/fetchers/notifications_fetcher.js
@@ -0,0 +1,140 @@
+import { ref } from 'vue'
+
+import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
+import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
+
+import { fetchTimeline } from 'src/api/timelines.js'
+import { promiseInterval } from 'src/services/promise_interval/promise_interval.js'
+
+// For using include_types when fetching notifications.
+// Note: chat_mention excluded as pleroma-fe polls them separately
+const mastoApiNotificationTypes = new Set([
+  'mention',
+  'status',
+  'favourite',
+  'reblog',
+  'follow',
+  'follow_request',
+  'move',
+  'poll',
+  'pleroma:emoji_reaction',
+  'pleroma:report',
+])
+
+const notificationsFetcher = (credentials) => {
+  const interval = ref(null)
+  const loading = ref(false)
+  const bottomedOut = ref(false)
+
+  const fetchNotifications = async ({ args, older }) => {
+    loading.value = true
+
+    try {
+      const response = await fetchTimeline(args)
+      const notifications = response.data
+      if (older && notifications.length === 0) bottomedOut.value = true
+
+      useNotificationsStore().addNewNotifications(response, older)
+    } catch (error) {
+      if (
+        error.statusCode === 400 &&
+        error.statusText.includes('Invalid value for enum')
+      ) {
+        error.statusText
+          .matchAll(/(\w+) - Invalid value for enum./g)
+          .toArray()
+          .map((x) => x[1])
+          .forEach((x) => mastoApiNotificationTypes.delete(x))
+
+        // Retry
+        return await fetchNotifications({ args, older })
+      }
+
+      console.error('Notifications Error', error)
+      useInterfaceStore().pushGlobalNotice({
+        level: 'error',
+        messageKey: 'notifications.error',
+        messageArgs: [error.message],
+        timeout: 5000,
+      })
+    } finally {
+      loading.value = false
+    }
+  }
+
+  const fetchAndUpdate = async ({ older = false, sinceId } = {}) => {
+    const args = { credentials }
+    const timelineData = useNotificationsStore()
+    const hideMutedPosts = useMergedConfigStore().mergedConfig.hideMutedPosts
+
+    if (useInstanceCapabilitiesStore().pleromaChatMessagesAvailable) {
+      mastoApiNotificationTypes.add('pleroma:chat_mention')
+    }
+
+    args.includeTypes = [...mastoApiNotificationTypes]
+    args.withMuted = !hideMutedPosts
+
+    args.timeline = 'notifications'
+    if (older) {
+      if (timelineData.minId !== '') {
+        args.maxId = timelineData.minId
+      }
+      return await fetchNotifications({ args, older })
+    } else {
+      // fetch new notifications
+      if (sinceId === undefined && timelineData.maxId !== '') {
+        args.sinceId = timelineData.maxId
+      } else if (sinceId !== null) {
+        args.sinceId = sinceId
+      }
+      const result = await fetchNotifications({ args, older })
+
+      // If there's any unread notifications, try fetch notifications since
+      // the newest read notification to check if any of the unread notifs
+      // have changed their 'seen' state (marked as read in another session), so
+      // we can update the state in this session to mark them as read as well.
+      // The normal maxId-check does not tell if older notifications have changed
+      const notifications = timelineData.data
+      const readNotifsIds = notifications.filter((n) => n.seen).map((n) => n.id)
+      const unreadNotifsIds = notifications
+        .filter((n) => !n.seen)
+        .map((n) => n.id)
+
+      if (readNotifsIds.length > 0 && unreadNotifsIds.length > 0) {
+        const minId = Math.min(...unreadNotifsIds) // Oldest known unread notification
+        if (minId !== Infinity) {
+          args.sinceId = null // Don't use since_id since it sorta conflicts with min_id
+          args.minId = minId - 1 // go beyond
+          fetchNotifications({ args, older })
+        }
+      }
+
+      return result
+    }
+  }
+
+  const startFetching = () => {
+    if (interval.value) throw new Error('Interval already exists!')
+
+    fetchAndUpdate()
+
+    interval.value = promiseInterval(fetchAndUpdate, 10000)
+  }
+
+  const stopFetching = () => {
+    interval.value.stop()
+    interval.value = null
+  }
+
+  return {
+    loading,
+    bottomedOut,
+    startFetching,
+    stopFetching,
+    fetchOlder: () => fetchAndUpdate({ older: true }),
+  }
+}
+
+export default notificationsFetcher
diff --git a/src/stores/fetchers/timeline_fetcher.js b/src/stores/fetchers/timeline_fetcher.js
new file mode 100644
index 000000000..7fae0800d
--- /dev/null
+++ b/src/stores/fetchers/timeline_fetcher.js
@@ -0,0 +1,148 @@
+import { ref } from 'vue'
+
+import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
+import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { ARGUMENT_MAP, useTimelinesStore } from 'src/stores/timelines.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import { fetchTimeline } from 'src/api/timelines.js'
+import { promiseInterval } from 'src/services/promise_interval/promise_interval.js'
+
+const REPLY_VISIBILITY_TIMELINES = new Set([
+  'friends',
+  'public',
+  'publicAndExternal',
+  'bubble',
+])
+
+const timelineFetcher = (timeline, argument, credentials) => {
+  const loadingNewer = ref(false)
+  const loadingOlder = ref(false)
+  const bottomedOut = ref(false)
+  const interval = ref(null)
+
+  const fetchAndUpdate = ({ older = false, showImmediately = false } = {}) => {
+    if (older) {
+      loadingOlder.value = true
+    } else {
+      loadingNewer.value = true
+    }
+
+    const { hideMutedPosts, replyVisibility } =
+      useMergedConfigStore().mergedConfig
+    const loggedIn = useUsersStore().loggedIn
+
+    const args = { timeline: timeline.name, credentials }
+    const mainArg = ARGUMENT_MAP[timeline.name]
+    if (mainArg) args[mainArg] = argument
+
+    if (older) {
+      // When minId = 0 we need to fetch without maxId param
+      args.maxId = timeline.minId || null
+    } else {
+      args.sinceId = timeline.maxId || null
+    }
+
+    args.withMuted = !hideMutedPosts
+    if (loggedIn && REPLY_VISIBILITY_TIMELINES.has(timeline.name)) {
+      args.replyVisibility = replyVisibility
+    }
+
+    const numStatusesBeforeFetch = timeline.statusIds.size
+
+    if (older && bottomedOut.value) {
+      loadingOlder.value = false
+      return
+    }
+
+    return fetchTimeline(args)
+      .then(({ data, pagination, timestamp }) => {
+        // No statuses for timeline, ever.
+        if (timeline.order.length === 0 && data.length === 0) {
+          bottomedOut.value = true
+        }
+        if (!older && data.length >= 20 && numStatusesBeforeFetch > 0) {
+          useTimelinesStore().requireReload(timeline.name)
+        }
+
+        if (older && data.length === 0) {
+          bottomedOut.value = true
+        }
+
+        const processed = useStatusesStore().addNewStatuses({
+          statuses: data,
+          timestamp,
+        })
+
+        const statuses = processed.map(({ id }) => id)
+
+        const repeats = processed
+          .filter(({ retweeted_status }) => Boolean(retweeted_status))
+          .map(({ id, retweeted_status: { id: repeatedId } }) => [
+            id,
+            repeatedId,
+          ])
+
+        useTimelinesStore().addStatusesToTimeline(timeline.name, argument, {
+          statuses,
+          repeats,
+          showImmediately,
+          older,
+          pagination,
+        })
+
+        return { statuses, pagination }
+      })
+      .catch((error) => {
+        if (error.statusCode === 403 && timeline.name === 'favorites') {
+          useInstanceCapabilitiesStore().pleromaPublicFavouritesAvailable = false
+          return
+        }
+        console.error('Timeline Error', error)
+        useInterfaceStore().pushGlobalNotice({
+          level: 'error',
+          messageKey: 'timeline.error',
+          messageArgs: [error.message],
+          timeout: 5000,
+        })
+      })
+      .finally(() => {
+        if (older) {
+          loadingOlder.value = false
+        } else {
+          loadingNewer.value = false
+        }
+      })
+  }
+
+  const startFetching = () => {
+    if (interval.value) throw new Error('Interval already exists!')
+
+    fetchAndUpdate({
+      showImmediately: timeline.visibleStatusIds.size === 0,
+    })
+
+    interval.value = promiseInterval(fetchAndUpdate, 10000)
+  }
+
+  const stopFetching = () => {
+    interval.value.stop()
+    interval.value = null
+  }
+
+  return {
+    startFetching,
+    stopFetching,
+    fetchOlder: () => fetchAndUpdate({ showImmediately: true, older: true }),
+    loadingOlder,
+    loadingNewer,
+    bottomedOut,
+    resetBottomedOut: () => {
+      bottomedOut.value = false
+    },
+  }
+}
+
+export default timelineFetcher
diff --git a/src/stores/instance.js b/src/stores/instance.js
index 02edd1235..0d1da35d0 100644
--- a/src/stores/instance.js
+++ b/src/stores/instance.js
@@ -13,6 +13,7 @@ import {
 } from '../modules/default_config_state.js'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
 
 import { fetchKnownDomains } from 'src/api/public.js'
 
@@ -212,7 +213,7 @@ export const useInstanceStore = defineStore('instance', {
     async getKnownDomains() {
       try {
         const { data } = await fetchKnownDomains({
-          credentials: window.vuex.state.users.currentUser.credentials,
+          credentials: useOAuthStore().token,
         })
         this.knownDomains = data
       } catch (e) {
diff --git a/src/stores/interface.js b/src/stores/interface.js
index 7be72a8d2..f2b2d86c7 100644
--- a/src/stores/interface.js
+++ b/src/stores/interface.js
@@ -6,17 +6,38 @@ import {
   tryLoadCache,
 } from '../services/style_setter/style_setter.js'
 import { deserialize } from '../services/theme_data/iss_deserializer.js'
+import {
+  windowHeight,
+  windowWidth,
+} from '../services/window_utils/window_utils'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
+import { WSConnectionStatus } from 'src/api/websocket.js'
+import {
+  registerPushNotifications,
+  unregisterPushNotifications,
+} from 'src/services/sw/sw.js'
 import {
   CURRENT_VERSION,
   generatePreset,
 } from 'src/services/theme_data/theme_data.service.js'
 import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
 
+const getNotificationPermission = async () => {
+  const Notification = window.Notification
+
+  if (!Notification) return null
+  if (Notification.permission === 'default')
+    return Notification.requestPermission()
+  return Notification.permission
+}
+
 const GENERIC_FONT_NAMES = new Set([
   'serif',
   'sans-serif',
@@ -73,6 +94,55 @@ export const useInterfaceStore = defineStore('interface', {
     foreignProfileBackground: null,
   }),
   actions: {
+    attachSocket() {
+      const et = new EventTarget()
+      const socket = {
+        name: 'interface',
+        et,
+      }
+
+      et.addEventListener('open', this.onStreamConnect)
+      et.addEventListener('close', this.onStreamDisconnect)
+
+      useStreamingStore().addSubscriber(socket)
+    },
+    onLogin() {
+      getNotificationPermission().then((permission) =>
+        useInterfaceStore().setNotificationPermission(permission),
+      )
+
+      this.setLayoutWidth(windowWidth())
+      this.setLayoutHeight(windowHeight())
+    },
+    onLogout() {
+      this.setLastTimeline('public-timeline')
+      this.setLayoutWidth(windowWidth())
+      this.setLayoutHeight(windowHeight())
+    },
+    onStreamConnect() {
+      if (useStreamingStore().state !== WSConnectionStatus.STARTING_INITIAL) {
+        this.pushGlobalNotice({
+          level: 'success',
+          messageKey: 'timeline.socket_reconnected',
+          timeout: 5000,
+        })
+      }
+    },
+    onStreamDisconnect(closeEvent) {
+      const intendedCodes = new Set([
+        1000, // Normal (intended) closure
+        1001, // Going away
+      ])
+      const { code } = closeEvent.original
+      if (!intendedCodes.has(code)) {
+        this.pushGlobalNotice({
+          level: 'error',
+          messageKey: 'timeline.socket_broke',
+          messageArgs: [code],
+          timeout: 5000,
+        })
+      }
+    },
     setTemporaryChanges({ confirm, revert }) {
       this.temporaryChangesCountdown = 10
       this.temporaryChangesConfirm = confirm
@@ -245,7 +315,7 @@ export const useInterfaceStore = defineStore('interface', {
       const mobileLayout = width <= 800
       const normalOrMobile = mobileLayout ? 'mobile' : 'normal'
       const { thirdColumnMode } = useMergedConfigStore().mergedConfig
-      if (thirdColumnMode === 'none' || !window.vuex.state.users.currentUser) {
+      if (thirdColumnMode === 'none' || !useUsersStore().currentUser) {
         this.layoutType = normalOrMobile
       } else {
         const wideLayout = width >= 1300
@@ -762,6 +832,28 @@ export const useInterfaceStore = defineStore('interface', {
         window.splashError(e)
       }
     },
+
+    // Push notifications
+    registerPushNotifications() {
+      const token = useOAuthStore().token
+      const vapidPublicKey = useInstanceStore().vapidPublicKey
+      const isEnabled = useMergedConfigStore().mergedConfig.webPushNotifications
+      const notificationVisibility =
+        useMergedConfigStore().mergedConfig.notificationVisibility
+
+      registerPushNotifications(
+        isEnabled,
+        vapidPublicKey,
+        token,
+        notificationVisibility,
+      )
+    },
+
+    unregisterPushNotifications() {
+      const token = useOAuthStore().token
+
+      unregisterPushNotifications(token)
+    },
   },
 })
 
diff --git a/src/stores/lists.js b/src/stores/lists.js
index 37471d46e..fcc3fefde 100644
--- a/src/stores/lists.js
+++ b/src/stores/lists.js
@@ -49,6 +49,9 @@ export const useListsStore = defineStore('lists', {
     },
     setLists(value) {
       this.allLists = value
+      this.allListsObject = Object.fromEntries(
+        value.map((list) => [list.id, list]),
+      )
     },
     async createList({ title }) {
       return await createList({
diff --git a/src/stores/notifications.js b/src/stores/notifications.js
new file mode 100644
index 000000000..bed0596ea
--- /dev/null
+++ b/src/stores/notifications.js
@@ -0,0 +1,344 @@
+import { defineStore } from 'pinia'
+
+import notificationsFetcher from 'src/stores/fetchers/notifications_fetcher.js'
+import { useI18nStore } from 'src/stores/i18n.js'
+import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useReportsStore } from 'src/stores/reports.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import { dismissNotification, markNotificationsAsSeen } from 'src/api/user.js'
+import {
+  closeAllDesktopNotifications,
+  closeDesktopNotification,
+} from 'src/services/desktop_notification_utils/desktop_notification_utils.js'
+import {
+  isValidNotification,
+  maybeShowNotification,
+} from 'src/services/notification_utils/notification_utils.js'
+import { isStatusNotification } from 'src/services/notification_utils/notification_utils_sw.js'
+
+export const defaultState = () => ({
+  // Prevents desktop notification spam on startup
+  desktopNotificationSilence: true,
+
+  // Pagination
+  maxId: '',
+  minId: '',
+
+  // Order
+  data: [],
+
+  // TODO: Implement!
+  // Useful for making notification as seen
+  // when interacting with status
+  statusNotificationRelations: new WeakMap(),
+
+  // ID to Object notification
+  idStore: new Map(),
+
+  // Reference to WS subscriber
+  socket: null,
+
+  // Indicates whether notifications receive push updates
+  streaming: false,
+
+  // Indicates whether notifications are SUPPOSED to be fetching
+  // this is partiualrly useful for when pausing/resuming. I.e.
+  // whether we need to start fetching again if timeline was resumed.
+  fetching: true,
+
+  // Reference to fetcher, used for polling for new notifications
+  // and manually fetching old notifications
+  fetcher: null,
+
+  // Whether notifications fetcher has been paused - it stops fetching
+  // (but still receives pushes!)
+  paused: false,
+})
+
+export const useNotificationsStore = defineStore('notifications', {
+  state: defaultState,
+  actions: {
+    // Init
+    attachSocket() {
+      const et = new EventTarget()
+      const socket = {
+        name: 'notifications',
+        et,
+      }
+
+      et.addEventListener('notification', this.addNewNotifications)
+      et.addEventListener('open', this.onStreamConnect)
+      et.addEventListener('close', this.onStreamDisconnect)
+
+      this.socket = socket
+      useStreamingStore().addSubscriber(this.socket)
+    },
+    pause() {
+      this.paused = true
+      if (this.fetcher && this.fetching) {
+        console.debug('[Notifications] Pausing notifications')
+        this.fetcher.stopFetching()
+      }
+    },
+    resume() {
+      this.paused = false
+      if (this.fetcher && this.fetching) {
+        console.debug('[Notifications] Resuming notifications')
+        this.fetcher.startFetching()
+      }
+    },
+    activate() {
+      this.attachSocket()
+
+      // Initially there's set flag to silence all desktop notifications so
+      // that there won't spam of them when user just opened up the FE we
+      // reset that flag after a while to show new notifications once again.
+      setTimeout(() => (this.desktopNotificationSilence = false), 10000)
+
+      if (this.fetcher) throw new Error('Fetcher already exists!')
+      this.fetcher = notificationsFetcher(useOAuthStore().token)
+      this.startFetching('Notifications activated')
+    },
+    deactivate() {
+      if (this.fetching) {
+        this.stopFetching('Notifications deactivated')
+      }
+
+      useStreamingStore().removeSubscriber(this.socket)
+
+      const { et } = this.socket
+      et.removeEventListener('notification', this.addNewNotifications)
+      et.removeEventListener('open', this.onStreamConnect)
+      et.removeEventListener('close', this.onStreamDisconnect)
+
+      const blankState = defaultState()
+      Object.keys(blankState).forEach((k) => {
+        this[k] = blankState[k]
+      })
+      console.debug('[Notifications] Deactivated', this.fetcher)
+    },
+
+    // Poll & Push
+    onStreamConnect() {
+      console.debug('[Notifications] Notifications stream connected')
+      this.streaming = true
+      this.stopFetching('Socket connected')
+    },
+    onStreamDisconnect() {
+      console.debug('[Notifications] Notifications stream disconnected')
+      this.streaming = false
+      this.startFetching('Socket disconnected')
+    },
+    startFetching(reason) {
+      if (this.paused) {
+        console.debug(
+          '[Notificatiosn] NOT Starting notifications fetcher because it is paused',
+          'Original Reason:',
+          reason,
+        )
+        return
+      }
+      console.debug(
+        '[Notifications] Starting notifications fetcher',
+        'Reason:',
+        reason,
+      )
+      this.fetcher.startFetching()
+      this.fetching = true
+    },
+    stopFetching(reason) {
+      this.fetcher.stopFetching()
+      this.fetching = false
+      console.debug(
+        '[Notifications] Stopped notifications fetcher',
+        'Reason:',
+        reason,
+      )
+    },
+
+    // Updates
+    updateExtremes(id) {
+      if (this.maxId === '' || id > this.maxId) {
+        this.maxId = id
+      }
+      if (this.minId === '' || id < this.minId) {
+        this.minId = id
+      }
+    },
+    addNewNotifications(result, older) {
+      const { timestamp, data } = result
+
+      const notifications = older ? data : [...data].reverse()
+
+      useUsersStore().addNewUsers({
+        timestamp,
+        data: notifications.map((n) => n.from_profile),
+      })
+
+      notifications.forEach((n) => {
+        n.from_profile = useUsersStore().findUser(n.from_profile.id)
+      })
+
+      const validNotifications = notifications.filter((notification) => {
+        // If invalid notification, update ids but don't add it to store
+        if (!isValidNotification(notification)) {
+          console.error('Invalid notification:', notification)
+          this.updateExtremes(notification.id)
+          return false
+        }
+        return true
+      })
+
+      useUsersStore().addNewUsers({
+        timestamp,
+        data: validNotifications.map(
+          (notification) => notification.from_profile,
+        ),
+      })
+
+      const statusNotifications = validNotifications.filter(
+        (notification) =>
+          isStatusNotification(notification.type) && notification.status,
+      )
+
+      // Synchronous commit to add all the statuses
+      useStatusesStore().addNewStatuses({
+        timestamp,
+        statuses: statusNotifications.map(
+          (notification) => notification.status,
+        ),
+      })
+
+      // Update references to statuses in notifications to ones in the store
+      statusNotifications.forEach((notification) => {
+        const id = notification.status.id
+        const referenceStatus = useStatusesStore().allStatuses.get(id)
+
+        if (referenceStatus) {
+          notification.status = referenceStatus
+        }
+      })
+
+      validNotifications.forEach((notification) => {
+        if (notification.type === 'pleroma:report') {
+          useReportsStore().addReport(notification.report)
+        }
+
+        if (notification.type === 'pleroma:emoji_reaction') {
+          useStatusesStore().fetchEmojiReactions(notification.status.id)
+        }
+
+        // Only add a new notification if we don't have one for the same action
+        if (!this.idStore.has(notification.id)) {
+          this.updateExtremes(notification.id)
+
+          if (older) {
+            this.data.push(notification)
+          } else {
+            this.data.unshift(notification)
+          }
+          this.idStore.set(notification.id, notification)
+
+          if (notification.status) {
+            this.statusNotificationRelations.set(
+              notification.status,
+              this.idStore.get(notification.id),
+            )
+          }
+
+          maybeShowNotification(
+            useMergedConfigStore().mergedConfig.notificationVisibility,
+            Object.values(
+              useSyncConfigStore().prefsStorage.simple.muteFilters ?? {},
+            ),
+            notification,
+            useI18nStore().i18n,
+          )
+        } else if (notification.seen) {
+          this.idStore.get(notification.id).seen = true
+        }
+      })
+    },
+
+    // Seen / Dismiss
+    notificationClicked(id) {
+      const notification = this.idStore.get(id)
+      const { type, seen } = notification
+
+      if (!seen) {
+        switch (type) {
+          case 'mention':
+          case 'pleroma:report':
+          case 'follow_request':
+            break
+          default:
+            this.markSingleNotificationAsSeen(id)
+        }
+      }
+    },
+    markNotificationsAsSeen() {
+      this.data.forEach((notification) => {
+        notification.seen = true
+      })
+
+      markNotificationsAsSeen({
+        id: this.maxId,
+        credentials: useOAuthStore().token,
+      }).then(() => {
+        closeAllDesktopNotifications()
+      })
+    },
+    markSingleNotificationAsSeen(id) {
+      const notification = this.idStore.get(id)
+      if (notification) notification.seen = true
+
+      markNotificationsAsSeen({
+        single: true,
+        id,
+        credentials: useOAuthStore().token,
+      }).then(() => {
+        closeDesktopNotification(id)
+      })
+    },
+    dismissNotificationLocal(id) {
+      this.idStore.delete(id)
+      this.syncOrder()
+    },
+    dismissNotification(id) {
+      this.dismissNotificationLocal(id)
+
+      dismissNotification({
+        id,
+        credentials: useOAuthStore().token,
+      })
+    },
+    syncOrder() {
+      this.minId = ''
+      this.maxId = ''
+      this.data = this.data.filter(({ id }) => {
+        const present = this.idStore.has(id)
+        if (present) {
+          this.updateExtremes(id) // Side-effect
+        }
+        return present
+      })
+    },
+    wipeStatuses(ids) {
+      const set = new Set(ids)
+      this.data.forEach((notification) => {
+        const status =
+          isStatusNotification(notification.type) && notification.status
+        if (status && set.has(status.id)) {
+          this.idStore.delete(notification.id)
+        }
+      })
+
+      this.syncOrder()
+    },
+  },
+})
diff --git a/src/stores/oauth.js b/src/stores/oauth.js
index 35cd67afb..2d87645eb 100644
--- a/src/stores/oauth.js
+++ b/src/stores/oauth.js
@@ -53,7 +53,7 @@ export const useOAuthStore = defineStore('oauth', {
       this.userToken = token
     },
     clearToken() {
-      this.userToken = false
+      this.userToken = null
     },
     async createApp() {
       const instance = useInstanceStore().server
diff --git a/src/stores/reports.js b/src/stores/reports.js
index 7d319d8e3..0b0e25380 100644
--- a/src/stores/reports.js
+++ b/src/stores/reports.js
@@ -1,8 +1,8 @@
-import { filter } from 'lodash'
 import { defineStore } from 'pinia'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
 
 import { setReportState } from 'src/api/admin.js'
 
@@ -10,28 +10,25 @@ export const useReportsStore = defineStore('reports', {
   state: () => ({
     reportModal: {
       userId: null,
-      statuses: [],
-      preTickedIds: [],
+      statusIds: new Set(),
+      preTickedIds: new Set(),
       activated: false,
     },
     reports: {},
   }),
   actions: {
     openUserReportingModal({ userId, statusIds = [] }) {
-      const preTickedStatuses = statusIds.map(
-        (id) => window.vuex.state.statuses.allStatusesObject[id],
-      )
-      const preTickedIds = statusIds
-      const statuses = preTickedStatuses.concat(
-        filter(
-          window.vuex.state.statuses.allStatuses,
-          (status) =>
-            status.user.id === userId && !preTickedIds.includes(status.id),
-        ),
-      )
+      const preTickedIds = new Set(statusIds)
+      // There could be a case (i.e. user is only ever mentioned in someone else's post -> user popover)
+      // where user has no known posts
+      const userAllStatusesIds =
+        useStatusesStore().statusesPerUser.get(userId) ?? new Set()
+      // Set constructor should take care of duplicated IDs and order,
+      // later duplicated IDs will be dropped in favor of earlier
+      const sortedIds = new Set([...preTickedIds, ...userAllStatusesIds])
 
       this.reportModal.userId = userId
-      this.reportModal.statuses = statuses
+      this.reportModal.statusIds = sortedIds
       this.reportModal.preTickedIds = preTickedIds
       this.reportModal.activated = true
     },
diff --git a/src/stores/scrobbles.js b/src/stores/scrobbles.js
new file mode 100644
index 000000000..180f433b7
--- /dev/null
+++ b/src/stores/scrobbles.js
@@ -0,0 +1,41 @@
+import { defineStore } from 'pinia'
+
+import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import { fetchScrobbles } from 'src/api/public.js'
+
+export const defaultState = () => ({
+  scrobblesNextFetch: new Map(),
+})
+
+export const useScrobblesStore = defineStore('scrobbles', {
+  state: defaultState,
+  actions: {
+    getLatestScrobble(userId) {
+      const scrobblesSupport =
+        useInstanceCapabilitiesStore().pleromaScrobblesAvailable
+
+      if (!scrobblesSupport) {
+        return
+      }
+
+      if (this.scrobblesNextFetch.get(userId) > Date.now()) {
+        return
+      }
+
+      this.scrobblesNextFetch.set(userId, Date.now() + 24 * 60 * 60 * 1000)
+
+      fetchScrobbles({ accountId: userId })
+        .then(({ data: scrobbles }) => {
+          useUsersStore().findUser(userId).latestScrobble = scrobbles[0]
+
+          this.scrobblesNextFetch.set(userId, Date.now() + 60 * 1000)
+        })
+        .catch((e) => {
+          useInstanceCapabilitiesStore().set('pleromaScrobblesAvailable', false)
+          console.warn('cannot fetch scrobbles', e)
+        })
+    },
+  },
+})
diff --git a/src/stores/search.js b/src/stores/search.js
new file mode 100644
index 000000000..cd7862d23
--- /dev/null
+++ b/src/stores/search.js
@@ -0,0 +1,56 @@
+import { defineStore } from 'pinia'
+
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import { search2, searchUsers } from 'src/api/public.js'
+
+export const useSearchStore = defineStore('search', {
+  actions: {
+    async search({ q, resolve, limit, offset, following, type }) {
+      const { data, ...rest } = await search2({
+        q,
+        resolve,
+        limit,
+        offset,
+        following,
+        type,
+        credentials: useOAuthStore().token,
+      })
+
+      const { accounts, statuses, hashtags } = data
+
+      useUsersStore().addNewUsers({
+        ...rest,
+        data: accounts,
+      })
+
+      useStatusesStore().addNewStatuses({
+        ...rest,
+        statuses,
+      })
+
+      const output = {}
+      output.statuses = statuses.map((s) =>
+        useStatusesStore().allStatuses.get(s.id),
+      )
+      output.accounts = accounts.map((s) => useUsersStore().findUser(s.id))
+      output.hashtags = hashtags ?? []
+      return output
+    },
+
+    // Search
+    searchUsers({ query }) {
+      return searchUsers({
+        query,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const { data } = result
+        useUsersStore().addNewUsers(result)
+
+        return data.map((s) => useUsersStore().findUser(s.id))
+      })
+    },
+  },
+})
diff --git a/src/stores/statusHistory.js b/src/stores/statusHistory.js
index 9868b22c5..e2a69c36d 100644
--- a/src/stores/statusHistory.js
+++ b/src/stores/statusHistory.js
@@ -1,17 +1,34 @@
 import { defineStore } from 'pinia'
 
+import { useOAuthStore } from 'src/stores/oauth.js'
+
+import { fetchStatusHistory } from 'src/api/public.js'
+
 export const useStatusHistoryStore = defineStore('statusHistory', {
   state: () => ({
-    params: {},
+    id: null,
     modalActivated: false,
+    history: null,
   }),
   actions: {
-    openStatusHistoryModal(params) {
-      this.params = params
-      this.modalActivated = true
+    openModal(id) {
+      this.fetchStatusHistory(id).then(() => {
+        this.id = id
+        this.modalActivated = true
+      })
     },
-    closeStatusHistoryModal() {
+    closeModal() {
+      this.id = null
       this.modalActivated = false
+      this.history = null
+    },
+    fetchStatusHistory(id) {
+      return fetchStatusHistory({
+        id,
+        credentials: useOAuthStore().token,
+      }).then(({ data }) => {
+        this.history = data
+      })
     },
   },
 })
diff --git a/src/stores/statuses.js b/src/stores/statuses.js
new file mode 100644
index 000000000..5fd7a3f2c
--- /dev/null
+++ b/src/stores/statuses.js
@@ -0,0 +1,566 @@
+import { defineStore } from 'pinia'
+
+import { useInterfaceStore } from 'src/stores/interface.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import {
+  fetchEmojiReactions,
+  fetchFavoritedByUsers,
+  fetchRebloggedByUsers,
+  fetchStatus,
+  fetchStatusSource,
+} from 'src/api/public.js'
+import {
+  bookmarkStatus,
+  deleteStatus,
+  favorite,
+  muteConversation,
+  pinOwnStatus,
+  reactWithEmoji,
+  retweet,
+  unbookmarkStatus,
+  unfavorite,
+  unmuteConversation,
+  unpinOwnStatus,
+  unreactWithEmoji,
+  unretweet,
+} from 'src/api/user.js'
+
+export const defaultState = () => ({
+  allStatuses: new Map(),
+  statusesPerUser: new Map(),
+  timestamps: new WeakMap(),
+  scrobblesNextFetch: {},
+  conversations: new Map(),
+  favorites: new Set(),
+  socket: null,
+  favs: new Map(),
+  repeats: new Map(),
+})
+
+export const useStatusesStore = defineStore('statuses', {
+  state: defaultState,
+  actions: {
+    // Init
+    attachSocket() {
+      const et = new EventTarget()
+      const handleUpdate = ({ data, timestamp }) =>
+        this.addNewStatuses({ statuses: data, timestamp })
+      const handleDelete = ({ data }) =>
+        data.forEach((id) => this.setDeleted(id))
+
+      const socket = {
+        name: 'statuses',
+        et,
+        handlers: {
+          handleUpdate,
+          handleDelete,
+        },
+      }
+
+      et.addEventListener('update', handleUpdate)
+      et.addEventListener('status.update', handleUpdate)
+      et.addEventListener('delete', handleDelete)
+
+      useStreamingStore().addSubscriber(socket)
+      this.socket = socket
+    },
+    resetStatuses() {
+      const emptyState = defaultState()
+      Object.entries(emptyState).forEach(([key, value]) => {
+        if (key === 'socket') return
+        this[key] = value
+      })
+    },
+
+    addNewStatuses({ statuses, timestamp }) {
+      // Sanity check
+      if (!Array.isArray(statuses)) {
+        throw new TypeError("Statuses aren't an array!")
+      }
+
+      // addStatus should always return "main" status,
+      // not "sub-status" i.e. retweeted/quoted/liked status
+      // in case of likes (which are not statuses) it should return null
+      const addStatus = (data) => {
+        const [status] = this.mergeOrAdd(this.allStatuses, data, timestamp)
+        let userSet = this.statusesPerUser.get(status.user.id)
+        if (userSet === undefined) {
+          userSet = new Set()
+          this.statusesPerUser.set(status.user.id, userSet)
+        }
+        userSet.add(status.id)
+
+        // Add to conversation
+        const conversations = this.conversations
+        const conversationId = status.statusnet_conversation_id
+
+        if (conversations.has(conversationId)) {
+          conversations.get(conversationId).add(status.id)
+        } else {
+          conversations.set(conversationId, new Set([status.id]))
+        }
+
+        // Work on quote
+        if (status.quote) {
+          status.quote = addStatus(status.quote)
+        }
+
+        return status
+      }
+
+      const processors = {
+        status: (status) => {
+          return addStatus(status)
+        },
+        edit: (status) => {
+          return addStatus(status)
+        },
+        retweet: (status) => {
+          if (status.retweeted_status) addStatus(status.retweeted_status)
+          return addStatus(status)
+        },
+        default: (unknown) => {
+          console.warn('unknown status type', unknown)
+          return null
+        },
+      }
+
+      return statuses.map((status) => {
+        const type = status.type
+        const processor = processors[type] ?? processors.default
+        return processor(status)
+      })
+    },
+    mergeOrAdd(map, status, timestamp) {
+      const existing = map.get(status.id) ?? {}
+      const oldTimestamp = this.timestamps.get(existing)
+
+      const { user: unused0, ...old } = existing
+      const { user: statusUser, ...neu } = status
+
+      const [user] = useUsersStore().addNewUsers({
+        data: statusUser,
+        timestamp,
+      })
+
+      const { in_reply_to_user_id } = status
+      if (in_reply_to_user_id) {
+        useUsersStore().fetchUserIfMissing({ id: in_reply_to_user_id })
+      }
+
+      existing.user = user // reactive update in case we return old
+
+      // implicit: if oldTimestamp is undefined this will still be false
+      if (oldTimestamp > timestamp) return [existing, false] // not overwriting old data with new
+
+      const newStatus = {
+        ...old,
+        ...Object.fromEntries(
+          Object.entries(neu).filter(([, v]) => v !== undefined),
+        ),
+        user,
+      }
+
+      map.set(newStatus.id, newStatus)
+
+      this.timestamps.set(newStatus, timestamp)
+
+      return [map.get(newStatus.id), true]
+    },
+
+    // Fetches
+    fetchStatus(id) {
+      return fetchStatus({
+        id,
+        credentials: useOAuthStore().token,
+      }).then(({ data: status, timestamp }) =>
+        this.addNewStatuses({ statuses: [status], timestamp }),
+      )
+    },
+    fetchStatusSource(id) {
+      return fetchStatusSource({
+        id,
+        credentials: useOAuthStore().token,
+      }).then(({ data }) => data)
+    },
+    fetchEmojiReactions(id) {
+      return fetchEmojiReactions({
+        id,
+        credentials: useOAuthStore().token,
+      }).then(({ data, timestamp }) => {
+        const reactions = data.map((reaction) => {
+          const users = useUsersStore().addNewUsers({
+            timestamp,
+            data: reaction.accounts,
+          })
+
+          // Backend inconsistency - status data only has ids (account_ids)
+          // but reactions data has full info (accounts)
+          return {
+            ...reaction,
+            accounts: users,
+            account_ids: users.map(({ id }) => id),
+          }
+        })
+
+        this.addEmojiReactionsBy(id, reactions)
+      })
+    },
+    fetchFavs(id) {
+      return fetchFavoritedByUsers({
+        id,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const users = useUsersStore().addNewUsers(result)
+        return this.addFavs(id, new Set(users.map(({ id }) => id)))
+      })
+    },
+    fetchRepeats(id) {
+      return fetchRebloggedByUsers({
+        id,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const users = useUsersStore().addNewUsers(result)
+        return this.addRepeats(id, new Set(users.map(({ id }) => id)))
+      })
+    },
+    fetchFavsAndRepeats(id) {
+      return Promise.all([this.fetchFavs(id), this.fetchRepeats(id)])
+    },
+
+    // Updates
+    addRepeats(id, users) {
+      const currentUser = useUsersStore().currentUser
+      const newStatus = this.allStatuses.get(id)
+      this.repeats.set(id, users)
+
+      // repeats stats can be incorrect based on polling
+      // condition, let's update them using the most recent data
+      newStatus.repeat_num = users.size
+      newStatus.repeated = users.has(currentUser?.id)
+    },
+    addFavs(id, users) {
+      const currentUser = useUsersStore().currentUser
+      const newStatus = this.allStatuses.get(id)
+      this.favs.set(id, users)
+
+      // favorites stats can be incorrect based on polling
+      // condition, let's update them using the most recent data
+      newStatus.fave_num = users.size
+      newStatus.favorited = users.has(currentUser?.id)
+    },
+    addEmojiReactionsBy(id, emojiReactions) {
+      const status = this.allStatuses.get(id)
+      status.emoji_reactions = emojiReactions
+    },
+    updateStatusWithPoll(id, poll) {
+      const status = this.allStatuses.get(id)
+      status.poll = poll
+    },
+
+    // Actions
+    requestInteract({ name, id, optimisticCall, apiCall, argument, value }) {
+      const oldValue = !value // Assumption
+
+      const apiArgs = (() => {
+        switch (name) {
+          case 'emoji':
+            return { emoji: argument }
+          case 'bookmark':
+            return { folder_id: argument }
+          default:
+            return {}
+        }
+      })()
+
+      // Optimistic
+      optimisticCall(id, value, argument)
+
+      return apiCall({
+        id,
+        ...apiArgs,
+        credentials: useOAuthStore().token,
+      })
+        .then(({ data: status, timestamp }) => {
+          this.addNewStatuses({
+            statuses: [status],
+            timestamp,
+          })
+        })
+        .catch((error) => {
+          optimisticCall(id, oldValue, argument)
+
+          console.error('Interact Error', error)
+          useInterfaceStore().pushGlobalNotice({
+            level: 'error',
+            messageKey: 'status.interact_error',
+            messageArgs: { error },
+            timeout: 5000,
+          })
+        })
+    },
+
+    /// Favorite
+    favorite(id) {
+      return this.requestInteract({
+        name: 'favorite',
+        id,
+        apiCall: favorite,
+        optimisticCall: this.setFavorited,
+        value: true,
+      })
+    },
+    unfavorite(id) {
+      return this.requestInteract({
+        name: 'favorite',
+        id,
+        apiCall: unfavorite,
+        optimisticCall: this.setFavorited,
+        value: false,
+      })
+    },
+    setFavorited(id, value) {
+      const newStatus = this.allStatuses.get(id)
+
+      if (newStatus.favorited !== value) {
+        if (value) {
+          newStatus.fave_num++
+        } else {
+          newStatus.fave_num--
+        }
+      }
+
+      newStatus.favorited = value
+    },
+
+    /// Reprööt
+    retweet(id) {
+      return this.requestInteract({
+        name: 'retweet',
+        id,
+        apiCall: retweet,
+        optimisticCall: this.setRetweeted,
+        value: true,
+      })
+    },
+    unretweet(id) {
+      return this.requestInteract({
+        name: 'retweet',
+        id,
+        apiCall: unretweet,
+        optimisticCall: this.setRetweeted,
+        value: false,
+      })
+    },
+    setRetweeted(id, value) {
+      const newStatus = this.allStatuses.get(id)
+
+      if (newStatus.repeated !== value) {
+        if (value) {
+          newStatus.repeat_num++
+        } else {
+          newStatus.repeat_num--
+        }
+      }
+
+      newStatus.repeated = value
+    },
+
+    // React
+    reactWithEmoji(id, emoji) {
+      return this.requestInteract({
+        name: 'emoji',
+        id,
+        apiCall: reactWithEmoji,
+        optimisticCall: this.setOwnReaction,
+        argument: emoji,
+        value: true,
+      })
+    },
+    unreactWithEmoji(id, emoji) {
+      return this.requestInteract({
+        name: 'emoji',
+        id,
+        apiCall: unreactWithEmoji,
+        optimisticCall: this.setOwnReaction,
+        argument: emoji,
+        value: false,
+      })
+    },
+    setOwnReaction(id, value, emoji) {
+      const currentUser = useUsersStore().currentUser
+      const status = this.allStatuses.get(id)
+      const reactionIndex = status.emoji_reactions.findIndex(
+        (react) => react.name === emoji,
+      )
+      const reactionPresent = reactionIndex >= 0
+      if (!value && !reactionPresent) return
+
+      const reaction = status.emoji_reactions[reactionIndex] || {
+        name: emoji,
+        count: 0,
+        accounts: [],
+        account_ids: [],
+      }
+
+      const count = value ? reaction.count + 1 : reaction.count - 1
+
+      const accounts = value
+        ? [...reaction.accounts, currentUser]
+        : reaction.accounts.filter((acc) => acc.id !== currentUser.id)
+      const account_ids = accounts.filter(Boolean).map(({ id }) => id)
+
+      const newReaction = {
+        ...reaction,
+        count,
+        me: value,
+        accounts,
+        account_ids,
+      }
+
+      if (reactionPresent && count > 0) {
+        status.emoji_reactions[reactionIndex] = newReaction
+      } else if (count === 0) {
+        status.emoji_reactions = status.emoji_reactions.filter(
+          (r) => r.name !== emoji,
+        )
+      } else {
+        status.emoji_reactions.push(newReaction)
+      }
+    },
+
+    /// Bookmark
+    bookmark(id, bookmark_folder_id) {
+      return this.requestInteract({
+        name: 'bookmark',
+        id,
+        apiCall: bookmarkStatus,
+        optimisticCall: this.setBookmarked,
+        argument: bookmark_folder_id,
+        value: true,
+      })
+    },
+    unbookmark(id) {
+      return this.requestInteract({
+        name: 'bookmark',
+        id,
+        apiCall: unbookmarkStatus,
+        optimisticCall: this.setBookmarked,
+        value: false,
+      })
+    },
+    setBookmarked(id, value, bookmark_folder_id) {
+      const status = this.allStatuses.get(id)
+      status.bookmarked = value
+
+      // When unbookmarking we don't specify folder so we wanna keep
+      // reference to the folder even when setting bookmarked to false
+      // the proper reference will be updated when api call resolves
+      if (bookmark_folder_id) {
+        status.bookmark_folder_id = value ? bookmark_folder_id : null
+      }
+    },
+
+    /// Mute
+    muteConversation(id) {
+      return this.requestInteract({
+        name: 'mute',
+        id,
+        apiCall: muteConversation,
+        optimisticCall: this.setMutedStatus,
+        value: true,
+      })
+    },
+    unmuteConversation(id) {
+      return this.requestInteract({
+        name: 'mute',
+        id,
+        apiCall: unmuteConversation,
+        optimisticCall: this.setMutedStatus,
+        value: false,
+      })
+    },
+    setMutedStatus(id, value) {
+      // Setting thread_muted flag on all other known statuses
+      // belonging to same conversation
+      const newStatus = this.allStatuses.get(id)
+      newStatus.thread_muted = value
+
+      if (newStatus.thread_muted !== undefined) {
+        this.conversations
+          .get(newStatus.statusnet_conversation_id)
+          .forEach((statusId) => {
+            this.allStatuses.get(statusId).thread_muted = value
+          })
+      }
+    },
+
+    /// Pin
+    pinStatus(id) {
+      return this.requestInteract({
+        name: 'pin',
+        id,
+        apiCall: pinOwnStatus,
+        optimisticCall: () => {
+          /* no-op */
+        },
+        value: true,
+      })
+    },
+    unpinStatus(id) {
+      return this.requestInteract({
+        name: 'pin',
+        id,
+        apiCall: unpinOwnStatus,
+        optimisticCall: () => {
+          /* no-op */
+        },
+        value: false,
+      })
+    },
+
+    /// Delete
+    deleteStatus(id) {
+      return deleteStatus({
+        id,
+        credentials: useOAuthStore().token,
+      })
+        .then(() => {
+          this.setDeleted(id)
+        })
+        .catch((e) => {
+          useInterfaceStore().pushGlobalNotice({
+            level: 'error',
+            messageKey: 'status.delete_error',
+            messageArgs: [e.message],
+            timeout: 5000,
+          })
+        })
+    },
+    setDeleted(id) {
+      const newStatus = this.allStatuses.get(id)
+      if (newStatus) newStatus.deleted = true
+    },
+
+    // For when blocking a user
+    wipeUserStatuses(userId) {
+      const removed = this.statusesPerUser.get(userId) ?? new Set()
+      removed.forEach((statusId) => {
+        const status = this.allStatuses.get(statusId)
+        this.allStatuses.delete(statusId)
+        const conversationSet = this.conversations.get(
+          status.statusnet_conversation_id,
+        )
+        conversationSet.delete(statusId)
+        if (conversationSet.size === 0) {
+          this.conversations.delete(status.statusnet_conversation_id)
+        }
+      })
+      this.statusesPerUser.delete(userId)
+      return removed
+    },
+  },
+})
diff --git a/src/stores/streaming.js b/src/stores/streaming.js
new file mode 100644
index 000000000..554d6a6b5
--- /dev/null
+++ b/src/stores/streaming.js
@@ -0,0 +1,270 @@
+import { defineStore } from 'pinia'
+
+import { useOAuthStore } from 'src/stores/oauth.js'
+
+import {
+  getMastodonSocketURI,
+  ProcessedWS,
+  WSConnectionStatus,
+} from 'src/api/websocket.js'
+
+const ARGUMENT_MAP = {
+  tag: 'tag',
+  list: 'list',
+}
+
+export const TIMELINE_STREAM_MAP = {
+  friends: 'user',
+  public: 'public',
+  tag: 'hashtag',
+  list: 'list',
+  dms: 'direct',
+}
+
+const retryTimeout = (multiplier) => 1000 * multiplier
+
+export class StreamStateEvent extends Event {
+  original
+
+  constructor(name, original) {
+    super(name)
+    this.original = original
+  }
+}
+
+export class StreamErrorEvent extends Event {
+  error
+
+  constructor(error) {
+    super('error', error)
+    this.error = error
+  }
+}
+
+export class StreamMessageEvent extends Event {
+  data
+  stream
+  timestamp
+
+  constructor(name, stream, data) {
+    super(name)
+    this.data = data
+    this.stream = stream
+    this.timestamp = Date.now()
+  }
+}
+
+export const useStreamingStore = defineStore('streaming', {
+  state: () => ({
+    socket: null,
+    error: null,
+    state: null,
+    retryMultiplier: 1,
+    retrying: false,
+    subscribers: new Set(),
+    subscriptions: new Map(),
+    globalSubscriptions: new Set(),
+  }),
+  actions: {
+    addSubscriber(subscriber) {
+      const { stream, et } = subscriber
+
+      if (stream) {
+        if (!this.subscriptions.has(stream.name)) {
+          this.subscriptions.set(stream.name, new Map())
+        }
+
+        const streamSubs = this.subscriptions.get(stream.name)
+
+        if (streamSubs.has(stream.argument)) {
+          throw new Error('Subscription already exists!')
+        }
+
+        streamSubs.set(stream.argument, subscriber)
+      } else {
+        this.globalSubscriptions.add(subscriber)
+      }
+
+      this.subscribers.add(subscriber)
+      if (this.state === WSConnectionStatus.JOINED) {
+        if (stream) {
+          this.socket.subscribe(...this.getSubArgs(stream))
+        }
+        et.dispatchEvent(new StreamStateEvent('open'))
+      }
+    },
+    removeSubscriber(subscriber) {
+      const { stream } = subscriber
+
+      this.subscribers.delete(subscriber)
+      if (stream) {
+        this.subscriptions.get(stream.name).delete(stream.argument)
+      } else {
+        this.globalSubscriptions.delete(subscriber)
+      }
+
+      if (stream && this.state === WSConnectionStatus.JOINED) {
+        this.socket.unsubscribe(...this.getSubArgs(stream))
+      }
+    },
+    initSocket(initial) {
+      if (this.socket) {
+        console.error(
+          "Socket already exists! This shouldn't happen! Force-closing the socket just in case",
+        )
+        try {
+          this.socket.close()
+        } catch (e) {
+          console.error(
+            "Error closing existing socket that shouldn't be there. Welp. Moving on.",
+            e,
+          )
+        }
+      }
+
+      this.state = initial
+        ? WSConnectionStatus.STARTING_INITIAL
+        : WSConnectionStatus.STARTING
+
+      const credentials = useOAuthStore().token
+      const url = getMastodonSocketURI({ credentials })
+
+      this.socket = ProcessedWS({
+        url,
+        id: 'Unified',
+        credentials,
+      })
+
+      this.socket.addEventListener('pleroma:authenticated', this.onAuth)
+      this.socket.addEventListener('open', this.onOpen)
+      this.socket.addEventListener('close', this.onClose)
+      this.socket.addEventListener('message', this.onMessage)
+      this.socket.addEventListener('error', this.onError)
+    },
+    stopSocket() {
+      if (this.socket == null)
+        console.error("Socket is already stopped! This shouldn't happen!")
+      this.socket?.close()
+      this.socket = null
+      this.state = WSConnectionStatus.CLOSED
+      this.retrying = false
+      this.retryMultiplier = 1
+      this.error = null
+    },
+
+    getSubArgs(stream) {
+      const argumentKey = ARGUMENT_MAP[stream.name]
+      const args = argumentKey
+        ? {
+            [argumentKey]: stream.argument,
+          }
+        : null
+
+      return [stream.name, args]
+    },
+    onAuth() {
+      this.subscribers.forEach(({ stream, et }) => {
+        et.dispatchEvent(new StreamStateEvent('authenticated'))
+
+        if (stream) {
+          this.socket.subscribe(...this.getSubArgs(stream))
+        }
+      })
+      this.state = WSConnectionStatus.JOINED
+    },
+    onOpen() {
+      this.retryMultiplier = 1
+      this.retrying = false
+      this.error = null
+      this.subscribers.forEach(({ stream, et }) => {
+        et.dispatchEvent(new StreamStateEvent('open'))
+      })
+    },
+    onMessage({ data: message }) {
+      if (!message) return // pings
+      const { event: eventName, stream: eventStream, ...data } = message
+      const [streamName, streamArgument] = eventStream ?? []
+
+      const subscriber = this.subscriptions.get(streamName)?.get(streamArgument)
+
+      const totalSubs = [
+        ...this.globalSubscriptions.values(),
+        subscriber,
+      ].filter(Boolean)
+
+      const eventData = (() => {
+        switch (eventName) {
+          case 'status.update':
+          case 'update':
+            return [data.status]
+          case 'notification':
+            return [data.notification]
+          case 'delete':
+            return [data.id]
+          default:
+            return data
+        }
+      })()
+
+      const event = new StreamMessageEvent(
+        eventName,
+        { name: streamName, argument: streamArgument },
+        eventData,
+      )
+
+      totalSubs.forEach(({ stream, et }) => {
+        et.dispatchEvent(event)
+      })
+    },
+    onError({ data: error }) {
+      this.subscribers.forEach(({ stream, et }) => {
+        et.dispatchEvent(new StreamErrorEvent(error))
+      })
+      this.error = error
+      console.error('Error in MastoAPI websocket:', error)
+    },
+    onClose({ data: closeEvent }) {
+      const ignoreCodes = new Set([
+        1000, // Normal (intended) closure
+        1001, // Going away
+      ])
+      const { code } = closeEvent
+
+      if (ignoreCodes.has(code)) {
+        console.debug(
+          `Not restarting socket becasue of closure code ${code} is in ignore list`,
+        )
+
+        this.state = WSConnectionStatus.CLOSED
+        this.retrying = false
+        this.error = null
+        this.retryMultiplier = 1
+
+        this.subscribers.forEach(({ et }) => {
+          et.dispatchEvent(new StreamStateEvent('close', closeEvent))
+        })
+      } else {
+        console.warn(
+          `MastoAPI websocket disconnected, restarting. CloseEvent code: ${code}`,
+        )
+
+        setTimeout(() => {
+          if (!this.retrying) return // retry aborted (i.e. due to logout)
+
+          this.initSocket()
+        }, retryTimeout(this.retryMultiplier))
+
+        this.retryMultiplier += 1
+
+        if (!this.retrying) {
+          this.subscribers.forEach(({ et }) => {
+            et.dispatchEvent(new StreamStateEvent('close', closeEvent))
+          })
+        }
+
+        this.retrying = true
+        this.state = WSConnectionStatus.ERROR
+      }
+    },
+  },
+})
diff --git a/src/stores/sync_config.js b/src/stores/sync_config.js
index 81181c768..4de0c13cb 100644
--- a/src/stores/sync_config.js
+++ b/src/stores/sync_config.js
@@ -21,6 +21,7 @@ import { CURRENT_UPDATE_COUNTER } from 'src/components/update_notification/updat
 
 import { useLocalConfigStore } from 'src/stores/local_config.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfileJSON } from 'src/api/user.js'
 import { storage } from 'src/lib/storage.js'
@@ -822,7 +823,7 @@ export const useSyncConfigStore = defineStore('sync_config', {
     pushSyncConfig({ force = false } = {}) {
       const needPush = this.dirty || force
       if (!needPush) return
-      this.updateCache({ username: window.vuex.state.users.currentUser.fqn })
+      this.updateCache({ username: useUsersStore().currentUser.fqn })
       const params = { pleroma_settings_store: { 'pleroma-fe': this.cache } }
       updateProfileJSON({
         params,
diff --git a/src/stores/timelines.js b/src/stores/timelines.js
new file mode 100644
index 000000000..86a2c617e
--- /dev/null
+++ b/src/stores/timelines.js
@@ -0,0 +1,484 @@
+import { first, last } from 'lodash'
+import { defineStore } from 'pinia'
+
+import timelineFetcher from 'src/stores/fetchers/timeline_fetcher.js'
+import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { TIMELINE_STREAM_MAP, useStreamingStore } from 'src/stores/streaming.js'
+
+const emptyTl = (name, argument = null) => {
+  const result = {
+    // Name of the timeline. Useful for debugging and logging
+    name,
+
+    // Order of statuses, important for timelines that
+    // have different ordering, i.e. bookmarks and favorites
+    order: [],
+
+    // All statuses belonging to the timeline
+    statusIds: new Set(),
+
+    // Statuses shown to user
+    visibleStatusIds: new Set(),
+
+    // Tracked reprööts, used to avoid displaying same reprööt more than once
+    repeatedToRepeat: new Map(),
+    repeatToRepeated: new Map(),
+    ignoredIds: new Set(),
+
+    // Number of statuses not shown yet
+    newStatusCount: 0,
+
+    // Pagination
+    maxId: '',
+    minId: '',
+
+    // Indicates whether timeline receives push updates
+    streaming: false,
+
+    // Indicates whether timeline is SUPPOSED to be fetching
+    // this is partiualrly useful for when pausing/resuming
+    // timeline. I.e. whether we need to start fetching again
+    // if timeline was resumed.
+    fetching: false,
+
+    // Indicates that in recent poll update we've hit more than or
+    // equal to 20 statuses and most likely missed some statuses
+    // between polls
+    reloadNeeded: false,
+
+    // Reference to fetcher, used for polling for new statuses and
+    // manually fetching old statuses
+    fetcher: null,
+
+    // Reference to WS subscriber
+    socket: null,
+
+    // Whether the timeline has been paused - it stops fetching
+    // (but still receives pushes!)
+    paused: false,
+  }
+
+  const property = ARGUMENT_MAP[name]
+
+  if (property) {
+    result[property] = argument
+  }
+
+  if (name === 'dms' || name === 'friends') {
+    result.persistent = true
+  }
+
+  return result
+}
+
+export const ARGUMENT_MAP = {
+  tag: 'tag',
+  list: 'listId',
+  bookmarks: 'bookmarkFolderId',
+  quotes: 'statusId',
+  search: 'query',
+  user: 'userId',
+  userPinned: 'userId',
+  media: 'userId',
+  favorites: 'userId',
+}
+
+const TIMELINES = new Set([
+  'mentions',
+  'public',
+  'user',
+  'userPinned',
+  'media',
+  'favorites',
+  'publicAndExternal',
+  'friends',
+  'tag',
+  'dms',
+  'bookmarks',
+  'list',
+  'bubble',
+  'quotes',
+  'search',
+])
+
+export const defaultState = () => {
+  return Object.fromEntries([...TIMELINES].map((name) => [name, emptyTl(name)]))
+}
+
+export const useTimelinesStore = defineStore('timelines', {
+  state: defaultState,
+  actions: {
+    // (De)Initialization stuff
+    activate(timelineName, argument, persistent) {
+      const timeline = this[timelineName]
+      if (timeline.persistent && !persistent) return
+
+      if (
+        timelineName === 'favorites' &&
+        !useInstanceCapabilitiesStore().pleromaPublicFavouritesAvailable
+      ) {
+        console.warn("Instance doesn't support public favorites timeline")
+        return
+      }
+
+      const property = ARGUMENT_MAP[timelineName]
+      if (property) {
+        timeline[property] = argument
+      }
+
+      timeline.fetcher = timelineFetcher(
+        timeline,
+        argument,
+        useOAuthStore().token,
+      )
+
+      this.startFetchingTimeline(timelineName, argument, 'Timeline activated')
+
+      const streamName = TIMELINE_STREAM_MAP[timelineName]
+
+      if (streamName) {
+        const et = new EventTarget()
+        const openHandler = () => this.onStreamConnect(timelineName, argument)
+        const closeHandler = () =>
+          this.onStreamDisconnect(timelineName, argument)
+        const messageHandler = (message) => {
+          this.onStreamMessage(timelineName, argument, message)
+        }
+
+        et.addEventListener('open', openHandler)
+        et.addEventListener('close', closeHandler)
+        et.addEventListener('update', messageHandler)
+
+        timeline.socket = {
+          name: 'timelines',
+          stream: {
+            name: streamName,
+            argument,
+          },
+          et,
+          handlers: {
+            openHandler,
+            closeHandler,
+            messageHandler,
+          },
+        }
+
+        useStreamingStore().addSubscriber(timeline.socket)
+      }
+    },
+    deactivate(timelineName, persistent) {
+      const timeline = this[timelineName]
+      if (timeline.persistent && !persistent) return
+      if (timeline.fetching) {
+        this.stopFetchingTimeline(timelineName, 'Timeline deactivation')
+      }
+
+      if (timeline.socket) {
+        useStreamingStore().removeSubscriber(timeline.socket)
+
+        const { openHandler, closeHandler, messageHandler } =
+          timeline.socket.handlers
+        timeline.socket.et.removeEventListener('open', openHandler)
+        timeline.socket.et.removeEventListener('close', closeHandler)
+        timeline.socket.et.removeEventListener('update', messageHandler)
+      }
+
+      this[timelineName] = emptyTl(timelineName)
+    },
+    clearTimeline(timelineName) {
+      const timeline = this[timelineName]
+
+      timeline.order = []
+      timeline.statusIds = new Set()
+      timeline.visibleStatusIds = new Set()
+      timeline.ignoredIds = new Set()
+      timeline.newStatusCount = 0
+      timeline.maxId = ''
+      timeline.minId = ''
+      timeline.reloadNeeded = false
+      timeline.fetcher.resetBottomedOut()
+    },
+    activatePersistents() {
+      TIMELINES.forEach((name) => {
+        if (this[name].persistent) {
+          this.activate(name, undefined, true)
+        }
+      })
+    },
+    deactivateAll() {
+      TIMELINES.forEach((name) => {
+        try {
+          this.deactivate(name, true)
+        } catch (e) {
+          console.error(`Failed to deactivate timeline ${name}:`, e)
+        }
+      })
+    },
+
+    // Pause
+    pause(name) {
+      const timeline = this[name]
+      timeline.paused = true
+      console.debug('[Timelines] Pausing timeline', name)
+      if (timeline.fetcher && timeline.fetching) {
+        timeline.fetcher.stopFetching()
+      }
+    },
+    resume(name) {
+      const timeline = this[name]
+      timeline.paused = false
+      console.debug('[Timelines] Resuming timeline', name)
+      if (timeline.fetcher && timeline.fetching) {
+        timeline.fetcher.startFetching()
+      }
+    },
+    pauseAll() {
+      TIMELINES.forEach((name) => {
+        try {
+          this.pause(name)
+        } catch (e) {
+          console.error(`[Timelines] Failed to pause timeline ${name}:`, e)
+        }
+      })
+    },
+    resumeAll() {
+      TIMELINES.forEach((name) => {
+        try {
+          this.resume(name)
+        } catch (e) {
+          console.error(`[Timelines] Failed to pause timeline ${name}:`, e)
+        }
+      })
+    },
+
+    // Update stuff
+    addStatusesToTimeline(
+      timelineName,
+      argument,
+      {
+        statuses,
+        repeats = [],
+        showImmediately = false,
+        noIdUpdate = false,
+        pagination = {},
+        older = false,
+      },
+    ) {
+      if (statuses.length === 0) return
+      const timeline = this[timelineName]
+
+      // This makes sure that user timeline won't get data meant for other
+      // user. I.e. opening different user profiles makes request which could
+      // return data late after user already viewing different user profile
+      // Same can happen with tags etc.
+      const property = ARGUMENT_MAP[timelineName]
+
+      if (property && timeline[property] !== argument) {
+        return
+      }
+
+      this.populateRepeats(timeline, repeats)
+
+      const filtered = statuses.filter((id) => !timeline.statusIds.has(id))
+      if (older) {
+        timeline.order.push(...filtered)
+      } else {
+        timeline.order.unshift(...filtered)
+      }
+
+      const newStatuses = new Set()
+
+      statuses.forEach((statusId) => {
+        const isNew = !timeline.statusIds.has(statusId)
+        timeline.statusIds.add(statusId)
+
+        if (isNew) {
+          newStatuses.add(statusId)
+        }
+      })
+
+      newStatuses.forEach((statusId) => {
+        const seenBefore = this.checkSeenBefore(timeline, statusId)
+        if (!seenBefore) {
+          if (showImmediately) {
+            // Add it directly to the visibleStatuses, don't change
+            // newStatusCount
+            timeline.visibleStatusIds.add(statusId)
+          } else {
+            // Just change newStatuscount
+            timeline.newStatusCount += 1
+          }
+        } else {
+          timeline.ignoredIds.add(statusId)
+        }
+      })
+
+      if (!noIdUpdate) {
+        this.updateTimelineExtremes(timeline, pagination)
+      }
+    },
+    onStreamMessage(timelineName, argument, event) {
+      this.addStatusesToTimeline(timelineName, argument, {
+        statuses: event.data.map(({ id }) => id),
+        repeats: event.data
+          .filter(({ retweeted_status }) => Boolean(retweeted_status))
+          .map(({ id, retweeted_status: { id: repeatedId } }) => [
+            id,
+            repeatedId,
+          ]),
+      })
+    },
+
+    // Reprööt handling
+    populateRepeats(timeline, repeats) {
+      // Starting from oldest
+      ;[...repeats].reverse().forEach(([repeatId, repeatedId]) => {
+        timeline.repeatToRepeated.set(repeatId, repeatedId)
+        const knownRepeats =
+          timeline.repeatedToRepeat.get(repeatedId) ?? new Set()
+        knownRepeats.add(repeatId)
+        timeline.repeatedToRepeat.set(repeatedId, knownRepeats)
+      })
+    },
+    checkSeenBefore(timeline, statusId) {
+      // Check if this is a reprööt
+      const repeatedStatusId = timeline.repeatToRepeated.get(statusId)
+      // Non-reprööts are never seen before
+      if (!repeatedStatusId) return false
+      // We've seen this status already directly
+      if (timeline.statusIds.has(repeatedStatusId)) return true
+
+      // Check for reprööts
+      const knownRepeats = timeline.repeatedToRepeat.get(repeatedStatusId)
+
+      // If it's the only reprööt then we've never seen post before
+      if (knownRepeats.size === 1) return false
+      // If we're working on oldest known reprööt then we've never seen it before
+      return knownRepeats.values().next().value !== statusId
+    },
+
+    // Poll & Push
+    onStreamConnect(timeline) {
+      console.debug('[Timelines] Stream connected', timeline)
+      this[timeline].streaming = true
+      this.stopFetchingTimeline(timeline, 'Socket connected')
+    },
+    onStreamDisconnect(timeline, argument) {
+      this[timeline].streaming = false
+      this.startFetchingTimeline(timeline, argument, 'Socket disconnected')
+    },
+    startFetchingTimeline(timelineName, argument, reason) {
+      const timeline = this[timelineName]
+      if (timeline.paused) {
+        console.debug(
+          '[Timelines] NOT Starting timeline fetcher because it is paused',
+          timelineName,
+          argument,
+          'Original Reason:',
+          reason,
+        )
+        return
+      }
+
+      console.debug(
+        '[Timelines] Starting timeline fetcher',
+        timelineName,
+        argument,
+        'Reason:',
+        reason,
+      )
+      timeline.fetcher.startFetching()
+      timeline.fetching = true
+    },
+    stopFetchingTimeline(timelineName, reason) {
+      const timeline = this[timelineName]
+      if (timeline.fetcher === null) {
+        console.debug(
+          '[Timelines] Already inactive timeline',
+          timelineName,
+          'Reason:',
+          reason,
+        )
+        return
+      } else if (timeline.paused) {
+        console.debug(
+          '[Timelines] Deactivating paused timeline',
+          timelineName,
+          'Reason:',
+          reason,
+        )
+        timeline.fetching = false
+      } else {
+        timeline.fetcher.stopFetching()
+        console.debug(
+          '[Timelines] Stopped fetching timeline',
+          timelineName,
+          'Reason:',
+          reason,
+        )
+        timeline.fetching = false
+      }
+    },
+
+    // Queues & Timeline manip
+    updateTimelineExtremes(timeline, pagination = {}, force = false) {
+      // Can't use Math.min/max because it doesn't work with string (duh)
+      const minNew = pagination.maxId ?? last(timeline.order) ?? ''
+      const maxNew = pagination.minId ?? first(timeline.order) ?? ''
+
+      const newer = maxNew > timeline.maxId
+      const older = minNew < timeline.minId
+
+      if (force || newer || timeline.maxId === '') {
+        timeline.maxId = maxNew
+      }
+      if (force || older || timeline.minId === '') {
+        timeline.minId = minNew
+      }
+
+      this.syncOrder(timeline)
+    },
+    showNewStatuses(timelineName) {
+      const timeline = this[timelineName]
+
+      timeline.newStatusCount = 0
+      timeline.order = timeline.order.slice(0, 50)
+      timeline.statusIds = new Set([...timeline.order])
+
+      // Reprööts CAN be present in order but some must be ignored
+      timeline.visibleStatusIds = new Set([
+        ...timeline.order.filter((id) => !timeline.ignoredIds.has(id)),
+      ])
+      this.updateTimelineExtremes(timeline, {}, true)
+      timeline.fetcher.resetBottomedOut()
+    },
+    syncOrder(timeline) {
+      timeline.order = timeline.order.filter((id) => timeline.statusIds.has(id))
+    },
+    requireReload(timeline, id) {
+      this[timeline].reloadNeeded = true
+    },
+    requireReloadAll() {
+      TIMELINES.forEach((timelineName) => {
+        const timeline = this[timelineName]
+
+        timeline.reloadNeeded = true
+      })
+    },
+
+    // Misc
+    wipeStatuses(ids) {
+      TIMELINES.forEach((timelineName) => {
+        const timeline = this[timelineName]
+
+        ids.forEach((id) => {
+          timeline.statusIds.delete(id)
+          timeline.visibleStatusIds.delete(id)
+        })
+
+        this.syncOrder(timeline)
+      })
+    },
+  },
+})
diff --git a/src/stores/user_highlight.js b/src/stores/user_highlight.js
index 3cd3bfe7d..a4cbacd6e 100644
--- a/src/stores/user_highlight.js
+++ b/src/stores/user_highlight.js
@@ -10,6 +10,7 @@ import { defineStore } from 'pinia'
 import { toRaw } from 'vue'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfileJSON } from 'src/api/user.js'
 import { storage } from 'src/lib/storage.js'
@@ -328,7 +329,7 @@ export const useUserHighlightStore = defineStore('user_highlight', {
     pushHighlight({ force = false } = {}) {
       const needPush = this.dirty || force
       if (!needPush) return
-      this.updateCache({ username: window.vuex.state.users.currentUser.fqn })
+      this.updateCache({ username: useUsersStore().currentUser.fqn })
       const params = {
         pleroma_settings_store: { user_highlight: this.cache },
       }
diff --git a/src/stores/users.js b/src/stores/users.js
new file mode 100644
index 000000000..b9725a652
--- /dev/null
+++ b/src/stores/users.js
@@ -0,0 +1,798 @@
+import Cookies from 'js-cookie'
+import { last } from 'lodash'
+import { defineStore } from 'pinia'
+
+import { useAnnouncementsStore } from 'src/stores/announcements.js'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
+import { useChatsStore } from 'src/stores/chats.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.js'
+import { useListsStore } from 'src/stores/lists.js'
+import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
+import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+
+import { revokeToken } from 'src/api/oauth.js'
+import {
+  fetchFollowers,
+  fetchFriends,
+  fetchUser,
+  fetchUserByName,
+  verifyCredentials,
+} from 'src/api/public.js'
+import {
+  blockUser,
+  editUserNote,
+  fetchBlocks,
+  fetchDomainMutes,
+  fetchMutes,
+  fetchUserInLists,
+  fetchUserRelationship,
+  followUser,
+  muteDomain,
+  muteUser,
+  removeUserFromFollowers,
+  unblockUser,
+  unfollowUser,
+  unmuteDomain,
+  unmuteUser,
+} from 'src/api/user.js'
+import { WSConnectionStatus } from 'src/api/websocket.js'
+import { promiseInterval } from 'src/services/promise_interval/promise_interval.js'
+
+export const useUsersStore = defineStore('users', {
+  state: () => ({
+    loggingIn: false,
+    currentUser: null,
+    users: new Map(),
+    usersByName: new Map(),
+    usersByURL: new Map(),
+    relationships: new Map(),
+    relationshipsLists: {
+      friends: new WeakMap(),
+      followers: new WeakMap(),
+    },
+    timestamps: new WeakMap(),
+    fetchesIds: new Map(),
+    fetchesNames: new Map(),
+    followPollers: new Map(),
+    followPollersAttempts: new Map(),
+  }),
+  getters: {
+    loggedIn: (state) => !!state.currentUser,
+    findUser: (state) => (query) => {
+      return state.users.get(query)
+    },
+    findUserByName: (state) => (query) => {
+      return state.usersByName.get(query.toLowerCase())
+    },
+    findUserByUrl: (state) => (query) => {
+      return state.usersByURL.get(query.toLowerCase())
+    },
+    relationship: (state) => (id) => {
+      const rel = id && state.relationships.get(id)
+      return rel || { id, loading: true }
+    },
+  },
+  actions: {
+    // Main updates
+    addNewUsers(response) {
+      const { data, timestamp } = response
+      const users = Array.isArray(data) ? data : [data]
+
+      return users.map((user) => {
+        const existing = this.users.get(user.id) ?? {}
+        const oldTimestamp = this.timestamps.get(existing)
+        //
+        // Relationship might have different timestamp and
+        // might need updating separate from user
+        const oldRelationship = this.relationships.get(user.id)
+        const oldRelationshipTimestamp = this.timestamps.get(oldRelationship)
+        let relationship
+
+        // Only need an update if new user data has relationship
+        if (user.relationship) {
+          // Only update if there is no old data or if it's outdated
+          if (
+            oldRelationship === undefined ||
+            timestamp > oldRelationshipTimestamp
+          ) {
+            relationship = this.updateUserRelationships({
+              timestamp,
+              data: { id: user.id, ...user.relationship },
+            })[0]
+          }
+        } else {
+          relationship = oldRelationship
+        }
+
+        // implicit: if oldTimestamp is undefined this will still be false
+        if (oldTimestamp > timestamp) return existing // not overwriting old data with new
+
+        const { relationship: unused1, ...newUser } = user
+
+        let reactive = this.users.get(user.id)
+        // Initializing reactivity & avoiding excessive Map mutation
+        if (!reactive) {
+          this.users.set(user.id, existing)
+
+          reactive = this.users.get(user.id)
+          this.usersByName.set(user.screen_name.toLowerCase(), reactive)
+          this.usersByURL.set(user.url.toLowerCase(), reactive)
+        }
+
+        // Relying on object reactivity to avoid mutating the Map
+        reactive.relationship = relationship ?? reactive.relationship
+
+        Object.entries(newUser).forEach(([k, v]) => {
+          reactive[k] = v
+        })
+
+        // Updating the timestamp
+        this.timestamps.set(reactive, timestamp)
+
+        if (user.id === this.currentUser?.id) {
+          this.currentUser = reactive
+        }
+
+        // Initialize some stuff
+        const { friends, followers } = this.relationshipsLists
+        if (!friends.has(reactive)) friends.set(reactive, new Set())
+        if (!followers.has(reactive)) followers.set(reactive, new Set())
+
+        return reactive
+      })
+    },
+    updateUserRelationships({ timestamp, optimism, data }) {
+      const relationships = Array.isArray(data) ? data : [data]
+
+      return relationships.map((relationship) => {
+        const { id } = relationship
+        const existing = this.relationships.get(id) ?? {}
+        const oldTimestamp = this.timestamps.get(existing)
+
+        // implicit: if oldTimestamp is undefined this will still be false
+        if (!optimism && oldTimestamp > timestamp) return existing
+
+        // Initializing reactivity
+        if (!this.relationships.has(id)) this.relationships.set(id, existing)
+        const reactive = this.relationships.get(id)
+
+        // Relying on reactivity
+        Object.entries(relationship).forEach(([k, v]) => {
+          reactive[k] = v
+        })
+
+        if (timestamp) {
+          this.timestamps.set(reactive, timestamp)
+        }
+
+        // Updating user property if there is such a user
+        if (this.users.has(id)) {
+          this.users.get(id).relationship = reactive
+        }
+
+        // Update block/mute lists
+        if (this.currentUser && id !== this.currentUser.id) {
+          ;[
+            ['muting', this.currentUser.muteIds],
+            ['blocking', this.currentUser.blockIds],
+            [
+              'following',
+              this.relationshipsLists.friends.get(this.currentUser),
+            ],
+            [
+              'followed_by',
+              this.relationshipsLists.followers.get(this.currentUser),
+            ],
+          ].forEach(([relationshipName, list]) => {
+            if (relationship[relationshipName]) {
+              list?.add(id)
+            } else {
+              list?.delete(id)
+            }
+          })
+        }
+
+        return reactive
+      })
+    },
+
+    // Misc updates
+    updateUserAdminData(id, data) {
+      const user = this.users.get(id)
+      if (!user) {
+        console.warn(
+          `User id ${id} somehow not found during admin data update!`,
+        )
+        return
+      }
+      user.adminData = data
+      user.deactivated = !data.is_active
+      user.tags = new Set(data.tags)
+    },
+    updateRight(id, right, value) {
+      const user = this.users.get(id)
+      const newRights = user.rights ?? {}
+      newRights[right] = value
+      user.rights = newRights
+    },
+
+    // Because frontend doesn't have a reason to keep these stuff in memory
+    // outside of viewing someones user profile.
+    clearFollowLists(userId) {
+      const user = this.users.get(userId)
+      if (user) {
+        this.relationshipsLists.friends.set(user, new Set())
+        this.relationshipsLists.followers.set(user, new Set())
+      }
+    },
+
+    // Fetches
+    async fetchUserIfMissing({ id, name }) {
+      let findFunc
+      let fetchFunc
+      let map
+      let identifier
+
+      if (id) {
+        findFunc = this.findUser
+        fetchFunc = this.fetchUser
+        map = this.fetchesIds
+        identifier = id
+      } else if (name) {
+        findFunc = this.findUserByName
+        fetchFunc = this.fetchUserByName
+        map = this.fetchesNames
+        identifier = name
+      } else {
+        throw new TypeError('No identifier provided')
+      }
+
+      // Search in cache
+      const user = findFunc(identifier)
+
+      if (user) return user
+      // not found => fetch
+      let promise
+
+      // Did we already search for this user?
+      if (map.has(identifier)) {
+        // if so, reuse the promise
+        promise = map.get(identifier)
+      } else {
+        // if not, make a new one
+        promise = fetchFunc(identifier)
+      }
+
+      map.set(identifier, promise)
+
+      try {
+        const result = await promise
+        if (result) {
+          const { id, screen_name } = result
+
+          // Save promise for future use
+          this.fetchesIds.set(id, promise)
+          this.fetchesNames.set(screen_name, promise)
+          return this.users.get(id)
+        } else {
+          return null
+        }
+      } catch (e) {
+        console.error(`Failed fetching user ${identifier}`, e)
+        map.delete(identifier)
+        throw e
+      }
+    },
+    async fetchUser(id) {
+      try {
+        const result = await fetchUser({
+          id,
+          credentials: useOAuthStore().token,
+        })
+
+        this.addNewUsers(result)
+
+        return this.users.get(result.data.id)
+      } catch (error) {
+        if (error.name === 'StatusCodeError' && error.statusCode === 404) {
+          console.warn(`User ${id} not found`)
+          return null
+        } else {
+          throw error
+        }
+      }
+    },
+    async fetchUserByName(name) {
+      try {
+        const result = await fetchUserByName({
+          name,
+          credentials: useOAuthStore().token,
+        })
+
+        this.addNewUsers(result)
+
+        return this.users.get(result.data.id)
+      } catch (error) {
+        if (error.name === 'StatusCodeError' && error.statusCode === 404) {
+          console.warn(`User ${name} not found`)
+          return null
+        } else {
+          throw error
+        }
+      }
+    },
+    fetchUserRelationship(id) {
+      return fetchUserRelationship({
+        id,
+        credentials: useOAuthStore().token,
+      }).then((result) => this.updateUserRelationships(result))
+    },
+    fetchFriends(id) {
+      const user = this.users.get(id)
+      const maxId = last([...this.relationshipsLists.friends.get(user)])
+      return fetchFriends({
+        id,
+        maxId,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const users = this.addNewUsers(result)
+        const list = this.relationshipsLists.friends.get(user)
+        users.forEach(({ id }) => list.add(id))
+        return result.data
+      })
+    },
+    fetchFollowers(id) {
+      const user = this.users.get(id)
+      const maxId = last([...this.relationshipsLists.followers.get(user)])
+      return fetchFollowers({
+        id,
+        maxId,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const users = this.addNewUsers(result)
+        const list = this.relationshipsLists.followers.get(user)
+        users.forEach(({ id }) => list.add(id))
+        return result.data
+      })
+    },
+    fetchUserInLists(id) {
+      if (this.currentUser) {
+        return fetchUserInLists({
+          id,
+          credentials: useOAuthStore().token,
+        }).then(({ data: inLists }) => {
+          this.users.get(id).inLists = inLists
+        })
+      }
+    },
+    fetchMutes(args) {
+      const { reset } = args || {}
+
+      const maxId = this.currentUser.muteIdsMaxId
+      return fetchMutes({
+        maxId,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const { data: mutes } = result
+        if (reset) {
+          this.currentUser.muteIds = new Set(mutes.map(({ id }) => id))
+        } else {
+          mutes.forEach(({ id }) => this.currentUser.muteIds.add(id))
+        }
+        if (mutes.length) {
+          this.currentUser.muteIdsMaxId = last(mutes).id
+        }
+        this.addNewUsers(result)
+        return mutes
+      })
+    },
+    fetchBlocks(args) {
+      const { reset } = args || {}
+
+      const maxId = this.currentUser.blockIdsMaxId
+      return fetchBlocks({
+        maxId,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        const { data: blocks } = result
+        if (reset) {
+          this.currentUser.blockIds = new Set(blocks.map(({ id }) => id))
+        } else {
+          blocks.forEach(({ id }) => this.currentUser.blockIds.add(id))
+        }
+        if (blocks.length) {
+          this.currentUser.blockIdsMaxId = last(blocks).id
+        }
+        this.addNewUsers(result)
+        return blocks
+      })
+    },
+    fetchDomainMutes() {
+      return fetchDomainMutes({
+        credentials: useOAuthStore().token,
+      }).then(({ data: domainMutes }) => {
+        this.currentUser.domainMutes = new Set(domainMutes)
+        return domainMutes
+      })
+    },
+
+    // Actions
+    /// Follow
+    async followUser(id) {
+      // Don't spam follow requests if we are already polling
+      if (this.followPollers.has(id)) return
+
+      const followFunc = () =>
+        followUser({
+          id,
+          credentials: useOAuthStore().token,
+        }).then((result) => this.updateUserRelationships(result))
+
+      const checker = async (func = () => this.fetchUserRelationship(id)) => {
+        await func() // Either fetch relationships or follow request
+        const relationship = this.relationships.get(id)
+
+        return (
+          relationship.following ||
+          (relationship.locked && relationship.requested)
+        )
+      }
+
+      const immediate = await checker(followFunc)
+      if (immediate) return // If follow goes through immediately don'd to looping
+
+      const loop = async () => {
+        const attempts = this.followPollersAttempts.get(id)
+        const result = await checker()
+
+        if (result || attempts === 1) {
+          this.followPollersAttempts.delete(id)
+          this.followPollers.get(id).stop()
+          this.followPollers.delete(id)
+        } else {
+          this.followPollersAttempts.set(id, attempts - 1)
+        }
+      }
+
+      this.followPollersAttempts.set(id, 3)
+      this.followPollers.set(id, promiseInterval(loop, 500))
+    },
+    async unfollowUser(id) {
+      const result = await unfollowUser({
+        id,
+        credentials: useOAuthStore().token,
+      })
+
+      return this.updateUserRelationships(result)
+    },
+
+    /// Subscribe
+    subscribeUser(id) {
+      return followUser({
+        id,
+        notify: true,
+        credentials: useOAuthStore().token,
+      }).then((result) => this.updateUserRelationships(result))
+    },
+    unsubscribeUser(id) {
+      return followUser({
+        id,
+        notify: false,
+        credentials: useOAuthStore().token,
+      }).then((result) => this.updateUserRelationships(result))
+    },
+
+    /// User Note
+    editUserNote(id, comment) {
+      return editUserNote({ id, comment }).then((result) =>
+        this.updateUserRelationships(result),
+      )
+    },
+
+    /// Hide reblogs
+    hideReblogs(id) {
+      return followUser({
+        id,
+        reblogs: false,
+        credentials: useOAuthStore().token,
+      }).then((result) => this.updateUserRelationships(result))
+    },
+    showReblogs(id) {
+      return followUser({
+        id,
+        reblogs: true,
+        credentials: useOAuthStore().token,
+      }).then((result) => this.updateUserRelationships(result))
+    },
+
+    /// Remove follower
+    removeUserFromFollowers(id) {
+      return removeUserFromFollowers({ id }).then((result) =>
+        this.updateUserRelationships(result),
+      )
+    },
+
+    /// Mute
+    muteUser(id, expiresIn = 0) {
+      const predictedRelationship = this.relationships.get(id) || { id }
+      predictedRelationship.muting = true
+      this.updateUserRelationships({
+        optimism: true,
+        data: [predictedRelationship],
+      })
+
+      return muteUser({
+        id,
+        expiresIn,
+        credentials: useOAuthStore().token,
+      }).then((result) => {
+        this.updateUserRelationships(result)
+      })
+    },
+    muteUsers(data = []) {
+      return Promise.all(data.map((d) => this.muteUser(d)))
+    },
+    unmuteUser(id) {
+      const predictedRelationship = this.relationships.get(id) || { id }
+      predictedRelationship.muting = false
+      this.updateUserRelationships({
+        optimism: true,
+        data: [predictedRelationship],
+      })
+
+      return unmuteUser({ id }).then((result) =>
+        this.updateUserRelationships(result),
+      )
+    },
+    unmuteUsers(ids = []) {
+      return Promise.all(ids.map((d) => this.unmuteUser(d)))
+    },
+
+    /// Block
+    blockUser(id, expiresIn = 0) {
+      const predictedRelationship = this.relationships.get(id) || { id }
+      this.updateUserRelationships({
+        optimism: true,
+        data: [predictedRelationship],
+      })
+
+      return blockUser({ id, expiresIn }).then((result) => {
+        this.updateUserRelationships(result)
+
+        const ids = useStatusesStore().wipeUserStatuses(id)
+        useTimelinesStore().wipeStatuses(ids)
+        useNotificationsStore().wipeStatuses(ids)
+      })
+    },
+    blockUsers(data = []) {
+      return Promise.all(data.map((d) => this.blockUser(d)))
+    },
+    unblockUser(id) {
+      return unblockUser({ id }).then((result) => {
+        this.updateUserRelationships(result)
+      })
+    },
+    unblockUsers(data = []) {
+      return Promise.all(data.map((d) => this.unblockUser(d)))
+    },
+
+    /// Domain Mute
+    muteDomain(domain) {
+      return muteDomain({
+        domain,
+        credentials: useOAuthStore().token,
+      }).then(() => this.currentUser.domainMutes.add(domain))
+    },
+    unmuteDomain(domain) {
+      return unmuteDomain({
+        domain,
+        credentials: useOAuthStore().token,
+      }).then(() => this.currentUser.domainMutes.delete(domain))
+    },
+    muteDomains(domains = []) {
+      return Promise.all(domains.map((domain) => this.muteDomain(domain)))
+    },
+    unmuteDomains(domain = []) {
+      return Promise.all(domain.map((domain) => this.unmuteDomain(domain)))
+    },
+
+    // Login/Logout
+    async loginUser(accessToken) {
+      const store = window.vuex
+      const dispatch =
+        store?.dispatch ??
+        (() => {
+          /* no-op */
+        }) // for tests
+
+      this.loggingIn = true
+
+      try {
+        const { data: user, ...rest } = await verifyCredentials({
+          credentials: useOAuthStore().token,
+        })
+
+        user.blockIds = new Set()
+        user.muteIds = new Set()
+        user.domainMutes = new Set()
+
+        useTimelinesStore().deactivateAll()
+        useStatusesStore().resetStatuses()
+
+        this.users = new Map()
+        this.usersByName = new Map()
+        this.usersByURL = new Map()
+        this.relationships = new Map()
+        this.currentUser = user
+        this.addNewUsers({ data: user, ...rest })
+
+        useInterfaceStore().onLogin()
+        useSyncConfigStore()
+          .initSyncConfig(user)
+          .then(() => {
+            useInterfaceStore()
+              .applyTheme()
+              .catch((e) => {
+                console.error('Error setting theme', e)
+              })
+          })
+
+        useUserHighlightStore().initUserHighlight(user)
+
+        useEmojiStore().fetchEmoji()
+
+        // Do server-side storage migrations
+
+        // Debug snippet to clean up storage and reset migrations
+        /*
+        // Reset wordfilter
+        Object.keys(
+        useSyncConfigStore().prefsStorage.simple.muteFilters
+        ).forEach(key => {
+        useSyncConfigStore().unsetSimplePrefAndSave({ path: 'muteFilters.' + key, value: null })
+        })
+
+        // Reset flag to 0 to re-run migrations
+        useSyncConfigStore().setFlag({ flag: 'configMigration', value: 0 })
+        /**/
+
+        if (user.token) {
+          // Shoutbox
+          dispatch('setWsToken', user.token)
+          dispatch('initializeSocket')
+        }
+
+        // DMs and Home
+        useTimelinesStore().activatePersistents()
+        useNotificationsStore().activate()
+
+        if (useInstanceCapabilitiesStore().pleromaChatMessagesAvailable) {
+          // Start fetching chats
+          useChatsStore().startFetching()
+        }
+
+        useListsStore().startFetching()
+        useBookmarkFoldersStore().startFetching()
+
+        if (user.locked) {
+          dispatch('startFetchingFollowRequests')
+        }
+
+        if (useMergedConfigStore().mergedConfig.useStreamingApi) {
+          useStreamingStore().initSocket(true)
+        }
+
+        // Start fetching things that don't need to block the UI
+        useAnnouncementsStore().startFetching()
+
+        this.fetchMutes()
+        dispatch('loadDrafts')
+      } catch (error) {
+        console.error(error)
+
+        // Authentication failed
+        this.loggingIn = false
+
+        // remove authentication token on client/authentication errors
+        if ([400, 401, 403, 422].includes(error.statusCode)) {
+          useOAuthStore().clearToken()
+        }
+
+        if (error.statusCode === 401) {
+          throw new Error('Wrong username or password', error)
+        } else {
+          throw new Error('An error occurred, please try again', error)
+        }
+      } finally {
+        this.loggingIn = false
+      }
+    },
+    logout() {
+      const store = window.vuex
+      const oauth = useOAuthStore()
+
+      // Pause fetching
+      useNotificationsStore().pause()
+      useTimelinesStore().pauseAll()
+
+      // Pause-less stores
+      useAnnouncementsStore().stopFetching()
+      useListsStore().stopFetching()
+      useBookmarkFoldersStore().stopFetching()
+      useChatsStore().stopFetching()
+
+      store?.dispatch('stopFetchingFollowRequests')
+
+      // NOTE: No need to verify the app still exists, because if it doesn't,
+      // the token will be invalid too
+      return oauth
+        .ensureApp()
+        .then((app) => {
+          const params = {
+            app,
+            instance: useInstanceStore().server,
+            token: oauth.userToken,
+          }
+
+          return revokeToken(params)
+        })
+        .then(() => {
+          oauth.clearToken()
+
+          this.currentUser = null
+
+          useNotificationsStore().deactivate()
+
+          // Full reset on logout success
+          useTimelinesStore().deactivateAll()
+          useStatusesStore().resetStatuses()
+          useChatsStore().resetChats()
+
+          this.users = new Map()
+          this.usersByName = new Map()
+          this.usersByURL = new Map()
+          this.relationships = new Map()
+
+          // Socket is most likely already closed by server
+          if (
+            useMergedConfigStore().mergedConfig.useStreamingApi &&
+            useStreamingStore().state !== WSConnectionStatus.CLOSED
+          ) {
+            useStreamingStore().stopSocket()
+          }
+
+          Cookies.remove('__Host-pleroma_key', { path: '/' })
+          useInterfaceStore().onLogout()
+        })
+        .catch((e) => {
+          useInterfaceStore().pushGlobalNotice({
+            messageKey: 'user.logout_failure',
+            messageArgs: {
+              error: e,
+            },
+            level: 'error',
+          })
+          console.error('Logout error!', e)
+
+          useAnnouncementsStore().startFetching()
+          useListsStore().startFetching()
+          useBookmarkFoldersStore().startFetching()
+          useChatsStore().startFetching()
+          store?.dispatch('startFetchingFollowRequests')
+        })
+        .finally(() => {
+          useNotificationsStore().resume()
+          useTimelinesStore().resumeAll()
+        })
+    },
+  },
+})
diff --git a/src/sw.js b/src/sw.js
index f73c1460e..f24486469 100644
--- a/src/sw.js
+++ b/src/sw.js
@@ -8,7 +8,7 @@ import { createI18n } from 'vue-i18n'
 import { storage } from 'src/lib/storage.js'
 import { INSTANCE_DEFAULT_CONFIG } from 'src/modules/default_config_state.js'
 import { parseNotification } from 'src/services/entity_normalizer/entity_normalizer.service.js'
-import { prepareNotificationObject } from 'src/services/notification_utils/notification_utils.js'
+import { prepareNotificationObject } from 'src/services/notification_utils/notification_utils_sw.js'
 import { cacheKey, emojiCacheKey, shouldCache } from 'src/services/sw/sw.js'
 
 // Collects all messages for service workers
diff --git a/test/fixtures/setup_test.js b/test/fixtures/setup_test.js
index b3804b102..3da0231a4 100644
--- a/test/fixtures/setup_test.js
+++ b/test/fixtures/setup_test.js
@@ -1,4 +1,3 @@
-import { createTestingPinia } from '@pinia/testing'
 import { config } from '@vue/test-utils'
 import { createMemoryHistory, createRouter } from 'vue-router'
 import VueVirtualScroller from 'vue-virtual-scroller'
@@ -26,7 +25,6 @@ const getDefaultOpts = ({
   global: {
     plugins: [
       applyAfterStore(makeMockStore(), afterStore),
-      createTestingPinia(),
       VueVirtualScroller,
       createRouter({
         history: createMemoryHistory(),
diff --git a/test/unit/specs/boot/routes.spec.js b/test/unit/specs/boot/routes.spec.js
index 98bb9a61d..068bedabe 100644
--- a/test/unit/specs/boot/routes.spec.js
+++ b/test/unit/specs/boot/routes.spec.js
@@ -3,20 +3,13 @@ import { createTestingPinia } from '@pinia/testing'
 createTestingPinia()
 
 import { createMemoryHistory, createRouter } from 'vue-router'
-import { createStore } from 'vuex'
 
 import routes from 'src/boot/routes'
 
-const store = createStore({
-  state: {
-    instance: {},
-  },
-})
-
 describe('routes', () => {
   const router = createRouter({
     history: createMemoryHistory(),
-    routes: routes(store),
+    routes: routes(),
   })
 
   it('root path', async () => {
@@ -24,12 +17,9 @@ describe('routes', () => {
 
     const matchedComponents = router.currentRoute.value.matched
 
-    expect(
-      Object.hasOwn(
-        matchedComponents[0].components.default.components,
-        'Timeline',
-      ),
-    ).to.eql(true)
+    expect(matchedComponents[0].components.default.__file).to.contain(
+      '/timeline.vue',
+    )
   })
 
   it("user's profile", async () => {
@@ -38,7 +28,7 @@ describe('routes', () => {
     const matchedComponents = router.currentRoute.value.matched
 
     expect(matchedComponents[0].components.default.__file).to.contain(
-      'user_profile.vue',
+      '/user_profile.vue',
     )
   })
 
@@ -48,7 +38,7 @@ describe('routes', () => {
     const matchedComponents = router.currentRoute.value.matched
 
     expect(matchedComponents[0].components.default.__file).to.contain(
-      'user_profile.vue',
+      '/user_profile.vue',
     )
   })
 
@@ -57,7 +47,7 @@ describe('routes', () => {
 
     const matchedComponents = router.currentRoute.value.matched
     expect(matchedComponents[0].components.default.__file).to.contain(
-      'lists.vue',
+      '/lists.vue',
     )
   })
 
@@ -67,7 +57,7 @@ describe('routes', () => {
     const matchedComponents = router.currentRoute.value.matched
 
     expect(matchedComponents[0].components.default.__file).to.contain(
-      'lists_timeline.vue',
+      '/timeline.vue',
     )
   })
 
@@ -77,7 +67,7 @@ describe('routes', () => {
     const matchedComponents = router.currentRoute.value.matched
 
     expect(matchedComponents[0].components.default.__file).to.contain(
-      'lists_edit.vue',
+      '/lists_edit.vue',
     )
   })
 })
diff --git a/test/unit/specs/components/chat_view.spec.js b/test/unit/specs/components/chat_view.spec.js
index d03809e38..ba06b6b4c 100644
--- a/test/unit/specs/components/chat_view.spec.js
+++ b/test/unit/specs/components/chat_view.spec.js
@@ -32,10 +32,6 @@ const global = {
     $store: {
       state: {
         api: {},
-        users: {},
-        statuses: {
-          allStatusesObject: {},
-        },
       },
     },
     $route: {
diff --git a/test/unit/specs/components/draft.spec.js b/test/unit/specs/components/draft.spec.js
index b69d2323e..40d63419b 100644
--- a/test/unit/specs/components/draft.spec.js
+++ b/test/unit/specs/components/draft.spec.js
@@ -7,6 +7,7 @@ import PostStatusForm from 'src/components/post_status_form/post_status_form.vue
 import { $t, mountOpts, waitForEvent } from '../../../fixtures/setup_test'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const autoSaveOrNot = (caseFn, caseTitle, runFn) => {
   caseFn(`${caseTitle} with auto-save`, function () {
@@ -34,13 +35,20 @@ const saveManually = async (wrapper) => {
 
 const waitSaveTime = 4000
 
-afterEach(() => {
-  vi.useRealTimers()
-})
+const currentUser = {
+  id: 'current-user',
+  default_scope: 'public',
+  locked: false,
+}
 
 describe('Draft saving', () => {
   beforeEach(() => {
     setActivePinia(createTestingPinia())
+    useUsersStore().currentUser = currentUser
+  })
+
+  afterEach(() => {
+    vi.useRealTimers()
   })
 
   autoSaveOrNot(
diff --git a/test/unit/specs/components/post_status_form.spec.js b/test/unit/specs/components/post_status_form.spec.js
index f89102504..981a6d020 100644
--- a/test/unit/specs/components/post_status_form.spec.js
+++ b/test/unit/specs/components/post_status_form.spec.js
@@ -1,4 +1,6 @@
+import { createTestingPinia } from '@pinia/testing'
 import { mount } from '@vue/test-utils'
+import { setActivePinia } from 'pinia'
 import { vi } from 'vitest'
 
 import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
@@ -6,6 +8,8 @@ import { mountOpts } from '../../../fixtures/setup_test'
 
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useUsersStore } from 'src/stores/users.js'
 
 const currentUser = {
   id: 'current-user',
@@ -31,24 +35,18 @@ const repliedStatus2 = {
   user: repliedUser,
 }
 
-const replyMountOpts = (props) =>
-  mountOpts({
-    props,
-    afterStore(store) {
-      store.state.users.currentUser = currentUser
-      store.state.statuses.allStatusesObject = {
-        [repliedStatus.id]: repliedStatus,
-      }
-    },
-  })
-
 describe('PostStatusForm', () => {
   beforeEach(() => {
     vi.useFakeTimers()
+    setActivePinia(createTestingPinia())
+    useUsersStore().currentUser = currentUser
+    useStatusesStore().allStatuses = new Map([
+      [repliedStatus.id, repliedStatus],
+    ])
   })
 
   it('Clean empty initial state', () => {
-    const wrapper = mount(PostStatusForm, replyMountOpts())
+    const wrapper = mount(PostStatusForm, mountOpts())
 
     expect(wrapper.vm.statusType).to.equal('new')
     expect(wrapper.vm.newStatus.spoilerText).to.eql('')
@@ -57,7 +55,7 @@ describe('PostStatusForm', () => {
   })
 
   it('Reset cleans form to pristine state equal to state form was when created', () => {
-    const wrapper = mount(PostStatusForm, replyMountOpts())
+    const wrapper = mount(PostStatusForm, mountOpts())
 
     const initial = { ...wrapper.vm.newStatus }
     wrapper.vm.clearStatus()
@@ -68,8 +66,10 @@ describe('PostStatusForm', () => {
   it('Initializes a reply form', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        repliedStatus: repliedStatus,
+      mountOpts({
+        props: {
+          repliedStatus: repliedStatus,
+        },
       }),
     )
 
@@ -91,8 +91,10 @@ describe('PostStatusForm', () => {
   it('Copies scope and subject line, disables quoting for locked posts', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        repliedStatus: repliedStatus2,
+      mountOpts({
+        props: {
+          repliedStatus: repliedStatus2,
+        },
       }),
     )
 
@@ -121,8 +123,10 @@ describe('PostStatusForm', () => {
 
   it('Forces direct mode when replying to a DM, mastodon style subject handling', () => {
     // We need to initialize pinia first which is happening here...
-    const options = replyMountOpts({
-      repliedStatus: { ...repliedStatus2, visibility: 'direct' },
+    const options = mountOpts({
+      props: {
+        repliedStatus: { ...repliedStatus2, visibility: 'direct' },
+      },
     })
 
     // ...set our settings...
@@ -150,10 +154,12 @@ describe('PostStatusForm', () => {
   it('Sets status to statusText without mentions if mentions line is enabled', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        repliedStatus: repliedStatus2,
-        statusText: 'testing',
-        mentionsLine: true,
+      mountOpts({
+        props: {
+          repliedStatus: repliedStatus2,
+          statusText: 'testing',
+          mentionsLine: true,
+        },
       }),
     )
 
@@ -166,8 +172,10 @@ describe('PostStatusForm', () => {
   it('Sets mention when asked for it', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        profileMention: repliedUser,
+      mountOpts({
+        props: {
+          profileMention: repliedUser,
+        },
       }),
     )
 
@@ -180,8 +188,10 @@ describe('PostStatusForm', () => {
   it('Initializes quote when reply/quote toggled to quote', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        repliedStatus: repliedStatus2,
+      mountOpts({
+        props: {
+          repliedStatus: repliedStatus2,
+        },
       }),
     )
 
@@ -196,8 +206,10 @@ describe('PostStatusForm', () => {
   it('Resets quote when reply/quote toggled to reply', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        repliedStatus: repliedStatus2,
+      mountOpts({
+        props: {
+          repliedStatus: repliedStatus2,
+        },
       }),
     )
 
@@ -213,8 +225,10 @@ describe('PostStatusForm', () => {
   it('Initializes and reset quote when toggling quote attachment', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        repliedStatus: repliedStatus2,
+      mountOpts({
+        props: {
+          repliedStatus: repliedStatus2,
+        },
       }),
     )
 
@@ -234,17 +248,19 @@ describe('PostStatusForm', () => {
   it('Status editing', () => {
     const wrapper = mount(
       PostStatusForm,
-      replyMountOpts({
-        statusId: 'edited',
-        statusText: 'text',
-        statusSubject: 'heading',
-        statusIsSensitive: true,
-        statusPoll: {},
-        statusQuote: {},
-        statusFiles: [],
-        statusMediaDescriptions: {},
-        statusVisibility: 'unlisted',
-        statusContentType: 'text/markdown',
+      mountOpts({
+        props: {
+          statusId: 'edited',
+          statusText: 'text',
+          statusSubject: 'heading',
+          statusIsSensitive: true,
+          statusPoll: {},
+          statusQuote: {},
+          statusFiles: [],
+          statusMediaDescriptions: {},
+          statusVisibility: 'unlisted',
+          statusContentType: 'text/markdown',
+        },
       }),
     )
 
@@ -264,7 +280,7 @@ describe('PostStatusForm', () => {
 
   it('Posting should reset idempotency key', async () => {
     vi.setSystemTime(new Date(2027, 1, 1, 13))
-    const wrapper = mount(PostStatusForm, replyMountOpts())
+    const wrapper = mount(PostStatusForm, mountOpts())
     const oldIdempotency = wrapper.vm.idempotencyKey
 
     vi.setSystemTime(new Date(2028, 1, 1, 13))
@@ -278,7 +294,7 @@ describe('PostStatusForm', () => {
   // TODO Probably better to separate attachment upload/manipulation into its own component?
   // we need to upload-on-submit for compression setting anyway
   it('Attachments manipulations (moving, adding, removing)', () => {
-    const wrapper = mount(PostStatusForm, replyMountOpts())
+    const wrapper = mount(PostStatusForm, mountOpts())
 
     const i1 = { id: '1', url: 'a' }
     const i2 = { id: '2', url: 'b' }
@@ -308,7 +324,7 @@ describe('PostStatusForm', () => {
   })
 
   it('Attachment descriptions', () => {
-    const wrapper = mount(PostStatusForm, replyMountOpts())
+    const wrapper = mount(PostStatusForm, mountOpts())
 
     const i1 = { id: '1', url: 'a' }
 
diff --git a/test/unit/specs/components/rich_content.spec.js b/test/unit/specs/components/rich_content.spec.js
index cc79fe377..19bfdc035 100644
--- a/test/unit/specs/components/rich_content.spec.js
+++ b/test/unit/specs/components/rich_content.spec.js
@@ -1,24 +1,11 @@
+import { createTestingPinia } from '@pinia/testing'
 import { mount, shallowMount } from '@vue/test-utils'
+import { setActivePinia } from 'pinia'
 
 import RichContent from 'src/components/rich_content/rich_content.jsx'
+import { mountOpts } from '../../../fixtures/setup_test'
 
 const attentions = []
-const global = {
-  mocks: {
-    $store: {
-      state: {},
-      getters: {
-        mergedConfig: () => ({
-          mentionLinkShowTooltip: true,
-        }),
-        findUserByUrl: () => null,
-      },
-    },
-  },
-  stubs: {
-    FAIcon: true,
-  },
-}
 
 const makeMention = (who, noClass) => {
   attentions.push({ statusnet_profile_url: `https://fake.tld/@${who}` })
@@ -37,18 +24,24 @@ const mentionsLine = (times) =>
   ].join('')
 
 describe('RichContent', () => {
+  beforeEach(() => {
+    setActivePinia(createTestingPinia())
+  })
+
   it('renders simple post without exploding', () => {
     const html = p('Hello world!')
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(html))
   })
@@ -56,32 +49,36 @@ describe('RichContent', () => {
   it('unescapes everything as needed', () => {
     const html = [p('Testing &#39;em all'), 'Testing &#39;em all'].join('')
     const expected = [p("Testing 'em all"), "Testing 'em all"].join('')
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
 
   it('replaces mention with mentionsline', () => {
     const html = p(makeMention('John'), ' how are you doing today?')
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(
       compwrap(p(mentionsLine(1), ' how are you doing today?')),
@@ -105,16 +102,18 @@ describe('RichContent', () => {
       ),
     ].join('')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
@@ -141,16 +140,18 @@ describe('RichContent', () => {
       ].join(''),
     ].join('\n')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: false,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: false,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html()).to.eql(compwrap(strippedHtml))
   })
@@ -162,16 +163,18 @@ describe('RichContent', () => {
       '<span class="greentext">&gt;any year</span>',
     ].join('\n')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: false,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: false,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html()).to.eql(compwrap(expected))
   })
@@ -179,16 +182,18 @@ describe('RichContent', () => {
   it('Does not add greentext and cyantext if setting is set to false', () => {
     const html = ['&gt;preordering videogames', '&gt;any year'].join('\n')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: false,
-        greentext: false,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: false,
+          greentext: false,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html()).to.eql(compwrap(html))
   })
@@ -200,16 +205,18 @@ describe('RichContent', () => {
       '<anonymous-stub shortcode="spurdo" islocal="true" class="emoji img" src="about:blank" title=":spurdo:" alt=":spurdo:"></anonymous-stub>',
     )
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: false,
-        greentext: false,
-        emoji: [{ url: 'about:blank', shortcode: 'spurdo' }],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: false,
+          greentext: false,
+          emoji: [{ url: 'about:blank', shortcode: 'spurdo' }],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
@@ -217,16 +224,18 @@ describe('RichContent', () => {
   it("Doesn't add nonexistent emoji to post", () => {
     const html = p('Lol :lol:')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: false,
-        greentext: false,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: false,
+          greentext: false,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(html))
   })
@@ -245,16 +254,18 @@ describe('RichContent', () => {
       '<span class="greentext">&gt;quote</span>',
     ].join('\n')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html()).to.eql(compwrap(expected))
   })
@@ -268,16 +279,18 @@ describe('RichContent', () => {
     ].join('<br>')
     const expected = ['Bruh', 'Bruh', mentionsLine(3), 'Bruh'].join('<br>')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
@@ -304,16 +317,18 @@ describe('RichContent', () => {
       ' </p>',
     ].join('')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
@@ -351,16 +366,18 @@ describe('RichContent', () => {
       p('Testing'),
     ].join('')
 
-    const wrapper = mount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = mount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(
       wrapper
@@ -424,16 +441,18 @@ describe('RichContent', () => {
       'Testing',
     ].join('')
 
-    const wrapper = mount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = mount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(
       wrapper
@@ -473,16 +492,18 @@ describe('RichContent', () => {
       '</p>',
     ].join('')
 
-    const wrapper = shallowMount(RichContent, {
-      global,
-      props: {
-        attentions,
-        handleLinks: true,
-        greentext: true,
-        emoji: [],
-        html,
-      },
-    })
+    const wrapper = shallowMount(
+      RichContent,
+      mountOpts({
+        props: {
+          attentions,
+          handleLinks: true,
+          greentext: true,
+          emoji: [],
+          html,
+        },
+      }),
+    )
 
     expect(wrapper.html().replaceAll('\n', '')).to.eql(compwrap(expected))
   })
@@ -519,14 +540,16 @@ describe('RichContent', () => {
     const ptest = (handleLinks, vhtml) => {
       const t0 = performance.now()
 
-      const wrapper = mount(TestComponent, {
-        global,
-        props: {
-          attentions,
-          handleLinks,
-          vhtml,
-        },
-      })
+      const wrapper = mount(
+        TestComponent,
+        mountOpts({
+          props: {
+            attentions,
+            handleLinks,
+            vhtml,
+          },
+        }),
+      )
 
       const t1 = performance.now()
 
diff --git a/test/unit/specs/components/user_profile.spec.js b/test/unit/specs/components/user_profile.spec.js
deleted file mode 100644
index 36d323575..000000000
--- a/test/unit/specs/components/user_profile.spec.js
+++ /dev/null
@@ -1,212 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { createStore } from 'vuex'
-
-import UserProfile from 'src/components/user_profile/user_profile.vue'
-
-import { getters } from 'src/modules/users.js'
-
-const mutations = {
-  clearTimeline: () => {
-    /* no-op */
-  },
-}
-
-const actions = {
-  fetchUser: () => {
-    /* no-op */
-  },
-  fetchUserByScreenName: () => {
-    /* no-op */
-  },
-}
-
-const testGetters = {
-  findUser: (state) => getters.findUser(state.users),
-  findUserByName: (state) => getters.findUserByName(state.users),
-  relationship: (state) => getters.relationship(state.users),
-  mergedConfig: () => ({
-    colors: '',
-    highlight: {},
-    customTheme: {
-      colors: [],
-    },
-  }),
-}
-
-const localUser = {
-  id: 100,
-  is_local: true,
-  screen_name: 'testUser',
-  screen_name_ui: 'testUser',
-}
-
-const extUser = {
-  id: 100,
-  is_local: false,
-  screen_name: 'testUser@test.instance',
-  screen_name_ui: 'testUser@test.instance',
-}
-
-const externalProfileStore = createStore({
-  mutations,
-  actions,
-  getters: testGetters,
-  state: {
-    interface: {
-      browserSupport: '',
-    },
-    instance: {
-      hideUserStats: true,
-    },
-    statuses: {
-      timelines: {
-        user: {
-          statuses: [],
-          statusesObject: {},
-          faves: [],
-          visibleStatuses: [],
-          visibleStatusesObject: {},
-          newStatusCount: 0,
-          maxId: 0,
-          minVisibleId: 0,
-          loading: false,
-          followers: [],
-          friends: [],
-          viewing: 'statuses',
-          userId: 100,
-          flushMarker: 0,
-        },
-        media: {
-          statuses: [],
-          statusesObject: {},
-          faves: [],
-          visibleStatuses: [],
-          visibleStatusesObject: {},
-          newStatusCount: 0,
-          maxId: 0,
-          minVisibleId: 0,
-          loading: false,
-          followers: [],
-          friends: [],
-          viewing: 'statuses',
-          userId: 100,
-          flushMarker: 0,
-        },
-      },
-    },
-    users: {
-      currentUser: {
-        credentials: '',
-      },
-      usersObject: { 100: extUser },
-      usersByNameObject: {},
-      users: [extUser],
-      relationships: {},
-    },
-  },
-})
-
-const localProfileStore = createStore({
-  mutations,
-  actions,
-  getters: testGetters,
-  state: {
-    interface: {
-      browserSupport: '',
-    },
-    config: {
-      colors: '',
-      highlight: {},
-      customTheme: {
-        colors: [],
-      },
-    },
-    instance: {
-      hideUserStats: true,
-    },
-    statuses: {
-      timelines: {
-        user: {
-          statuses: [],
-          statusesObject: {},
-          faves: [],
-          visibleStatuses: [],
-          visibleStatusesObject: {},
-          newStatusCount: 0,
-          maxId: 0,
-          minVisibleId: 0,
-          loading: false,
-          followers: [],
-          friends: [],
-          viewing: 'statuses',
-          userId: 100,
-          flushMarker: 0,
-        },
-        media: {
-          statuses: [],
-          statusesObject: {},
-          faves: [],
-          visibleStatuses: [],
-          visibleStatusesObject: {},
-          newStatusCount: 0,
-          maxId: 0,
-          minVisibleId: 0,
-          loading: false,
-          followers: [],
-          friends: [],
-          viewing: 'statuses',
-          userId: 100,
-          flushMarker: 0,
-        },
-      },
-    },
-    users: {
-      currentUser: {
-        credentials: '',
-      },
-      usersObject: { 100: localUser },
-      usersByNameObject: { testuser: localUser },
-      users: [localUser],
-      relationships: {},
-    },
-  },
-})
-
-// https://github.com/vuejs/test-utils/issues/1382
-describe.skip('UserProfile', () => {
-  it('renders external profile', () => {
-    const wrapper = mount(UserProfile, {
-      global: {
-        plugins: [externalProfileStore],
-        mocks: {
-          $route: {
-            params: { id: 100 },
-            name: 'external-user-profile',
-          },
-          $t: (msg) => msg,
-        },
-      },
-    })
-
-    expect(wrapper.find('.user-screen-name').text()).to.eql(
-      '@testUser@test.instance',
-    )
-  })
-
-  it('renders local profile', () => {
-    const wrapper = mount(UserProfile, {
-      global: {
-        plugins: [localProfileStore],
-        mocks: {
-          $route: {
-            params: { name: 'testUser' },
-            name: 'user-profile',
-          },
-          $t: (msg) => msg,
-        },
-      },
-    })
-
-    expect(wrapper.find('.user-screen-name').text()).to.eql('@testUser')
-  })
-})
diff --git a/test/unit/specs/modules/statuses.spec.js b/test/unit/specs/modules/statuses.spec.js
deleted file mode 100644
index 04bd07ffe..000000000
--- a/test/unit/specs/modules/statuses.spec.js
+++ /dev/null
@@ -1,447 +0,0 @@
-import { createTestingPinia } from '@pinia/testing'
-
-import {
-  defaultState,
-  mutations,
-  prepareStatus,
-} from '../../../../src/modules/statuses.js'
-
-createTestingPinia()
-
-const makeMockStatus = ({ id, text, type = 'status' }) => {
-  return {
-    id,
-    user: { id: '0' },
-    name: 'status',
-    text: text || `Text number ${id}`,
-    fave_num: 0,
-    uri: '',
-    type,
-    attentions: [],
-  }
-}
-
-describe('Statuses module', () => {
-  describe('prepareStatus', () => {
-    it('sets deleted flag to false', () => {
-      const aStatus = makeMockStatus({ id: '1', text: 'Hello oniichan' })
-      expect(prepareStatus(aStatus).deleted).to.eq(false)
-    })
-  })
-
-  describe('addNewStatuses', () => {
-    it('adds the status to allStatuses and to the given timeline', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        timeline: 'public',
-      })
-
-      expect(state.allStatuses).to.eql([status])
-      expect(state.timelines.public.statuses).to.eql([status])
-      expect(state.timelines.public.visibleStatuses).to.eql([])
-      expect(state.timelines.public.newStatusCount).to.equal(1)
-    })
-
-    it('counts the status as new if it has not been seen on this timeline', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        timeline: 'public',
-      })
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        timeline: 'friends',
-      })
-
-      expect(state.allStatuses).to.eql([status])
-      expect(state.timelines.public.statuses).to.eql([status])
-      expect(state.timelines.public.visibleStatuses).to.eql([])
-      expect(state.timelines.public.newStatusCount).to.equal(1)
-
-      expect(state.allStatuses).to.eql([status])
-      expect(state.timelines.friends.statuses).to.eql([status])
-      expect(state.timelines.friends.visibleStatuses).to.eql([])
-      expect(state.timelines.friends.newStatusCount).to.equal(1)
-    })
-
-    it('add the statuses to allStatuses if no timeline is given', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-
-      mutations.addNewStatuses(state, { statuses: [status] })
-
-      expect(state.allStatuses).to.eql([status])
-      expect(state.timelines.public.statuses).to.eql([])
-      expect(state.timelines.public.visibleStatuses).to.eql([])
-      expect(state.timelines.public.newStatusCount).to.equal(0)
-    })
-
-    it('adds the status to allStatuses and to the given timeline, directly visible', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-
-      expect(state.allStatuses).to.eql([status])
-      expect(state.timelines.public.statuses).to.eql([status])
-      expect(state.timelines.public.visibleStatuses).to.eql([status])
-      expect(state.timelines.public.newStatusCount).to.equal(0)
-    })
-
-    it('does not update the maxId when the noIdUpdate flag is set', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      const secondStatus = makeMockStatus({ id: '2' })
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      expect(state.timelines.public.maxId).to.equal('1')
-
-      mutations.addNewStatuses(state, {
-        statuses: [secondStatus],
-        showImmediately: true,
-        timeline: 'public',
-        noIdUpdate: true,
-      })
-      expect(state.timelines.public.statuses).to.eql([secondStatus, status])
-      expect(state.timelines.public.visibleStatuses).to.eql([
-        secondStatus,
-        status,
-      ])
-      expect(state.timelines.public.maxId).to.equal('1')
-    })
-
-    it('keeps a descending by id order in timeline.visibleStatuses and timeline.statuses', () => {
-      const state = defaultState()
-      const nonVisibleStatus = makeMockStatus({ id: '1' })
-      const status = makeMockStatus({ id: '3' })
-      const statusTwo = makeMockStatus({ id: '2' })
-      const statusThree = makeMockStatus({ id: '4' })
-
-      mutations.addNewStatuses(state, {
-        statuses: [nonVisibleStatus],
-        showImmediately: false,
-        timeline: 'public',
-      })
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      mutations.addNewStatuses(state, {
-        statuses: [statusTwo],
-        showImmediately: true,
-        timeline: 'public',
-      })
-
-      expect(state.timelines.public.minVisibleId).to.equal('2')
-
-      mutations.addNewStatuses(state, {
-        statuses: [statusThree],
-        showImmediately: true,
-        timeline: 'public',
-      })
-
-      expect(state.timelines.public.statuses).to.eql([
-        statusThree,
-        status,
-        statusTwo,
-        nonVisibleStatus,
-      ])
-      expect(state.timelines.public.visibleStatuses).to.eql([
-        statusThree,
-        status,
-        statusTwo,
-      ])
-    })
-
-    it('splits retweets from their status and links them', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      const retweet = makeMockStatus({ id: '2', type: 'retweet' })
-      const modStatus = makeMockStatus({ id: '1', text: 'something else' })
-
-      retweet.retweeted_status = status
-
-      // It adds both statuses, but only the retweet to visible.
-      mutations.addNewStatuses(state, {
-        statuses: [retweet],
-        timeline: 'public',
-        showImmediately: true,
-      })
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.timelines.public.statuses).to.have.length(1)
-      expect(state.allStatuses).to.have.length(2)
-      expect(state.allStatuses[0].id).to.equal('1')
-      expect(state.allStatuses[1].id).to.equal('2')
-
-      // It refers to the modified status.
-      mutations.addNewStatuses(state, {
-        statuses: [modStatus],
-        timeline: 'public',
-      })
-      expect(state.allStatuses).to.have.length(2)
-      expect(state.allStatuses[0].id).to.equal('1')
-      expect(state.allStatuses[0].text).to.equal(modStatus.text)
-      expect(state.allStatuses[1].id).to.equal('2')
-      expect(retweet.retweeted_status.text).to.eql(modStatus.text)
-    })
-
-    it('replaces existing statuses with the same id', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      const modStatus = makeMockStatus({ id: '1', text: 'something else' })
-
-      // Add original status
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.allStatuses).to.have.length(1)
-
-      // Add new version of status
-      mutations.addNewStatuses(state, {
-        statuses: [modStatus],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.allStatuses).to.have.length(1)
-      expect(state.allStatuses[0].text).to.eql(modStatus.text)
-    })
-
-    it('replaces existing statuses with the same id, coming from a retweet', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      const modStatus = makeMockStatus({ id: '1', text: 'something else' })
-      const retweet = makeMockStatus({ id: '2', type: 'retweet' })
-      retweet.retweeted_status = modStatus
-
-      // Add original status
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.allStatuses).to.have.length(1)
-
-      // Add new version of status
-      mutations.addNewStatuses(state, {
-        statuses: [retweet],
-        showImmediately: false,
-        timeline: 'public',
-      })
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      // Don't add the retweet itself if the tweet is visible
-      expect(state.timelines.public.statuses).to.have.length(1)
-      expect(state.allStatuses).to.have.length(2)
-      expect(state.allStatuses[0].text).to.eql(modStatus.text)
-    })
-
-    it('handles favorite actions', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-
-      const favorite = {
-        id: '2',
-        type: 'favorite',
-        in_reply_to_status_id: '1', // The API uses strings here...
-        uri: 'tag:shitposter.club,2016-08-21:fave:3895:note:773501:2016-08-21T16:52:15+00:00',
-        text: 'a favorited something by b',
-        user: { id: '99' },
-      }
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      mutations.addNewStatuses(state, {
-        statuses: [favorite],
-        showImmediately: true,
-        timeline: 'public',
-      })
-
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.timelines.public.visibleStatuses[0].fave_num).to.eql(1)
-      expect(state.timelines.public.maxId).to.eq(favorite.id)
-
-      // Adding it again does nothing
-      mutations.addNewStatuses(state, {
-        statuses: [favorite],
-        showImmediately: true,
-        timeline: 'public',
-      })
-
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.timelines.public.visibleStatuses[0].fave_num).to.eql(1)
-      expect(state.timelines.public.maxId).to.eq(favorite.id)
-
-      // If something is favorited by the current user, it also sets the 'favorited' property but does not increment counter to avoid over-counting. Counter is incremented (updated, really) via response to the favorite request.
-      const user = {
-        id: '1',
-      }
-
-      const ownFavorite = {
-        id: '3',
-        type: 'favorite',
-        in_reply_to_status_id: '1', // The API uses strings here...
-        uri: 'tag:shitposter.club,2016-08-21:fave:3895:note:773501:2016-08-21T16:52:15+00:00',
-        text: 'a favorited something by b',
-        user,
-      }
-
-      mutations.addNewStatuses(state, {
-        statuses: [ownFavorite],
-        showImmediately: true,
-        timeline: 'public',
-        user,
-      })
-
-      expect(state.timelines.public.visibleStatuses).to.have.length(1)
-      expect(state.timelines.public.visibleStatuses[0].fave_num).to.eql(1)
-      expect(state.timelines.public.visibleStatuses[0].favorited).to.eql(true)
-    })
-  })
-
-  describe('emojiReactions', () => {
-    it('increments count in existing reaction', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      status.emoji_reactions = [{ name: '😂', count: 1, accounts: [] }]
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      mutations.addOwnReaction(state, {
-        id: '1',
-        emoji: '😂',
-        currentUser: { id: 'me' },
-      })
-      expect(state.allStatusesObject['1'].emoji_reactions[0].count).to.eql(2)
-      expect(state.allStatusesObject['1'].emoji_reactions[0].me).to.eql(true)
-      expect(
-        state.allStatusesObject['1'].emoji_reactions[0].accounts[0].id,
-      ).to.equal('me')
-    })
-
-    it('adds a new reaction', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      status.emoji_reactions = []
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      mutations.addOwnReaction(state, {
-        id: '1',
-        emoji: '😂',
-        currentUser: { id: 'me' },
-      })
-      expect(state.allStatusesObject['1'].emoji_reactions[0].count).to.eql(1)
-      expect(state.allStatusesObject['1'].emoji_reactions[0].me).to.eql(true)
-      expect(
-        state.allStatusesObject['1'].emoji_reactions[0].accounts[0].id,
-      ).to.equal('me')
-    })
-
-    it('decreases count in existing reaction', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      status.emoji_reactions = [
-        { name: '😂', count: 2, accounts: [{ id: 'me' }] },
-      ]
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      mutations.removeOwnReaction(state, {
-        id: '1',
-        emoji: '😂',
-        currentUser: { id: 'me' },
-      })
-      expect(state.allStatusesObject['1'].emoji_reactions[0].count).to.eql(1)
-      expect(state.allStatusesObject['1'].emoji_reactions[0].me).to.eql(false)
-      expect(state.allStatusesObject['1'].emoji_reactions[0].accounts).to.eql(
-        [],
-      )
-    })
-
-    it('removes a reaction', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '1' })
-      status.emoji_reactions = [
-        { name: '😂', count: 1, accounts: [{ id: 'me' }] },
-      ]
-
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      mutations.removeOwnReaction(state, {
-        id: '1',
-        emoji: '😂',
-        currentUser: { id: 'me' },
-      })
-      expect(state.allStatusesObject['1'].emoji_reactions).to.have.length(0)
-    })
-  })
-
-  describe('showNewStatuses', () => {
-    it('resets the minId to the min of the visible statuses when adding new to visible statuses', () => {
-      const state = defaultState()
-      const status = makeMockStatus({ id: '10' })
-      mutations.addNewStatuses(state, {
-        statuses: [status],
-        showImmediately: true,
-        timeline: 'public',
-      })
-      const newStatus = makeMockStatus({ id: '20' })
-      mutations.addNewStatuses(state, {
-        statuses: [newStatus],
-        showImmediately: false,
-        timeline: 'public',
-      })
-      state.timelines.public.minId = '5'
-      mutations.showNewStatuses(state, { timeline: 'public' })
-
-      expect(state.timelines.public.visibleStatuses).to.have.length(2)
-      expect(state.timelines.public.minVisibleId).to.equal('10')
-      expect(state.timelines.public.minId).to.equal('10')
-    })
-  })
-
-  describe('clearTimeline', () => {
-    it('keeps userId when clearing user timeline when excludeUserId param is true', () => {
-      const state = defaultState()
-      state.timelines.user.userId = 123
-
-      mutations.clearTimeline(state, { timeline: 'user', excludeUserId: true })
-
-      expect(state.timelines.user.userId).to.eql(123)
-    })
-  })
-})
diff --git a/test/unit/specs/modules/users.spec.js b/test/unit/specs/modules/users.spec.js
deleted file mode 100644
index 1b33f8c4e..000000000
--- a/test/unit/specs/modules/users.spec.js
+++ /dev/null
@@ -1,120 +0,0 @@
-import { cloneDeep } from 'lodash'
-
-import {
-  defaultState,
-  getters,
-  mutations,
-} from '../../../../src/modules/users.js'
-
-describe('The users module', () => {
-  describe('mutations', () => {
-    it('adds new users to the set, merging in new information for old users', () => {
-      const state = cloneDeep(defaultState)
-      const user = { id: '1', name: 'Guy' }
-      const modUser = { id: '1', name: 'Dude' }
-
-      mutations.addNewUsers(state, [user])
-      expect(state.users).to.have.length(1)
-      expect(state.users).to.eql([user])
-
-      mutations.addNewUsers(state, [modUser])
-      expect(state.users).to.have.length(1)
-      expect(state.users).to.eql([user])
-      expect(state.users[0].name).to.eql('Dude')
-    })
-
-    it('merging array field in new information for old users', () => {
-      const state = cloneDeep(defaultState)
-      const user = {
-        id: '1',
-        fields: [{ name: 'Label 1', value: 'Content 1' }],
-      }
-      const firstModUser = {
-        id: '1',
-        fields: [
-          { name: 'Label 2', value: 'Content 2' },
-          { name: 'Label 3', value: 'Content 3' },
-        ],
-      }
-      const secondModUser = {
-        id: '1',
-        fields: [{ name: 'Label 4', value: 'Content 4' }],
-      }
-
-      mutations.addNewUsers(state, [user])
-      expect(state.users[0].fields).to.have.length(1)
-      expect(state.users[0].fields[0].name).to.eql('Label 1')
-
-      mutations.addNewUsers(state, [firstModUser])
-      expect(state.users[0].fields).to.have.length(2)
-      expect(state.users[0].fields[0].name).to.eql('Label 2')
-      expect(state.users[0].fields[1].name).to.eql('Label 3')
-
-      mutations.addNewUsers(state, [secondModUser])
-      expect(state.users[0].fields).to.have.length(1)
-      expect(state.users[0].fields[0].name).to.eql('Label 4')
-    })
-  })
-
-  describe('findUser', () => {
-    it('does not return user with matching screen_name', () => {
-      const user = { screen_name: 'Guy', id: '1' }
-      const state = {
-        usersObject: {
-          1: user,
-        },
-        usersByNameObject: {
-          guy: user,
-        },
-      }
-      const name = 'Guy'
-      expect(getters.findUser(state)(name)).to.be.undefined
-    })
-
-    it('returns user with matching id', () => {
-      const user = { screen_name: 'Guy', id: '1' }
-      const state = {
-        usersObject: {
-          1: user,
-        },
-        usersByNameObject: {
-          guy: user,
-        },
-      }
-      const id = '1'
-      const expected = { screen_name: 'Guy', id: '1' }
-      expect(getters.findUser(state)(id)).to.eql(expected)
-    })
-  })
-
-  describe('findUserByName', () => {
-    it('returns user with matching screen_name', () => {
-      const user = { screen_name: 'Guy', id: '1' }
-      const state = {
-        usersObject: {
-          1: user,
-        },
-        usersByNameObject: {
-          guy: user,
-        },
-      }
-      const name = 'Guy'
-      const expected = { screen_name: 'Guy', id: '1' }
-      expect(getters.findUserByName(state)(name)).to.eql(expected)
-    })
-
-    it('does not return user with matching id', () => {
-      const user = { screen_name: 'Guy', id: '1' }
-      const state = {
-        usersObject: {
-          1: user,
-        },
-        usersByNameObject: {
-          guy: user,
-        },
-      }
-      const id = '1'
-      expect(getters.findUserByName(state)(id)).to.be.undefined
-    })
-  })
-})
diff --git a/test/unit/specs/services/notification_utils/notification_utils.spec.js b/test/unit/specs/services/notification_utils/notification_utils.spec.js
index 20c9379c6..09d39f704 100644
--- a/test/unit/specs/services/notification_utils/notification_utils.spec.js
+++ b/test/unit/specs/services/notification_utils/notification_utils.spec.js
@@ -1,13 +1,15 @@
 import { createTestingPinia } from '@pinia/testing'
+import { setActivePinia } from 'pinia'
 
+import { useNotificationsStore } from 'src/stores/notifications.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
 
 import * as NotificationUtils from 'src/services/notification_utils/notification_utils.js'
 
 describe('NotificationUtils', () => {
   beforeEach(() => {
-    const store = useSyncConfigStore(createTestingPinia())
-    store.mergedConfig = {
+    setActivePinia(createTestingPinia())
+    useSyncConfigStore().mergedConfig = {
       notificationVisibility: {
         likes: true,
         repeats: true,
@@ -16,31 +18,26 @@ describe('NotificationUtils', () => {
     }
   })
 
-  describe('filteredNotificationsFromStore', () => {
+  describe('filteredNotifications', () => {
     it('should return sorted notifications with configured types', () => {
-      const store = {
-        state: {
-          notifications: {
-            data: [
-              {
-                id: 1,
-                action: { id: '1' },
-                type: 'like',
-              },
-              {
-                id: 2,
-                action: { id: '2' },
-                type: 'mention',
-              },
-              {
-                id: 3,
-                action: { id: '3' },
-                type: 'repeat',
-              },
-            ],
-          },
+      useNotificationsStore().data = [
+        {
+          id: 1,
+          action: { id: '1' },
+          type: 'like',
         },
-      }
+        {
+          id: 2,
+          action: { id: '2' },
+          type: 'mention',
+        },
+        {
+          id: 3,
+          action: { id: '3' },
+          type: 'repeat',
+        },
+      ]
+
       const expected = [
         {
           action: { id: '3' },
@@ -54,7 +51,7 @@ describe('NotificationUtils', () => {
         },
       ]
       expect(
-        NotificationUtils.filteredNotificationsFromStore(store, {
+        NotificationUtils.filteredNotifications({
           mentions: false,
           likes: true,
           repeats: true,
@@ -63,26 +60,21 @@ describe('NotificationUtils', () => {
     })
   })
 
-  describe('unseenNotificationsFromStore', () => {
+  describe('unseenNotifications', () => {
     it('should return only notifications not marked as seen', () => {
-      const store = {
-        state: {
-          notifications: {
-            data: [
-              {
-                action: { id: '1' },
-                type: 'like',
-                seen: false,
-              },
-              {
-                action: { id: '2' },
-                type: 'mention',
-                seen: true,
-              },
-            ],
-          },
+      useNotificationsStore().data = [
+        {
+          action: { id: '1' },
+          type: 'like',
+          seen: false,
         },
-      }
+        {
+          action: { id: '2' },
+          type: 'mention',
+          seen: true,
+        },
+      ]
+
       const expected = [
         {
           action: { id: '1' },
@@ -91,7 +83,7 @@ describe('NotificationUtils', () => {
         },
       ]
       expect(
-        NotificationUtils.unseenNotificationsFromStore(store, {
+        NotificationUtils.unseenNotifications({
           likes: true,
           repeats: true,
           mentions: false,
diff --git a/test/unit/specs/stores/notifications.spec.js b/test/unit/specs/stores/notifications.spec.js
new file mode 100644
index 000000000..ad8b6bf44
--- /dev/null
+++ b/test/unit/specs/stores/notifications.spec.js
@@ -0,0 +1,390 @@
+import { createTestingPinia } from '@pinia/testing'
+import { setActivePinia } from 'pinia'
+
+import { useI18nStore } from 'src/stores/i18n.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
+import { useReportsStore } from 'src/stores/reports.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import * as USER_API from 'src/api/user.js'
+
+const userId = '1'
+const userScreenName = 'user'
+const userName = 'Guy'
+const userUrl = 'http://localhost/user'
+
+const mockMastoAPIUser = ({
+  screen_name = userScreenName,
+  name = userName,
+  url = userUrl,
+  id = userId,
+} = {}) => ({
+  id,
+  acct: screen_name,
+  display_name: name,
+  fields: [],
+  avatar: '',
+  url,
+  pleroma: {
+    emoji_reactions: [],
+  },
+})
+
+const mockUser = ({
+  screen_name = userScreenName,
+  id = userId,
+  name = userName,
+  url = userUrl,
+} = {}) => ({
+  _original: mockMastoAPIUser({
+    screen_name,
+    id,
+    name,
+    url,
+  }),
+  id,
+  name,
+  screen_name,
+  url,
+  relationship: undefined,
+})
+
+const mockStatus = ({
+  id = '1',
+  text,
+  summary,
+  type = 'status',
+  statusUser = mockUser(),
+} = {}) => ({
+  id,
+  user: statusUser,
+  summary: summary ?? `Summary number ${id}`,
+  name: 'status',
+  text: text ?? `Text number ${id}`,
+  uri: '',
+  type,
+  attentions: [],
+  statusnet_conversation_id: 'c1',
+  emoji_reactions: [],
+})
+
+const mockStatusNotification = ({
+  id = '1',
+  type = 'like',
+  status = mockStatus({ id }),
+  seen = false,
+  user = mockUser(),
+} = {}) => ({
+  type,
+  id,
+  status,
+  seen,
+  user,
+  from_profile: user,
+})
+
+describe('Notifications store', () => {
+  beforeEach(() => {
+    vi.useFakeTimers()
+    setActivePinia(createTestingPinia({ stubActions: false }))
+    useI18nStore().i18n = {
+      t: () => {
+        /* no-op */
+      },
+    }
+  })
+
+  afterEach(() => {
+    vi.useRealTimers()
+  })
+
+  it('activate', () => {
+    const store = useNotificationsStore()
+    const sub = vi.fn()
+    useStreamingStore().addSubscriber = sub
+
+    store.activate()
+
+    expect(sub).to.have.been.called
+    expect(store.fetcher).to.not.be.null
+    expect(store.socket).to.not.be.null
+
+    store.deactivate()
+  })
+
+  it('deactivate', () => {
+    const store = useNotificationsStore()
+    const unsub = vi.fn()
+    useStreamingStore().removeSubscriber = unsub
+
+    store.activate()
+    // Checking so that they were set properly before
+    // since reset changes them to ''
+    store.maxId = '2'
+    store.minId = '1'
+    store.idStore = new Map()
+    store.idStore.set('1', {})
+    store.idStore.set('2', {})
+    store.deactivate()
+
+    expect(unsub).to.have.been.called
+    expect(store.fetcher).to.be.null
+    expect(store.socket).to.be.null
+    expect(store.idStore).to.have.length(0)
+    expect(store).to.have.property('maxId', '')
+    expect(store).to.have.property('minId', '')
+  })
+
+  it('updateExtremes should update min and max ids', () => {
+    const store = useNotificationsStore()
+    store.maxId = '10'
+    store.minId = '05'
+
+    store.updateExtremes('04')
+    store.updateExtremes('11')
+
+    expect(store).to.have.property('maxId', '11')
+    expect(store).to.have.property('minId', '04')
+  })
+
+  describe('addNewNotifications', () => {
+    it('adds notifications to the list', () => {
+      const store = useNotificationsStore()
+
+      store.addNewNotifications({
+        timestamp: 1,
+        data: [
+          mockStatusNotification({ id: 'a' }),
+          mockStatusNotification({ id: 'b' }),
+        ],
+      })
+
+      // must be ordered
+      expect(store.data.map(({ id }) => id)).to.eql(['a', 'b'])
+      expect(store.idStore).to.have.keys(['a', 'b'])
+      expect(store).to.have.property('maxId', 'b')
+      expect(store).to.have.property('minId', 'a')
+    })
+
+    it('ignores duplicates', () => {
+      const store = useNotificationsStore()
+
+      store.addNewNotifications({
+        timestamp: 1,
+        data: [
+          mockStatusNotification({ id: '2' }),
+          mockStatusNotification({ id: '1' }),
+        ],
+      })
+
+      store.addNewNotifications({
+        timestamp: 1,
+        data: [
+          mockStatusNotification({ id: '3' }),
+          mockStatusNotification({ id: '2' }),
+        ],
+      })
+
+      // must be ordered
+      expect(store.data.map(({ id }) => id)).to.eql(['3', '2', '1'])
+      expect(store.idStore).to.have.keys(['1', '2', '3'])
+      expect(store).to.have.property('maxId', '3')
+      expect(store).to.have.property('minId', '1')
+    })
+
+    it('appends notifications if fetching older', () => {
+      const store = useNotificationsStore()
+
+      store.addNewNotifications({
+        timestamp: 1,
+        data: [
+          mockStatusNotification({ id: '4' }),
+          mockStatusNotification({ id: '3' }),
+        ],
+      })
+
+      store.addNewNotifications(
+        {
+          timestamp: 1,
+          data: [
+            mockStatusNotification({ id: '2' }),
+            mockStatusNotification({ id: '1' }),
+          ],
+        },
+        true,
+      )
+
+      // must be ordered
+      expect(store.data.map(({ id }) => id)).to.eql(['4', '3', '2', '1'])
+      expect(store.idStore).to.have.keys(['1', '2', '3', '4'])
+      expect(store).to.have.property('maxId', '4')
+      expect(store).to.have.property('minId', '1')
+    })
+
+    it('should update usersStore', () => {
+      const store = useNotificationsStore()
+      const mock = vi.spyOn(useUsersStore(), 'addNewUsers')
+      const mockedNotification = mockStatusNotification({ type: 'follow' })
+
+      store.addNewNotifications({
+        timestamp: 1337,
+        data: [mockedNotification],
+      })
+
+      expect(mock).to.have.been.called
+      expect(mock.mock.calls[0][0]).to.have.property('timestamp', 1337)
+      expect(mock.mock.calls[0][0].data[0]).to.eql(
+        mockedNotification.from_profile,
+      )
+    })
+
+    it('should update reportsStore', (notificationType) => {
+      const store = useNotificationsStore()
+      const mock = vi.spyOn(useReportsStore(), 'addReport')
+      const mockedNotification = mockStatusNotification({
+        type: 'pleroma:report',
+      })
+      mockedNotification.report = { data: '123' }
+
+      store.addNewNotifications({
+        timestamp: 1337,
+        data: [mockedNotification],
+      })
+
+      expect(mock).to.have.been.calledWith({ data: '123' })
+    })
+
+    it.each([
+      'like',
+      'mention',
+      'status',
+      'repeat',
+      'pleroma:emoji_reaction',
+      'poll',
+    ])('should update statusesStore on %s notification', (notificationType) => {
+      const store = useNotificationsStore()
+      const mock = vi.fn()
+      useStatusesStore().addNewStatuses = mock
+      const mockedNotification = mockStatusNotification({
+        type: notificationType,
+      })
+
+      store.addNewNotifications({
+        timestamp: 1337,
+        data: [mockedNotification],
+      })
+
+      expect(mock).to.have.been.called
+      expect(mock.mock.calls[0][0]).to.have.property('timestamp', 1337)
+      expect(mock.mock.calls[0][0].statuses[0]).to.eql(
+        mockedNotification.status,
+      )
+    })
+  })
+
+  describe('wipeStatuses', () => {
+    it('clears all statuses', () => {
+      const store = useNotificationsStore()
+
+      store.addNewNotifications({
+        timestamp: 1,
+        data: [
+          mockStatusNotification({
+            id: 'n2',
+            status: mockStatus({ id: 's2' }),
+          }),
+          mockStatusNotification({
+            id: 'n1',
+            status: mockStatus({ id: 's1' }),
+          }),
+        ],
+      })
+
+      store.wipeStatuses(['s2'])
+      expect(store.idStore).to.not.have.members('n2')
+      expect(store.data.map(({ id }) => id)).to.eql(['n1'])
+    })
+  })
+
+  describe('read/dismiss', () => {
+    it('read single', () => {
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify({ ok: 'ok' }), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useNotificationsStore()
+
+      store.addNewNotifications({
+        timestamp: 1337,
+        data: [
+          mockStatusNotification({ id: 'n3' }),
+          mockStatusNotification({ id: 'n2' }),
+          mockStatusNotification({ id: 'n1' }),
+        ],
+      })
+
+      expect(store.data[1]).to.have.property('seen', false)
+
+      store.markSingleNotificationAsSeen('n2')
+
+      expect(store.data[0]).to.have.property('seen', false)
+      expect(store.data[1]).to.have.property('seen', true)
+      expect(store.data[0]).to.have.property('seen', false)
+
+      const calls = mockFetch.mock.calls
+      expect(calls).to.have.length(1)
+      const callOne = calls[0]
+      expect(callOne[0]).to.eql(USER_API.NOTIFICATION_READ_URL)
+      const formData = Object.fromEntries(callOne[1].body.entries())
+      expect(formData).to.eql({ id: 'n2' })
+    })
+
+    it('read all', () => {
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify({ ok: 'ok' }), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useNotificationsStore()
+
+      // FormData is weird to test
+      store.addNewNotifications({
+        timestamp: 1337,
+        data: [
+          mockStatusNotification({ id: 'n3' }),
+          mockStatusNotification({ id: 'n2' }),
+          mockStatusNotification({ id: 'n1' }),
+        ],
+      })
+
+      expect(store.data[0]).to.have.property('seen', false)
+      expect(store.data[1]).to.have.property('seen', false)
+      expect(store.data[2]).to.have.property('seen', false)
+
+      store.markNotificationsAsSeen()
+
+      expect(store.data[0]).to.have.property('seen', true)
+      expect(store.data[1]).to.have.property('seen', true)
+      expect(store.data[2]).to.have.property('seen', true)
+
+      // FormData is weird to test
+      const calls = mockFetch.mock.calls
+      expect(calls).to.have.length(1)
+      const callOne = calls[0]
+      expect(callOne[0]).to.eql(USER_API.NOTIFICATION_READ_URL)
+      const formData = Object.fromEntries(callOne[1].body.entries())
+      expect(formData).to.eql({ max_id: 'n3' })
+    })
+  })
+})
diff --git a/test/unit/specs/stores/statuses.spec.js b/test/unit/specs/stores/statuses.spec.js
new file mode 100644
index 000000000..f4064ec9d
--- /dev/null
+++ b/test/unit/specs/stores/statuses.spec.js
@@ -0,0 +1,660 @@
+import { createTestingPinia } from '@pinia/testing'
+import { snakeCase } from 'lodash'
+import { setActivePinia } from 'pinia'
+
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import * as PUBLIC_API from 'src/api/public.js'
+import * as USER_API from 'src/api/user.js'
+
+const userId = '1'
+const userScreenName = 'user'
+const userName = 'Guy'
+const userUrl = 'http://localhost/user'
+
+const mockMastoAPIUser = ({
+  screen_name = userScreenName,
+  name = userName,
+  url = userUrl,
+  id = userId,
+} = {}) => ({
+  id,
+  acct: screen_name,
+  display_name: name,
+  fields: [],
+  avatar: '',
+  url,
+  pleroma: {
+    emoji_reactions: [],
+  },
+})
+
+const mockUser = ({
+  screen_name = userScreenName,
+  id = userId,
+  name = userName,
+  url = userUrl,
+} = {}) => ({
+  _original: mockMastoAPIUser({
+    screen_name,
+    id,
+    name,
+    url,
+  }),
+  id,
+  name,
+  screen_name,
+  url,
+  relationship: undefined,
+})
+
+const mockStatus = ({
+  id = '1',
+  text,
+  type = 'status',
+  statusUser = mockUser(),
+} = {}) => ({
+  id,
+  user: statusUser,
+  name: 'status',
+  text: text ?? `Text number ${id}`,
+  uri: '',
+  type,
+  attentions: [],
+  statusnet_conversation_id: 'c1',
+  emoji_reactions: [],
+})
+
+const mockMastoAPIStatus = ({
+  id = '1',
+  text,
+  type = 'status',
+  statusUser = mockMastoAPIUser(),
+} = {}) => ({
+  id,
+  account: statusUser,
+  name: 'status',
+  content: text ?? `Text number ${id}`,
+  uri: '',
+  type,
+  attentions: [],
+  statusnet_conversation_id: 'c1',
+})
+
+const DEFAULT_OPTIONS = (method = 'GET') => ({
+  method,
+  credentials: 'same-origin',
+  headers: {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+  },
+})
+
+describe('Statuses store', () => {
+  beforeEach(() => {
+    setActivePinia(createTestingPinia({ stubActions: false }))
+  })
+
+  it('init', () => {
+    const store = useStatusesStore()
+    const sub = vi.fn()
+    useStreamingStore().addSubscriber = sub
+
+    store.attachSocket()
+
+    expect(store.socket).to.not.be.null
+    expect(sub).to.have.been.called
+  })
+
+  it('resetStatuses', () => {
+    const store = useStatusesStore()
+    const statuses = [...new Array(20)].map((empty, index) =>
+      mockStatus({
+        id: 's' + index,
+        statusUser: mockUser({ id: 'u' + index }),
+      }),
+    )
+
+    store.attachSocket()
+    store.addNewStatuses({
+      statuses,
+      timestamp: 1,
+    })
+    store.resetStatuses()
+    expect(store.allStatuses).to.have.length(0)
+  })
+
+  describe('addNewStatuses', () => {
+    beforeEach(() => {
+      const usersStore = useUsersStore()
+      usersStore.addNewUsers = vi.fn().mockReturnValue([mockUser()])
+    })
+
+    it('adds the status to allStatuses', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1,
+      })
+
+      expect(store.allStatuses).to.eql(new Map([['1', status]]))
+      expect(store.conversations).to.eql(new Map([['c1', new Set(['1'])]]))
+      expect(usersStore.addNewUsers).to.have.callCount(1)
+    })
+
+    it('splits retweets from their status and links them', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+      const retweet = mockStatus({
+        id: '2',
+        type: 'retweet',
+        user: mockUser({ id: '2' }),
+      })
+      retweet.type = 'retweet'
+      retweet.retweeted_status = status
+
+      store.addNewStatuses({
+        statuses: [retweet],
+        timestamp: 1,
+      })
+
+      expect(store.allStatuses).to.eql(
+        new Map([
+          ['1', status],
+          ['2', retweet],
+        ]),
+      )
+      expect(usersStore.addNewUsers).to.have.callCount(2)
+    })
+
+    it('splits quotes from their status and links them', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+      const quote = mockStatus({ id: '2' })
+      quote.quote = status
+
+      store.addNewStatuses({
+        statuses: [quote],
+        timestamp: 1,
+      })
+
+      expect(store.allStatuses).to.eql(
+        new Map([
+          ['1', status],
+          ['2', quote],
+        ]),
+      )
+      expect(usersStore.addNewUsers).to.have.callCount(2)
+    })
+
+    it('replaces existing statuses with the same id', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+      const modStatus = mockStatus({ id: '1', text: 'something else' })
+
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1991,
+      })
+      expect(store.allStatuses).to.eql(new Map([['1', status]]))
+
+      store.addNewStatuses({
+        statuses: [modStatus],
+        timestamp: 2000,
+      })
+      expect(store.allStatuses).to.eql(new Map([['1', modStatus]]))
+      expect(usersStore.addNewUsers).to.have.callCount(2)
+    })
+
+    it('handles edits', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+      const modStatus = mockStatus({
+        id: '1',
+        text: 'something else',
+        type: 'edit',
+      })
+
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1991,
+      })
+      expect(store.allStatuses).to.eql(new Map([['1', status]]))
+
+      store.addNewStatuses({
+        statuses: [modStatus],
+        timestamp: 2000,
+      })
+      expect(store.allStatuses).to.eql(new Map([['1', modStatus]]))
+      expect(usersStore.addNewUsers).to.have.callCount(2)
+    })
+
+    it('ignores updates with older timestamp', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+      const modStatus = mockStatus({ id: '1', text: 'something else' })
+
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 2000,
+      })
+      expect(store.allStatuses).to.eql(new Map([['1', status]]))
+
+      store.addNewStatuses({
+        statuses: [modStatus],
+        timestamp: 1991,
+      })
+      expect(store.allStatuses).to.eql(new Map([['1', status]]))
+      expect(usersStore.addNewUsers).to.have.callCount(2)
+    })
+
+    it('calls useUsersStore().addNewUsers() even on older timestamp', () => {
+      const store = useStatusesStore()
+      const usersStore = useUsersStore()
+      const status = mockStatus({ id: '1' })
+      const modStatus = mockStatus({ id: '1', text: 'something else' })
+
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 2000,
+      })
+      store.addNewStatuses({
+        statuses: [modStatus],
+        timestamp: 1991,
+      })
+      expect(usersStore.addNewUsers).to.have.callCount(2)
+    })
+  })
+
+  describe('fetchers', () => {
+    it.each([
+      [
+        'StatusSource',
+        {
+          content_type: 'text/plain',
+          text: 'Text',
+          spoiler_text: 'Text',
+        },
+      ],
+      [
+        'EmojiReactions',
+        [
+          {
+            accounts: [
+              mockMastoAPIUser({ id: 'u1' }),
+              mockMastoAPIUser({ id: 'u2' }),
+            ],
+            count: 1,
+            me: false,
+            name: 'cofe',
+            url: '',
+          },
+        ],
+      ],
+      [
+        'Favs',
+        [mockMastoAPIUser({ id: 'u1' }), mockMastoAPIUser({ id: 'u2' })],
+      ],
+      [
+        'Repeats',
+        [mockMastoAPIUser({ id: 'u1' }), mockMastoAPIUser({ id: 'u2' })],
+      ],
+    ])('fetch%s', async (group, mockedResponse) => {
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify(mockedResponse), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+      const addNewUsers = vi.spyOn(useUsersStore(), 'addNewUsers')
+
+      let urlKey
+      let prefix = 'MASTODON'
+      if (group === 'Favs') {
+        urlKey = 'STATUS_FAVORITEDBY'
+      } else if (group === 'Repeats') {
+        urlKey = 'STATUS_REBLOGGEDBY'
+      } else {
+        urlKey = snakeCase(group).toUpperCase()
+      }
+      if (group === 'EmojiReactions') {
+        prefix = 'PLEROMA'
+      }
+
+      const url = PUBLIC_API[`${prefix}_${urlKey}_URL`]('id')
+
+      const store = useStatusesStore()
+      const status = mockStatus({ id: 'id' })
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 2000,
+      })
+
+      const result = await store[`fetch${group}`]('id')
+      const updated = store.allStatuses.get('id')
+
+      // Fetch called
+      expect(mockFetch).to.have.been.calledWith(url, DEFAULT_OPTIONS())
+
+      // Users updated
+      if (group !== 'StatusSource') {
+        // first call is the one for the status
+        expect(addNewUsers).to.have.been.calledTwice
+        const secondCallData = addNewUsers.mock.calls[1][0].data
+        expect(secondCallData).to.have.length(2)
+        expect(secondCallData[0]).to.have.property('id', 'u1')
+        expect(secondCallData[1]).to.have.property('id', 'u2')
+      }
+
+      if (group === 'Favs') {
+        expect(store.favs).to.have.length(1)
+        expect(store.favs.get('id')).to.have.length(2)
+        expect(store.favs.get('id')).to.eql(new Set(['u1', 'u2']))
+        expect(updated.fave_num).to.eql(2)
+      } else if (group === 'Repeats') {
+        expect(store.repeats).to.have.length(1)
+        expect(store.repeats.get('id')).to.have.length(2)
+        expect(store.repeats.get('id')).to.eql(new Set(['u1', 'u2']))
+        expect(updated.repeat_num).to.eql(2)
+      } else if (group === 'EmojiReactions') {
+        expect(updated.emoji_reactions).to.have.length(mockedResponse.length)
+        expect(updated.emoji_reactions[0].name).to.eql(mockedResponse[0].name)
+      } else {
+        expect(result).to.eql(mockedResponse)
+      }
+    })
+
+    it('fetchFavsAndRepeats', async () => {
+      const store = useStatusesStore()
+      store.fetchFavs = vi.fn().mockResolvedValue(async () => {
+        /* no-op */
+      })
+      store.fetchRepeats = vi.fn().mockResolvedValue(async () => {
+        /* no-op */
+      })
+
+      await store.fetchFavsAndRepeats('id')
+      expect(store.fetchFavs).to.have.been.calledWith('id')
+      expect(store.fetchRepeats).to.have.been.calledWith('id')
+    })
+
+    it('fetchStatus', async () => {
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify(mockMastoAPIStatus()), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useStatusesStore()
+      await store.fetchStatus('id')
+
+      expect(mockFetch).to.have.been.calledWith(
+        PUBLIC_API.MASTODON_STATUS_URL('id'),
+        DEFAULT_OPTIONS(),
+      )
+      expect(store.allStatuses).to.have.length(1)
+    })
+  })
+
+  describe('interactions', () => {
+    it.each([
+      ['favorite', 'MASTODON_FAVORITE_URL'],
+      ['unfavorite', 'MASTODON_UNFAVORITE_URL'],
+      ['retweet', 'MASTODON_RETWEET_URL'],
+      ['unretweet', 'MASTODON_UNRETWEET_URL'],
+      ['reactWithEmoji', 'PLEROMA_EMOJI_REACT_URL', 'PUT'],
+      ['unreactWithEmoji', 'PLEROMA_EMOJI_UNREACT_URL', 'DELETE'],
+      [
+        'bookmark',
+        'MASTODON_BOOKMARK_STATUS_URL',
+        undefined,
+        { folder_id: 'argument' },
+      ],
+      ['unbookmark', 'MASTODON_UNBOOKMARK_STATUS_URL'],
+      ['pinStatus', 'MASTODON_PIN_OWN_STATUS_URL'],
+      ['unpinStatus', 'MASTODON_UNPIN_OWN_STATUS_URL'],
+      ['muteConversation', 'MASTODON_MUTE_CONVERSATION_URL'],
+      ['unmuteConversation', 'MASTODON_UNMUTE_CONVERSATION_URL'],
+      ['deleteStatus', 'MASTODON_DELETE_URL', 'DELETE'],
+    ])('%s - api call', async (interaction, urlKey, method = 'POST', body) => {
+      const url = USER_API[urlKey]('1', 'argument')
+
+      const status = mockStatus()
+      const store = useStatusesStore()
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1,
+      })
+
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify(mockMastoAPIStatus({ text: 'Updated' })), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+      await store[interaction]('1', 'argument')
+      const expectedArg = DEFAULT_OPTIONS(method)
+
+      if (body) {
+        expectedArg.body = JSON.stringify(body)
+      }
+
+      expect(mockFetch).to.have.been.calledWith(url, expectedArg)
+      if (interaction === 'deleteStatus') {
+        expect(store.allStatuses.get('1').deleted).to.be.true
+      } else {
+        expect(store.allStatuses.get('1').text).to.eql('Updated')
+      }
+    })
+
+    const optimismInteractions = [
+      ['favorite', 'favorited', 'fave_num'],
+      ['retweet', 'repeated', 'repeat_num'],
+      ['bookmark', 'bookmarked'],
+      ['muteConversation', 'thread_muted'],
+    ]
+      .map(([method, property, count]) => [
+        [method, property, count],
+        ['un' + method, property, count],
+      ])
+      .flat()
+
+    it.each(
+      optimismInteractions,
+    )('%s - optimism call', async (method, property, count) => {
+      // Prepare our status
+      const status = mockStatus()
+      const negate = method.startsWith('un')
+      const oldCount = 9
+      const newCount = negate ? 8 : 10
+      status[property] = negate
+      if (count) {
+        status[count] = oldCount
+      }
+      if (method === 'unbookmark') {
+        status.bookmark_folder_id = 'argument'
+      }
+
+      // Insert it
+      const store = useStatusesStore()
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1,
+      })
+
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify(mockMastoAPIStatus({ text: 'Updated' })), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      expect(store.allStatuses.get('1')).to.have.property(property, negate)
+      if (count) {
+        expect(store.allStatuses.get('1')).to.have.property(count, oldCount)
+      }
+      vi.stubGlobal('fetch', mockFetch)
+
+      store[method]('1', 'argument')
+      expect(store.allStatuses.get('1')).to.have.property(property, !negate)
+      if (count) {
+        expect(store.allStatuses.get('1')).to.have.property(count, newCount)
+      }
+      if (property === 'bookmarked') {
+        expect(store.allStatuses.get('1')).to.have.property(
+          'bookmark_folder_id',
+          'argument',
+        )
+      }
+    })
+
+    it.each(
+      optimismInteractions,
+    )('%s - optimism fail', async (method, property, count) => {
+      // Prepare our status
+      const status = mockStatus()
+      const negate = method.startsWith('un')
+      const oldCount = 9
+      status[property] = negate
+      if (count) {
+        status[count] = oldCount
+      }
+      if (method === 'unbookmark') {
+        status.bookmark_folder_id = 'argument'
+      }
+
+      // Insert it
+      const store = useStatusesStore()
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1,
+      })
+
+      const mockFetch = vi.fn()
+      mockFetch.mockRejectedValueOnce(new Error('Failure!'))
+
+      expect(store.allStatuses.get('1')).to.have.property(property, negate)
+      if (count) {
+        expect(store.allStatuses.get('1')).to.have.property(count, oldCount)
+      }
+      vi.stubGlobal('fetch', mockFetch)
+
+      await store[method]('1', 'argument')
+      expect(store.allStatuses.get('1')).to.have.property(property, negate)
+      if (count) {
+        expect(store.allStatuses.get('1')).to.have.property(count, oldCount)
+      }
+
+      // Failing 'bookmark' method SHOULD clear folder id
+      if (method === 'unbookmark') {
+        expect(store.allStatuses.get('1')).to.have.property(
+          'bookmark_folder_id',
+          'argument',
+        )
+      }
+    })
+
+    it.each([
+      ['reactWithEmoji', 0],
+      ['unreactWithEmoji', 1],
+      ['reactWithEmoji', 1],
+      ['unreactWithEmoji', 2],
+    ])('%s count: %s - optimism call', async (method, oldCount) => {
+      // Prepare our status
+      const status = mockStatus()
+      const negate = method.startsWith('un')
+      const newCount = negate ? oldCount - 1 : oldCount + 1
+
+      useUsersStore().currentUser = mockUser()
+
+      if (oldCount > 0) {
+        const reactors = [...new Array(oldCount)].map((empty, index) =>
+          mockUser({ id: 'o' + index }),
+        )
+        if (negate) {
+          // Replace one of reactors with ourselves
+          reactors[0] = useUsersStore().currentUser
+        }
+        status.emoji_reactions = [
+          {
+            name: 'hyperlol',
+            count: oldCount,
+            accounts: reactors,
+          },
+        ]
+      } else {
+        status.emoji_reactions = []
+      }
+
+      // Insert it
+      const store = useStatusesStore()
+      store.addNewStatuses({
+        statuses: [status],
+        timestamp: 1,
+      })
+
+      const mockFetch = vi.fn()
+      mockFetch.mockResolvedValueOnce(
+        new Response(JSON.stringify(mockMastoAPIStatus({ text: 'Updated' })), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+      const expected = store.allStatuses.get('1')
+
+      expect(expected.emoji_reactions).to.have.length(oldCount === 0 ? 0 : 1)
+      if (oldCount !== 0) {
+        expect(expected.emoji_reactions[0].name).to.eql('hyperlol')
+        expect(expected.emoji_reactions[0].count).to.eql(oldCount)
+        expect(expected.emoji_reactions[0].accounts).to.have.length(oldCount)
+      }
+
+      store[method]('1', 'hyperlol')
+
+      expect(expected.emoji_reactions).to.have.length(newCount === 0 ? 0 : 1)
+      if (newCount !== 0) {
+        expect(expected.emoji_reactions[0].name).to.eql('hyperlol')
+        expect(expected.emoji_reactions[0].count).to.eql(newCount)
+        expect(expected.emoji_reactions[0].accounts).to.have.length(newCount)
+      }
+    })
+  })
+
+  it('wipeUserStatuses', () => {
+    const store = useStatusesStore()
+    const statuses = [...new Array(20)].map((empty, index) =>
+      mockStatus({
+        id: 's' + index,
+        statusUser: mockUser({ id: 'u' + index }),
+      }),
+    )
+
+    store.addNewStatuses({
+      statuses,
+      timestamp: 1,
+    })
+
+    const result = store.wipeUserStatuses('u19')
+
+    expect(store.allStatuses).to.have.length(19)
+    expect(result).to.eql(new Set(['s19']))
+  })
+})
diff --git a/test/unit/specs/stores/timelines.spec.js b/test/unit/specs/stores/timelines.spec.js
new file mode 100644
index 000000000..2b4704052
--- /dev/null
+++ b/test/unit/specs/stores/timelines.spec.js
@@ -0,0 +1,487 @@
+import { createTestingPinia } from '@pinia/testing'
+import { setActivePinia } from 'pinia'
+
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
+
+describe('Timelines store', () => {
+  beforeEach(() => {
+    vi.useFakeTimers()
+    setActivePinia(createTestingPinia({ stubActions: false }))
+  })
+
+  afterEach(() => {
+    useTimelinesStore().deactivateAll()
+    vi.useRealTimers()
+  })
+
+  describe('activate', () => {
+    it('streamable', () => {
+      const store = useTimelinesStore()
+      const sub = vi.fn()
+      useStreamingStore().addSubscriber = sub
+
+      store.activate('friends', undefined, true)
+
+      expect(sub).to.have.been.called
+      expect(store.friends.fetcher).to.not.be.null
+      expect(store.friends.socket).to.not.be.null
+    })
+
+    it('non-streamable', () => {
+      const store = useTimelinesStore()
+      const sub = vi.fn()
+      useStreamingStore().addSubscriber = sub
+
+      store.activate('user', '1')
+
+      expect(sub).to.not.have.been.called
+      expect(store.user.fetcher).to.not.be.null
+      expect(store.user.socket).to.be.null
+    })
+  })
+
+  describe('deactivate', () => {
+    it('streamable', () => {
+      const store = useTimelinesStore()
+      const unsub = vi.fn()
+      useStreamingStore().removeSubscriber = unsub
+      useStreamingStore().addSubscriber = vi.fn()
+
+      store.activate('friends', undefined, true)
+      // Checking so that they were set properly before
+      // since reset changes them to ''
+      store.friends.maxId = '3'
+      store.friends.minId = '4'
+      store.friends.statusIds = new Set(['3', '4'])
+      store.friends.visibleStausIds = new Set(['3', '4'])
+      store.deactivate('friends', true)
+
+      expect(unsub).to.have.been.called
+      expect(store.friends.fetcher).to.be.null
+      expect(store.friends.socket).to.be.null
+      expect(store.friends.statusIds).to.have.length(0)
+      expect(store.friends.visibleStatusIds).to.have.length(0)
+      expect(store.friends).to.have.property('maxId', '')
+      expect(store.friends).to.have.property('minId', '')
+    })
+
+    it('non-streamable', () => {
+      const store = useTimelinesStore()
+      const unsub = vi.fn()
+      useStreamingStore().removeSubscriber = unsub
+      useStreamingStore().addSubscriber = vi.fn()
+
+      store.activate('user', '1')
+      // Checking so that they were set properly before
+      // since reset changes them to ''
+      store.user.maxId = '3'
+      store.user.minId = '4'
+      store.user.statusIds = new Set(['3', '4'])
+      store.user.visibleStausIds = new Set(['3', '4'])
+      store.deactivate('user')
+
+      expect(unsub).to.not.have.been.called
+      expect(store.user.fetcher).to.be.null
+      expect(store.user.socket).to.be.null
+      expect(store.user.statusIds).to.have.length(0)
+      expect(store.user.visibleStatusIds).to.have.length(0)
+      expect(store.user).to.have.property('maxId', '')
+      expect(store.user).to.have.property('minId', '')
+    })
+  })
+
+  describe('updateTimelineExtremes', () => {
+    it('should derive extremes from data', () => {
+      const store = useTimelinesStore()
+      const timeline = useTimelinesStore().friends
+      timeline.order = ['4', '1', '3', '2']
+      timeline.statusesIds = new Set(timeline.order)
+      store.updateTimelineExtremes(timeline)
+
+      expect(store.friends).to.have.property('maxId', '4')
+      expect(store.friends).to.have.property('minId', '2')
+    })
+
+    it('should use extremes from pagination', () => {
+      const store = useTimelinesStore()
+      const timeline = useTimelinesStore().friends
+      store.updateTimelineExtremes(timeline, { maxId: '1', minId: '2' })
+
+      // Min and max are swapped!
+      expect(store.friends).to.have.property('maxId', '2')
+      expect(store.friends).to.have.property('minId', '1')
+    })
+  })
+
+  describe('addStatusesToTimeline', () => {
+    it('adds the status to the given timeline', () => {
+      const store = useTimelinesStore()
+      const statuses = ['1', '2', '3']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '1', {
+        statuses,
+        repeats: [],
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.list.order).to.eql(statuses)
+      expect(store.list.statusIds).to.eql(new Set(statuses))
+      expect(store.list.visibleStatusIds).to.eql(new Set())
+      expect(store.list.newStatusCount).to.equal(3)
+      expect(store.list).to.have.property('maxId', '1')
+      expect(store.list).to.have.property('minId', '3')
+    })
+
+    it('ignores duplicates', () => {
+      const store = useTimelinesStore()
+      const statuses = ['1', '2', '3']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '1', {
+        statuses,
+        repeats: [],
+        pagination: { minId: '1', maxId: '3' },
+      })
+      store.addStatusesToTimeline('list', '1', {
+        statuses,
+        repeats: [],
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.list.order).to.eql(statuses)
+      expect(store.list.statusIds).to.eql(new Set(statuses))
+      expect(store.list.visibleStatusIds).to.eql(new Set())
+      expect(store.list.newStatusCount).to.equal(3)
+      expect(store.list).to.have.property('maxId', '1')
+      expect(store.list).to.have.property('minId', '3')
+    })
+
+    it('adds the status the given timeline, directly visible', () => {
+      const store = useTimelinesStore()
+      const statuses = ['1', '2', '3']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '1', {
+        statuses,
+        repeats: [],
+        showImmediately: true,
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.list.order).to.eql(statuses)
+      expect(store.list.statusIds).to.eql(new Set(statuses))
+      expect(store.list.visibleStatusIds).to.eql(new Set(statuses))
+      expect(store.list.newStatusCount).to.equal(0)
+      expect(store.list).to.have.property('maxId', '1')
+      expect(store.list).to.have.property('minId', '3')
+    })
+
+    it('does not update the maxId when the noIdUpdate flag is set', () => {
+      const store = useTimelinesStore()
+      const statuses = ['1', '2', '3']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '1', {
+        statuses,
+        repeats: [],
+        noIdUpdate: true,
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.list.order).to.eql(statuses)
+      expect(store.list.statusIds).to.eql(new Set(statuses))
+      expect(store.list.visibleStatusIds).to.eql(new Set())
+      expect(store.list.newStatusCount).to.equal(3)
+      expect(store.list).to.have.property('maxId', '')
+      expect(store.list).to.have.property('minId', '')
+    })
+
+    it('does not update timeline if it belongs to a different arugment', () => {
+      const store = useTimelinesStore()
+      const statuses = ['1', '2', '3']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '2', {
+        statuses,
+        repeats: [],
+        noIdUpdate: true,
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.list.order).to.eql([])
+      expect(store.list.statusIds).to.eql(new Set())
+      expect(store.list.visibleStatusIds).to.eql(new Set())
+      expect(store.list.newStatusCount).to.equal(0)
+      expect(store.list).to.have.property('maxId', '')
+      expect(store.list).to.have.property('minId', '')
+    })
+
+    it('prepends timeline with new statuses', () => {
+      const store = useTimelinesStore()
+      const statuses1 = ['3', '2', '1']
+      const statuses2 = ['6', '5', '4']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '1', {
+        statuses: statuses1,
+        repeats: [],
+        pagination: { minId: '3', maxId: '1' },
+      })
+      store.addStatusesToTimeline('list', '1', {
+        statuses: statuses2,
+        repeats: [],
+        pagination: { minId: '6', maxId: '4' },
+      })
+
+      const newOrder = [...statuses2, ...statuses1]
+      expect(store.list.order).to.eql(newOrder)
+      expect(store.list.statusIds).to.eql(new Set(newOrder))
+      expect(store.list.visibleStatusIds).to.eql(new Set())
+      expect(store.list.newStatusCount).to.equal(6)
+      expect(store.list).to.have.property('maxId', '6')
+      expect(store.list).to.have.property('minId', '1')
+    })
+
+    it('appends timeline with new statuses if fetching older', () => {
+      const store = useTimelinesStore()
+      const statuses1 = ['6', '5', '4']
+      const statuses2 = ['3', '2', '1']
+
+      store.activate('list', '1')
+      store.addStatusesToTimeline('list', '1', {
+        statuses: statuses1,
+        repeats: [],
+        pagination: { minId: '6', maxId: '4' },
+      })
+      store.addStatusesToTimeline('list', '1', {
+        statuses: statuses2,
+        repeats: [],
+        pagination: { minId: '3', maxId: '1' },
+        older: true,
+      })
+
+      const newOrder = [...statuses1, ...statuses2]
+      expect(store.list.order).to.eql(newOrder)
+      expect(store.list.statusIds).to.eql(new Set(newOrder))
+      expect(store.list.visibleStatusIds).to.eql(new Set())
+      expect(store.list.newStatusCount).to.equal(6)
+      expect(store.list).to.have.property('maxId', '6')
+      expect(store.list).to.have.property('minId', '1')
+    })
+
+    describe('repeat de-duplication', () => {
+      it('handles repeat de-duplication (older)', () => {
+        const store = useTimelinesStore()
+        const statuses1 = ['s7s3', 's6s3', 's5', 's4s0', 's3', 's2']
+        const statuses2 = ['s1s0', 's0']
+
+        store.activate('list', '1')
+        store.addStatusesToTimeline('list', '1', {
+          statuses: statuses1,
+          repeats: [
+            ['s7s3', 's2'],
+            ['s6s3', 's2'],
+            ['s4s0', 's0'],
+          ],
+          pagination: { minId: 's7s3', maxId: 's2' },
+          showImmediately: true,
+        })
+        expect(store.list.order).to.eql(statuses1)
+        expect(store.list.statusIds).to.eql(new Set(statuses1))
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set(['s5', 's4s0', 's3', 's2']),
+        )
+        expect(store.list).to.have.property('maxId', 's7s3')
+        expect(store.list).to.have.property('minId', 's2')
+
+        store.addStatusesToTimeline('list', '1', {
+          statuses: statuses2,
+          repeats: [['s1s0', 's0']],
+          pagination: { minId: 's1', maxId: 's0' },
+          showImmediately: true,
+          older: true,
+        })
+
+        const newOrder = [...statuses1, ...statuses2]
+        expect(store.list.order).to.eql(newOrder)
+        expect(store.list.statusIds).to.eql(new Set(newOrder))
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set(['s5', 's4s0', 's3', 's2', 's0']),
+        )
+        expect(store.list).to.have.property('maxId', 's7s3')
+        expect(store.list).to.have.property('minId', 's0')
+      })
+
+      it('handles repeat de-duplication(reverse)', () => {
+        const store = useTimelinesStore()
+        const statuses1 = ['s6s2', 's5s2', 's4', 's3s0', 's2', 's1']
+        const statuses2 = ['sAs0', 's9s1', 's8', 's7s2']
+
+        store.activate('list', '1')
+        store.addStatusesToTimeline('list', '1', {
+          statuses: statuses1,
+          repeats: [
+            ['s6s2', 's2'],
+            ['s5s2', 's2'],
+            ['s3s0', 's0'],
+          ],
+          pagination: { minId: 's6s2', maxId: 's1' },
+          showImmediately: true,
+        })
+        expect(store.list.order).to.eql(statuses1)
+        expect(store.list.statusIds).to.eql(new Set(statuses1))
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set(['s4', 's3s0', 's2', 's1']),
+        )
+        expect(store.list).to.have.property('maxId', 's6s2')
+        expect(store.list).to.have.property('minId', 's1')
+
+        store.addStatusesToTimeline('list', '1', {
+          statuses: statuses2,
+          repeats: [
+            ['sAs0', 's0'],
+            ['s9s1', 's1'],
+            ['s7s2', 's2'],
+          ],
+          pagination: { minId: 'sAs0', maxId: 's7s2' },
+          showImmediately: true,
+        })
+
+        const newOrder = [...statuses2, ...statuses1]
+        expect(store.list.order).to.eql(newOrder)
+        expect(store.list.statusIds).to.eql(new Set(newOrder))
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set([
+            's4',
+            's3s0',
+            's2',
+            's1',
+            // Newer
+            's8',
+          ]),
+        )
+        expect(store.list).to.have.property('maxId', 'sAs0')
+        expect(store.list).to.have.property('minId', 's1')
+      })
+
+      it('showNewStatuses follows de-duplication rules', () => {
+        const store = useTimelinesStore()
+        const statuses1 = ['s6s2', 's5s2', 's4', 's3s0', 's2', 's1']
+        const statuses2 = ['sAs0', 's9s1', 's8', 's7s2']
+
+        store.activate('list', '1')
+        store.addStatusesToTimeline('list', '1', {
+          statuses: statuses1,
+          repeats: [
+            ['s6s2', 's2'],
+            ['s5s2', 's2'],
+            ['s3s0', 's0'],
+          ],
+          pagination: { minId: 's6s2', maxId: 's1' },
+          showImmediately: true,
+        })
+        expect(store.list.order).to.eql(statuses1)
+        expect(store.list.statusIds).to.eql(new Set(statuses1))
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set(['s4', 's3s0', 's2', 's1']),
+        )
+        expect(store.list).to.have.property('maxId', 's6s2')
+        expect(store.list).to.have.property('minId', 's1')
+
+        store.addStatusesToTimeline('list', '1', {
+          statuses: statuses2,
+          repeats: [
+            ['sAs0', 's0'],
+            ['s9s1', 's1'],
+            ['s7s2', 's2'],
+          ],
+          pagination: { minId: 'sAs0', maxId: 's7s2' },
+        })
+
+        const newOrder = [...statuses2, ...statuses1]
+        expect(store.list.order).to.eql(newOrder)
+        expect(store.list.statusIds).to.eql(new Set(newOrder))
+        expect(store.list.newStatusCount).to.eql(1)
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set(['s4', 's3s0', 's2', 's1']),
+        )
+
+        store.showNewStatuses('list')
+        expect(store.list.visibleStatusIds).to.eql(
+          new Set([
+            's4',
+            's3s0',
+            's2',
+            's1',
+            // Newer
+            's8',
+          ]),
+        )
+      })
+    })
+  })
+
+  describe('showNewStatuses', () => {
+    it('resets counter and makes all ids visible', () => {
+      const store = useTimelinesStore()
+      const statuses = ['1', '2', '3']
+
+      store.activate('public')
+      store.addStatusesToTimeline('public', undefined, {
+        statuses,
+        repeats: [],
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.public.statusIds).to.eql(new Set(statuses))
+      expect(store.public.visibleStatusIds).to.eql(new Set())
+      expect(store.public.newStatusCount).to.equal(3)
+      store.showNewStatuses('public')
+      expect(store.public.visibleStatusIds).to.eql(new Set(statuses))
+      expect(store.public.newStatusCount).to.equal(0)
+    })
+
+    it('limits shown items to 50 for better performance', () => {
+      const store = useTimelinesStore()
+      const statuses = new Array(100).fill().map((_, index) => 's' + index)
+
+      store.activate('public')
+      store.addStatusesToTimeline('public', undefined, {
+        statuses,
+        repeats: [],
+        pagination: { minId: '1', maxId: '3' },
+      })
+
+      expect(store.public.statusIds).to.eql(new Set(statuses))
+      expect(store.public.visibleStatusIds).to.eql(new Set())
+      expect(store.public.newStatusCount).to.equal(100)
+      store.showNewStatuses('public')
+      expect(store.public.visibleStatusIds).to.eql(
+        new Set(statuses.slice(0, 50)),
+      )
+      expect(store.public.newStatusCount).to.equal(0)
+    })
+  })
+
+  describe('wipeStatuses', () => {
+    it('clears all statuses', () => {
+      const store = useTimelinesStore()
+
+      store.activate('friends')
+      store.activate('public')
+      store.addStatusesToTimeline('public', undefined, {
+        statuses: ['1', '2', '3', '0'],
+        repeats: [],
+      })
+      store.addStatusesToTimeline('friends', undefined, {
+        statuses: ['5', '0', '9', '1'],
+        repeats: [],
+      })
+      store.wipeStatuses(['0'])
+      expect(store.friends.statusIds).to.not.have.members('0')
+      expect(store.public.statusIds).to.not.have.members('0')
+    })
+  })
+})
diff --git a/test/unit/specs/stores/user_highlight.spec.js b/test/unit/specs/stores/user_highlight.spec.js
index e97f8f382..865544035 100644
--- a/test/unit/specs/stores/user_highlight.spec.js
+++ b/test/unit/specs/stores/user_highlight.spec.js
@@ -9,15 +9,6 @@ import {
 describe('The UserHighlight store', () => {
   beforeEach(() => {
     setActivePinia(createPinia())
-    window.vuex = {
-      state: {
-        users: {
-          currentUser: {
-            fqn: 'foo@bar.tld',
-          },
-        },
-      },
-    }
   })
 
   describe('mutations', () => {
diff --git a/test/unit/specs/stores/users.spec.js b/test/unit/specs/stores/users.spec.js
new file mode 100644
index 000000000..c44c749f3
--- /dev/null
+++ b/test/unit/specs/stores/users.spec.js
@@ -0,0 +1,1356 @@
+import { createTestingPinia } from '@pinia/testing'
+import { snakeCase } from 'lodash'
+import { setActivePinia } from 'pinia'
+
+import { useAnnouncementsStore } from 'src/stores/announcements.js'
+import { useBookmarkFoldersStore } from 'src/stores/bookmark_folders.js'
+import { useChatsStore } from 'src/stores/chats.js'
+import { useEmojiStore } from 'src/stores/emoji.js'
+import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
+import { useListsStore } from 'src/stores/lists.js'
+import { useMergedConfigStore } from 'src/stores/merged_config.js'
+import { useNotificationsStore } from 'src/stores/notifications.js'
+import { useOAuthStore } from 'src/stores/oauth.js'
+import { useStatusesStore } from 'src/stores/statuses.js'
+import { useStreamingStore } from 'src/stores/streaming.js'
+import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useTimelinesStore } from 'src/stores/timelines.js'
+import { useUserHighlightStore } from 'src/stores/user_highlight.js'
+import { useUsersStore } from 'src/stores/users.js'
+
+import * as PUBLIC_API from 'src/api/public.js'
+import * as USER_API from 'src/api/user.js'
+
+const DEFAULT_OPTIONS = (method = 'POST') => ({
+  method,
+  credentials: 'same-origin',
+  headers: {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+  },
+})
+
+const actionKeys = (action) => {
+  const result = {}
+  if (action === 'removeUserFromFollowers') {
+    result.storeAction = action
+  } else {
+    result.storeAction = action + 'User'
+  }
+
+  result.apiUrl = `MASTODON_${snakeCase(result.storeAction).toUpperCase()}_URL`
+  return result
+}
+
+const userId = '1'
+const userScreenName = 'user'
+const userName = 'Guy'
+const userUrl = 'http://localhost/user'
+
+const mockMastoAPIUser = ({
+  screen_name = userScreenName,
+  name = userName,
+  url = userUrl,
+  id = userId,
+} = {}) => ({
+  id,
+  acct: screen_name,
+  display_name: name,
+  fields: [],
+  avatar: '',
+  url,
+})
+
+const mockUser = ({
+  screen_name = userScreenName,
+  id = userId,
+  name = userName,
+  url = userUrl,
+} = {}) => ({
+  _original: mockMastoAPIUser({
+    screen_name,
+    id,
+    name,
+    url,
+  }),
+  id,
+  name,
+  screen_name,
+  url,
+  relationship: undefined,
+})
+
+describe('Users store', () => {
+  beforeEach(() => {
+    setActivePinia(createTestingPinia({ stubActions: false }))
+  })
+
+  describe('addNewUsers', () => {
+    describe('users', () => {
+      it('adds new users to the set, merging in new information for old users', () => {
+        const store = useUsersStore()
+
+        const modUser = mockUser({ name: 'Dude' })
+
+        store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+        expect(store.users).to.have.length(1)
+        expect(store.users).to.have.all.keys(userId)
+
+        store.addNewUsers({ data: [modUser], timestamp: 2 })
+        expect(store.users).to.have.length(1)
+        expect(store.users).to.have.all.keys(userId)
+        expect(store.users.get(userId).name).to.eql('Dude')
+      })
+
+      it('ignores new users if timestamp is older', () => {
+        const store = useUsersStore()
+
+        const modUser = mockUser({ name: 'Old guy' })
+
+        store.addNewUsers({ data: [mockUser()], timestamp: 2000 })
+        expect(store.users).to.have.length(1)
+        expect(store.users).to.have.all.keys(userId)
+        expect(store.users.get(userId).name).to.eql('Guy')
+
+        store.addNewUsers({ data: [modUser], timestamp: 1991 })
+        expect(store.users).to.have.length(1)
+        expect(store.users).to.have.all.keys(userId)
+        expect(store.users.get(userId).name).to.eql('Guy')
+      })
+
+      it('merging array field in new information for old users', () => {
+        const store = useUsersStore()
+
+        const userFields = {
+          ...mockUser(),
+          fields: [{ name: 'Label 1', value: 'Content 1' }],
+        }
+        const firstModUser = {
+          ...mockUser(),
+          fields: [
+            { name: 'Label 2', value: 'Content 2' },
+            { name: 'Label 3', value: 'Content 3' },
+          ],
+        }
+        const secondModUser = {
+          ...mockUser(),
+          fields: [{ name: 'Label 4', value: 'Content 4' }],
+        }
+
+        store.addNewUsers({ data: [userFields], timestamp: 1 })
+        const reactive = store.users.get(userId)
+        expect(reactive.fields).to.have.length(1)
+        expect(reactive.fields[0].name).to.eql('Label 1')
+
+        store.addNewUsers({ data: [firstModUser], timestamp: 2 })
+        expect(reactive.fields).to.have.length(2)
+        expect(reactive.fields[0].name).to.eql('Label 2')
+        expect(reactive.fields[1].name).to.eql('Label 3')
+
+        store.addNewUsers({ data: [secondModUser], timestamp: 3 })
+        expect(reactive.fields).to.have.length(1)
+        expect(reactive.fields[0].name).to.eql('Label 4')
+      })
+    })
+
+    describe('relationships', () => {
+      it('updates relationship information if present', () => {
+        const store = useUsersStore()
+
+        const modUser = {
+          ...mockUser(),
+          relationship: {
+            id: userId,
+            following: true,
+          },
+        }
+
+        store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+        store.addNewUsers({ data: [modUser], timestamp: 2 })
+
+        expect(store.relationships).to.have.length(1)
+        expect(store.relationships).to.have.all.keys(userId)
+        expect(store.relationship(userId).following).to.eql(true)
+        expect(store.findUser(userId).relationship.following).to.eql(true)
+      })
+
+      it('updates relationship information if present even if user timestamp is older', () => {
+        const store = useUsersStore()
+
+        const modUser = {
+          ...mockUser({ name: 'Old Dude' }),
+          relationship: {
+            id: userId,
+            following: true,
+          },
+        }
+
+        store.addNewUsers({ data: [mockUser()], timestamp: 2000 })
+        store.addNewUsers({ data: [modUser], timestamp: 1991 })
+
+        expect(store.relationships).to.have.length(1)
+        expect(store.relationships).to.have.all.keys(userId)
+        expect(store.relationship(userId).following).to.eql(true)
+        expect(store.findUser(userId).relationship.following).to.eql(true)
+      })
+
+      it("doesn't erase relationship information if new data has it missing", () => {
+        const store = useUsersStore()
+
+        const modUser = mockUser({ name: 'Dude' })
+
+        store.addNewUsers({
+          data: [
+            { ...mockUser(), relationship: { id: userId, following: true } },
+          ],
+          timestamp: 1,
+        })
+        store.addNewUsers({ data: [modUser], timestamp: 2 })
+
+        expect(store.relationships).to.have.length(1)
+        expect(store.relationships).to.have.all.keys(userId)
+        expect(store.relationship(userId).following).to.eql(true)
+        expect(store.findUser(userId).relationship.following).to.eql(true)
+      })
+    })
+  })
+
+  describe('updateUserRelationships', () => {
+    it('updates existing user relationship', () => {
+      const store = useUsersStore()
+      const relationship = { id: userId, following: true }
+
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+      store.updateUserRelationships({ data: relationship, timestamp: 2 })
+
+      expect(store.relationship(userId)).to.eql({ id: userId, following: true })
+      expect(store.findUser(userId).relationship.following).to.eql(true)
+    })
+
+    it('stores relationship for missing user', () => {
+      const store = useUsersStore()
+      const relationship = { id: userId, following: true }
+
+      store.updateUserRelationships({ data: relationship, timestamp: 1 })
+
+      expect(store.relationship(userId)).to.eql({ id: userId, following: true })
+    })
+
+    it('assigns relationship for missing user when it becomes available', () => {
+      const store = useUsersStore()
+      const relationship = { id: userId, following: true }
+
+      store.updateUserRelationships({ data: relationship, timestamp: 1 })
+      store.addNewUsers({ data: [mockUser()], timestamp: 2 })
+
+      expect(store.relationship(userId)).to.eql({ id: userId, following: true })
+      expect(store.findUser(userId).relationship).to.eql({
+        id: userId,
+        following: true,
+      })
+    })
+
+    it('ignores relationship update if timestamp is older than existing', () => {
+      const store = useUsersStore()
+      const oldRelationship = { id: userId, following: true }
+      const newRelationship = { id: userId, following: false }
+
+      store.addNewUsers({
+        data: [{ ...mockUser(), relationship: newRelationship }],
+        timestamp: 2000,
+      })
+      store.updateUserRelationships({ data: oldRelationship, timestamp: 1991 })
+
+      expect(store.relationship(userId)).to.eql({
+        id: userId,
+        following: false,
+      })
+      expect(store.findUser(userId).relationship.following).to.eql(false)
+    })
+  })
+
+  describe('fetchers', () => {
+    describe('fetchUserIfMissing', () => {
+      it('should fetch requested user, add it to store and return it', async () => {
+        vi.stubGlobal(
+          'fetch',
+          vi.fn().mockResolvedValueOnce(
+            new Response(JSON.stringify(mockMastoAPIUser()), {
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          ),
+        )
+
+        const expected = mockUser()
+        const store = useUsersStore()
+        const resultUser = await store.fetchUserIfMissing({ id: '1' })
+
+        expect(resultUser).to.deep.include(expected)
+        expect(store.findUser(userId)).to.deep.include(expected)
+      })
+
+      it('Should re-use existing promise for other fetches', async () => {
+        vi.stubGlobal(
+          'fetch',
+          vi
+            .fn()
+            .mockResolvedValueOnce(
+              new Response(JSON.stringify({ id: '1' }), {
+                headers: { 'Content-Type': 'application/json' },
+              }),
+            )
+            // fetch by name yields user id which we request next
+            .mockResolvedValueOnce(
+              new Response(JSON.stringify(mockMastoAPIUser()), {
+                headers: { 'Content-Type': 'application/json' },
+              }),
+            )
+            .mockThrowOnce(new Error("Shouldn't be called more than once")),
+        )
+
+        const expected = mockUser()
+        const store = useUsersStore()
+        const resultUser1 = await store.fetchUserIfMissing({ name: 'user' })
+        const resultUser2 = await store.fetchUserIfMissing({ id: '1' })
+
+        expect(resultUser1).to.deep.include(expected)
+        expect(resultUser2).to.deep.include(expected)
+        expect(store.findUser(userId)).to.deep.include(expected)
+      })
+
+      it('Should use cached data if present', async () => {
+        vi.stubGlobal(
+          'fetch',
+          vi.fn().mockThrowOnce(new Error("Shouldn't be called at all")),
+        )
+        const store = useUsersStore()
+        store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+
+        const resultUser1 = await store.fetchUserIfMissing({ id: '1' })
+        const resultUser2 = await store.fetchUserIfMissing({ name: 'user' })
+        const expected = mockUser()
+
+        expect(resultUser1).to.deep.include(expected)
+        expect(resultUser2).to.deep.include(expected)
+        expect(store.findUser(userId)).to.deep.include(expected)
+      })
+
+      it('Should handle 404 gracefully', async () => {
+        vi.stubGlobal(
+          'fetch',
+          vi.fn().mockResolvedValueOnce(
+            new Response(JSON.stringify(mockMastoAPIUser()), {
+              status: 404,
+              statusText: 'Not Found',
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          ),
+        )
+        const store = useUsersStore()
+
+        const resultUser = await store.fetchUserIfMissing({ id: '1' })
+
+        expect(resultUser).to.be.null
+      })
+
+      it('Should throw if no identifier is provided', async () => {
+        const store = useUsersStore()
+
+        await expect(
+          async () => await store.fetchUserIfMissing({}),
+        ).rejects.to.throw(TypeError)
+        await expect(
+          async () => await store.fetchUserIfMissing(),
+        ).rejects.to.throw(TypeError)
+      })
+    })
+
+    describe('relationships', () => {
+      it.each(['Friends', 'Followers'])('fetch%s', async (group) => {
+        const mockFetch = vi
+          .fn()
+          .mockResolvedValueOnce(
+            new Response(
+              JSON.stringify([
+                mockMastoAPIUser({
+                  screen_name: 'snake',
+                  name: 'John',
+                  id: '2',
+                }),
+                mockMastoAPIUser({
+                  screen_name: 'zero',
+                  name: 'David Oh',
+                  id: '3',
+                }),
+              ]),
+              {
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+          .mockResolvedValueOnce(
+            new Response(
+              JSON.stringify([
+                mockMastoAPIUser({
+                  screen_name: 'sigint',
+                  name: 'Mr.Anderson',
+                  id: '4',
+                }),
+                mockMastoAPIUser({
+                  screen_name: 'paramedic',
+                  name: 'Dr.Clark',
+                  id: '5',
+                }),
+              ]),
+              {
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+
+        vi.stubGlobal('fetch', mockFetch)
+
+        const store = useUsersStore()
+        store.addNewUsers({ timestamp: 1, data: mockUser() })
+
+        const urlGroup = group === 'Friends' ? 'Following' : group
+        const us = store.users.get(userId)
+
+        await store[`fetch${group}`](userId)
+        expect(mockFetch).to.have.been.calledWith(
+          PUBLIC_API[`MASTODON_${urlGroup.toUpperCase()}_URL`](userId, {
+            limit: 20,
+            withRelationships: true,
+          }),
+          DEFAULT_OPTIONS('GET'),
+        )
+        expect(
+          store.relationshipsLists[group.toLowerCase()].get(us),
+        ).to.have.length(2)
+
+        await store[`fetch${group}`](userId)
+        expect(mockFetch).to.have.been.calledWith(
+          PUBLIC_API[`MASTODON_${urlGroup.toUpperCase()}_URL`](userId, {
+            maxId: '3',
+            limit: 20,
+            withRelationships: true,
+          }),
+          DEFAULT_OPTIONS('GET'),
+        )
+        expect(
+          store.relationshipsLists[group.toLowerCase()].get(us),
+        ).to.have.length(4)
+      })
+
+      it.each(['Mutes', 'Blocks'])('fetch%s', async (group) => {
+        const mockFetch = vi
+          .fn()
+          .mockResolvedValueOnce(
+            new Response(
+              JSON.stringify([
+                mockMastoAPIUser({
+                  screen_name: 'snake',
+                  name: 'John',
+                  id: '2',
+                }),
+                mockMastoAPIUser({
+                  screen_name: 'zero',
+                  name: 'David Oh',
+                  id: '3',
+                }),
+              ]),
+              {
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+          .mockResolvedValueOnce(
+            new Response(
+              JSON.stringify([
+                mockMastoAPIUser({
+                  screen_name: 'sigint',
+                  name: 'Mr.Anderson',
+                  id: '4',
+                }),
+                mockMastoAPIUser({
+                  screen_name: 'paramedic',
+                  name: 'Dr.Clark',
+                  id: '5',
+                }),
+              ]),
+              {
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+
+        vi.stubGlobal('fetch', mockFetch)
+
+        const store = useUsersStore()
+        store.addNewUsers({ timestamp: 1, data: mockUser() })
+
+        const us = store.users.get(userId)
+
+        store.currentUser = us
+        const ids = group === 'Mutes' ? 'muteIds' : 'blockIds'
+
+        await store[`fetch${group}`]({ reset: true })
+        expect(mockFetch).to.have.been.calledWith(
+          USER_API[`MASTODON_USER_${group.toUpperCase()}_URL`]({
+            withRelationships: true,
+          }),
+          DEFAULT_OPTIONS('GET'),
+        )
+        expect(us[ids]).to.have.length(2)
+
+        await store[`fetch${group}`]()
+        expect(mockFetch).to.have.been.calledWith(
+          USER_API[`MASTODON_USER_${group.toUpperCase()}_URL`]({
+            withRelationships: true,
+          }),
+          DEFAULT_OPTIONS('GET'),
+        )
+        expect(us[ids]).to.have.length(4)
+      })
+
+      it('fetchDomainMutes', async () => {
+        const mockFetch = vi.fn().mockResolvedValueOnce(
+          new Response(JSON.stringify(['example.com', 'example.org']), {
+            headers: { 'Content-Type': 'application/json' },
+          }),
+        )
+
+        vi.stubGlobal('fetch', mockFetch)
+
+        const store = useUsersStore()
+        store.addNewUsers({ timestamp: 1, data: mockUser() })
+
+        const us = store.users.get(userId)
+        store.currentUser = us
+
+        await store.fetchDomainMutes()
+
+        expect(mockFetch).to.have.been.calledWith(
+          USER_API.MASTODON_DOMAIN_BLOCKS_URL,
+          DEFAULT_OPTIONS('GET'),
+        )
+
+        expect(us.domainMutes).to.have.eql(
+          new Set(['example.com', 'example.org']),
+        )
+      })
+
+      it('fetchInLists', async () => {
+        const inLists = [
+          { exclusive: false, id: '1', title: 'Operatives' },
+          { exclusive: true, id: '2', title: 'Agents' },
+        ]
+        const mockFetch = vi.fn().mockResolvedValueOnce(
+          new Response(JSON.stringify(inLists), {
+            headers: { 'Content-Type': 'application/json' },
+          }),
+        )
+
+        vi.stubGlobal('fetch', mockFetch)
+
+        const store = useUsersStore()
+        store.addNewUsers({
+          timestamp: 1,
+          data: [
+            mockUser(),
+            { ...mockUser({ name: 'John', screen_name: 'snake', id: '2' }) },
+            { ...mockUser({ name: 'David Oh', screen_name: 'zero', id: '3' }) },
+          ],
+        })
+
+        const us = store.users.get(userId)
+        store.currentUser = us
+
+        await store.fetchUserInLists('2')
+
+        expect(mockFetch).to.have.been.calledWith(
+          USER_API.MASTODON_USER_IN_LISTS('2'),
+          DEFAULT_OPTIONS('GET'),
+        )
+
+        expect(store.users.get('2').inLists).to.have.eql(inLists)
+      })
+    })
+  })
+
+  describe('misc updates', () => {
+    it('updateUserAdminData', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+      const adminData = { is_active: true, tags: ['one', 'two'] }
+      store.updateUserAdminData(userId, adminData)
+
+      const userData = store.users.get(userId)
+      expect(userData.deactivated).to.eql(false)
+      expect(userData.tags).to.eql(new Set(['one', 'two']))
+    })
+
+    it('updateRight', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+      store.updateRight(userId, 'right1', true)
+      store.updateRight(userId, 'right2', false)
+
+      const userData = store.users.get(userId)
+      expect(userData.rights.right1).to.eql(true)
+      expect(userData.rights.right2).to.eql(false)
+    })
+
+    it('clearFollowLists', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+      const userData = store.users.get(userId)
+      store.relationshipsLists.friends.get(userData).add('2')
+      store.relationshipsLists.friends.get(userData).add('3')
+      store.relationshipsLists.followers.get(userData).add('4')
+      store.relationshipsLists.followers.get(userData).add('5')
+      store.clearFollowLists(userId)
+
+      expect(store.relationshipsLists.friends.get(userData)).to.have.length(0)
+      expect(store.relationshipsLists.followers.get(userData)).to.have.length(0)
+    })
+  })
+
+  describe('login/logout', () => {
+    describe('login', () => {
+      it('normal login', async () => {
+        vi.stubGlobal(
+          'fetch',
+          vi.fn().mockResolvedValueOnce(
+            new Response(JSON.stringify(mockMastoAPIUser()), {
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          ),
+        )
+
+        const spies = [
+          // Misc initialization
+          vi.spyOn(useSyncConfigStore(), 'initSyncConfig'),
+          vi.spyOn(useUserHighlightStore(), 'initUserHighlight'),
+          vi.spyOn(useInterfaceStore(), 'applyTheme'),
+          vi.spyOn(useInterfaceStore(), 'onLogin'),
+          vi.spyOn(useEmojiStore(), 'fetchEmoji'),
+
+          // Timeline / Notifications
+          vi.spyOn(useNotificationsStore(), 'activate'),
+          vi.spyOn(useTimelinesStore(), 'activatePersistents'),
+
+          // Fetchers
+          vi.spyOn(useChatsStore(), 'startFetching'),
+          vi.spyOn(useListsStore(), 'startFetching'),
+          vi.spyOn(useAnnouncementsStore(), 'startFetching'),
+          vi.spyOn(useBookmarkFoldersStore(), 'startFetching'),
+          vi.spyOn(useStreamingStore(), 'initSocket'),
+        ]
+
+        spies.forEach((spy) => {
+          spy.mockImplementation(async () => {
+            /* no-op */
+          })
+        })
+
+        useInstanceCapabilitiesStore().pleromaChatMessagesAvailable = true
+        useMergedConfigStore().mergedConfig = { useStreamingApi: true }
+
+        const store = useUsersStore()
+
+        // Adding some users to verify they are getting cleaned afterwards
+        store.addNewUsers({
+          data: [
+            mockUser(),
+            { ...mockUser({ name: 'John', screen_name: 'snake' }) },
+            { ...mockUser({ name: 'David Oh', screen_name: 'zero' }) },
+          ],
+          timestamp: 2000,
+        })
+
+        expect(store.loggedIn).to.eql(false)
+        await store.loginUser('ACCESS_TOKEN')
+        expect(store.loggedIn).to.eql(true)
+
+        // We should be in the store ourselves
+        expect(store.users).to.have.length(1)
+        expect(store.usersByName).to.have.length(1)
+        expect(store.usersByURL).to.have.length(1)
+        expect(store.relationships).to.have.length(0)
+        spies.forEach((spy, index) => {
+          expect(spy, `Spy ${index} has failed`).to.have.been.called
+        })
+      })
+
+      it('bad credentials', async () => {
+        vi.stubGlobal(
+          'fetch',
+          vi.fn().mockResolvedValueOnce(
+            new Response(JSON.stringify(mockMastoAPIUser()), {
+              status: 403,
+              statusText: 'Forbidden',
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          ),
+        )
+
+        const spies = [vi.spyOn(useOAuthStore(), 'clearToken')]
+
+        spies.forEach((spy) => {
+          spy.mockImplementation(async () => {
+            /* no-op */
+          })
+        })
+
+        const store = useUsersStore()
+        const exec = async () => {
+          await store.loginUser('ACCESS_TOKEN')
+        }
+
+        await expect(exec).rejects.to.throw(Error)
+
+        expect(store.loggedIn).to.eql(false)
+
+        spies.forEach((spy, index) => {
+          expect(spy, `Spy ${index} has failed`).to.have.been.called
+        })
+      })
+    })
+
+    describe('logout', () => {
+      it('normal logout', async () => {
+        const revokeApi = vi
+          .fn()
+          .mockResolvedValueOnce(
+            // Ensure APP
+            new Response(JSON.stringify('ok'), {
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          )
+          .mockResolvedValueOnce(
+            // Revoke Token
+            new Response(JSON.stringify('ok'), {
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          )
+
+        vi.stubGlobal('fetch', revokeApi)
+
+        const spies = [
+          // Misc initialization
+          /* 0 */ vi.spyOn(useStatusesStore(), 'resetStatuses'),
+          /* 1 */ vi.spyOn(useInterfaceStore(), 'onLogout'),
+
+          // Timeline / Notifications
+          /* 2 */ vi.spyOn(useNotificationsStore(), 'deactivate'),
+          /* 3 */ vi.spyOn(useNotificationsStore(), 'pause'),
+          /* 4 */ vi.spyOn(useNotificationsStore(), 'resume'),
+          /* 5 */ vi.spyOn(useTimelinesStore(), 'deactivateAll'),
+          /* 6 */ vi.spyOn(useTimelinesStore(), 'pauseAll'),
+          /* 7 */ vi.spyOn(useTimelinesStore(), 'resumeAll'),
+
+          // Fetchers
+          /* 8 */ vi.spyOn(useChatsStore(), 'resetChats'),
+          /* 9 */ vi.spyOn(useChatsStore(), 'stopFetching'),
+          /* 10 */ vi.spyOn(useListsStore(), 'stopFetching'),
+          /* 11 */ vi.spyOn(useAnnouncementsStore(), 'stopFetching'),
+          /* 12 */ vi.spyOn(useBookmarkFoldersStore(), 'stopFetching'),
+          /* 13 */ vi.spyOn(useStreamingStore(), 'stopSocket'),
+        ]
+
+        spies.forEach((spy) => {
+          spy.mockImplementation(async () => {
+            /* no-op */
+          })
+        })
+
+        useInstanceCapabilitiesStore().pleromaChatMessagesAvailable = true
+        useMergedConfigStore().mergedConfig = { useStreamingApi: true }
+
+        const store = useUsersStore()
+        store.currentUser = mockUser()
+
+        // Adding some users to verify they are getting cleaned afterwards
+        store.addNewUsers({
+          data: [
+            mockUser(),
+            {
+              ...mockUser({ name: 'John', screen_name: 'snake' }),
+              relationship: { id: userId, following: true },
+            },
+            { ...mockUser({ name: 'David Oh', screen_name: 'zero' }) },
+          ],
+          timestamp: 2000,
+        })
+        expect(store.loggedIn).to.eql(true)
+        await store.logout()
+        expect(store.loggedIn).to.eql(false)
+        expect(revokeApi).to.have.been.called
+        expect(store.users).to.have.length(0)
+        expect(store.usersByName).to.have.length(0)
+        expect(store.usersByURL).to.have.length(0)
+        expect(store.relationships).to.have.length(0)
+        spies.forEach((spy, index) => {
+          expect(spy, `Spy ${index} has failed`).to.have.been.called
+        })
+      })
+
+      it('failed logout', async () => {
+        const revokeApi = vi
+          .fn()
+          .mockResolvedValueOnce(
+            // Ensure APP
+            new Response(JSON.stringify('ok'), {
+              headers: { 'Content-Type': 'application/json' },
+            }),
+          )
+          .mockResolvedValueOnce(
+            // Revoke Token
+            new Response(
+              JSON.stringify('Oopsie-woopsie pleroma made a fucky-wucky'),
+              {
+                status: 500,
+                statusText: 'Internal Server Error',
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+
+        vi.stubGlobal('fetch', revokeApi)
+
+        // NOTE: Order is not checked for!
+        const spies = [
+          // ## PAUSE ##
+          // Timeline / Notifications
+          /* 0 */ vi.spyOn(useTimelinesStore(), 'pauseAll'),
+          /* 1 */ vi.spyOn(useNotificationsStore(), 'pause'),
+
+          // Fetchers (Pauseless)
+          /* 2 */ vi.spyOn(useListsStore(), 'stopFetching'),
+          /* 3 */ vi.spyOn(useChatsStore(), 'stopFetching'),
+          /* 4 */ vi.spyOn(useAnnouncementsStore(), 'stopFetching'),
+          /* 5 */ vi.spyOn(useBookmarkFoldersStore(), 'stopFetching'),
+
+          // ## RESUME ##
+          // Timeline / Notifications
+          /* 6 */ vi.spyOn(useNotificationsStore(), 'resume'),
+          /* 7 */ vi.spyOn(useTimelinesStore(), 'resumeAll'),
+
+          // Fetchers (Pauseless)
+          /* 8 */ vi.spyOn(useListsStore(), 'startFetching'),
+          /* 9 */ vi.spyOn(useChatsStore(), 'startFetching'),
+          /* 10 */ vi.spyOn(useAnnouncementsStore(), 'startFetching'),
+          /* 11 */ vi.spyOn(useBookmarkFoldersStore(), 'startFetching'),
+        ]
+
+        spies.forEach((spy) => {
+          spy.mockImplementation(async () => {
+            /* no-op */
+          })
+        })
+
+        useInstanceCapabilitiesStore().pleromaChatMessagesAvailable = true
+        useMergedConfigStore().mergedConfig = { useStreamingApi: true }
+
+        const store = useUsersStore()
+        store.currentUser = mockUser()
+
+        // Adding some users to verify they are getting cleaned afterwards
+        store.addNewUsers({
+          data: [
+            mockUser(),
+            {
+              ...mockUser({ name: 'John', screen_name: 'snake' }),
+              relationship: { id: userId, following: true },
+            },
+            { ...mockUser({ name: 'David Oh', screen_name: 'zero' }) },
+          ],
+          timestamp: 2000,
+        })
+        expect(store.loggedIn).to.eql(true)
+        await store.logout()
+        expect(store.loggedIn).to.eql(true)
+        expect(revokeApi).to.have.been.called
+        expect(store.users).to.have.length(1)
+        expect(store.usersByName).to.have.length(1)
+        expect(store.usersByURL).to.have.length(1)
+        expect(store.relationships).to.have.length(1)
+        spies.forEach((spy, index) => {
+          expect(spy, `Spy ${index} has failed`).to.have.been.called
+        })
+      })
+    })
+  })
+
+  describe('actions', () => {
+    describe('follow', () => {
+      beforeEach(() => {
+        vi.useFakeTimers()
+      })
+
+      afterEach(() => {
+        vi.useRealTimers()
+      })
+
+      it('instant follow case', async () => {
+        const followApi = vi.fn().mockResolvedValueOnce(
+          new Response(
+            JSON.stringify({
+              id: userId,
+              following: true,
+              requested: true,
+            }),
+            {
+              headers: { 'Content-Type': 'application/json' },
+            },
+          ),
+        )
+
+        vi.stubGlobal('fetch', followApi)
+        const store = useUsersStore()
+
+        await store.followUser(userId)
+        expect(followApi).to.have.been.called
+
+        expect(store.followPollers).to.have.length(0)
+        expect(store.followPollersAttempts).to.have.length(0)
+        expect(followApi).to.have.been.calledWith(
+          USER_API.MASTODON_FOLLOW_URL(userId),
+          {
+            body: '{}',
+            ...DEFAULT_OPTIONS(),
+          },
+        )
+      })
+
+      it('delayed follow case', async () => {
+        const followApi = vi
+          .fn()
+          .mockResolvedValueOnce(
+            // Follow
+            new Response(
+              JSON.stringify({
+                id: userId,
+                following: false,
+                requested: true,
+              }),
+              {
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+          .mockResolvedValueOnce(
+            // Check relationship
+            new Response(
+              JSON.stringify({
+                id: userId,
+                following: true,
+                requested: true,
+              }),
+              {
+                headers: { 'Content-Type': 'application/json' },
+              },
+            ),
+          )
+
+        vi.stubGlobal('fetch', followApi)
+
+        const store = useUsersStore()
+
+        await store.followUser(userId)
+        expect(followApi).to.have.been.called
+
+        expect(store.followPollers).to.have.length(1)
+        expect(store.followPollersAttempts).to.have.length(1)
+        expect(store.followPollersAttempts.get(userId)).to.eql(3)
+
+        await vi.runAllTimersAsync()
+        expect(followApi).to.have.been.called
+        expect(store.followPollers).to.have.length(0)
+        expect(store.followPollersAttempts).to.have.length(0)
+      })
+
+      it('unresolved follow case', async () => {
+        const followApi = vi.fn().mockResolvedValueOnce(
+          // Follow
+          new Response(
+            JSON.stringify({
+              id: userId,
+              following: false,
+              requested: true,
+            }),
+            {
+              headers: { 'Content-Type': 'application/json' },
+            },
+          ),
+        )
+
+        followApi // mockImplementation because we need to re-create Response
+          .mockImplementation(
+            () =>
+              // Check relationship
+              new Response(
+                JSON.stringify({
+                  id: userId,
+                  following: false,
+                  requested: true,
+                }),
+                {
+                  headers: { 'Content-Type': 'application/json' },
+                },
+              ),
+          )
+
+        vi.stubGlobal('fetch', followApi)
+
+        const store = useUsersStore()
+
+        await store.followUser(userId)
+        expect(store.followPollers).to.have.length(1)
+        expect(store.followPollersAttempts).to.have.length(1)
+        expect(store.followPollersAttempts.get(userId)).to.eql(3)
+
+        await vi.runAllTimersAsync()
+        expect(store.followPollersAttempts.get(userId)).to.eql(2)
+
+        await vi.runAllTimersAsync()
+        expect(store.followPollersAttempts.get(userId)).to.eql(1)
+
+        await vi.runAllTimersAsync()
+        expect(store.followPollers).to.have.length(0)
+        expect(store.followPollersAttempts).to.have.length(0)
+
+        expect(followApi).to.have.callCount(4) // 1 follow + 3 retries
+      })
+    })
+
+    it('unfollow', async () => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(
+          JSON.stringify({
+            id: userId,
+            following: false,
+            requested: true,
+          }),
+          {
+            headers: { 'Content-Type': 'application/json' },
+          },
+        ),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      await store.unfollowUser(userId)
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API.MASTODON_UNFOLLOW_URL(userId),
+        DEFAULT_OPTIONS(),
+      )
+    })
+
+    it('subscribe', async () => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(
+          JSON.stringify({
+            id: userId,
+            following: false,
+            requested: true,
+            subscribing: true,
+          }),
+          {
+            headers: { 'Content-Type': 'application/json' },
+          },
+        ),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      await store.subscribeUser(userId)
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API.MASTODON_FOLLOW_URL(userId),
+        {
+          body: JSON.stringify({ notify: true }),
+          ...DEFAULT_OPTIONS(),
+        },
+      )
+    })
+
+    it('unsubscribe', async () => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(
+          JSON.stringify({
+            id: userId,
+            following: false,
+            requested: true,
+            subscribing: false,
+          }),
+          {
+            headers: { 'Content-Type': 'application/json' },
+          },
+        ),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      await store.unsubscribeUser(userId)
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API.MASTODON_FOLLOW_URL(userId),
+        {
+          body: JSON.stringify({ notify: false }),
+          ...DEFAULT_OPTIONS(),
+        },
+      )
+    })
+
+    it('showReblogs', async () => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(
+          JSON.stringify({
+            id: userId,
+            following: false,
+            requested: true,
+            showing_reblogs: true,
+          }),
+          {
+            headers: { 'Content-Type': 'application/json' },
+          },
+        ),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      await store.showReblogs(userId)
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API.MASTODON_FOLLOW_URL(userId),
+        {
+          body: JSON.stringify({ reblogs: true }),
+          ...DEFAULT_OPTIONS(),
+        },
+      )
+    })
+
+    it('hideReblogs', async () => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(
+          JSON.stringify({
+            id: userId,
+            following: false,
+            requested: true,
+            showing_reblogs: false,
+          }),
+          {
+            headers: { 'Content-Type': 'application/json' },
+          },
+        ),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      await store.hideReblogs(userId)
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API.MASTODON_FOLLOW_URL(userId),
+        {
+          body: JSON.stringify({ reblogs: false }),
+          ...DEFAULT_OPTIONS(),
+        },
+      )
+    })
+
+    it.each([
+      'unmute',
+      'unblock',
+      'removeUserFromFollowers',
+    ])('%s', async (action) => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(JSON.stringify({ id: userId }), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      const { storeAction, apiUrl } = actionKeys(action)
+      await store[storeAction](userId)
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API[apiUrl](userId),
+        DEFAULT_OPTIONS(),
+      )
+    })
+
+    describe.each(['mute', 'block'])('%s', (action) => {
+      it('normal', async () => {
+        const mockFetch = vi.fn().mockResolvedValueOnce(
+          new Response(JSON.stringify({ id: userId }), {
+            headers: { 'Content-Type': 'application/json' },
+          }),
+        )
+
+        vi.stubGlobal('fetch', mockFetch)
+
+        vi.spyOn(useStatusesStore(), 'wipeUserStatuses').mockImplementation(
+          async () => {
+            /* no-op */
+          },
+        )
+
+        vi.spyOn(useTimelinesStore(), 'wipeStatuses').mockImplementation(
+          async () => {
+            /* no-op */
+          },
+        )
+
+        vi.spyOn(useNotificationsStore(), 'wipeStatuses').mockImplementation(
+          async () => {
+            /* no-op */
+          },
+        )
+
+        const store = useUsersStore()
+        const { storeAction, apiUrl } = actionKeys(action)
+        await store[storeAction](userId)
+
+        expect(mockFetch).to.have.been.calledWith(USER_API[apiUrl](userId), {
+          body: '{}',
+          ...DEFAULT_OPTIONS(),
+        })
+      })
+
+      it('with expiration', async () => {
+        const mockFetch = vi.fn().mockResolvedValueOnce(
+          new Response(JSON.stringify({ id: userId }), {
+            headers: { 'Content-Type': 'application/json' },
+          }),
+        )
+
+        vi.stubGlobal('fetch', mockFetch)
+
+        vi.spyOn(useStatusesStore(), 'wipeUserStatuses').mockImplementation(
+          async () => {
+            /* no-op */
+          },
+        )
+
+        vi.spyOn(useTimelinesStore(), 'wipeStatuses').mockImplementation(
+          async () => {
+            /* no-op */
+          },
+        )
+
+        vi.spyOn(useNotificationsStore(), 'wipeStatuses').mockImplementation(
+          async () => {
+            /* no-op */
+          },
+        )
+
+        const store = useUsersStore()
+        const { storeAction, apiUrl } = actionKeys(action)
+        await store[storeAction](userId, 20)
+        const argument = action === 'mute' ? 'expires_in' : 'duration'
+
+        expect(mockFetch).to.have.been.calledWith(USER_API[apiUrl](userId), {
+          body: `{"${argument}":20}`,
+          ...DEFAULT_OPTIONS(),
+        })
+      })
+    })
+
+    it.each(['mute', 'unmute'])('%s domain', async (action) => {
+      const mockFetch = vi.fn().mockResolvedValueOnce(
+        new Response(JSON.stringify({ id: userId }), {
+          headers: { 'Content-Type': 'application/json' },
+        }),
+      )
+
+      vi.stubGlobal('fetch', mockFetch)
+
+      const store = useUsersStore()
+      store.currentUser = mockUser()
+      store.currentUser.domainMutes = new Set()
+      if (action === 'unmute') {
+        store.currentUser.domainMutes.add('example.com')
+      }
+      await store[action + 'Domain']('example.com')
+
+      expect(mockFetch).to.have.been.calledWith(
+        USER_API.MASTODON_DOMAIN_BLOCKS_URL,
+        {
+          body: JSON.stringify({ domain: 'example.com' }),
+          ...DEFAULT_OPTIONS(action === 'mute' ? 'POST' : 'DELETE'),
+        },
+      )
+
+      if (action === 'mute') {
+        expect(store.currentUser.domainMutes).to.include('example.com')
+      } else {
+        expect(store.currentUser.domainMutes).to.not.include('example.com')
+      }
+    })
+
+    it.each([
+      'muteDomain',
+      'unmuteDomain',
+      'muteUser',
+      'unmuteUser',
+      'blockUser',
+      'unblockUser',
+    ])('%ss', async (action) => {
+      const store = useUsersStore()
+      store[action] = vi.fn().mockResolvedValue(async () => {
+        /* no-op */
+      })
+      store[action + 's'](['1', '2', '3'])
+      expect(store[action]).to.have.been.calledWith('1')
+      expect(store[action]).to.have.been.calledWith('2')
+      expect(store[action]).to.have.been.calledWith('3')
+    })
+  })
+
+  describe('getters', () => {
+    it('relationship returns a placeholder if relationship info is missing', () => {
+      const store = useUsersStore()
+
+      expect(store.relationship(userId)).to.eql({ id: userId, loading: true })
+    })
+
+    it('relationship returns a placeholder if relationship info is missing while user is present', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+
+      expect(store.relationship(userId)).to.eql({ id: userId, loading: true })
+    })
+
+    it('findUser returns user with matching id', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+
+      expect(store.findUser(userId).id).to.eql(userId)
+    })
+
+    it('findUserByName returns user with matching screen_name', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+
+      expect(store.findUserByName(mockUser().screen_name).id).to.eql(userId)
+    })
+
+    it('findUserByName returns user with matching url', () => {
+      const store = useUsersStore()
+      store.addNewUsers({ data: [mockUser()], timestamp: 1 })
+
+      expect(store.findUserByUrl(mockUser().url).id).to.eql(userId)
+    })
+  })
+})