Merge commit '0caf334891e0a5f4e995f1d667eb83d3aad7e41e' into glitch-soc/merge-upstream

Conflicts:
- `lib/mastodon/version.rb`:
  Upstream updated the API version, while we also have a custom glitch API version.
  Updated as upstream did.

app/javascript/mastodon/features/account_featured/components/empty_message.tsx

@@ -9,7 +9,6 @@ import { Button } from '@/mastodon/components/button';
 import { DisplayName } from '@/mastodon/components/display_name';
 import { EmptyState } from '@/mastodon/components/empty_state';
 import { LimitedAccountHint } from '@/mastodon/components/limited_account_hint';
-import { areCollectionsEnabled } from '@/mastodon/features/collections/utils';
 import { useAccount } from '@/mastodon/hooks/useAccount';
 import { useCurrentAccountId } from '@/mastodon/hooks/useAccountId';
 import { useAppDispatch } from '@/mastodon/store';
@@ -50,56 +49,39 @@ export const EmptyMessage: React.FC<EmptyMessageProps> = ({
   let title: React.ReactNode = null;
   let message: React.ReactNode = null;
 
-  const hasCollections = areCollectionsEnabled();
-
   if (me === accountId) {
-    if (hasCollections) {
-      // Return only here to insert the "Create a collection" button as the action for the empty state.
-      return (
-        <EmptyState
-          title={
+    // Return only here to insert the "Create a collection" button as the action for the empty state.
+    return (
+      <EmptyState
+        title={
+          <FormattedMessage
+            id='empty_column.account_featured_self.showcase_accounts'
+            defaultMessage='Showcase your favorite accounts'
+          />
+        }
+        message={
+          <FormattedMessage
+            id='empty_column.account_featured_self.showcase_accounts_desc'
+            defaultMessage='Collections are curated lists of accounts to help others discover more of the Fediverse.'
+          />
+        }
+      >
+        {!withoutAddCollectionButton && (
+          <Link to='/collections/new' className='button'>
             <FormattedMessage
-              id='empty_column.account_featured_self.showcase_accounts'
-              defaultMessage='Showcase your favorite accounts'
+              id='empty_column.account_featured_self.no_collections_button'
+              defaultMessage='Create a collection'
             />
-          }
-          message={
-            <FormattedMessage
-              id='empty_column.account_featured_self.showcase_accounts_desc'
-              defaultMessage='Collections are curated lists of accounts to help others discover more of the Fediverse.'
-            />
-          }
-        >
-          {!withoutAddCollectionButton && (
-            <Link to='/collections/new' className='button'>
-              <FormattedMessage
-                id='empty_column.account_featured_self.no_collections_button'
-                defaultMessage='Create a collection'
-              />
-            </Link>
-          )}
-          <Button secondary onClick={confirmHideFeaturedTab}>
-            <FormattedMessage
-              id='empty_column.account_featured_self.no_collections_hide_tab'
-              defaultMessage='Hide this tab instead'
-            />
-          </Button>
-        </EmptyState>
-      );
-    } else {
-      title = (
-        <FormattedMessage
-          id='empty_column.account_featured_self.pre_collections'
-          defaultMessage='Stay tuned for Collections'
-        />
-      );
-      message = (
-        <FormattedMessage
-          id='empty_column.account_featured_self.pre_collections_desc'
-          defaultMessage='Collections (coming in Mastodon 4.6) allow you to create your own curated lists of accounts to recommend to others.'
-        />
-      );
-    }
+          </Link>
+        )}
+        <Button secondary onClick={confirmHideFeaturedTab}>
+          <FormattedMessage
+            id='empty_column.account_featured_self.no_collections_hide_tab'
+            defaultMessage='Hide this tab instead'
+          />
+        </Button>
+      </EmptyState>
+    );
   } else if (suspended) {
     title = (
       <FormattedMessage

app/javascript/mastodon/features/account_featured/index.tsx

@@ -30,13 +30,10 @@ import AddIcon from '@/material-icons/400-24px/add.svg?react';
 
 import { CollectionListItem } from '../collections/components/collection_list_item';
 import { useCollectionsCreatedBy } from '../collections/overview/created_by_you';
-import { areCollectionsEnabled } from '../collections/utils';
 
 import { EmptyMessage } from './components/empty_message';
 import { Subheading, SubheadingLink } from './components/subheading';
 
-const collectionsEnabled = areCollectionsEnabled();
-
 const AccountFeatured: React.FC<{ multiColumn: boolean }> = ({
   multiColumn,
 }) => {
@@ -98,14 +95,11 @@ const AccountFeatured: React.FC<{ multiColumn: boolean }> = ({
   );
 
   const hasCollections =
-    collectionsEnabled &&
-    collectionsLoadStatus === 'idle' &&
-    listedCollections.length > 0;
+    collectionsLoadStatus === 'idle' && listedCollections.length > 0;
 
   const hasFeaturedAccounts = !featuredAccountIds.isEmpty();
 
-  const isLoading =
-    !accountId || (collectionsEnabled && collectionsLoadStatus !== 'idle');
+  const isLoading = !accountId || collectionsLoadStatus !== 'idle';
 
   if (accountId === null) {
     return <BundleColumnError multiColumn={multiColumn} errorType='routing' />;
@@ -165,57 +159,53 @@ const AccountFeatured: React.FC<{ multiColumn: boolean }> = ({
             </ItemList>
           </>
         )}
-        {collectionsEnabled && (
-          <>
-            <Subheading as='header'>
-              <h2>
-                <FormattedMessage
-                  id='account.featured.collections'
-                  defaultMessage='Collections'
-                />
-              </h2>
-              {accountId === me && (
-                <SubheadingLink to='/collections/new' icon={AddIcon}>
-                  <FormattedMessage
-                    id='account.featured.new_collection'
-                    defaultMessage='New collection'
-                  />
-                </SubheadingLink>
-              )}
-            </Subheading>
-            {hasCollections ? (
-              <ItemList>
-                <TruncatedListItems
-                  visibleItems={listedCollections}
-                  truncatedItems={unlistedCollections}
-                  toggleButton={{
-                    title: (
-                      <FormattedMessage
-                        id='collections.unlisted_collections_with_count'
-                        defaultMessage='Unlisted collections ({count})'
-                        values={{ count: unlistedCollections.length }}
-                      />
-                    ),
-                    subtitle: (
-                      <FormattedMessage
-                        id='collections.unlisted_collections_description'
-                        defaultMessage='These don’t appear on your profile to others. Anyone with the link can discover them.'
-                      />
-                    ),
-                  }}
-                  renderListItem={renderListItem}
-                />
-              </ItemList>
-            ) : (
-              <EmptyMessage
-                withoutAddCollectionButton
-                blockedBy={blockedBy}
-                hidden={hidden}
-                suspended={suspended}
-                accountId={accountId}
+        <Subheading as='header'>
+          <h2>
+            <FormattedMessage
+              id='account.featured.collections'
+              defaultMessage='Collections'
+            />
+          </h2>
+          {accountId === me && (
+            <SubheadingLink to='/collections/new' icon={AddIcon}>
+              <FormattedMessage
+                id='account.featured.new_collection'
+                defaultMessage='New collection'
               />
-            )}
-          </>
+            </SubheadingLink>
+          )}
+        </Subheading>
+        {hasCollections ? (
+          <ItemList>
+            <TruncatedListItems
+              visibleItems={listedCollections}
+              truncatedItems={unlistedCollections}
+              toggleButton={{
+                title: (
+                  <FormattedMessage
+                    id='collections.unlisted_collections_with_count'
+                    defaultMessage='Unlisted collections ({count})'
+                    values={{ count: unlistedCollections.length }}
+                  />
+                ),
+                subtitle: (
+                  <FormattedMessage
+                    id='collections.unlisted_collections_description'
+                    defaultMessage='These don’t appear on your profile to others. Anyone with the link can discover them.'
+                  />
+                ),
+              }}
+              renderListItem={renderListItem}
+            />
+          </ItemList>
+        ) : (
+          <EmptyMessage
+            withoutAddCollectionButton
+            blockedBy={blockedBy}
+            hidden={hidden}
+            suspended={suspended}
+            accountId={accountId}
+          />
         )}
         <RemoteHint accountId={accountId} />
       </Scrollable>

app/javascript/mastodon/features/collections/editor/accounts.tsx

@@ -215,6 +215,7 @@ export const CollectionAccounts: React.FC<{
     resetAccounts,
   } = useSearchAccounts({
     withRelationships: true,
+    withDefaultFollows: searchValue === '',
     // Don't suggest accounts that were already added
     filterResults: (account) =>
       !editorItems.find((item) => item.account_id === account.id),
@@ -363,6 +364,7 @@ export const CollectionAccounts: React.FC<{
           )}
           {hasPendingItems && <PendingNote />}
           <ComboboxField
+            openOnFocus
             id={inputId}
             label={intl.formatMessage({
               id: 'collections.search_accounts_label',

app/javascript/mastodon/features/collections/overview/created_by_you.tsx

@@ -23,7 +23,6 @@ import {
   userCollectionLimit,
 } from '../editor';
 import classes from '../styles.module.scss';
-import { areCollectionsEnabled } from '../utils';
 
 const CreateButton: React.FC = () => (
   <Link to='/collections/new' className='button button--compact'>
@@ -49,7 +48,7 @@ export function useCollectionsCreatedBy(accountId: string | null | undefined) {
   const dispatch = useAppDispatch();
 
   useEffect(() => {
-    if (accountId && areCollectionsEnabled()) {
+    if (accountId) {
       void dispatch(fetchCollectionsCreatedByAccount({ accountId }));
     }
   }, [dispatch, accountId]);

app/javascript/mastodon/features/collections/overview/featuring_you.tsx

@@ -15,7 +15,6 @@ import { useAppSelector, useAppDispatch } from 'mastodon/store';
 
 import { CollectionListItem } from '../components/collection_list_item';
 import classes from '../styles.module.scss';
-import { areCollectionsEnabled } from '../utils';
 
 import { CollectionListError } from './created_by_you';
 
@@ -23,7 +22,7 @@ function useCollectionsFeaturing(accountId: string | null | undefined) {
   const dispatch = useAppDispatch();
 
   useEffect(() => {
-    if (accountId && areCollectionsEnabled()) {
+    if (accountId) {
       void dispatch(fetchCollectionsFeaturingAccount({ accountId }));
     }
   }, [dispatch, accountId]);

app/javascript/mastodon/features/collections/utils.ts

@@ -1,18 +1,13 @@
-import type { ApiMutedAccountJSON } from '@/mastodon/api_types/accounts';
+import type { ApiAccountJSON } from '@/mastodon/api_types/accounts';
 import type { Account } from '@/mastodon/models/account';
-import { isServerFeatureEnabled } from '@/mastodon/utils/environment';
-
-export function areCollectionsEnabled() {
-  return isServerFeatureEnabled('collections');
-}
 
 export const getCollectionPath = (id: string) => `/collections/${id}`;
 
-export const canAccountBeAdded = (account: ApiMutedAccountJSON | Account) =>
+export const canAccountBeAdded = (account: ApiAccountJSON | Account) =>
   ['automatic', 'manual'].includes(account.feature_approval.current_user);
 
 export const canAccountBeAddedByFollowers = (
-  account: ApiMutedAccountJSON | Account,
+  account: ApiAccountJSON | Account,
 ) =>
   account.feature_approval.automatic.includes('followers') ||
   account.feature_approval.manual.includes('followers');

app/javascript/mastodon/features/lists/members.tsx

@@ -15,7 +15,7 @@ import { fetchList } from 'mastodon/actions/lists';
 import { openModal } from 'mastodon/actions/modal';
 import { apiFollowAccount } from 'mastodon/api/accounts';
 import {
-  apiGetAccounts,
+  apiGetListAccounts,
   apiAddAccountToList,
   apiRemoveAccountFromList,
 } from 'mastodon/api/lists';
@@ -184,7 +184,7 @@ const ListMembers: React.FC<{
     if (id) {
       dispatch(fetchList(id));
 
-      void apiGetAccounts(id)
+      void apiGetListAccounts(id)
         .then((data) => {
           dispatch(importFetchedAccounts(data));
           setAccountIds(data.map((a) => a.id));

app/javascript/mastodon/features/lists/new.tsx

@@ -12,7 +12,7 @@ import ChevronRightIcon from '@/material-icons/400-24px/chevron_right.svg?react'
 import ListAltIcon from '@/material-icons/400-24px/list_alt.svg?react';
 import { fetchList } from 'mastodon/actions/lists';
 import { createList, updateList } from 'mastodon/actions/lists_typed';
-import { apiGetAccounts } from 'mastodon/api/lists';
+import { apiGetListAccounts } from 'mastodon/api/lists';
 import type { ApiAccountJSON } from 'mastodon/api_types/accounts';
 import type { RepliesPolicyType } from 'mastodon/api_types/lists';
 import { Avatar } from 'mastodon/components/avatar';
@@ -44,7 +44,7 @@ const MembersLink: React.FC<{
   const [avatarAccounts, setAvatarAccounts] = useState<ApiAccountJSON[]>([]);
 
   useEffect(() => {
-    void apiGetAccounts(id)
+    void apiGetListAccounts(id)
       .then((data) => {
         setAvatarCount(data.length);
         setAvatarAccounts(data.slice(0, 3));

app/javascript/mastodon/features/navigation_panel/index.tsx

@@ -51,7 +51,6 @@ import { selectUnreadNotificationGroupsCount } from 'mastodon/selectors/notifica
 import { useAppSelector, useAppDispatch } from 'mastodon/store';
 
 import { AnnualReportNavItem } from '../annual_report/nav_item';
-import { areCollectionsEnabled } from '../collections/utils';
 
 import { DisabledAccountBanner } from './components/disabled_account_banner';
 import { FollowedTagsPanel } from './components/followed_tags_panel';
@@ -361,18 +360,16 @@ export const NavigationPanel: React.FC<{ multiColumn?: boolean }> = ({
                 text={intl.formatMessage(messages.bookmarks)}
               />
             </li>
-            {areCollectionsEnabled() && (
-              <li>
-                <ColumnLink
-                  transparent
-                  to={`/@${account?.acct}/collections`}
-                  icon='collections'
-                  iconComponent={CollectionsIcon}
-                  activeIconComponent={CollectionsActiveIcon}
-                  text={intl.formatMessage(messages.collections)}
-                />
-              </li>
-            )}
+            <li>
+              <ColumnLink
+                transparent
+                to={`/@${account?.acct}/collections`}
+                icon='collections'
+                iconComponent={CollectionsIcon}
+                activeIconComponent={CollectionsActiveIcon}
+                text={intl.formatMessage(messages.collections)}
+              />
+            </li>
             <li>
               <ColumnLink
                 transparent

app/javascript/mastodon/features/notifications/components/column_settings.jsx

@@ -12,6 +12,7 @@ import ClearColumnButton from './clear_column_button';
 import GrantPermissionButton from './grant_permission_button';
 import { PolicyControls } from './policy_controls';
 import SettingToggle from './setting_toggle';
+import { ColumnSettingsGroup } from './column_settings_group';
 
 class ColumnSettings extends PureComponent {
   static propTypes = {
@@ -187,6 +188,11 @@ class ColumnSettings extends PureComponent {
           </div>
         </section>
 
+        <ColumnSettingsGroup
+          type="collections"
+          label={<FormattedMessage id='notifications.column_settings.collections' defaultMessage='Collections:' />}
+        />
+
         {((this.props.identity.permissions & PERMISSION_MANAGE_USERS) === PERMISSION_MANAGE_USERS) && (
           <section role='group' aria-labelledby='notifications-admin-sign-up'>
             <h3 id='notifications-status'><FormattedMessage id='notifications.column_settings.admin.sign_up' defaultMessage='New sign-ups:' /></h3>

app/javascript/mastodon/features/notifications/components/column_settings_group.tsx

@@ -0,0 +1,162 @@
+import { useCallback } from 'react';
+import type { FC, ReactNode } from 'react';
+
+import { defineMessages, FormattedMessage } from 'react-intl';
+
+import { showAlert } from '@/mastodon/actions/alerts';
+import { requestBrowserPermission } from '@/mastodon/actions/notifications';
+import { changeAlerts } from '@/mastodon/actions/push_notifications';
+import { changeSetting } from '@/mastodon/actions/settings';
+import {
+  createAppSelector,
+  useAppDispatch,
+  useAppSelector,
+} from '@/mastodon/store';
+
+import SettingToggle from './setting_toggle';
+
+const selectNotificationSettings = createAppSelector(
+  [
+    (state) =>
+      (state.settings as Immutable.Map<string, unknown>).get(
+        'notifications',
+      ) as Immutable.Map<string, Immutable.Map<string, unknown> | boolean>,
+    (state) => state.notifications.get('browserPermission') as string,
+    (state) => state.push_notifications,
+  ],
+  (settings, browserPermission, pushSettings) => ({
+    settings,
+    browserPermission: browserPermission !== 'denied',
+    pushSettings,
+    showPushSettings:
+      pushSettings.get('supported') && pushSettings.get('enabled'),
+  }),
+);
+
+const messages = defineMessages({
+  permissionDenied: {
+    id: 'notifications.permission_denied_alert',
+    defaultMessage:
+      "Desktop notifications can't be enabled, as browser permission has been denied before",
+  },
+});
+
+type SettingsType = 'alerts' | 'shows' | 'sounds';
+
+export const ColumnSettingsGroup: FC<{ label: ReactNode; type: string }> = ({
+  label,
+  type,
+}) => {
+  const { settings, browserPermission, pushSettings, showPushSettings } =
+    useAppSelector(selectNotificationSettings);
+
+  const dispatch = useAppDispatch();
+  const handleChange = useCallback(
+    (path: [SettingsType, string], checked: boolean) => {
+      if (
+        path[0] === 'alerts' &&
+        checked &&
+        typeof window.Notification !== 'undefined' &&
+        Notification.permission !== 'granted'
+      ) {
+        dispatch(
+          requestBrowserPermission((permission) => {
+            if (permission === 'granted') {
+              dispatch(changeSetting(['notifications', ...path], checked));
+            } else {
+              dispatch(showAlert({ message: messages.permissionDenied }));
+            }
+          }),
+        );
+      } else {
+        dispatch(changeSetting(['notifications', ...path], checked));
+      }
+    },
+    [dispatch],
+  );
+  const handlePushChange = useCallback(
+    (path: string[], checked: boolean) => {
+      if (
+        checked &&
+        typeof window.Notification !== 'undefined' &&
+        Notification.permission !== 'granted'
+      ) {
+        dispatch(
+          requestBrowserPermission((permission: NotificationPermission) => {
+            if (permission === 'granted') {
+              dispatch(changeAlerts(path, checked));
+            } else {
+              dispatch(showAlert({ message: messages.permissionDenied }));
+            }
+          }),
+        );
+      } else {
+        dispatch(changeAlerts(path, checked));
+      }
+    },
+    [dispatch],
+  );
+
+  return (
+    <section role='group' aria-labelledby={`notifications-${type}`}>
+      <h3 id={`notifications-${type}`}>{label}</h3>
+
+      <div className='column-settings__row'>
+        <SettingToggle
+          disabled={!browserPermission}
+          prefix='notifications_desktop'
+          settings={settings}
+          settingPath={['alerts', type]}
+          onChange={handleChange}
+          label={
+            <FormattedMessage
+              id='notifications.column_settings.alert'
+              defaultMessage='Desktop notifications'
+            />
+          }
+        />
+
+        {showPushSettings && (
+          <SettingToggle
+            prefix='notifications_push'
+            settings={pushSettings}
+            settingPath={['alerts', type]}
+            onChange={handlePushChange}
+            label={
+              <FormattedMessage
+                id='notifications.column_settings.push'
+                defaultMessage='Push notifications'
+              />
+            }
+          />
+        )}
+
+        <SettingToggle
+          prefix='notifications'
+          settings={settings}
+          settingPath={['shows', type]}
+          onChange={handleChange}
+          label={
+            <FormattedMessage
+              id='notifications.column_settings.show'
+              defaultMessage='Show in column'
+            />
+          }
+        />
+
+        <SettingToggle
+          prefix='notifications'
+          settings={settings}
+          settingPath={['sounds', type]}
+          onChange={handleChange}
+          label={
+            <FormattedMessage
+              id='notifications.column_settings.sound'
+              defaultMessage='Play sound'
+            />
+          }
+        />
+      </div>
+    </section>
+  );
+};

app/javascript/mastodon/features/notifications_v2/filter_bar.tsx

@@ -3,6 +3,7 @@ import { useCallback } from 'react';
 
 import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 
+import CollectionsIcon from '@/material-icons/400-24px/category.svg?react';
 import HomeIcon from '@/material-icons/400-24px/home-fill.svg?react';
 import InsertChartIcon from '@/material-icons/400-24px/insert_chart.svg?react';
 import PersonAddIcon from '@/material-icons/400-24px/person_add.svg?react';
@@ -26,6 +27,10 @@ const tooltips = defineMessages({
   boosts: { id: 'notifications.filter.boosts', defaultMessage: 'Boosts' },
   polls: { id: 'notifications.filter.polls', defaultMessage: 'Poll results' },
   follows: { id: 'notifications.filter.follows', defaultMessage: 'Follows' },
+  collections: {
+    id: 'notifications.filter.collections',
+    defaultMessage: 'Collections',
+  },
   statuses: {
     id: 'notifications.filter.statuses',
     defaultMessage: 'Updates from people you follow',
@@ -124,6 +129,14 @@ export const FilterBar: React.FC = () => {
         >
           <Icon id='user-plus' icon={PersonAddIcon} />
         </BarButton>
+        <BarButton
+          selectedFilter={selectedFilter}
+          type='collection'
+          key='collection'
+          title={intl.formatMessage(tooltips.collections)}
+        >
+          <Icon id='collections' icon={CollectionsIcon} />
+        </BarButton>
       </div>
     );
   else

app/javascript/mastodon/features/ui/components/block_modal.jsx

@@ -17,7 +17,6 @@ import { blockAccount } from 'mastodon/actions/accounts';
 import { closeModal } from 'mastodon/actions/modal';
 import { Button } from 'mastodon/components/button';
 import { Icon } from 'mastodon/components/icon';
-import { areCollectionsEnabled } from '../../collections/utils';
 
 export const BlockModal = ({ accountId, acct }) => {
   const dispatch = useDispatch();
@@ -73,12 +72,10 @@ export const BlockModal = ({ accountId, acct }) => {
             <div><FormattedMessage id='block_modal.they_cant_mention' defaultMessage="You can't mention, follow, or quote each other." /></div>
           </li>
 
-          {areCollectionsEnabled() && 
-            <li>
-              <div className='safety-action-modal__bullet-points__icon'><Icon icon={CollectionsIcon} /></div>
-              <div><FormattedMessage id='block_modal.no_collections' defaultMessage="Neither of you can add each other to collections. You'll be automatically removed from each others' existing collections, if applicable." /></div>
-            </li>
-          }
+          <li>
+            <div className='safety-action-modal__bullet-points__icon'><Icon icon={CollectionsIcon} /></div>
+            <div><FormattedMessage id='block_modal.no_collections' defaultMessage="Neither of you can add each other to collections. You'll be automatically removed from each others' existing collections, if applicable." /></div>
+          </li>
         </ul>
       </div>
 

app/javascript/mastodon/features/ui/index.jsx

@@ -93,7 +93,6 @@ import { CustomHomepage } from 'mastodon/features/custom_homepage';
 // Dummy import, to make sure that <Status /> ends up in the application bundle.
 // Without this it ends up in ~8 very commonly used bundles.
 import '../../components/status';
-import { areCollectionsEnabled } from '../collections/utils';
 import { getNavigationSkipLinkId, SkipLinks } from './components/skip_links';
 
 const messages = defineMessages({
@@ -235,13 +234,9 @@ class SwitchingColumnsArea extends PureComponent {
 
             <WrappedRoute path={['/@:acct', '/accounts/:id']} exact component={AccountTimeline} content={children} />
             <WrappedRoute path={['/@:acct/featured', '/accounts/:id/featured']} component={AccountFeatured} content={children} />
-            {areCollectionsEnabled() &&
-              [
-                <WrappedRoute path={['/@:acct/collections']} component={Collections} content={children} key='collections-list' />,
-                <WrappedRoute path={['/collections/new', '/collections/:id/edit']} component={CollectionsEditor} content={children} key='collections-editor' />,
-                <WrappedRoute path='/collections/:id' component={CollectionDetail} content={children} key='collections-detail' />,
-              ]
-            }
+            <WrappedRoute path={['/@:acct/collections']} component={Collections} content={children} key='collections-list' />
+            <WrappedRoute path={['/collections/new', '/collections/:id/edit']} component={CollectionsEditor} content={children} key='collections-editor' />
+            <WrappedRoute path='/collections/:id' component={CollectionDetail} content={children} key='collections-detail' />
             <WrappedRoute path='/@:acct/tagged/:tagged?' exact component={AccountTimeline} content={children} />
             <WrappedRoute path={['/@:acct/with_replies', '/accounts/:id/with_replies']} component={AccountTimeline} content={children} componentParams={{ withReplies: true }} />
             <WrappedRoute path={['/accounts/:id/followers', '/users/:acct/followers', '/@:acct/followers']} component={Followers} content={children} />