Merge branch 'status-focus-outline' into 'develop'

Fix: When I visit a link to a status, the user's avatar is focused

Closes #1049

See merge request soapbox-pub/soapbox-fe!1671

app/soapbox/features/status/components/detailed-status.tsx

@@ -127,7 +127,7 @@ class DetailedStatus extends ImmutablePureComponent<IDetailedStatus, IDetailedSt
 
     return (
       <div style={outerStyle}>
-        <div ref={this.setRef} className={classNames('detailed-status', { compact })}>
+        <div ref={this.setRef} className={classNames('detailed-status', { compact })} tabIndex={-1}>
           <div className='mb-4'>
             <AccountContainer
               key={account.id}

app/soapbox/features/status/index.tsx

@@ -644,7 +644,7 @@ class Status extends ImmutablePureComponent<IStatus, IStatusState> {
         offset: -80,
       });
 
-      setImmediate(() => this.status?.querySelector('a')?.focus());
+      setImmediate(() => this.status?.querySelector<HTMLDivElement>('.detailed-status')?.focus());
     }
   }