Fixes collection notification urls (#39127)

app/javascript/mastodon/components/status/handled_link.tsx

@@ -4,7 +4,6 @@ import type { ComponentProps, FC } from 'react';
 import classNames from 'classnames';
 import { Link } from 'react-router-dom';
 
-import type { ApiCollectionJSON } from '@/mastodon/api_types/collections';
 import type { ApiMentionJSON } from '@/mastodon/api_types/statuses';
 import { getCollectionPath } from '@/mastodon/features/collections/utils';
 import type { OnElementHandler } from '@/mastodon/utils/html';
@@ -15,7 +14,7 @@ export interface HandledLinkProps {
   prevText?: string;
   hashtagAccountId?: string;
   mention?: Pick<ApiMentionJSON, 'id' | 'acct'>;
-  collection?: Pick<ApiCollectionJSON, 'id'>;
+  collectionId?: string;
 }
 
 export const HandledLink: FC<HandledLinkProps & ComponentProps<'a'>> = ({
@@ -24,7 +23,7 @@ export const HandledLink: FC<HandledLinkProps & ComponentProps<'a'>> = ({
   prevText,
   hashtagAccountId,
   mention,
-  collection,
+  collectionId,
   className,
   children,
   ...props
@@ -61,11 +60,11 @@ export const HandledLink: FC<HandledLinkProps & ComponentProps<'a'>> = ({
         {children}
       </Link>
     );
-  } else if (collection) {
+  } else if (collectionId) {
     return (
       <Link
         className={classNames(className)}
-        to={getCollectionPath(collection.id)}
+        to={getCollectionPath(collectionId)}
       >
         {children}
       </Link>
@@ -98,15 +97,18 @@ export const HandledLink: FC<HandledLinkProps & ComponentProps<'a'>> = ({
 
 export const useElementHandledLink = ({
   hashtagAccountId,
+  hrefToCollectionId: hrefToCollection,
   hrefToMention,
 }: {
   hashtagAccountId?: string;
+  hrefToCollectionId?: (href: string) => string | undefined;
   hrefToMention?: (href: string) => ApiMentionJSON | undefined;
 } = {}) => {
   const onElement = useCallback<OnElementHandler>(
     (element, { key, ...props }, children) => {
       if (element instanceof HTMLAnchorElement) {
         const mention = hrefToMention?.(element.href);
+        const collectionId = hrefToCollection?.(element.href);
         return (
           <HandledLink
             {...props}
@@ -116,6 +118,7 @@ export const useElementHandledLink = ({
             prevText={element.previousSibling?.textContent ?? undefined}
             hashtagAccountId={hashtagAccountId}
             mention={mention}
+            collectionId={collectionId}
           >
             {children}
           </HandledLink>
@@ -123,7 +126,7 @@ export const useElementHandledLink = ({
       }
       return undefined;
     },
-    [hashtagAccountId, hrefToMention],
+    [hashtagAccountId, hrefToCollection, hrefToMention],
   );
   return { onElement };
 };

app/javascript/mastodon/components/status_content.jsx

@@ -170,7 +170,7 @@ class StatusContent extends PureComponent {
           text={element.innerText}
           hashtagAccountId={this.props.status.getIn(['account', 'id'])}
           mention={mention?.toJSON()}
-          collection={taggedCollection?.toJSON()}
+          collectionId={taggedCollection?.get('id')}
           key={key}
         >
           {children}

app/javascript/mastodon/features/collections/components/share_modal.tsx

@@ -24,11 +24,13 @@ import classes from './share_modal.module.scss';
 const messages = defineMessages({
   shareTextOwn: {
     id: 'collection.share_template_own',
-    defaultMessage: 'Check out my new collection: {link}',
+    defaultMessage: 'Check out my new collection:',
+    description: 'Collection links are appended after a new line',
   },
   shareTextOther: {
     id: 'collection.share_template_other',
-    defaultMessage: 'Check out this cool collection: {link}',
+    defaultMessage: 'Check out this cool collection:',
+    description: 'Collection links are appended after a new line',
   },
 });
 
@@ -51,13 +53,10 @@ export const CollectionShareModal: React.FC<{
   }, [collectionLink]);
 
   const handleShareViaPost = useCallback(() => {
-    const shareMessage = isOwnCollection
+    let shareMessage = isOwnCollection
-      ? intl.formatMessage(messages.shareTextOwn, {
+      ? intl.formatMessage(messages.shareTextOwn)
-          link: collectionLink,
+      : intl.formatMessage(messages.shareTextOther);
-        })
+    shareMessage += `\n\n${collectionLink}`;
-      : intl.formatMessage(messages.shareTextOther, {
-          link: collectionLink,
-        });
 
     onClose();
     dispatch(changeCompose(shareMessage));

app/javascript/mastodon/features/notifications_v2/components/embedded_status_content.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useMemo } from 'react';
 
-import type { List } from 'immutable';
+import type { List, Map } from 'immutable';
 
 import { EmojiHTML } from '@/mastodon/components/emoji/html';
 import { useElementHandledLink } from '@/mastodon/components/status/handled_link';
@@ -23,8 +23,19 @@ export const EmbeddedStatusContent: React.FC<{
     },
     [mentions],
   );
+  const hrefToCollection = useCallback(
+    (href: string) => {
+      const collections = status.get('tagged_collections') as List<
+        Map<'url' | 'id', string>
+      >;
+      const collection = collections.find((item) => item.get('url') === href);
+      return collection?.get('id');
+    },
+    [status],
+  );
   const htmlHandlers = useElementHandledLink({
     hashtagAccountId: status.get('account') as string | undefined,
+    hrefToCollectionId: hrefToCollection,
     hrefToMention,
   });
 

app/javascript/mastodon/locales/en.json

@@ -367,8 +367,8 @@
   "collection.share_modal.share_via_system": "Share to…",
   "collection.share_modal.title": "Share collection",
   "collection.share_modal.title_new": "Share your new collection!",
-  "collection.share_template_other": "Check out this cool collection: {link}",
+  "collection.share_template_other": "Check out this cool collection:",
-  "collection.share_template_own": "Check out my new collection: {link}",
+  "collection.share_template_own": "Check out my new collection:",
   "collections.account_count": "{count, plural, one {# account} other {# accounts}}",
   "collections.accounts.empty_description": "Add up to {count} accounts",
   "collections.accounts.empty_editor_title": "No one is in this collection yet",