Delete findAccountByUsername selector

app/soapbox/features/account-gallery/index.tsx

@@ -2,17 +2,14 @@ import React, { useEffect, useRef } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { useParams } from 'react-router-dom';
 
-import {
-  fetchAccount,
-  fetchAccountByUsername,
-} from 'soapbox/actions/accounts';
 import { openModal } from 'soapbox/actions/modals';
 import { expandAccountMediaTimeline } from 'soapbox/actions/timelines';
+import { useAccountLookup } from 'soapbox/api/hooks';
 import LoadMore from 'soapbox/components/load-more';
 import MissingIndicator from 'soapbox/components/missing-indicator';
 import { Column, Spinner } from 'soapbox/components/ui';
-import { useAppDispatch, useAppSelector, useFeatures } from 'soapbox/hooks';
-import { getAccountGallery, findAccountByUsername } from 'soapbox/selectors';
+import { useAppDispatch, useAppSelector, useFeatures, useLoggedIn } from 'soapbox/hooks';
+import { getAccountGallery } from 'soapbox/selectors';
 
 import MediaItem from './components/media-item';
 
@@ -38,33 +35,20 @@ const AccountGallery = () => {
   const dispatch = useAppDispatch();
   const { username } = useParams<{ username: string }>();
   const features = useFeatures();
+  const { me } = useLoggedIn();
 
-  const { accountId, unavailable, accountUsername } = useAppSelector((state) => {
-    const me = state.me;
-    const accountFetchError = (state.accounts.get(-1)?.username || '').toLowerCase() === username.toLowerCase();
+  const {
+    account,
+    isLoading: accountLoading,
+  } = useAccountLookup(username, { withRelationship: true });
 
-    let accountId: string | -1 | null = -1;
-    let accountUsername = username;
-    if (accountFetchError) {
-      accountId = null;
-    } else {
-      const account = findAccountByUsername(state, username);
-      accountId = account ? (account.id || null) : -1;
-      accountUsername = account?.acct || '';
-    }
+  const isBlocked = account?.relationship?.blocked_by === true;
+  const unavailable = (me === account?.id) ? false : (isBlocked && !features.blockersVisible);
 
-    const isBlocked = state.relationships.get(String(accountId))?.blocked_by || false;
-    return {
-      accountId,
-      unavailable: (me === accountId) ? false : (isBlocked && !features.blockersVisible),
-      accountUsername,
-    };
-  });
-  const isAccount = useAppSelector((state) => !!state.accounts.get(accountId));
-  const attachments: ImmutableList<Attachment> = useAppSelector((state) => getAccountGallery(state, accountId as string));
-  const isLoading = useAppSelector((state) => state.timelines.get(`account:${accountId}:media`)?.isLoading);
-  const hasMore = useAppSelector((state) => state.timelines.get(`account:${accountId}:media`)?.hasMore);
-  const next = useAppSelector(state => state.timelines.get(`account:${accountId}:media`)?.next);
+  const attachments: ImmutableList<Attachment> = useAppSelector((state) => getAccountGallery(state, account!.id));
+  const isLoading = useAppSelector((state) => state.timelines.get(`account:${account?.id}:media`)?.isLoading);
+  const hasMore = useAppSelector((state) => state.timelines.get(`account:${account?.id}:media`)?.hasMore);
+  const next = useAppSelector(state => state.timelines.get(`account:${account?.id}:media`)?.next);
 
   const node = useRef<HTMLDivElement>(null);
 
@@ -75,8 +59,8 @@ const AccountGallery = () => {
   };
 
   const handleLoadMore = (maxId: string | null) => {
-    if (accountId && accountId !== -1) {
-      dispatch(expandAccountMediaTimeline(accountId, { url: next, maxId }));
+    if (account) {
+      dispatch(expandAccountMediaTimeline(account.id, { url: next, maxId }));
     }
   };
 
@@ -97,21 +81,12 @@ const AccountGallery = () => {
   };
 
   useEffect(() => {
-    if (accountId && accountId !== -1) {
-      dispatch(fetchAccount(accountId));
-      dispatch(expandAccountMediaTimeline(accountId));
-    } else {
-      dispatch(fetchAccountByUsername(username));
+    if (account) {
+      dispatch(expandAccountMediaTimeline(account.id));
     }
-  }, [accountId]);
+  }, [account?.id]);
 
-  if (!isAccount && accountId !== -1) {
-    return (
-      <MissingIndicator />
-    );
-  }
-
-  if (accountId === -1 || (!attachments && isLoading)) {
+  if (accountLoading || (!attachments && isLoading)) {
     return (
       <Column>
         <Spinner />
@@ -119,6 +94,12 @@ const AccountGallery = () => {
     );
   }
 
+  if (!account) {
+    return (
+      <MissingIndicator />
+    );
+  }
+
   let loadOlder = null;
 
   if (hasMore && !(isLoading && attachments.size === 0)) {
@@ -136,7 +117,7 @@ const AccountGallery = () => {
   }
 
   return (
-    <Column label={`@${accountUsername}`} transparent withHeader={false}>
+    <Column label={`@${account.acct}`} transparent withHeader={false}>
       <div role='feed' className='grid grid-cols-2 gap-2 sm:grid-cols-3' ref={node}>
         {attachments.map((attachment, index) => attachment === null ? (
           <LoadMoreMedia key={'more:' + attachments.get(index + 1)?.id} maxId={index > 0 ? (attachments.get(index - 1)?.id || null) : null} onLoadMore={handleLoadMore} />

app/soapbox/features/account-timeline/index.tsx

@@ -5,11 +5,12 @@ import { useHistory } from 'react-router-dom';
 import { fetchAccountByUsername } from 'soapbox/actions/accounts';
 import { fetchPatronAccount } from 'soapbox/actions/patron';
 import { expandAccountFeaturedTimeline, expandAccountTimeline } from 'soapbox/actions/timelines';
+import { useAccountLookup } from 'soapbox/api/hooks';
 import MissingIndicator from 'soapbox/components/missing-indicator';
 import StatusList from 'soapbox/components/status-list';
 import { Card, CardBody, Spinner, Text } from 'soapbox/components/ui';
 import { useAppDispatch, useAppSelector, useFeatures, useSettings, useSoapboxConfig } from 'soapbox/hooks';
-import { makeGetStatusIds, findAccountByUsername } from 'soapbox/selectors';
+import { makeGetStatusIds } from 'soapbox/selectors';
 
 const getStatusIds = makeGetStatusIds();
 
@@ -27,7 +28,7 @@ const AccountTimeline: React.FC<IAccountTimeline> = ({ params, withReplies = fal
   const settings = useSettings();
   const soapboxConfig = useSoapboxConfig();
 
-  const account = useAppSelector(state => findAccountByUsername(state, params.username));
+  const { account } = useAccountLookup(params.username, { withRelationship: true });
   const [accountLoading, setAccountLoading] = useState<boolean>(!account);
 
   const path = withReplies ? `${account?.id}:with_replies` : account?.id;

app/soapbox/features/favourited-statuses/index.tsx

@@ -5,11 +5,11 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 
 import { fetchAccount, fetchAccountByUsername } from 'soapbox/actions/accounts';
 import { fetchFavouritedStatuses, expandFavouritedStatuses, fetchAccountFavouritedStatuses, expandAccountFavouritedStatuses } from 'soapbox/actions/favourites';
+import { useAccount } from 'soapbox/api/hooks';
 import MissingIndicator from 'soapbox/components/missing-indicator';
 import StatusList from 'soapbox/components/status-list';
 import { Column } from 'soapbox/components/ui';
 import { useAppDispatch, useAppSelector, useFeatures, useOwnAccount } from 'soapbox/hooks';
-import { findAccountByUsername } from 'soapbox/selectors';
 
 const messages = defineMessages({
   heading: { id: 'column.favourited_statuses', defaultMessage: 'Liked posts' },
@@ -22,14 +22,14 @@ interface IFavourites {
 }
 
 /** Timeline displaying a user's favourited statuses. */
-const Favourites: React.FC<IFavourites> = (props) => {
+const Favourites: React.FC<IFavourites> = ({ params }) => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
   const features = useFeatures();
   const ownAccount = useOwnAccount();
+  const { account } = useAccount(params?.username, { withRelationship: true });
 
-  const username = props.params?.username || '';
-  const account = useAppSelector(state => findAccountByUsername(state, username));
+  const username = params?.username || '';
   const isOwnAccount = username.toLowerCase() === ownAccount?.username?.toLowerCase();
 
   const timelineKey = isOwnAccount ? 'favourites' : `favourites:${account?.id}`;

app/soapbox/selectors/index.ts

@@ -46,36 +46,6 @@ export const makeGetAccount = () => {
   });
 };
 
-const findAccountsByUsername = (state: RootState, username: string) => {
-  const accounts = state.accounts;
-
-  return accounts.filter(account => {
-    return username.toLowerCase() === account?.acct.toLowerCase();
-  });
-};
-
-export const findAccountByUsername = (state: RootState, username: string) => {
-  const accounts = findAccountsByUsername(state, username);
-
-  if (accounts.length > 1) {
-    const me = state.me;
-    const meURL = state.accounts.get(me)?.url || '';
-
-    return accounts.find(account => {
-      try {
-        // If more than one account has the same username, try matching its host
-        const { host } = new URL(account.url);
-        const { host: meHost } = new URL(meURL);
-        return host === meHost;
-      } catch {
-        return false;
-      }
-    });
-  } else {
-    return accounts[0];
-  }
-};
-
 const toServerSideType = (columnType: string): ContextType => {
   switch (columnType) {
     case 'home':