refactor: simplify ContentLinkUrl rendering

This commit is contained in:
2026-04-11 18:56:23 +05:30
parent ebc1e72b28
commit bdc7d9e070
3 changed files with 14 additions and 24 deletions
+11 -8
View File
@@ -1,8 +1,9 @@
<script lang="ts">
import {ellipsize, displayUrl, postJson} from "@welshman/lib"
import {call, ellipsize, displayUrl, postJson} from "@welshman/lib"
import {isRelayUrl, getTagValue} from "@welshman/util"
import {Capacitor} from "@capacitor/core"
import {preventDefault, stopPropagation} from "@lib/html"
import Link from "@lib/components/Link.svelte"
import ContentLinkDetail from "@app/components/ContentLinkDetail.svelte"
import ContentLinkUrl from "@app/components/ContentLinkUrl.svelte"
import ContentLinkBlockImage from "@app/components/ContentLinkBlockImage.svelte"
@@ -10,6 +11,7 @@
import {
dufflepud,
IMAGE_CONTENT_TYPES,
PLATFORM_URL,
VIDEO_CONTENT_TYPES,
THUMBNAIL_URL,
isRoomId,
@@ -21,6 +23,11 @@
const url = value.url.toString()
const isRoomOrRelay = isRoomId(url) || isRelayUrl(url)
const [href, external] = call(() => {
if (url.startsWith(PLATFORM_URL)) return [url.replace(PLATFORM_URL, ""), false]
return [url, true]
})
const fileType = getTagValue("file-type", event.tags) || ""
@@ -50,13 +57,9 @@
</script>
{#if isRoomOrRelay}
<ContentLinkUrl
{url}
class="bg-alt my-2 block p-4 leading-normal whitespace-nowrap"
showIcon
labelClass="ml-2" />
<ContentLinkUrl {url} class="bg-alt my-2 block p-4 leading-normal whitespace-nowrap" />
{:else}
<ContentLinkUrl {url} class="my-2 block">
<Link {external} {href} class="my-2 block">
<div class="overflow-hidden rounded-box">
{#if url.match(/\.(mov|webm|mp4)$/) || VIDEO_CONTENT_TYPES.includes(fileType)}
<video
@@ -98,5 +101,5 @@
{/await}
{/if}
</div>
</ContentLinkUrl>
</Link>
{/if}
+1 -1
View File
@@ -27,5 +27,5 @@
{displayUrl(url)}
</a>
{:else}
<ContentLinkUrl {url} class="link-content whitespace-nowrap" showIcon />
<ContentLinkUrl {url} class="link-content whitespace-nowrap" />
{/if}
+2 -15
View File
@@ -1,5 +1,4 @@
<script lang="ts">
import type {Snippet} from "svelte"
import {call, displayUrl} from "@welshman/lib"
import {displayRelayUrl, isRelayUrl, normalizeRelayUrl} from "@welshman/util"
import LinkRound from "@assets/icons/link-round.svg?dataurl"
@@ -9,17 +8,11 @@
import {makeRoomPath, makeSpacePath} from "@app/util/routes"
const {
children,
url,
class: className = "",
showIcon = false,
labelClass = "",
}: {
children?: Snippet
url: string
class?: string
showIcon?: boolean
labelClass?: string
} = $props()
const roomReference = call(() => {
@@ -69,12 +62,6 @@
</script>
<Link {external} {href} class={className}>
{#if children}
{@render children()}
{:else if showIcon}
<Icon icon={LinkRound} size={3} class="inline-block" />
<span class={labelClass}>{label}</span>
{:else}
{label}
{/if}
<Icon icon={LinkRound} size={3} class="inline-block" />
<span class="ml-2">{label}</span>
</Link>