Account header split up (#37490)

app/javascript/mastodon/hooks/useAccount.ts

@@ -0,0 +1,26 @@
+import { useEffect } from 'react';
+
+import { fetchAccount } from '../actions/accounts';
+import { createAppSelector, useAppDispatch, useAppSelector } from '../store';
+
+export const accountSelector = createAppSelector(
+  [
+    (state) => state.accounts,
+    (_, accountId: string | null | undefined) => accountId,
+  ],
+  (accounts, accountId) => (accountId ? accounts.get(accountId) : undefined),
+);
+
+export function useAccount(accountId: string | null | undefined) {
+  const account = useAppSelector((state) => accountSelector(state, accountId));
+
+  const dispatch = useAppDispatch();
+  const accountInStore = !!account;
+  useEffect(() => {
+    if (accountId && !accountInStore) {
+      dispatch(fetchAccount(accountId));
+    }
+  }, [accountId, accountInStore, dispatch]);
+
+  return account;
+}