Show collection preview cards and open collections links locally (#38643)

app/javascript/mastodon/features/status/components/detailed_status.tsx

@@ -29,9 +29,12 @@ import StatusContent from 'mastodon/components/status_content';
 import { QuotedStatus } from 'mastodon/components/status_quoted';
 import { VisibilityIcon } from 'mastodon/components/visibility_icon';
 import { Audio } from 'mastodon/features/audio';
+import { CollectionPreviewCard } from 'mastodon/features/collections/components/collection_preview_card';
 import scheduleIdleTask from 'mastodon/features/ui/util/schedule_idle_task';
 import { Video } from 'mastodon/features/video';
 import { useIdentity } from 'mastodon/identity_context';
+import type { CollectionAttachment } from 'mastodon/models/status';
+import { compareUrls } from 'mastodon/utils/compare_urls';
 
 import Card from './card';
 
@@ -260,13 +263,25 @@ export const DetailedStatus: React.FC<{
       );
     }
   } else if (status.get('card') && !status.get('quote')) {
-    media = (
-      <Card
-        key={`${status.get('id')}-${status.get('edited_at')}`}
-        sensitive={status.get('sensitive')}
-        card={status.get('card')}
-      />
-    );
+    const cardUrl: string = status.getIn(['card', 'url']);
+
+    const taggedCollection = status
+      .get('tagged_collections')
+      .find((item: CollectionAttachment) =>
+        compareUrls(item.get('url'), cardUrl),
+      );
+
+    if (taggedCollection) {
+      media = <CollectionPreviewCard collection={taggedCollection} />;
+    } else {
+      media = (
+        <Card
+          key={`${status.get('id')}-${status.get('edited_at')}`}
+          sensitive={status.get('sensitive')}
+          card={status.get('card')}
+        />
+      );
+    }
   }
 
   if (status.get('application')) {