diff --git a/app/javascript/flavours/glitch/components/status/handled_link.tsx b/app/javascript/flavours/glitch/components/status/handled_link.tsx index 55a2a47948..ecc59d7c3c 100644 --- a/app/javascript/flavours/glitch/components/status/handled_link.tsx +++ b/app/javascript/flavours/glitch/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 '@/flavours/glitch/api_types/collections'; import type { ApiMentionJSON } from '@/flavours/glitch/api_types/statuses'; import { getCollectionPath } from '@/flavours/glitch/features/collections/utils'; import { useAppSelector } from '@/flavours/glitch/store'; @@ -17,7 +16,7 @@ export interface HandledLinkProps { prevText?: string; hashtagAccountId?: string; mention?: Pick; - collection?: Pick; + collectionId?: string; } const textMatchesTarget = (text: string, origin: string, host: string) => { @@ -114,7 +113,7 @@ export const HandledLink: FC> = ({ prevText, hashtagAccountId, mention, - collection, + collectionId, className, children, ...props @@ -184,11 +183,11 @@ export const HandledLink: FC> = ({ {children} ); - } else if (collection) { + } else if (collectionId) { return ( {children} @@ -222,15 +221,18 @@ export const HandledLink: FC> = ({ export const useElementHandledLink = ({ hashtagAccountId, + hrefToCollectionId: hrefToCollection, hrefToMention, }: { hashtagAccountId?: string; + hrefToCollectionId?: (href: string) => string | undefined; hrefToMention?: (href: string) => ApiMentionJSON | undefined; } = {}) => { const onElement = useCallback( (element, { key, ...props }, children) => { if (element instanceof HTMLAnchorElement) { const mention = hrefToMention?.(element.href); + const collectionId = hrefToCollection?.(element.href); return ( {children} @@ -247,7 +250,7 @@ export const useElementHandledLink = ({ } return undefined; }, - [hashtagAccountId, hrefToMention], + [hashtagAccountId, hrefToCollection, hrefToMention], ); return { onElement }; }; diff --git a/app/javascript/flavours/glitch/components/status_content.jsx b/app/javascript/flavours/glitch/components/status_content.jsx index d2d2b586e5..570b057257 100644 --- a/app/javascript/flavours/glitch/components/status_content.jsx +++ b/app/javascript/flavours/glitch/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} diff --git a/app/javascript/flavours/glitch/features/collections/components/share_modal.tsx b/app/javascript/flavours/glitch/features/collections/components/share_modal.tsx index 2fccae2df7..3dcdce49aa 100644 --- a/app/javascript/flavours/glitch/features/collections/components/share_modal.tsx +++ b/app/javascript/flavours/glitch/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 - ? intl.formatMessage(messages.shareTextOwn, { - link: collectionLink, - }) - : intl.formatMessage(messages.shareTextOther, { - link: collectionLink, - }); + let shareMessage = isOwnCollection + ? intl.formatMessage(messages.shareTextOwn) + : intl.formatMessage(messages.shareTextOther); + shareMessage += `\n\n${collectionLink}`; onClose(); dispatch(changeCompose(shareMessage)); diff --git a/app/javascript/flavours/glitch/features/notifications_v2/components/embedded_status_content.tsx b/app/javascript/flavours/glitch/features/notifications_v2/components/embedded_status_content.tsx index 52e719ec63..f63cb2f2dd 100644 --- a/app/javascript/flavours/glitch/features/notifications_v2/components/embedded_status_content.tsx +++ b/app/javascript/flavours/glitch/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 '@/flavours/glitch/components/emoji/html'; import { useElementHandledLink } from '@/flavours/glitch/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, });