Add collection detail page (#37897)

app/javascript/mastodon/components/__tests__/__snapshots__/avatar-test.jsx.snap

@@ -1,7 +1,7 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`<Avatar /> > Autoplay > renders a animated avatar 1`] = `
-<div
+<span
   className="account__avatar account__avatar--loading"
   onMouseEnter={[Function]}
   onMouseLeave={[Function]}
@@ -18,11 +18,11 @@ exports[`<Avatar /> > Autoplay > renders a animated avatar 1`] = `
     onLoad={[Function]}
     src="/animated/alice.gif"
   />
-</div>
+</span>
 `;
 
 exports[`<Avatar /> > Still > renders a still avatar 1`] = `
-<div
+<span
   className="account__avatar account__avatar--loading"
   onMouseEnter={[Function]}
   onMouseLeave={[Function]}
@@ -39,5 +39,5 @@ exports[`<Avatar /> > Still > renders a still avatar 1`] = `
     onLoad={[Function]}
     src="/static/alice.jpg"
   />
-</div>
+</span>
 `;

app/javascript/mastodon/components/account/index.tsx

@@ -297,7 +297,7 @@ export const Account: React.FC<AccountProps> = ({
       >
         <div className='account__info-wrapper'>
           <Link
-            className='account__display-name'
+            className='account__display-name focusable'
             title={account?.acct}
             to={`/@${account?.acct}`}
             data-hover-card-account={id}

app/javascript/mastodon/components/avatar.tsx

@@ -53,7 +53,7 @@ export const Avatar: React.FC<Props> = ({
   }, [setError]);
 
   const avatar = (
-    <div
+    <span
       className={classNames(className, 'account__avatar', {
         'account__avatar--inline': inline,
         'account__avatar--loading': loading,
@@ -67,14 +67,14 @@ export const Avatar: React.FC<Props> = ({
       )}
 
       {counter && (
-        <div
+        <span
           className='account__avatar__counter'
           style={{ borderColor: counterBorderColor }}
         >
           {counter}
-        </div>
+        </span>
       )}
-    </div>
+    </span>
   );
 
   if (withLink) {