Skip to content

Commit e6e884f

Browse files
committed
Refactor + make card post work for no-image cards
1 parent b6a25f5 commit e6e884f

File tree

1 file changed

+21
-14
lines changed

1 file changed

+21
-14
lines changed

src/components/status.jsx

Lines changed: 21 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2456,6 +2456,22 @@ function MediaFirstContainer(props) {
24562456
);
24572457
}
24582458

2459+
function getDomain(url) {
2460+
return punycode.toUnicode(
2461+
URL.parse(url)
2462+
.hostname.replace(/^www\./, '')
2463+
.replace(/\/$/, ''),
2464+
);
2465+
}
2466+
2467+
// "Post": Quote post + card link preview combo
2468+
// Assume all links from these domains are "posts"
2469+
// Mastodon links are "posts" too but they are converted to real quote posts and there's too many domains to check
2470+
// This is just "Progressive Enhancement"
2471+
function isCardPost(domain) {
2472+
return ['x.com', 'twitter.com', 'threads.net', 'bsky.app'].includes(domain);
2473+
}
2474+
24592475
function Card({ card, selfReferential, instance }) {
24602476
const snapStates = useSnapshot(states);
24612477
const {
@@ -2534,11 +2550,7 @@ function Card({ card, selfReferential, instance }) {
25342550
);
25352551

25362552
if (hasText && (image || (type === 'photo' && blurhash))) {
2537-
const domain = punycode.toUnicode(
2538-
URL.parse(url)
2539-
.hostname.replace(/^www\./, '')
2540-
.replace(/\/$/, ''),
2541-
);
2553+
const domain = getDomain(url);
25422554
let blurhashImage;
25432555
const rgbAverageColor =
25442556
image && blurhash ? getBlurHashAverageColor(blurhash) : null;
@@ -2559,11 +2571,7 @@ function Card({ card, selfReferential, instance }) {
25592571
blurhashImage = canvas.toDataURL();
25602572
}
25612573

2562-
// "Post": Quote post + card link preview combo
2563-
// Assume all links from these domains are "posts"
2564-
// Mastodon links are "posts" too but they are converted to real quote posts and there's too many domains to check
2565-
// This is just "Progressive Enhancement"
2566-
const isPost = ['x.com', 'twitter.com', 'threads.net'].includes(domain);
2574+
const isPost = isCardPost(domain);
25672575

25682576
return (
25692577
<a
@@ -2669,15 +2677,14 @@ function Card({ card, selfReferential, instance }) {
26692677
// );
26702678
}
26712679
if (hasText && !image) {
2672-
const domain = punycode.toUnicode(
2673-
URL.parse(url).hostname.replace(/^www\./, ''),
2674-
);
2680+
const domain = getDomain(url);
2681+
const isPost = isCardPost(domain);
26752682
return (
26762683
<a
26772684
href={cardStatusURL || url}
26782685
target={cardStatusURL ? null : '_blank'}
26792686
rel="nofollow noopener noreferrer"
2680-
class={`card link no-image`}
2687+
class={`card link ${isPost ? 'card-post' : ''} no-image`}
26812688
lang={language}
26822689
onClick={handleClick}
26832690
>

0 commit comments

Comments
 (0)