Refactor + make card post work for no-image cards
This commit is contained in:
parent
b6a25f5939
commit
e6e884f1cb
|
@ -2456,6 +2456,22 @@ function MediaFirstContainer(props) {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getDomain(url) {
|
||||||
|
return punycode.toUnicode(
|
||||||
|
URL.parse(url)
|
||||||
|
.hostname.replace(/^www\./, '')
|
||||||
|
.replace(/\/$/, ''),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// "Post": Quote post + card link preview combo
|
||||||
|
// Assume all links from these domains are "posts"
|
||||||
|
// Mastodon links are "posts" too but they are converted to real quote posts and there's too many domains to check
|
||||||
|
// This is just "Progressive Enhancement"
|
||||||
|
function isCardPost(domain) {
|
||||||
|
return ['x.com', 'twitter.com', 'threads.net', 'bsky.app'].includes(domain);
|
||||||
|
}
|
||||||
|
|
||||||
function Card({ card, selfReferential, instance }) {
|
function Card({ card, selfReferential, instance }) {
|
||||||
const snapStates = useSnapshot(states);
|
const snapStates = useSnapshot(states);
|
||||||
const {
|
const {
|
||||||
|
@ -2534,11 +2550,7 @@ function Card({ card, selfReferential, instance }) {
|
||||||
);
|
);
|
||||||
|
|
||||||
if (hasText && (image || (type === 'photo' && blurhash))) {
|
if (hasText && (image || (type === 'photo' && blurhash))) {
|
||||||
const domain = punycode.toUnicode(
|
const domain = getDomain(url);
|
||||||
URL.parse(url)
|
|
||||||
.hostname.replace(/^www\./, '')
|
|
||||||
.replace(/\/$/, ''),
|
|
||||||
);
|
|
||||||
let blurhashImage;
|
let blurhashImage;
|
||||||
const rgbAverageColor =
|
const rgbAverageColor =
|
||||||
image && blurhash ? getBlurHashAverageColor(blurhash) : null;
|
image && blurhash ? getBlurHashAverageColor(blurhash) : null;
|
||||||
|
@ -2559,11 +2571,7 @@ function Card({ card, selfReferential, instance }) {
|
||||||
blurhashImage = canvas.toDataURL();
|
blurhashImage = canvas.toDataURL();
|
||||||
}
|
}
|
||||||
|
|
||||||
// "Post": Quote post + card link preview combo
|
const isPost = isCardPost(domain);
|
||||||
// Assume all links from these domains are "posts"
|
|
||||||
// Mastodon links are "posts" too but they are converted to real quote posts and there's too many domains to check
|
|
||||||
// This is just "Progressive Enhancement"
|
|
||||||
const isPost = ['x.com', 'twitter.com', 'threads.net'].includes(domain);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<a
|
<a
|
||||||
|
@ -2669,15 +2677,14 @@ function Card({ card, selfReferential, instance }) {
|
||||||
// );
|
// );
|
||||||
}
|
}
|
||||||
if (hasText && !image) {
|
if (hasText && !image) {
|
||||||
const domain = punycode.toUnicode(
|
const domain = getDomain(url);
|
||||||
URL.parse(url).hostname.replace(/^www\./, ''),
|
const isPost = isCardPost(domain);
|
||||||
);
|
|
||||||
return (
|
return (
|
||||||
<a
|
<a
|
||||||
href={cardStatusURL || url}
|
href={cardStatusURL || url}
|
||||||
target={cardStatusURL ? null : '_blank'}
|
target={cardStatusURL ? null : '_blank'}
|
||||||
rel="nofollow noopener noreferrer"
|
rel="nofollow noopener noreferrer"
|
||||||
class={`card link no-image`}
|
class={`card link ${isPost ? 'card-post' : ''} no-image`}
|
||||||
lang={language}
|
lang={language}
|
||||||
onClick={handleClick}
|
onClick={handleClick}
|
||||||
>
|
>
|
||||||
|
|
Loading…
Reference in a new issue