diff --git a/components/status/StatusBody.vue b/components/status/StatusBody.vue index 8a41e050..ae125d86 100644 --- a/components/status/StatusBody.vue +++ b/components/status/StatusBody.vue @@ -17,17 +17,6 @@ const { translation } = useTranslation(status, getLanguageCode()) const emojisObject = useEmojisFallback(() => status.emojis) -/** - * example status raw content - * - *

🔴 trying to code live - come let's talk @elk and twitch.tv/ayoayco

- * - * - * "

I say something about the link first

https://ayco.io

" - - * - */ - const vnode = $computed(() => { if (!status.content) return null diff --git a/components/status/StatusPreviewCardNormal.vue b/components/status/StatusPreviewCardNormal.vue index 07dc62ce..9c6cd62e 100644 --- a/components/status/StatusPreviewCardNormal.vue +++ b/components/status/StatusPreviewCardNormal.vue @@ -21,7 +21,17 @@ const isSquare = $computed(() => ( || Number(props.card.width || 0) < ogImageWidth || Number(props.card.height || 0) < ogImageWidth / 2 )) -const providerName = $computed(() => props.card.providerName ? `${props.card.providerName} · ${props.cleanSharedLink}` : new URL(props.card.url).hostname) +const providerName = $computed(() => { + let finalProviderName = new URL(props.card.url).hostname + + if (props.card.providerName) { + finalProviderName = props.card.providerName + if (props.cleanSharedLink && finalProviderName !== props.cleanSharedLink) + finalProviderName = `${props.card.providerName} · ${props.cleanSharedLink}` + } + + return finalProviderName +}) // TODO: handle card.type: 'photo' | 'video' | 'rich'; const cardTypeIconMap: Record = { diff --git a/composables/content-parse.ts b/composables/content-parse.ts index 947d3421..c37374e6 100644 --- a/composables/content-parse.ts +++ b/composables/content-parse.ts @@ -132,22 +132,28 @@ export function parseMastodonHTML( const node = parse(html) as Node if (cleanSharedLink) { - const filteredNode = node.children.filter((child: Node) => !!child.children) // remove invisible spans - const filteredLength = filteredNode.length - const length = filteredNode[filteredLength - 1].children.length - const lastChild = filteredNode[filteredLength - 1].children[length - 1] - const sharedHref = lastChild.attributes?.href - const match = sharedHref === cleanSharedLink + // filter out invisible spans + const filteredNode = node.children.filter((child: Node) => !!child.children) + const matchedIndex = lastChildLinkMatchesPreviewUrl(filteredNode, cleanSharedLink) - if (match) { - const index = length - 1 - filteredNode[filteredLength - 1].children.splice(index, 1) - } + if (matchedIndex) + filteredNode[filteredNode.length - 1].children.splice(matchedIndex, 1) } return transformSync(node, transforms) } +/** + * Returns the index of the last link node if it matches the previewUrl + */ +export function lastChildLinkMatchesPreviewUrl(filteredNode: Node, previewUrl: string) { + const filteredLength = filteredNode.length + const length = filteredNode[filteredLength - 1].children.length + const lastChild = filteredNode[filteredLength - 1].children[length - 1] + const sharedHref = lastChild.attributes?.href + return sharedHref === previewUrl ? length - 1 : null +} + /** * Converts raw HTML form Mastodon server to HTML for Tiptap editor */