Merge pull request #2519 from ClearlyClaire/glitch-soc/immutable-record-redux

Use Immutable `Record` for accounts in Redux state

app/javascript/flavours/glitch/actions/account_notes.ts

@@ -1,3 +1,4 @@
+import type { ApiRelationshipJSON } from 'flavours/glitch/api_types/relationships';
 import { createAppAsyncThunk } from 'flavours/glitch/store/typed_functions';
 
 import api from '../api';
@@ -5,8 +6,7 @@ import api from '../api';
 export const submitAccountNote = createAppAsyncThunk(
   'account_note/submit',
   async (args: { id: string; value: string }, { getState }) => {
-    // TODO: replace `unknown` with `ApiRelationshipJSON` when it is merged
+    const response = await api(getState).post<ApiRelationshipJSON>(
-    const response = await api(getState).post<unknown>(
       `/api/v1/accounts/${args.id}/note`,
       {
         comment: args.value,

app/javascript/flavours/glitch/actions/accounts.js

@@ -1,5 +1,15 @@
 import api, { getLinks } from '../api';
 
+import {
+  followAccountSuccess, unfollowAccountSuccess,
+  authorizeFollowRequestSuccess, rejectFollowRequestSuccess,
+  followAccountRequest, followAccountFail,
+  unfollowAccountRequest, unfollowAccountFail,
+  muteAccountSuccess, unmuteAccountSuccess,
+  blockAccountSuccess, unblockAccountSuccess,
+  pinAccountSuccess, unpinAccountSuccess,
+  fetchRelationshipsSuccess,
+} from './accounts_typed';
 import { importFetchedAccount, importFetchedAccounts } from './importer';
 
 export const ACCOUNT_FETCH_REQUEST = 'ACCOUNT_FETCH_REQUEST';
@@ -10,36 +20,22 @@ export const ACCOUNT_LOOKUP_REQUEST = 'ACCOUNT_LOOKUP_REQUEST';
 export const ACCOUNT_LOOKUP_SUCCESS = 'ACCOUNT_LOOKUP_SUCCESS';
 export const ACCOUNT_LOOKUP_FAIL    = 'ACCOUNT_LOOKUP_FAIL';
 
-export const ACCOUNT_FOLLOW_REQUEST = 'ACCOUNT_FOLLOW_REQUEST';
-export const ACCOUNT_FOLLOW_SUCCESS = 'ACCOUNT_FOLLOW_SUCCESS';
-export const ACCOUNT_FOLLOW_FAIL    = 'ACCOUNT_FOLLOW_FAIL';
-
-export const ACCOUNT_UNFOLLOW_REQUEST = 'ACCOUNT_UNFOLLOW_REQUEST';
-export const ACCOUNT_UNFOLLOW_SUCCESS = 'ACCOUNT_UNFOLLOW_SUCCESS';
-export const ACCOUNT_UNFOLLOW_FAIL    = 'ACCOUNT_UNFOLLOW_FAIL';
-
 export const ACCOUNT_BLOCK_REQUEST = 'ACCOUNT_BLOCK_REQUEST';
-export const ACCOUNT_BLOCK_SUCCESS = 'ACCOUNT_BLOCK_SUCCESS';
 export const ACCOUNT_BLOCK_FAIL    = 'ACCOUNT_BLOCK_FAIL';
 
 export const ACCOUNT_UNBLOCK_REQUEST = 'ACCOUNT_UNBLOCK_REQUEST';
-export const ACCOUNT_UNBLOCK_SUCCESS = 'ACCOUNT_UNBLOCK_SUCCESS';
 export const ACCOUNT_UNBLOCK_FAIL    = 'ACCOUNT_UNBLOCK_FAIL';
 
 export const ACCOUNT_MUTE_REQUEST = 'ACCOUNT_MUTE_REQUEST';
-export const ACCOUNT_MUTE_SUCCESS = 'ACCOUNT_MUTE_SUCCESS';
 export const ACCOUNT_MUTE_FAIL    = 'ACCOUNT_MUTE_FAIL';
 
 export const ACCOUNT_UNMUTE_REQUEST = 'ACCOUNT_UNMUTE_REQUEST';
-export const ACCOUNT_UNMUTE_SUCCESS = 'ACCOUNT_UNMUTE_SUCCESS';
 export const ACCOUNT_UNMUTE_FAIL    = 'ACCOUNT_UNMUTE_FAIL';
 
 export const ACCOUNT_PIN_REQUEST = 'ACCOUNT_PIN_REQUEST';
-export const ACCOUNT_PIN_SUCCESS = 'ACCOUNT_PIN_SUCCESS';
 export const ACCOUNT_PIN_FAIL    = 'ACCOUNT_PIN_FAIL';
 
 export const ACCOUNT_UNPIN_REQUEST = 'ACCOUNT_UNPIN_REQUEST';
-export const ACCOUNT_UNPIN_SUCCESS = 'ACCOUNT_UNPIN_SUCCESS';
 export const ACCOUNT_UNPIN_FAIL    = 'ACCOUNT_UNPIN_FAIL';
 
 export const FOLLOWERS_FETCH_REQUEST = 'FOLLOWERS_FETCH_REQUEST';
@@ -59,7 +55,6 @@ export const FOLLOWING_EXPAND_SUCCESS = 'FOLLOWING_EXPAND_SUCCESS';
 export const FOLLOWING_EXPAND_FAIL    = 'FOLLOWING_EXPAND_FAIL';
 
 export const RELATIONSHIPS_FETCH_REQUEST = 'RELATIONSHIPS_FETCH_REQUEST';
-export const RELATIONSHIPS_FETCH_SUCCESS = 'RELATIONSHIPS_FETCH_SUCCESS';
 export const RELATIONSHIPS_FETCH_FAIL    = 'RELATIONSHIPS_FETCH_FAIL';
 
 export const FOLLOW_REQUESTS_FETCH_REQUEST = 'FOLLOW_REQUESTS_FETCH_REQUEST';
@@ -91,9 +86,10 @@ export const PINNED_ACCOUNTS_EDITOR_SUGGESTIONS_CHANGE = 'PINNED_ACCOUNTS_EDITOR
 
 export const PINNED_ACCOUNTS_EDITOR_RESET = 'PINNED_ACCOUNTS_EDITOR_RESET';
 
-
 export const ACCOUNT_REVEAL = 'ACCOUNT_REVEAL';
 
+export * from './accounts_typed';
+
 export function fetchAccount(id) {
   return (dispatch, getState) => {
     dispatch(fetchRelationships([id]));
@@ -168,12 +164,12 @@ export function followAccount(id, options = { reblogs: true }) {
     const alreadyFollowing = getState().getIn(['relationships', id, 'following']);
     const locked = getState().getIn(['accounts', id, 'locked'], false);
 
-    dispatch(followAccountRequest(id, locked));
+    dispatch(followAccountRequest({ id, locked }));
 
     api(getState).post(`/api/v1/accounts/${id}/follow`, options).then(response => {
-      dispatch(followAccountSuccess(response.data, alreadyFollowing));
+      dispatch(followAccountSuccess({relationship: response.data, alreadyFollowing}));
     }).catch(error => {
-      dispatch(followAccountFail(error, locked));
+      dispatch(followAccountFail({ id, error, locked }));
     });
   };
 }
@@ -183,74 +179,22 @@ export function unfollowAccount(id) {
     dispatch(unfollowAccountRequest(id));
 
     api(getState).post(`/api/v1/accounts/${id}/unfollow`).then(response => {
-      dispatch(unfollowAccountSuccess(response.data, getState().get('statuses')));
+      dispatch(unfollowAccountSuccess({relationship: response.data, statuses: getState().get('statuses')}));
     }).catch(error => {
-      dispatch(unfollowAccountFail(error));
+      dispatch(unfollowAccountFail({ id, error }));
     });
   };
 }
 
-export function followAccountRequest(id, locked) {
-  return {
-    type: ACCOUNT_FOLLOW_REQUEST,
-    id,
-    locked,
-    skipLoading: true,
-  };
-}
-
-export function followAccountSuccess(relationship, alreadyFollowing) {
-  return {
-    type: ACCOUNT_FOLLOW_SUCCESS,
-    relationship,
-    alreadyFollowing,
-    skipLoading: true,
-  };
-}
-
-export function followAccountFail(error, locked) {
-  return {
-    type: ACCOUNT_FOLLOW_FAIL,
-    error,
-    locked,
-    skipLoading: true,
-  };
-}
-
-export function unfollowAccountRequest(id) {
-  return {
-    type: ACCOUNT_UNFOLLOW_REQUEST,
-    id,
-    skipLoading: true,
-  };
-}
-
-export function unfollowAccountSuccess(relationship, statuses) {
-  return {
-    type: ACCOUNT_UNFOLLOW_SUCCESS,
-    relationship,
-    statuses,
-    skipLoading: true,
-  };
-}
-
-export function unfollowAccountFail(error) {
-  return {
-    type: ACCOUNT_UNFOLLOW_FAIL,
-    error,
-    skipLoading: true,
-  };
-}
-
 export function blockAccount(id) {
   return (dispatch, getState) => {
     dispatch(blockAccountRequest(id));
 
     api(getState).post(`/api/v1/accounts/${id}/block`).then(response => {
       // Pass in entire statuses map so we can use it to filter stuff in different parts of the reducers
-      dispatch(blockAccountSuccess(response.data, getState().get('statuses')));
+      dispatch(blockAccountSuccess({ relationship: response.data, statuses: getState().get('statuses') }));
     }).catch(error => {
-      dispatch(blockAccountFail(id, error));
+      dispatch(blockAccountFail({ id, error }));
     });
   };
 }
@@ -260,9 +204,9 @@ export function unblockAccount(id) {
     dispatch(unblockAccountRequest(id));
 
     api(getState).post(`/api/v1/accounts/${id}/unblock`).then(response => {
-      dispatch(unblockAccountSuccess(response.data));
+      dispatch(unblockAccountSuccess({ relationship: response.data }));
     }).catch(error => {
-      dispatch(unblockAccountFail(id, error));
+      dispatch(unblockAccountFail({ id, error }));
     });
   };
 }
@@ -273,15 +217,6 @@ export function blockAccountRequest(id) {
     id,
   };
 }
-
-export function blockAccountSuccess(relationship, statuses) {
-  return {
-    type: ACCOUNT_BLOCK_SUCCESS,
-    relationship,
-    statuses,
-  };
-}
-
 export function blockAccountFail(error) {
   return {
     type: ACCOUNT_BLOCK_FAIL,
@@ -296,13 +231,6 @@ export function unblockAccountRequest(id) {
   };
 }
 
-export function unblockAccountSuccess(relationship) {
-  return {
-    type: ACCOUNT_UNBLOCK_SUCCESS,
-    relationship,
-  };
-}
-
 export function unblockAccountFail(error) {
   return {
     type: ACCOUNT_UNBLOCK_FAIL,
@@ -317,9 +245,9 @@ export function muteAccount(id, notifications, duration=0) {
 
     api(getState).post(`/api/v1/accounts/${id}/mute`, { notifications, duration }).then(response => {
       // Pass in entire statuses map so we can use it to filter stuff in different parts of the reducers
-      dispatch(muteAccountSuccess(response.data, getState().get('statuses')));
+      dispatch(muteAccountSuccess({ relationship: response.data, statuses: getState().get('statuses') }));
     }).catch(error => {
-      dispatch(muteAccountFail(id, error));
+      dispatch(muteAccountFail({ id, error }));
     });
   };
 }
@@ -329,9 +257,9 @@ export function unmuteAccount(id) {
     dispatch(unmuteAccountRequest(id));
 
     api(getState).post(`/api/v1/accounts/${id}/unmute`).then(response => {
-      dispatch(unmuteAccountSuccess(response.data));
+      dispatch(unmuteAccountSuccess({ relationship: response.data }));
     }).catch(error => {
-      dispatch(unmuteAccountFail(id, error));
+      dispatch(unmuteAccountFail({ id, error }));
     });
   };
 }
@@ -343,14 +271,6 @@ export function muteAccountRequest(id) {
   };
 }
 
-export function muteAccountSuccess(relationship, statuses) {
-  return {
-    type: ACCOUNT_MUTE_SUCCESS,
-    relationship,
-    statuses,
-  };
-}
-
 export function muteAccountFail(error) {
   return {
     type: ACCOUNT_MUTE_FAIL,
@@ -365,13 +285,6 @@ export function unmuteAccountRequest(id) {
   };
 }
 
-export function unmuteAccountSuccess(relationship) {
-  return {
-    type: ACCOUNT_UNMUTE_SUCCESS,
-    relationship,
-  };
-}
-
 export function unmuteAccountFail(error) {
   return {
     type: ACCOUNT_UNMUTE_FAIL,
@@ -568,7 +481,7 @@ export function fetchRelationships(accountIds) {
     dispatch(fetchRelationshipsRequest(newAccountIds));
 
     api(getState).get(`/api/v1/accounts/relationships?with_suspended=true&${newAccountIds.map(id => `id[]=${id}`).join('&')}`).then(response => {
-      dispatch(fetchRelationshipsSuccess(response.data));
+      dispatch(fetchRelationshipsSuccess({ relationships: response.data }));
     }).catch(error => {
       dispatch(fetchRelationshipsFail(error));
     });
@@ -583,14 +496,6 @@ export function fetchRelationshipsRequest(ids) {
   };
 }
 
-export function fetchRelationshipsSuccess(relationships) {
-  return {
-    type: RELATIONSHIPS_FETCH_SUCCESS,
-    relationships,
-    skipLoading: true,
-  };
-}
-
 export function fetchRelationshipsFail(error) {
   return {
     type: RELATIONSHIPS_FETCH_FAIL,
@@ -678,7 +583,7 @@ export function authorizeFollowRequest(id) {
 
     api(getState)
       .post(`/api/v1/follow_requests/${id}/authorize`)
-      .then(() => dispatch(authorizeFollowRequestSuccess(id)))
+      .then(() => dispatch(authorizeFollowRequestSuccess({ id })))
       .catch(error => dispatch(authorizeFollowRequestFail(id, error)));
   };
 }
@@ -690,13 +595,6 @@ export function authorizeFollowRequestRequest(id) {
   };
 }
 
-export function authorizeFollowRequestSuccess(id) {
-  return {
-    type: FOLLOW_REQUEST_AUTHORIZE_SUCCESS,
-    id,
-  };
-}
-
 export function authorizeFollowRequestFail(id, error) {
   return {
     type: FOLLOW_REQUEST_AUTHORIZE_FAIL,
@@ -712,7 +610,7 @@ export function rejectFollowRequest(id) {
 
     api(getState)
       .post(`/api/v1/follow_requests/${id}/reject`)
-      .then(() => dispatch(rejectFollowRequestSuccess(id)))
+      .then(() => dispatch(rejectFollowRequestSuccess({ id })))
       .catch(error => dispatch(rejectFollowRequestFail(id, error)));
   };
 }
@@ -724,13 +622,6 @@ export function rejectFollowRequestRequest(id) {
   };
 }
 
-export function rejectFollowRequestSuccess(id) {
-  return {
-    type: FOLLOW_REQUEST_REJECT_SUCCESS,
-    id,
-  };
-}
-
 export function rejectFollowRequestFail(id, error) {
   return {
     type: FOLLOW_REQUEST_REJECT_FAIL,
@@ -744,7 +635,7 @@ export function pinAccount(id) {
     dispatch(pinAccountRequest(id));
 
     api(getState).post(`/api/v1/accounts/${id}/pin`).then(response => {
-      dispatch(pinAccountSuccess(response.data));
+      dispatch(pinAccountSuccess({ relationship: response.data }));
     }).catch(error => {
       dispatch(pinAccountFail(error));
     });
@@ -756,7 +647,7 @@ export function unpinAccount(id) {
     dispatch(unpinAccountRequest(id));
 
     api(getState).post(`/api/v1/accounts/${id}/unpin`).then(response => {
-      dispatch(unpinAccountSuccess(response.data));
+      dispatch(unpinAccountSuccess({ relationship: response.data }));
     }).catch(error => {
       dispatch(unpinAccountFail(error));
     });
@@ -770,13 +661,6 @@ export function pinAccountRequest(id) {
   };
 }
 
-export function pinAccountSuccess(relationship) {
-  return {
-    type: ACCOUNT_PIN_SUCCESS,
-    relationship,
-  };
-}
-
 export function pinAccountFail(error) {
   return {
     type: ACCOUNT_PIN_FAIL,
@@ -791,13 +675,6 @@ export function unpinAccountRequest(id) {
   };
 }
 
-export function unpinAccountSuccess(relationship) {
-  return {
-    type: ACCOUNT_UNPIN_SUCCESS,
-    relationship,
-  };
-}
-
 export function unpinAccountFail(error) {
   return {
     type: ACCOUNT_UNPIN_FAIL,
@@ -805,11 +682,6 @@ export function unpinAccountFail(error) {
   };
 }
 
-export const revealAccount = id => ({
-  type: ACCOUNT_REVEAL,
-  id,
-});
-
 export function fetchPinnedAccounts() {
   return (dispatch, getState) => {
     dispatch(fetchPinnedAccountsRequest());

app/javascript/flavours/glitch/actions/accounts_typed.ts

@@ -0,0 +1,97 @@
+import { createAction } from '@reduxjs/toolkit';
+
+import type { ApiAccountJSON } from 'flavours/glitch/api_types/accounts';
+import type { ApiRelationshipJSON } from 'flavours/glitch/api_types/relationships';
+
+export const revealAccount = createAction<{
+  id: string;
+}>('accounts/revealAccount');
+
+export const importAccounts = createAction<{ accounts: ApiAccountJSON[] }>(
+  'accounts/importAccounts',
+);
+
+function actionWithSkipLoadingTrue<Args extends object>(args: Args) {
+  return {
+    payload: {
+      ...args,
+      skipLoading: true,
+    },
+  };
+}
+
+export const followAccountSuccess = createAction(
+  'accounts/followAccount/SUCCESS',
+  actionWithSkipLoadingTrue<{
+    relationship: ApiRelationshipJSON;
+    alreadyFollowing: boolean;
+  }>,
+);
+
+export const unfollowAccountSuccess = createAction(
+  'accounts/unfollowAccount/SUCCESS',
+  actionWithSkipLoadingTrue<{
+    relationship: ApiRelationshipJSON;
+    statuses: unknown;
+    alreadyFollowing?: boolean;
+  }>,
+);
+
+export const authorizeFollowRequestSuccess = createAction<{ id: string }>(
+  'accounts/followRequestAuthorize/SUCCESS',
+);
+
+export const rejectFollowRequestSuccess = createAction<{ id: string }>(
+  'accounts/followRequestReject/SUCCESS',
+);
+
+export const followAccountRequest = createAction(
+  'accounts/follow/REQUEST',
+  actionWithSkipLoadingTrue<{ id: string; locked: boolean }>,
+);
+
+export const followAccountFail = createAction(
+  'accounts/follow/FAIL',
+  actionWithSkipLoadingTrue<{ id: string; error: string; locked: boolean }>,
+);
+
+export const unfollowAccountRequest = createAction(
+  'accounts/unfollow/REQUEST',
+  actionWithSkipLoadingTrue<{ id: string }>,
+);
+
+export const unfollowAccountFail = createAction(
+  'accounts/unfollow/FAIL',
+  actionWithSkipLoadingTrue<{ id: string; error: string }>,
+);
+
+export const blockAccountSuccess = createAction<{
+  relationship: ApiRelationshipJSON;
+  statuses: unknown;
+}>('accounts/block/SUCCESS');
+
+export const unblockAccountSuccess = createAction<{
+  relationship: ApiRelationshipJSON;
+}>('accounts/unblock/SUCCESS');
+
+export const muteAccountSuccess = createAction<{
+  relationship: ApiRelationshipJSON;
+  statuses: unknown;
+}>('accounts/mute/SUCCESS');
+
+export const unmuteAccountSuccess = createAction<{
+  relationship: ApiRelationshipJSON;
+}>('accounts/unmute/SUCCESS');
+
+export const pinAccountSuccess = createAction<{
+  relationship: ApiRelationshipJSON;
+}>('accounts/pin/SUCCESS');
+
+export const unpinAccountSuccess = createAction<{
+  relationship: ApiRelationshipJSON;
+}>('accounts/unpin/SUCCESS');
+
+export const fetchRelationshipsSuccess = createAction(
+  'relationships/fetch/SUCCESS',
+  actionWithSkipLoadingTrue<{ relationships: ApiRelationshipJSON[] }>,
+);

app/javascript/flavours/glitch/actions/domain_blocks.js

@@ -1,11 +1,13 @@
 import api, { getLinks } from '../api';
 
+import { blockDomainSuccess, unblockDomainSuccess } from "./domain_blocks_typed";
+
+export * from "./domain_blocks_typed";
+
 export const DOMAIN_BLOCK_REQUEST = 'DOMAIN_BLOCK_REQUEST';
-export const DOMAIN_BLOCK_SUCCESS = 'DOMAIN_BLOCK_SUCCESS';
 export const DOMAIN_BLOCK_FAIL    = 'DOMAIN_BLOCK_FAIL';
 
 export const DOMAIN_UNBLOCK_REQUEST = 'DOMAIN_UNBLOCK_REQUEST';
-export const DOMAIN_UNBLOCK_SUCCESS = 'DOMAIN_UNBLOCK_SUCCESS';
 export const DOMAIN_UNBLOCK_FAIL    = 'DOMAIN_UNBLOCK_FAIL';
 
 export const DOMAIN_BLOCKS_FETCH_REQUEST = 'DOMAIN_BLOCKS_FETCH_REQUEST';
@@ -24,7 +26,7 @@ export function blockDomain(domain) {
       const at_domain = '@' + domain;
       const accounts = getState().get('accounts').filter(item => item.get('acct').endsWith(at_domain)).valueSeq().map(item => item.get('id'));
 
-      dispatch(blockDomainSuccess(domain, accounts));
+      dispatch(blockDomainSuccess({ domain, accounts }));
     }).catch(err => {
       dispatch(blockDomainFail(domain, err));
     });
@@ -38,14 +40,6 @@ export function blockDomainRequest(domain) {
   };
 }
 
-export function blockDomainSuccess(domain, accounts) {
-  return {
-    type: DOMAIN_BLOCK_SUCCESS,
-    domain,
-    accounts,
-  };
-}
-
 export function blockDomainFail(domain, error) {
   return {
     type: DOMAIN_BLOCK_FAIL,
@@ -61,7 +55,7 @@ export function unblockDomain(domain) {
     api(getState).delete('/api/v1/domain_blocks', { params: { domain } }).then(() => {
       const at_domain = '@' + domain;
       const accounts = getState().get('accounts').filter(item => item.get('acct').endsWith(at_domain)).valueSeq().map(item => item.get('id'));
-      dispatch(unblockDomainSuccess(domain, accounts));
+      dispatch(unblockDomainSuccess({ domain, accounts }));
     }).catch(err => {
       dispatch(unblockDomainFail(domain, err));
     });
@@ -75,14 +69,6 @@ export function unblockDomainRequest(domain) {
   };
 }
 
-export function unblockDomainSuccess(domain, accounts) {
-  return {
-    type: DOMAIN_UNBLOCK_SUCCESS,
-    domain,
-    accounts,
-  };
-}
-
 export function unblockDomainFail(domain, error) {
   return {
     type: DOMAIN_UNBLOCK_FAIL,

app/javascript/flavours/glitch/actions/domain_blocks_typed.ts

@@ -0,0 +1,13 @@
+import { createAction } from '@reduxjs/toolkit';
+
+import type { Account } from 'flavours/glitch/models/account';
+
+export const blockDomainSuccess = createAction<{
+  domain: string;
+  accounts: Account[];
+}>('domain_blocks/block/SUCCESS');
+
+export const unblockDomainSuccess = createAction<{
+  domain: string;
+  accounts: Account[];
+}>('domain_blocks/unblock/SUCCESS');

app/javascript/flavours/glitch/actions/importer/index.js

@@ -1,7 +1,7 @@
-import { normalizeAccount, normalizeStatus, normalizePoll } from './normalizer';
+import { importAccounts } from '../accounts_typed';
+
+import { normalizeStatus, normalizePoll } from './normalizer';
 
-export const ACCOUNT_IMPORT  = 'ACCOUNT_IMPORT';
-export const ACCOUNTS_IMPORT = 'ACCOUNTS_IMPORT';
 export const STATUS_IMPORT   = 'STATUS_IMPORT';
 export const STATUSES_IMPORT = 'STATUSES_IMPORT';
 export const POLLS_IMPORT    = 'POLLS_IMPORT';
@@ -13,14 +13,6 @@ function pushUnique(array, object) {
   }
 }
 
-export function importAccount(account) {
-  return { type: ACCOUNT_IMPORT, account };
-}
-
-export function importAccounts(accounts) {
-  return { type: ACCOUNTS_IMPORT, accounts };
-}
-
 export function importStatus(status) {
   return { type: STATUS_IMPORT, status };
 }
@@ -45,7 +37,7 @@ export function importFetchedAccounts(accounts) {
   const normalAccounts = [];
 
   function processAccount(account) {
-    pushUnique(normalAccounts, normalizeAccount(account));
+    pushUnique(normalAccounts, account);
 
     if (account.moved) {
       processAccount(account.moved);
@@ -54,7 +46,7 @@ export function importFetchedAccounts(accounts) {
 
   accounts.forEach(processAccount);
 
-  return importAccounts(normalAccounts);
+  return importAccounts({ accounts: normalAccounts });
 }
 
 export function importFetchedStatus(status) {

app/javascript/flavours/glitch/actions/importer/normalizer.js

@@ -2,7 +2,6 @@ import escapeTextContentForBrowser from 'escape-html';
 
 import emojify from '../../features/emoji/emoji';
 import { autoHideCW } from '../../utils/content_warning';
-import { unescapeHTML } from '../../utils/html';
 
 const domParser = new DOMParser();
 
@@ -17,32 +16,6 @@ export function searchTextFromRawStatus (status) {
   return domParser.parseFromString(searchContent, 'text/html').documentElement.textContent;
 }
 
-export function normalizeAccount(account) {
-  account = { ...account };
-
-  const emojiMap = makeEmojiMap(account.emojis);
-  const displayName = account.display_name.trim().length === 0 ? account.username : account.display_name;
-
-  account.display_name_html = emojify(escapeTextContentForBrowser(displayName), emojiMap);
-  account.note_emojified = emojify(account.note, emojiMap);
-  account.note_plain = unescapeHTML(account.note);
-
-  if (account.fields) {
-    account.fields = account.fields.map(pair => ({
-      ...pair,
-      name_emojified: emojify(escapeTextContentForBrowser(pair.name), emojiMap),
-      value_emojified: emojify(pair.value, emojiMap),
-      value_plain: unescapeHTML(pair.value),
-    }));
-  }
-
-  if (account.moved) {
-    account.moved = account.moved.id;
-  }
-
-  return account;
-}
-
 export function normalizeFilterResult(result) {
   const normalResult = { ...result };
 

app/javascript/flavours/glitch/actions/notifications.js

@@ -18,10 +18,12 @@ import {
   importFetchedStatuses,
 } from './importer';
 import { submitMarkers } from './markers';
+import { notificationsUpdate } from "./notifications_typed";
 import { register as registerPushNotifications } from './push_notifications';
 import { saveSettings } from './settings';
 
-export const NOTIFICATIONS_UPDATE      = 'NOTIFICATIONS_UPDATE';
+export * from "./notifications_typed";
+
 export const NOTIFICATIONS_UPDATE_NOOP = 'NOTIFICATIONS_UPDATE_NOOP';
 
 // tracking the notif cleaning request
@@ -107,12 +109,8 @@ export function updateNotifications(notification, intlMessages, intlLocale) {
         dispatch(importFetchedAccount(notification.report.target_account));
       }
 
-      dispatch({
+
-        type: NOTIFICATIONS_UPDATE,
+      dispatch(notificationsUpdate({ notification, preferPendingItems, playSound: playSound && !filtered}));
-        notification,
-        usePendingItems: preferPendingItems,
-        meta: (playSound && !filtered) ? { sound: 'boop' } : undefined,
-      });
 
       fetchRelatedRelationships(dispatch, [notification]);
     } else if (playSound && !filtered) {

app/javascript/flavours/glitch/actions/notifications_typed.ts

@@ -0,0 +1,23 @@
+import { createAction } from '@reduxjs/toolkit';
+
+import type { ApiAccountJSON } from '../api_types/accounts';
+// To be replaced once ApiNotificationJSON type exists
+interface FakeApiNotificationJSON {
+  type: string;
+  account: ApiAccountJSON;
+}
+
+export const notificationsUpdate = createAction(
+  'notifications/update',
+  ({
+    playSound,
+    ...args
+  }: {
+    notification: FakeApiNotificationJSON;
+    usePendingItems: boolean;
+    playSound: boolean;
+  }) => ({
+    payload: args,
+    meta: { sound: playSound ? 'boop' : undefined },
+  }),
+);

app/javascript/flavours/glitch/actions/store.js

@@ -25,6 +25,7 @@ const applyMigrations = (state) => {
   });
 };
 
+
 export function hydrateStore(rawState) {
   return dispatch => {
     const state = applyMigrations(convertState(rawState));

app/javascript/flavours/glitch/api_types/accounts.ts

@@ -0,0 +1,45 @@
+import type { ApiCustomEmojiJSON } from './custom_emoji';
+
+export interface ApiAccountFieldJSON {
+  name: string;
+  value: string;
+  verified_at: string | null;
+}
+
+export interface ApiAccountRoleJSON {
+  color: string;
+  id: string;
+  name: string;
+}
+
+// See app/serializers/rest/account_serializer.rb
+export interface ApiAccountJSON {
+  acct: string;
+  avatar: string;
+  avatar_static: string;
+  bot: boolean;
+  created_at: string;
+  discoverable: boolean;
+  display_name: string;
+  emojis: ApiCustomEmojiJSON[];
+  fields: ApiAccountFieldJSON[];
+  followers_count: number;
+  following_count: number;
+  group: boolean;
+  header: string;
+  header_static: string;
+  id: string;
+  last_status_at: string;
+  locked: boolean;
+  noindex?: boolean;
+  note: string;
+  roles?: ApiAccountJSON[];
+  statuses_count: number;
+  uri: string;
+  url: string;
+  username: string;
+  moved?: ApiAccountJSON;
+  suspended?: boolean;
+  limited?: boolean;
+  memorial?: boolean;
+}

app/javascript/flavours/glitch/api_types/custom_emoji.ts

@@ -0,0 +1,8 @@
+// See app/serializers/rest/account_serializer.rb
+export interface ApiCustomEmojiJSON {
+  shortcode: string;
+  static_url: string;
+  url: string;
+  category?: string;
+  visible_in_picker: boolean;
+}

app/javascript/flavours/glitch/api_types/relationships.ts

@@ -0,0 +1,18 @@
+// See app/serializers/rest/relationship_serializer.rb
+export interface ApiRelationshipJSON {
+  blocked_by: boolean;
+  blocking: boolean;
+  domain_blocking: boolean;
+  endorsed: boolean;
+  followed_by: boolean;
+  following: boolean;
+  id: string;
+  languages: string[] | null;
+  muting_notifications: boolean;
+  muting: boolean;
+  note: string;
+  notifying: boolean;
+  requested_by: boolean;
+  requested: boolean;
+  showing_reblogs: boolean;
+}

app/javascript/flavours/glitch/components/account.jsx

@@ -36,7 +36,7 @@ class Account extends ImmutablePureComponent {
 
   static propTypes = {
     size: PropTypes.number,
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     onFollow: PropTypes.func.isRequired,
     onBlock: PropTypes.func.isRequired,
     onMute: PropTypes.func.isRequired,

app/javascript/flavours/glitch/components/avatar.tsx

@@ -1,8 +1,9 @@
 import classNames from 'classnames';
 
+import type { Account } from 'flavours/glitch/models/account';
+
 import { useHovering } from '../hooks/useHovering';
 import { autoPlayGif } from '../initial_state';
-import type { Account } from '../types/resources';
 
 interface Props {
   account: Account | undefined; // FIXME: remove `undefined` once we know for sure its always there

app/javascript/flavours/glitch/components/avatar_overlay.tsx

@@ -1,6 +1,7 @@
+import type { Account } from 'flavours/glitch/models/account';
+
 import { useHovering } from '../hooks/useHovering';
 import { autoPlayGif } from '../initial_state';
-import type { Account } from '../types/resources';
 
 interface Props {
   account: Account | undefined; // FIXME: remove `undefined` once we know for sure its always there

app/javascript/flavours/glitch/components/display_name.tsx

@@ -4,8 +4,9 @@ import classNames from 'classnames';
 
 import type { List } from 'immutable';
 
+import type { Account } from 'flavours/glitch/models/account';
+
 import { autoPlayGif } from '../initial_state';
-import type { Account } from '../types/resources';
 
 import { Skeleton } from './skeleton';
 

app/javascript/flavours/glitch/components/inline_account.jsx

@@ -19,7 +19,7 @@ const makeMapStateToProps = () => {
 class InlineAccount extends PureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
   };
 
   render () {

app/javascript/flavours/glitch/components/status.jsx

@@ -75,7 +75,7 @@ class Status extends ImmutablePureComponent {
     containerId: PropTypes.string,
     id: PropTypes.string,
     status: ImmutablePropTypes.map,
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     previousId: PropTypes.string,
     nextInReplyToId: PropTypes.string,
     rootId: PropTypes.string,

app/javascript/flavours/glitch/features/account/components/account_note.jsx

@@ -49,7 +49,7 @@ class InlineAlert extends PureComponent {
 class AccountNote extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     value: PropTypes.string,
     onSave: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,

app/javascript/flavours/glitch/features/account/components/featured_tags.jsx

@@ -15,7 +15,7 @@ const messages = defineMessages({
 class FeaturedTags extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     featuredTags: ImmutablePropTypes.list,
     tagged: PropTypes.string,
     intl: PropTypes.object.isRequired,

app/javascript/flavours/glitch/features/account/components/follow_request_note.jsx

@@ -8,7 +8,7 @@ import { Icon } from 'flavours/glitch/components/icon';
 export default class FollowRequestNote extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
   };
 
   render () {

app/javascript/flavours/glitch/features/account/components/header.jsx

@@ -83,7 +83,7 @@ const dateFormatOptions = {
 class Header extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     identity_props: ImmutablePropTypes.list,
     onFollow: PropTypes.func.isRequired,
     onBlock: PropTypes.func.isRequired,

app/javascript/flavours/glitch/features/account_timeline/components/header.jsx

@@ -18,7 +18,7 @@ import MovedNote from './moved_note';
 class Header extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     onFollow: PropTypes.func.isRequired,
     onBlock: PropTypes.func.isRequired,
     onMention: PropTypes.func.isRequired,

app/javascript/flavours/glitch/features/account_timeline/components/limited_account_hint.jsx

@@ -1,40 +0,0 @@
-import PropTypes from 'prop-types';
-import { PureComponent } from 'react';
-
-import { FormattedMessage } from 'react-intl';
-
-import { connect } from 'react-redux';
-
-import { revealAccount } from 'flavours/glitch/actions/accounts';
-import { Button } from 'flavours/glitch/components/button';
-import { domain } from 'flavours/glitch/initial_state';
-
-const mapDispatchToProps = (dispatch, { accountId }) => ({
-
-  reveal () {
-    dispatch(revealAccount(accountId));
-  },
-
-});
-
-class LimitedAccountHint extends PureComponent {
-
-  static propTypes = {
-    accountId: PropTypes.string.isRequired,
-    reveal: PropTypes.func,
-  };
-
-  render () {
-    const { reveal } = this.props;
-
-    return (
-      <div className='limited-account-hint'>
-        <p><FormattedMessage id='limited_account_hint.title' defaultMessage='This profile has been hidden by the moderators of {domain}.' values={{ domain }} /></p>
-        <Button onClick={reveal}><FormattedMessage id='limited_account_hint.action' defaultMessage='Show profile anyway' /></Button>
-      </div>
-    );
-  }
-
-}
-
-export default connect(() => {}, mapDispatchToProps)(LimitedAccountHint);

app/javascript/flavours/glitch/features/account_timeline/components/limited_account_hint.tsx

@@ -0,0 +1,35 @@
+import { useCallback } from 'react';
+
+import { FormattedMessage } from 'react-intl';
+
+import { revealAccount } from 'flavours/glitch/actions/accounts_typed';
+import { Button } from 'flavours/glitch/components/button';
+import { domain } from 'flavours/glitch/initial_state';
+import { useAppDispatch } from 'flavours/glitch/store';
+
+export const LimitedAccountHint: React.FC<{ accountId: string }> = ({
+  accountId,
+}) => {
+  const dispatch = useAppDispatch();
+  const reveal = useCallback(() => {
+    dispatch(revealAccount({ id: accountId }));
+  }, [dispatch, accountId]);
+
+  return (
+    <div className='limited-account-hint'>
+      <p>
+        <FormattedMessage
+          id='limited_account_hint.title'
+          defaultMessage='This profile has been hidden by the moderators of {domain}.'
+          values={{ domain }}
+        />
+      </p>
+      <Button onClick={reveal}>
+        <FormattedMessage
+          id='limited_account_hint.action'
+          defaultMessage='Show profile anyway'
+        />
+      </Button>
+    </div>
+  );
+};

app/javascript/flavours/glitch/features/account_timeline/index.jsx

@@ -20,7 +20,7 @@ import { LoadingIndicator } from '../../components/loading_indicator';
 import StatusList from '../../components/status_list';
 import Column from '../ui/components/column';
 
-import LimitedAccountHint from './components/limited_account_hint';
+import { LimitedAccountHint } from './components/limited_account_hint';
 import HeaderContainer from './containers/header_container';
 
 const emptyList = ImmutableList();

app/javascript/flavours/glitch/features/compose/components/action_bar.jsx

@@ -28,7 +28,7 @@ const messages = defineMessages({
 class ActionBar extends PureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     onLogout: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
   };

app/javascript/flavours/glitch/features/compose/components/autosuggest_account.jsx

@@ -7,7 +7,7 @@ import { DisplayName } from '../../../components/display_name';
 export default class AutosuggestAccount extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
   };
 
   render () {

app/javascript/flavours/glitch/features/compose/components/navigation_bar.jsx

@@ -15,7 +15,7 @@ import ActionBar from './action_bar';
 export default class NavigationBar extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     onLogout: PropTypes.func.isRequired,
     onClose: PropTypes.func,
   };

app/javascript/flavours/glitch/features/directory/components/account_card.jsx

@@ -104,7 +104,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
 class AccountCard extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     intl: PropTypes.object.isRequired,
     onFollow: PropTypes.func.isRequired,
     onBlock: PropTypes.func.isRequired,

app/javascript/flavours/glitch/features/follow_requests/components/account_authorize.jsx

@@ -18,7 +18,7 @@ const messages = defineMessages({
 class AccountAuthorize extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     onAuthorize: PropTypes.func.isRequired,
     onReject: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,

app/javascript/flavours/glitch/features/followers/index.jsx

@@ -23,7 +23,7 @@ import { LoadingIndicator } from '../../components/loading_indicator';
 import ScrollableList from '../../components/scrollable_list';
 import AccountContainer from '../../containers/account_container';
 import ProfileColumnHeader from '../account/components/profile_column_header';
-import LimitedAccountHint from '../account_timeline/components/limited_account_hint';
+import { LimitedAccountHint } from '../account_timeline/components/limited_account_hint';
 import HeaderContainer from '../account_timeline/containers/header_container';
 import Column from '../ui/components/column';
 

app/javascript/flavours/glitch/features/following/index.jsx

@@ -23,7 +23,7 @@ import { LoadingIndicator } from '../../components/loading_indicator';
 import ScrollableList from '../../components/scrollable_list';
 import AccountContainer from '../../containers/account_container';
 import ProfileColumnHeader from '../account/components/profile_column_header';
-import LimitedAccountHint from '../account_timeline/components/limited_account_hint';
+import { LimitedAccountHint } from '../account_timeline/components/limited_account_hint';
 import HeaderContainer from '../account_timeline/containers/header_container';
 import Column from '../ui/components/column';
 

app/javascript/flavours/glitch/features/list_adder/components/account.jsx

@@ -21,7 +21,7 @@ const makeMapStateToProps = () => {
 class Account extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
   };
 
   render () {

app/javascript/flavours/glitch/features/list_editor/components/account.jsx

@@ -36,7 +36,7 @@ const mapDispatchToProps = (dispatch, { accountId }) => ({
 class Account extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     intl: PropTypes.object.isRequired,
     onRemove: PropTypes.func.isRequired,
     onAdd: PropTypes.func.isRequired,

app/javascript/flavours/glitch/features/notifications/components/follow_request.jsx

@@ -27,7 +27,7 @@ const messages = defineMessages({
 class FollowRequest extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     onAuthorize: PropTypes.func.isRequired,
     onReject: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,

app/javascript/flavours/glitch/features/notifications/components/report.jsx

@@ -20,7 +20,7 @@ const messages = defineMessages({
 class Report extends ImmutablePureComponent {
 
   static propTypes = {
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     report: ImmutablePropTypes.map.isRequired,
     hidden: PropTypes.bool,
     intl: PropTypes.object.isRequired,

app/javascript/flavours/glitch/features/onboarding/index.jsx

@@ -42,7 +42,7 @@ const mapStateToProps = () => {
 class Onboarding extends ImmutablePureComponent {
   static propTypes = {
     dispatch: PropTypes.func.isRequired,
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     multiColumn: PropTypes.bool,
     ...WithRouterPropTypes,
   };

app/javascript/flavours/glitch/features/onboarding/share.jsx

@@ -145,7 +145,7 @@ class Share extends PureComponent {
 
   static propTypes = {
     onBack: PropTypes.func,
-    account: ImmutablePropTypes.map,
+    account: ImmutablePropTypes.record,
     multiColumn: PropTypes.bool,
     intl: PropTypes.object,
   };

app/javascript/flavours/glitch/features/picture_in_picture/components/header.jsx

@@ -25,7 +25,7 @@ class Header extends ImmutablePureComponent {
   static propTypes = {
     accountId: PropTypes.string.isRequired,
     statusId: PropTypes.string.isRequired,
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     onClose: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
   };

app/javascript/flavours/glitch/features/report/thanks.jsx

@@ -20,7 +20,7 @@ class Thanks extends PureComponent {
   static propTypes = {
     submitted: PropTypes.bool,
     onClose: PropTypes.func.isRequired,
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     dispatch: PropTypes.func.isRequired,
   };
 

app/javascript/flavours/glitch/features/ui/components/focal_point_modal.jsx

@@ -109,7 +109,7 @@ class FocalPointModal extends ImmutablePureComponent {
 
   static propTypes = {
     media: ImmutablePropTypes.map.isRequired,
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
     isUploadingThumbnail: PropTypes.bool,
     onSave: PropTypes.func.isRequired,
     onChangeDescription: PropTypes.func.isRequired,

app/javascript/flavours/glitch/features/ui/components/report_modal.jsx

@@ -40,7 +40,7 @@ class ReportModal extends ImmutablePureComponent {
     statusId: PropTypes.string,
     dispatch: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
-    account: ImmutablePropTypes.map.isRequired,
+    account: ImmutablePropTypes.record.isRequired,
   };
 
   state = {

app/javascript/flavours/glitch/initial_state.js

@@ -1,43 +1,5 @@
 // @ts-check
 
-/**
- * @typedef Emoji
- * @property {string} shortcode
- * @property {string} static_url
- * @property {string} url
- */
-
-/**
- * @typedef AccountField
- * @property {string} name
- * @property {string} value
- * @property {string} verified_at
- */
-
-/**
- * @typedef Account
- * @property {string} acct
- * @property {string} avatar
- * @property {string} avatar_static
- * @property {boolean} bot
- * @property {string} created_at
- * @property {boolean=} discoverable
- * @property {string} display_name
- * @property {Emoji[]} emojis
- * @property {AccountField[]} fields
- * @property {number} followers_count
- * @property {number} following_count
- * @property {boolean} group
- * @property {string} header
- * @property {string} header_static
- * @property {string} id
- * @property {string=} last_status_at
- * @property {boolean} locked
- * @property {string} note
- * @property {number} statuses_count
- * @property {string} url
- * @property {string} username
- */
 
 /**
  * @typedef {[code: string, name: string, localName: string]} InitialStateLanguage
@@ -99,7 +61,7 @@ export const hasMultiColumnPath = initialPath === '/'
 
 /**
  * @typedef InitialState
- * @property {Record<string, Account>} accounts
+ * @property {Record<string, import("./api_types/accounts").ApiAccountJSON>} accounts
  * @property {InitialStateLanguage[]} languages
  * @property {boolean=} critical_updates_pending
  * @property {InitialStateMeta} meta

app/javascript/flavours/glitch/models/account.ts

@@ -0,0 +1,149 @@
+import type { RecordOf } from 'immutable';
+import { List, Record as ImmutableRecord } from 'immutable';
+
+import escapeTextContentForBrowser from 'escape-html';
+
+import type {
+  ApiAccountFieldJSON,
+  ApiAccountRoleJSON,
+  ApiAccountJSON,
+} from 'flavours/glitch/api_types/accounts';
+import type { ApiCustomEmojiJSON } from 'flavours/glitch/api_types/custom_emoji';
+import emojify from 'flavours/glitch/features/emoji/emoji';
+import { unescapeHTML } from 'flavours/glitch/utils/html';
+
+import { CustomEmojiFactory } from './custom_emoji';
+import type { CustomEmoji } from './custom_emoji';
+
+// AccountField
+interface AccountFieldShape extends Required<ApiAccountFieldJSON> {
+  name_emojified: string;
+  value_emojified: string;
+  value_plain: string | null;
+}
+
+type AccountField = RecordOf<AccountFieldShape>;
+
+const AccountFieldFactory = ImmutableRecord<AccountFieldShape>({
+  name: '',
+  value: '',
+  verified_at: null,
+  name_emojified: '',
+  value_emojified: '',
+  value_plain: null,
+});
+
+// AccountRole
+export type AccountRoleShape = ApiAccountRoleJSON;
+export type AccountRole = RecordOf<AccountRoleShape>;
+
+const AccountRoleFactory = ImmutableRecord<AccountRoleShape>({
+  color: '',
+  id: '',
+  name: '',
+});
+
+// Account
+export interface AccountShape
+  extends Required<
+    Omit<ApiAccountJSON, 'emojis' | 'fields' | 'roles' | 'moved'>
+  > {
+  emojis: List<CustomEmoji>;
+  fields: List<AccountField>;
+  roles: List<AccountRole>;
+  display_name_html: string;
+  note_emojified: string;
+  note_plain: string | null;
+  hidden: boolean;
+  moved: string | null;
+}
+
+export type Account = RecordOf<AccountShape>;
+
+export const accountDefaultValues: AccountShape = {
+  acct: '',
+  avatar: '',
+  avatar_static: '',
+  bot: false,
+  created_at: '',
+  discoverable: false,
+  display_name: '',
+  display_name_html: '',
+  emojis: List<CustomEmoji>(),
+  fields: List<AccountField>(),
+  group: false,
+  header: '',
+  header_static: '',
+  id: '',
+  last_status_at: '',
+  locked: false,
+  noindex: false,
+  note: '',
+  note_emojified: '',
+  note_plain: 'string',
+  roles: List<AccountRole>(),
+  uri: '',
+  url: '',
+  username: '',
+  followers_count: 0,
+  following_count: 0,
+  statuses_count: 0,
+  hidden: false,
+  suspended: false,
+  memorial: false,
+  limited: false,
+  moved: null,
+};
+
+const AccountFactory = ImmutableRecord<AccountShape>(accountDefaultValues);
+
+type EmojiMap = Record<string, ApiCustomEmojiJSON>;
+
+function makeEmojiMap(emojis: ApiCustomEmojiJSON[]) {
+  return emojis.reduce<EmojiMap>((obj, emoji) => {
+    obj[`:${emoji.shortcode}:`] = emoji;
+    return obj;
+  }, {});
+}
+
+function createAccountField(
+  jsonField: ApiAccountFieldJSON,
+  emojiMap: EmojiMap,
+) {
+  return AccountFieldFactory({
+    ...jsonField,
+    name_emojified: emojify(
+      escapeTextContentForBrowser(jsonField.name),
+      emojiMap,
+    ),
+    value_emojified: emojify(jsonField.value, emojiMap),
+    value_plain: unescapeHTML(jsonField.value),
+  });
+}
+
+export function createAccountFromServerJSON(serverJSON: ApiAccountJSON) {
+  const { moved, ...accountJSON } = serverJSON;
+
+  const emojiMap = makeEmojiMap(accountJSON.emojis);
+
+  const displayName =
+    accountJSON.display_name.trim().length === 0
+      ? accountJSON.username
+      : accountJSON.display_name;
+
+  return AccountFactory({
+    ...accountJSON,
+    moved: moved?.id,
+    fields: List(
+      serverJSON.fields.map((field) => createAccountField(field, emojiMap)),
+    ),
+    emojis: List(serverJSON.emojis.map((emoji) => CustomEmojiFactory(emoji))),
+    roles: List(serverJSON.roles?.map((role) => AccountRoleFactory(role))),
+    display_name_html: emojify(
+      escapeTextContentForBrowser(displayName),
+      emojiMap,
+    ),
+    note_emojified: emojify(accountJSON.note, emojiMap),
+    note_plain: unescapeHTML(accountJSON.note),
+  });
+}

app/javascript/flavours/glitch/models/custom_emoji.ts

@@ -0,0 +1,15 @@
+import type { RecordOf } from 'immutable';
+import { Record } from 'immutable';
+
+import type { ApiCustomEmojiJSON } from 'flavours/glitch/api_types/custom_emoji';
+
+type CustomEmojiShape = Required<ApiCustomEmojiJSON>; // no changes from server shape
+export type CustomEmoji = RecordOf<CustomEmojiShape>;
+
+export const CustomEmojiFactory = Record<CustomEmojiShape>({
+  shortcode: '',
+  static_url: '',
+  url: '',
+  category: '',
+  visible_in_picker: false,
+});

app/javascript/flavours/glitch/models/relationship.ts

@@ -0,0 +1,29 @@
+import type { RecordOf } from 'immutable';
+import { Record } from 'immutable';
+
+import type { ApiRelationshipJSON } from 'flavours/glitch/api_types/relationships';
+
+type RelationshipShape = Required<ApiRelationshipJSON>; // no changes from server shape
+export type Relationship = RecordOf<RelationshipShape>;
+
+const RelationshipFactory = Record<RelationshipShape>({
+  blocked_by: false,
+  blocking: false,
+  domain_blocking: false,
+  endorsed: false,
+  followed_by: false,
+  following: false,
+  id: '',
+  languages: null,
+  muting_notifications: false,
+  muting: false,
+  note: '',
+  notifying: false,
+  requested_by: false,
+  requested: false,
+  showing_reblogs: false,
+});
+
+export function createRelationship(attributes: Partial<RelationshipShape>) {
+  return RelationshipFactory(attributes);
+}

app/javascript/flavours/glitch/reducers/accounts.js

@@ -1,39 +0,0 @@
-import { Map as ImmutableMap, fromJS } from 'immutable';
-
-import { ACCOUNT_REVEAL } from 'flavours/glitch/actions/accounts';
-import { ACCOUNT_IMPORT, ACCOUNTS_IMPORT } from 'flavours/glitch/actions/importer';
-
-const initialState = ImmutableMap();
-
-const normalizeAccount = (state, account) => {
-  account = { ...account };
-
-  delete account.followers_count;
-  delete account.following_count;
-  delete account.statuses_count;
-
-  account.hidden = state.getIn([account.id, 'hidden']) === false ? false : account.limited;
-
-  return state.set(account.id, fromJS(account));
-};
-
-const normalizeAccounts = (state, accounts) => {
-  accounts.forEach(account => {
-    state = normalizeAccount(state, account);
-  });
-
-  return state;
-};
-
-export default function accounts(state = initialState, action) {
-  switch(action.type) {
-  case ACCOUNT_IMPORT:
-    return normalizeAccount(state, action.account);
-  case ACCOUNTS_IMPORT:
-    return normalizeAccounts(state, action.accounts);
-  case ACCOUNT_REVEAL:
-    return state.setIn([action.id, 'hidden'], false);
-  default:
-    return state;
-  }
-}

app/javascript/flavours/glitch/reducers/accounts.ts

@@ -0,0 +1,84 @@
+import { Map as ImmutableMap } from 'immutable';
+
+import type { Reducer } from 'redux';
+
+import {
+  followAccountSuccess,
+  unfollowAccountSuccess,
+  importAccounts,
+  revealAccount,
+} from 'flavours/glitch/actions/accounts_typed';
+import type { ApiAccountJSON } from 'flavours/glitch/api_types/accounts';
+import { me } from 'flavours/glitch/initial_state';
+import type { Account } from 'flavours/glitch/models/account';
+import { createAccountFromServerJSON } from 'flavours/glitch/models/account';
+
+const initialState = ImmutableMap<string, Account>();
+
+const normalizeAccount = (
+  state: typeof initialState,
+  account: ApiAccountJSON,
+) => {
+  return state.set(
+    account.id,
+    createAccountFromServerJSON(account).set(
+      'hidden',
+      state.get(account.id)?.hidden === false
+        ? false
+        : account.limited || false,
+    ),
+  );
+};
+
+const normalizeAccounts = (
+  state: typeof initialState,
+  accounts: ApiAccountJSON[],
+) => {
+  accounts.forEach((account) => {
+    state = normalizeAccount(state, account);
+  });
+
+  return state;
+};
+
+function getCurrentUser() {
+  if (!me)
+    throw new Error(
+      'No current user (me) defined when calling `accountsReducer`',
+    );
+
+  return me;
+}
+
+export const accountsReducer: Reducer<typeof initialState> = (
+  state = initialState,
+  action,
+) => {
+  if (revealAccount.match(action))
+    return state.setIn([action.payload.id, 'hidden'], false);
+  else if (importAccounts.match(action))
+    return normalizeAccounts(state, action.payload.accounts);
+  else if (followAccountSuccess.match(action)) {
+    return state
+      .update(
+        action.payload.relationship.id,
+        (account) => account?.update('followers_count', (n) => n + 1),
+      )
+      .update(
+        getCurrentUser(),
+        (account) => account?.update('following_count', (n) => n + 1),
+      );
+  } else if (unfollowAccountSuccess.match(action))
+    return state
+      .update(
+        action.payload.relationship.id,
+        (account) =>
+          account?.update('followers_count', (n) => Math.max(0, n - 1)),
+      )
+      .update(
+        getCurrentUser(),
+        (account) =>
+          account?.update('following_count', (n) => Math.max(0, n - 1)),
+      );
+  else return state;
+};

app/javascript/flavours/glitch/reducers/accounts_counters.js

@@ -1,49 +0,0 @@
-import { Map as ImmutableMap, fromJS } from 'immutable';
-
-import { me } from 'flavours/glitch/initial_state';
-
-import {
-  ACCOUNT_FOLLOW_SUCCESS,
-  ACCOUNT_UNFOLLOW_SUCCESS,
-} from '../actions/accounts';
-import { ACCOUNT_IMPORT, ACCOUNTS_IMPORT } from '../actions/importer';
-
-const normalizeAccount = (state, account) => state.set(account.id, fromJS({
-  followers_count: account.followers_count,
-  following_count: account.following_count,
-  statuses_count: account.statuses_count,
-}));
-
-const normalizeAccounts = (state, accounts) => {
-  accounts.forEach(account => {
-    state = normalizeAccount(state, account);
-  });
-
-  return state;
-};
-
-const incrementFollowers = (state, accountId) =>
-  state.updateIn([accountId, 'followers_count'], num => num + 1)
-    .updateIn([me, 'following_count'], num => num + 1);
-
-const decrementFollowers = (state, accountId) =>
-  state.updateIn([accountId, 'followers_count'], num => Math.max(0, num - 1))
-    .updateIn([me, 'following_count'], num => Math.max(0, num - 1));
-
-const initialState = ImmutableMap();
-
-export default function accountsCounters(state = initialState, action) {
-  switch(action.type) {
-  case ACCOUNT_IMPORT:
-    return normalizeAccount(state, action.account);
-  case ACCOUNTS_IMPORT:
-    return normalizeAccounts(state, action.accounts);
-  case ACCOUNT_FOLLOW_SUCCESS:
-    return action.alreadyFollowing ? state :
-      incrementFollowers(state, action.relationship.id);
-  case ACCOUNT_UNFOLLOW_SUCCESS:
-    return decrementFollowers(state, action.relationship.id);
-  default:
-    return state;
-  }
-}

app/javascript/flavours/glitch/reducers/accounts_map.js

@@ -1,7 +1,7 @@
 import { Map as ImmutableMap } from 'immutable';
 
 import { ACCOUNT_LOOKUP_FAIL } from '../actions/accounts';
-import { ACCOUNT_IMPORT, ACCOUNTS_IMPORT } from '../actions/importer';
+import { importAccounts } from '../actions/accounts_typed';
 
 export const normalizeForLookup = str => str.toLowerCase();
 
@@ -11,10 +11,8 @@ export default function accountsMap(state = initialState, action) {
   switch(action.type) {
   case ACCOUNT_LOOKUP_FAIL:
     return action.error?.response?.status === 404 ? state.set(normalizeForLookup(action.acct), null) : state;
-  case ACCOUNT_IMPORT:
+  case importAccounts.type:
-    return state.set(normalizeForLookup(action.account.acct), action.account.id);
+    return state.withMutations(map => action.payload.accounts.forEach(account => map.set(normalizeForLookup(account.acct), account.id)));
-  case ACCOUNTS_IMPORT:
-    return state.withMutations(map => action.accounts.forEach(account => map.set(normalizeForLookup(account.acct), account.id)));
   default:
     return state;
   }

app/javascript/flavours/glitch/reducers/contexts.js

@@ -1,8 +1,8 @@
 import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
 
 import {
-  ACCOUNT_BLOCK_SUCCESS,
+  blockAccountSuccess,
-  ACCOUNT_MUTE_SUCCESS,
+  muteAccountSuccess,
 } from '../actions/accounts';
 import { CONTEXT_FETCH_SUCCESS } from '../actions/statuses';
 import { TIMELINE_DELETE, TIMELINE_UPDATE } from '../actions/timelines';
@@ -92,9 +92,9 @@ const updateContext = (state, status) => {
 
 export default function replies(state = initialState, action) {
   switch(action.type) {
-  case ACCOUNT_BLOCK_SUCCESS:
+  case blockAccountSuccess.type:
-  case ACCOUNT_MUTE_SUCCESS:
+  case muteAccountSuccess.type:
-    return filterContexts(state, action.relationship, action.statuses);
+    return filterContexts(state, action.payload.relationship, action.payload.statuses);
   case CONTEXT_FETCH_SUCCESS:
     return normalizeContext(state, action.id, action.ancestors, action.descendants);
   case TIMELINE_DELETE:

app/javascript/flavours/glitch/reducers/conversations.js

@@ -1,7 +1,7 @@
 import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
 
-import { ACCOUNT_BLOCK_SUCCESS, ACCOUNT_MUTE_SUCCESS } from 'flavours/glitch/actions/accounts';
+import { blockAccountSuccess, muteAccountSuccess } from 'flavours/glitch/actions/accounts';
-import { DOMAIN_BLOCK_SUCCESS } from 'flavours/glitch/actions/domain_blocks';
+import { blockDomainSuccess } from 'flavours/glitch/actions/domain_blocks';
 
 import {
   CONVERSATIONS_MOUNT,
@@ -105,11 +105,11 @@ export default function conversations(state = initialState, action) {
 
       return item;
     }));
-  case ACCOUNT_BLOCK_SUCCESS:
+  case blockAccountSuccess.type:
-  case ACCOUNT_MUTE_SUCCESS:
+  case muteAccountSuccess.type:
-    return filterConversations(state, [action.relationship.id]);
+    return filterConversations(state, [action.payload.relationship.id]);
-  case DOMAIN_BLOCK_SUCCESS:
+  case blockDomainSuccess.type:
-    return filterConversations(state, action.accounts);
+    return filterConversations(state, action.payload.accounts);
   case CONVERSATIONS_DELETE_SUCCESS:
     return state.update('items', list => list.filterNot(item => item.get('id') === action.id));
   default:

app/javascript/flavours/glitch/reducers/domain_lists.js

@@ -3,7 +3,7 @@ import { Map as ImmutableMap, OrderedSet as ImmutableOrderedSet } from 'immutabl
 import {
   DOMAIN_BLOCKS_FETCH_SUCCESS,
   DOMAIN_BLOCKS_EXPAND_SUCCESS,
-  DOMAIN_UNBLOCK_SUCCESS,
+  unblockDomainSuccess
 } from '../actions/domain_blocks';
 
 const initialState = ImmutableMap({
@@ -18,8 +18,8 @@ export default function domainLists(state = initialState, action) {
     return state.setIn(['blocks', 'items'], ImmutableOrderedSet(action.domains)).setIn(['blocks', 'next'], action.next);
   case DOMAIN_BLOCKS_EXPAND_SUCCESS:
     return state.updateIn(['blocks', 'items'], set => set.union(action.domains)).setIn(['blocks', 'next'], action.next);
-  case DOMAIN_UNBLOCK_SUCCESS:
+  case unblockDomainSuccess.type:
-    return state.updateIn(['blocks', 'items'], set => set.delete(action.domain));
+    return state.updateIn(['blocks', 'items'], set => set.delete(action.payload.domain));
   default:
     return state;
   }

app/javascript/flavours/glitch/reducers/index.ts

@@ -3,8 +3,7 @@ import { Record as ImmutableRecord } from 'immutable';
 import { loadingBarReducer } from 'react-redux-loading-bar';
 import { combineReducers } from 'redux-immutable';
 
-import accounts from './accounts';
+import { accountsReducer } from './accounts';
-import accounts_counters from './accounts_counters';
 import accounts_map from './accounts_map';
 import alerts from './alerts';
 import announcements from './announcements';
@@ -34,7 +33,7 @@ import picture_in_picture from './picture_in_picture';
 import pinnedAccountsEditor from './pinned_accounts_editor';
 import polls from './polls';
 import push_notifications from './push_notifications';
-import relationships from './relationships';
+import { relationshipsReducer } from './relationships';
 import search from './search';
 import server from './server';
 import settings from './settings';
@@ -57,11 +56,10 @@ const reducers = {
   user_lists,
   domain_lists,
   status_lists,
-  accounts,
+  accounts: accountsReducer,
-  accounts_counters,
   accounts_map,
   statuses,
-  relationships,
+  relationships: relationshipsReducer,
   settings,
   local_settings,
   push_notifications,

app/javascript/flavours/glitch/reducers/notifications.js

@@ -1,12 +1,12 @@
 import { fromJS, Map as ImmutableMap, List as ImmutableList } from 'immutable';
 
-import { DOMAIN_BLOCK_SUCCESS } from 'flavours/glitch/actions/domain_blocks';
+import { blockDomainSuccess } from 'flavours/glitch/actions/domain_blocks';
 
 import {
-  ACCOUNT_BLOCK_SUCCESS,
+  authorizeFollowRequestSuccess,
-  ACCOUNT_MUTE_SUCCESS,
+  blockAccountSuccess,
-  FOLLOW_REQUEST_AUTHORIZE_SUCCESS,
+  muteAccountSuccess,
-  FOLLOW_REQUEST_REJECT_SUCCESS,
+  rejectFollowRequestSuccess,
 } from '../actions/accounts';
 import {
   MARKERS_FETCH_SUCCESS,
@@ -15,7 +15,7 @@ import {
   NOTIFICATIONS_MOUNT,
   NOTIFICATIONS_UNMOUNT,
   NOTIFICATIONS_SET_VISIBILITY,
-  NOTIFICATIONS_UPDATE,
+  notificationsUpdate,
   NOTIFICATIONS_EXPAND_SUCCESS,
   NOTIFICATIONS_EXPAND_REQUEST,
   NOTIFICATIONS_EXPAND_FAIL,
@@ -316,19 +316,19 @@ export default function notifications(state = initialState, action) {
     return state.set('items', ImmutableList()).set('pendingItems', ImmutableList()).set('hasMore', true);
   case NOTIFICATIONS_SCROLL_TOP:
     return updateTop(state, action.top);
-  case NOTIFICATIONS_UPDATE:
+  case notificationsUpdate.type:
-    return normalizeNotification(state, action.notification, action.usePendingItems);
+    return normalizeNotification(state, action.payload.notification, action.payload.usePendingItems);
   case NOTIFICATIONS_EXPAND_SUCCESS:
     return expandNormalizedNotifications(state, action.notifications, action.next, action.isLoadingMore, action.isLoadingRecent, action.usePendingItems);
-  case ACCOUNT_BLOCK_SUCCESS:
+  case blockAccountSuccess.type:
-    return filterNotifications(state, [action.relationship.id]);
+    return filterNotifications(state, [action.payload.relationship.id]);
-  case ACCOUNT_MUTE_SUCCESS:
+  case muteAccountSuccess.type:
-    return action.relationship.muting_notifications ? filterNotifications(state, [action.relationship.id]) : state;
+    return action.payload.relationship.muting_notifications ? filterNotifications(state, [action.payload.relationship.id]) : state;
-  case DOMAIN_BLOCK_SUCCESS:
+  case blockDomainSuccess.type:
-    return filterNotifications(state, action.accounts);
+    return filterNotifications(state, action.payload.accounts);
-  case FOLLOW_REQUEST_AUTHORIZE_SUCCESS:
+  case authorizeFollowRequestSuccess.type:
-  case FOLLOW_REQUEST_REJECT_SUCCESS:
+  case rejectFollowRequestSuccess.type:
-    return filterNotifications(state, [action.id], 'follow_request');
+    return filterNotifications(state, [action.payload.id], 'follow_request');
   case NOTIFICATIONS_CLEAR:
     return state.set('items', ImmutableList()).set('pendingItems', ImmutableList()).set('hasMore', false);
   case TIMELINE_DELETE:

app/javascript/flavours/glitch/reducers/pinned_accounts_editor.js

@@ -8,8 +8,8 @@ import {
   PINNED_ACCOUNTS_SUGGESTIONS_FETCH_SUCCESS,
   PINNED_ACCOUNTS_EDITOR_SUGGESTIONS_CLEAR,
   PINNED_ACCOUNTS_EDITOR_SUGGESTIONS_CHANGE,
-  ACCOUNT_PIN_SUCCESS,
+  pinAccountSuccess,
-  ACCOUNT_UNPIN_SUCCESS,
+  unpinAccountSuccess,
 } from '../actions/accounts';
 
 const initialState = ImmutableMap({
@@ -48,10 +48,10 @@ export default function listEditorReducer(state = initialState, action) {
       map.set('items', ImmutableList());
       map.set('value', '');
     }));
-  case ACCOUNT_PIN_SUCCESS:
+  case pinAccountSuccess.type:
-    return state.updateIn(['accounts', 'items'], list => list.unshift(action.relationship.id));
+    return state.updateIn(['accounts', 'items'], list => list.unshift(action.payload.relationship.id));
-  case ACCOUNT_UNPIN_SUCCESS:
+  case unpinAccountSuccess.type:
-    return state.updateIn(['accounts', 'items'], list => list.filterNot(item => item === action.relationship.id));
+    return state.updateIn(['accounts', 'items'], list => list.filterNot(item => item === action.payload.relationship.id));
   default:
     return state;
   }

app/javascript/flavours/glitch/reducers/relationships.js

@@ -1,88 +0,0 @@
-import { Map as ImmutableMap, fromJS } from 'immutable';
-
-import {
-  submitAccountNote,
-} from '../actions/account_notes';
-import {
-  ACCOUNT_FOLLOW_SUCCESS,
-  ACCOUNT_FOLLOW_REQUEST,
-  ACCOUNT_FOLLOW_FAIL,
-  ACCOUNT_UNFOLLOW_SUCCESS,
-  ACCOUNT_UNFOLLOW_REQUEST,
-  ACCOUNT_UNFOLLOW_FAIL,
-  ACCOUNT_BLOCK_SUCCESS,
-  ACCOUNT_UNBLOCK_SUCCESS,
-  ACCOUNT_MUTE_SUCCESS,
-  ACCOUNT_UNMUTE_SUCCESS,
-  ACCOUNT_PIN_SUCCESS,
-  ACCOUNT_UNPIN_SUCCESS,
-  RELATIONSHIPS_FETCH_SUCCESS,
-  FOLLOW_REQUEST_AUTHORIZE_SUCCESS,
-  FOLLOW_REQUEST_REJECT_SUCCESS,
-} from '../actions/accounts';
-import {
-  DOMAIN_BLOCK_SUCCESS,
-  DOMAIN_UNBLOCK_SUCCESS,
-} from '../actions/domain_blocks';
-import {
-  NOTIFICATIONS_UPDATE,
-} from '../actions/notifications';
-
-
-const normalizeRelationship = (state, relationship) => state.set(relationship.id, fromJS(relationship));
-
-const normalizeRelationships = (state, relationships) => {
-  relationships.forEach(relationship => {
-    state = normalizeRelationship(state, relationship);
-  });
-
-  return state;
-};
-
-const setDomainBlocking = (state, accounts, blocking) => {
-  return state.withMutations(map => {
-    accounts.forEach(id => {
-      map.setIn([id, 'domain_blocking'], blocking);
-    });
-  });
-};
-
-const initialState = ImmutableMap();
-
-export default function relationships(state = initialState, action) {
-  switch(action.type) {
-  case FOLLOW_REQUEST_AUTHORIZE_SUCCESS:
-    return state.setIn([action.id, 'followed_by'], true).setIn([action.id, 'requested_by'], false);
-  case FOLLOW_REQUEST_REJECT_SUCCESS:
-    return state.setIn([action.id, 'followed_by'], false).setIn([action.id, 'requested_by'], false);
-  case NOTIFICATIONS_UPDATE:
-    return action.notification.type === 'follow_request' ? state.setIn([action.notification.account.id, 'requested_by'], true) : state;
-  case ACCOUNT_FOLLOW_REQUEST:
-    return state.getIn([action.id, 'following']) ? state : state.setIn([action.id, action.locked ? 'requested' : 'following'], true);
-  case ACCOUNT_FOLLOW_FAIL:
-    return state.setIn([action.id, action.locked ? 'requested' : 'following'], false);
-  case ACCOUNT_UNFOLLOW_REQUEST:
-    return state.setIn([action.id, 'following'], false);
-  case ACCOUNT_UNFOLLOW_FAIL:
-    return state.setIn([action.id, 'following'], true);
-  case ACCOUNT_FOLLOW_SUCCESS:
-  case ACCOUNT_UNFOLLOW_SUCCESS:
-  case ACCOUNT_BLOCK_SUCCESS:
-  case ACCOUNT_UNBLOCK_SUCCESS:
-  case ACCOUNT_MUTE_SUCCESS:
-  case ACCOUNT_UNMUTE_SUCCESS:
-  case ACCOUNT_PIN_SUCCESS:
-  case ACCOUNT_UNPIN_SUCCESS:
-    return normalizeRelationship(state, action.relationship);
-  case RELATIONSHIPS_FETCH_SUCCESS:
-    return normalizeRelationships(state, action.relationships);
-  case submitAccountNote.fulfilled:
-    return normalizeRelationship(state, action.payload.relationship);
-  case DOMAIN_BLOCK_SUCCESS:
-    return setDomainBlocking(state, action.accounts, true);
-  case DOMAIN_UNBLOCK_SUCCESS:
-    return setDomainBlocking(state, action.accounts, false);
-  default:
-    return state;
-  }
-}

app/javascript/flavours/glitch/reducers/relationships.ts

@@ -0,0 +1,123 @@
+import { Map as ImmutableMap } from 'immutable';
+
+import { isFulfilled } from '@reduxjs/toolkit';
+import type { Reducer } from 'redux';
+
+import type { ApiRelationshipJSON } from 'flavours/glitch/api_types/relationships';
+import type { Account } from 'flavours/glitch/models/account';
+import { createRelationship } from 'flavours/glitch/models/relationship';
+import type { Relationship } from 'flavours/glitch/models/relationship';
+
+import { submitAccountNote } from '../actions/account_notes';
+import {
+  followAccountSuccess,
+  unfollowAccountSuccess,
+  authorizeFollowRequestSuccess,
+  rejectFollowRequestSuccess,
+  followAccountRequest,
+  followAccountFail,
+  unfollowAccountRequest,
+  unfollowAccountFail,
+  blockAccountSuccess,
+  unblockAccountSuccess,
+  muteAccountSuccess,
+  unmuteAccountSuccess,
+  pinAccountSuccess,
+  unpinAccountSuccess,
+  fetchRelationshipsSuccess,
+} from '../actions/accounts_typed';
+import {
+  blockDomainSuccess,
+  unblockDomainSuccess,
+} from '../actions/domain_blocks_typed';
+import { notificationsUpdate } from '../actions/notifications_typed';
+
+const initialState = ImmutableMap<string, Relationship>();
+type State = typeof initialState;
+
+const normalizeRelationship = (
+  state: State,
+  relationship: ApiRelationshipJSON,
+) => state.set(relationship.id, createRelationship(relationship));
+
+const normalizeRelationships = (
+  state: State,
+  relationships: ApiRelationshipJSON[],
+) => {
+  relationships.forEach((relationship) => {
+    state = normalizeRelationship(state, relationship);
+  });
+
+  return state;
+};
+
+const setDomainBlocking = (
+  state: State,
+  accounts: Account[],
+  blocking: boolean,
+) => {
+  return state.withMutations((map) => {
+    accounts.forEach((id) => {
+      map.setIn([id, 'domain_blocking'], blocking);
+    });
+  });
+};
+
+export const relationshipsReducer: Reducer<State> = (
+  state = initialState,
+  action,
+) => {
+  if (authorizeFollowRequestSuccess.match(action))
+    return state
+      .setIn([action.payload.id, 'followed_by'], true)
+      .setIn([action.payload.id, 'requested_by'], false);
+  else if (rejectFollowRequestSuccess.match(action))
+    return state
+      .setIn([action.payload.id, 'followed_by'], false)
+      .setIn([action.payload.id, 'requested_by'], false);
+  else if (notificationsUpdate.match(action))
+    return action.payload.notification.type === 'follow_request'
+      ? state.setIn(
+          [action.payload.notification.account.id, 'requested_by'],
+          true,
+        )
+      : state;
+  else if (followAccountRequest.match(action))
+    return state.getIn([action.payload.id, 'following'])
+      ? state
+      : state.setIn(
+          [
+            action.payload.id,
+            action.payload.locked ? 'requested' : 'following',
+          ],
+          true,
+        );
+  else if (followAccountFail.match(action))
+    return state.setIn(
+      [action.payload.id, action.payload.locked ? 'requested' : 'following'],
+      false,
+    );
+  else if (unfollowAccountRequest.match(action))
+    return state.setIn([action.payload.id, 'following'], false);
+  else if (unfollowAccountFail.match(action))
+    return state.setIn([action.payload.id, 'following'], true);
+  else if (
+    followAccountSuccess.match(action) ||
+    unfollowAccountSuccess.match(action) ||
+    blockAccountSuccess.match(action) ||
+    unblockAccountSuccess.match(action) ||
+    muteAccountSuccess.match(action) ||
+    unmuteAccountSuccess.match(action) ||
+    pinAccountSuccess.match(action) ||
+    unpinAccountSuccess.match(action) ||
+    isFulfilled(submitAccountNote)(action)
+  )
+    return normalizeRelationship(state, action.payload.relationship);
+  else if (fetchRelationshipsSuccess.match(action))
+    return normalizeRelationships(state, action.payload.relationships);
+  else if (blockDomainSuccess.match(action))
+    return setDomainBlocking(state, action.payload.accounts, true);
+  else if (unblockDomainSuccess.match(action))
+    return setDomainBlocking(state, action.payload.accounts, false);
+  else return state;
+};

app/javascript/flavours/glitch/reducers/status_lists.js

@@ -1,8 +1,8 @@
 import { Map as ImmutableMap, OrderedSet as ImmutableOrderedSet } from 'immutable';
 
 import {
-  ACCOUNT_BLOCK_SUCCESS,
+  blockAccountSuccess,
-  ACCOUNT_MUTE_SUCCESS,
+  muteAccountSuccess,
 } from '../actions/accounts';
 import {
   BOOKMARKED_STATUSES_FETCH_REQUEST,
@@ -142,9 +142,9 @@ export default function statusLists(state = initialState, action) {
     return prependOneToList(state, 'pins', action.status);
   case UNPIN_SUCCESS:
     return removeOneFromList(state, 'pins', action.status);
-  case ACCOUNT_BLOCK_SUCCESS:
+  case blockAccountSuccess.type:
-  case ACCOUNT_MUTE_SUCCESS:
+  case muteAccountSuccess.type:
-    return state.updateIn(['trending', 'items'], ImmutableOrderedSet(), list => list.filterNot(statusId => action.statuses.getIn([statusId, 'account']) === action.relationship.id));
+    return state.updateIn(['trending', 'items'], ImmutableOrderedSet(), list => list.filterNot(statusId => action.payload.statuses.getIn([statusId, 'account']) === action.payload.relationship.id));
   default:
     return state;
   }

app/javascript/flavours/glitch/reducers/suggestions.js

@@ -1,7 +1,7 @@
 import { Map as ImmutableMap, List as ImmutableList, fromJS } from 'immutable';
 
-import { ACCOUNT_BLOCK_SUCCESS, ACCOUNT_MUTE_SUCCESS } from 'flavours/glitch/actions/accounts';
+import { blockAccountSuccess, muteAccountSuccess } from 'flavours/glitch/actions/accounts';
-import { DOMAIN_BLOCK_SUCCESS } from 'flavours/glitch/actions/domain_blocks';
+import { blockDomainSuccess } from 'flavours/glitch/actions/domain_blocks';
 
 import {
   SUGGESTIONS_FETCH_REQUEST,
@@ -29,11 +29,11 @@ export default function suggestionsReducer(state = initialState, action) {
     return state.set('isLoading', false);
   case SUGGESTIONS_DISMISS:
     return state.update('items', list => list.filterNot(x => x.account === action.id));
-  case ACCOUNT_BLOCK_SUCCESS:
+  case blockAccountSuccess.type:
-  case ACCOUNT_MUTE_SUCCESS:
+  case muteAccountSuccess.type:
-    return state.update('items', list => list.filterNot(x => x.account === action.relationship.id));
+    return state.update('items', list => list.filterNot(x => x.account === action.payload.relationship.id));
-  case DOMAIN_BLOCK_SUCCESS:
+  case blockDomainSuccess.type:
-    return state.update('items', list => list.filterNot(x => action.accounts.includes(x.account)));
+    return state.update('items', list => list.filterNot(x => action.payload.accounts.includes(x.account)));
   default:
     return state;
   }

app/javascript/flavours/glitch/reducers/timelines.js

@@ -1,9 +1,9 @@
 import { Map as ImmutableMap, List as ImmutableList, OrderedSet as ImmutableOrderedSet, fromJS } from 'immutable';
 
 import {
-  ACCOUNT_BLOCK_SUCCESS,
+  blockAccountSuccess,
-  ACCOUNT_MUTE_SUCCESS,
+  muteAccountSuccess,
-  ACCOUNT_UNFOLLOW_SUCCESS,
+  unfollowAccountSuccess
 } from '../actions/accounts';
 import {
   TIMELINE_UPDATE,
@@ -206,11 +206,11 @@ export default function timelines(state = initialState, action) {
     return deleteStatus(state, action.id, action.references, action.reblogOf);
   case TIMELINE_CLEAR:
     return clearTimeline(state, action.timeline);
-  case ACCOUNT_BLOCK_SUCCESS:
+  case blockAccountSuccess.type:
-  case ACCOUNT_MUTE_SUCCESS:
+  case muteAccountSuccess.type:
-    return filterTimelines(state, action.relationship, action.statuses);
+    return filterTimelines(state, action.payload.relationship, action.payload.statuses);
-  case ACCOUNT_UNFOLLOW_SUCCESS:
+  case unfollowAccountSuccess.type:
-    return filterTimeline('home', state, action.relationship, action.statuses);
+    return filterTimeline('home', state, action.payload.relationship, action.payload.statuses);
   case TIMELINE_SCROLL_TOP:
     return updateTop(state, action.timeline, action.top);
   case TIMELINE_CONNECT:

app/javascript/flavours/glitch/reducers/user_lists.js

@@ -33,8 +33,8 @@ import {
   FOLLOW_REQUESTS_EXPAND_REQUEST,
   FOLLOW_REQUESTS_EXPAND_SUCCESS,
   FOLLOW_REQUESTS_EXPAND_FAIL,
-  FOLLOW_REQUEST_AUTHORIZE_SUCCESS,
+  authorizeFollowRequestSuccess,
-  FOLLOW_REQUEST_REJECT_SUCCESS,
+  rejectFollowRequestSuccess,
 } from '../actions/accounts';
 import {
   BLOCKS_FETCH_REQUEST,
@@ -66,11 +66,7 @@ import {
   MUTES_EXPAND_SUCCESS,
   MUTES_EXPAND_FAIL,
 } from '../actions/mutes';
-import {
+import { notificationsUpdate } from '../actions/notifications';
-  NOTIFICATIONS_UPDATE,
-} from '../actions/notifications';
-
-
 
 const initialListState = ImmutableMap({
   next: null,
@@ -163,8 +159,8 @@ export default function userLists(state = initialState, action) {
   case FAVOURITES_FETCH_FAIL:
   case FAVOURITES_EXPAND_FAIL:
     return state.setIn(['favourited_by', action.id, 'isLoading'], false);
-  case NOTIFICATIONS_UPDATE:
+  case notificationsUpdate.type:
-    return action.notification.type === 'follow_request' ? normalizeFollowRequest(state, action.notification) : state;
+    return action.payload.notification.type === 'follow_request' ? normalizeFollowRequest(state, action.payload.notification) : state;
   case FOLLOW_REQUESTS_FETCH_SUCCESS:
     return normalizeList(state, ['follow_requests'], action.accounts, action.next);
   case FOLLOW_REQUESTS_EXPAND_SUCCESS:
@@ -175,9 +171,9 @@ export default function userLists(state = initialState, action) {
   case FOLLOW_REQUESTS_FETCH_FAIL:
   case FOLLOW_REQUESTS_EXPAND_FAIL:
     return state.setIn(['follow_requests', 'isLoading'], false);
-  case FOLLOW_REQUEST_AUTHORIZE_SUCCESS:
+  case authorizeFollowRequestSuccess.type:
-  case FOLLOW_REQUEST_REJECT_SUCCESS:
+  case rejectFollowRequestSuccess.type:
-    return state.updateIn(['follow_requests', 'items'], list => list.filterNot(item => item === action.id));
+    return state.updateIn(['follow_requests', 'items'], list => list.filterNot(item => item === action.payload.id));
   case BLOCKS_FETCH_SUCCESS:
     return normalizeList(state, ['blocks'], action.accounts, action.next);
   case BLOCKS_EXPAND_SUCCESS:

app/javascript/flavours/glitch/selectors/accounts.ts

@@ -0,0 +1,47 @@
+import { Record as ImmutableRecord } from 'immutable';
+import { createSelector } from 'reselect';
+
+import { accountDefaultValues } from 'flavours/glitch/models/account';
+import type { Account, AccountShape } from 'flavours/glitch/models/account';
+import type { Relationship } from 'flavours/glitch/models/relationship';
+import type { RootState } from 'flavours/glitch/store';
+
+const getAccountBase = (state: RootState, id: string) =>
+  state.accounts.get(id, null);
+
+const getAccountRelationship = (state: RootState, id: string) =>
+  state.relationships.get(id, null);
+
+const getAccountMoved = (state: RootState, id: string) => {
+  const movedToId = state.accounts.get(id)?.moved;
+
+  if (!movedToId) return undefined;
+
+  return state.accounts.get(movedToId);
+};
+
+interface FullAccountShape extends Omit<AccountShape, 'moved'> {
+  relationship: Relationship | null;
+  moved: Account | null;
+}
+
+const FullAccountFactory = ImmutableRecord<FullAccountShape>({
+  ...accountDefaultValues,
+  moved: null,
+  relationship: null,
+});
+
+export function makeGetAccount() {
+  return createSelector(
+    [getAccountBase, getAccountRelationship, getAccountMoved],
+    (base, relationship, moved) => {
+      if (base === null) {
+        return null;
+      }
+
+      return FullAccountFactory(base)
+        .set('relationship', relationship)
+        .set('moved', moved ?? null);
+    },
+  );
+}

app/javascript/flavours/glitch/selectors/index.js

@@ -5,23 +5,7 @@ import { toServerSideType } from 'flavours/glitch/utils/filters';
 
 import { me } from '../initial_state';
 
-const getAccountBase         = (state, id) => state.getIn(['accounts', id], null);
+export { makeGetAccount } from "./accounts";
-const getAccountCounters     = (state, id) => state.getIn(['accounts_counters', id], null);
-const getAccountRelationship = (state, id) => state.getIn(['relationships', id], null);
-const getAccountMoved        = (state, id) => state.getIn(['accounts', state.getIn(['accounts', id, 'moved'])]);
-
-export const makeGetAccount = () => {
-  return createSelector([getAccountBase, getAccountCounters, getAccountRelationship, getAccountMoved], (base, counters, relationship, moved) => {
-    if (base === null) {
-      return null;
-    }
-
-    return base.merge(counters).withMutations(map => {
-      map.set('relationship', relationship);
-      map.set('moved', moved);
-    });
-  });
-};
 
 const getFilters = (state, { contextType }) => {
   if (!contextType) return null;

app/javascript/flavours/glitch/store/middlewares/loading_bar.ts

@@ -1,3 +1,9 @@
+import {
+  isAsyncThunkAction,
+  isPending as isThunkActionPending,
+  isFulfilled as isThunkActionFulfilled,
+  isRejected as isThunkActionRejected,
+} from '@reduxjs/toolkit';
 import { showLoading, hideLoading } from 'react-redux-loading-bar';
 import type { AnyAction, Middleware } from 'redux';
 
@@ -21,25 +27,43 @@ export const loadingBarMiddleware = (
   return ({ dispatch }) =>
     (next) =>
     (action: AnyAction) => {
-      if (action.type && !action.skipLoading) {
+      let isPending = false;
+      let isFulfilled = false;
+      let isRejected = false;
+
+      if (
+        isAsyncThunkAction(action)
+        // TODO: once we get the first use-case for it, add a check for skipLoading
+      ) {
+        if (isThunkActionPending(action)) isPending = true;
+        else if (isThunkActionFulfilled(action)) isFulfilled = true;
+        else if (isThunkActionRejected(action)) isRejected = true;
+      } else if (
+        action.type &&
+        !action.skipLoading &&
+        typeof action.type === 'string'
+      ) {
         const [PENDING, FULFILLED, REJECTED] = promiseTypeSuffixes;
 
-        const isPending = new RegExp(`${PENDING}$`, 'g');
+        const isPendingRegexp = new RegExp(`${PENDING}$`, 'g');
-        const isFulfilled = new RegExp(`${FULFILLED}$`, 'g');
+        const isFulfilledRegexp = new RegExp(`${FULFILLED}$`, 'g');
-        const isRejected = new RegExp(`${REJECTED}$`, 'g');
+        const isRejectedRegexp = new RegExp(`${REJECTED}$`, 'g');
 
-        if (typeof action.type === 'string') {
+        if (action.type.match(isPendingRegexp)) {
-          if (action.type.match(isPending)) {
+          isPending = true;
-            dispatch(showLoading());
+        } else if (action.type.match(isFulfilledRegexp)) {
-          } else if (
+          isFulfilled = true;
-            action.type.match(isFulfilled) ??
+        } else if (action.type.match(isRejectedRegexp)) {
-            action.type.match(isRejected)
+          isRejected = true;
-          ) {
-            dispatch(hideLoading());
-          }
         }
       }
 
+      if (isPending) {
+        dispatch(showLoading());
+      } else if (isFulfilled || isRejected) {
+        dispatch(hideLoading());
+      }
+
       return next(action);
     };
 };

app/javascript/flavours/glitch/store/store.ts

@@ -35,6 +35,5 @@ export const store = configureStore({
 
 // Infer the `RootState` and `AppDispatch` types from the store itself
 export type RootState = ReturnType<typeof rootReducer>;
-// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
 export type AppDispatch = typeof store.dispatch;
 export type GetState = typeof store.getState;

app/javascript/flavours/glitch/types/resources.ts

@@ -1,55 +0,0 @@
-import type { Record } from 'immutable';
-
-type CustomEmoji = Record<{
-  shortcode: string;
-  static_url: string;
-  url: string;
-}>;
-
-type AccountField = Record<{
-  name: string;
-  value: string;
-  verified_at: string | null;
-}>;
-
-interface AccountApiResponseValues {
-  acct: string;
-  avatar: string;
-  avatar_static: string;
-  bot: boolean;
-  created_at: string;
-  discoverable: boolean;
-  display_name: string;
-  emojis: CustomEmoji[];
-  fields: AccountField[];
-  followers_count: number;
-  following_count: number;
-  group: boolean;
-  header: string;
-  header_static: string;
-  id: string;
-  last_status_at: string;
-  locked: boolean;
-  note: string;
-  statuses_count: number;
-  url: string;
-  uri: string;
-  username: string;
-}
-
-type NormalizedAccountField = Record<{
-  name_emojified: string;
-  value_emojified: string;
-  value_plain: string;
-}>;
-
-interface NormalizedAccountValues {
-  display_name_html: string;
-  fields: NormalizedAccountField[];
-  note_emojified: string;
-  note_plain: string;
-}
-
-export type Account = Record<
-  AccountApiResponseValues & NormalizedAccountValues
->;