badmanners/gallery.badmanners.xyz
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add qualifyLocalURLsInMarkdown()

Browse source 
This will handle special links in the description and similar fields
This commit is contained in:
Bad Manners 2024-08-12 21:38:16 -03:00
parent c38275e2f2
commit cd67f6a5c5
20 changed files with 982 additions and 296 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/layouts/PublishedContentLayout.astro
View file

@ -10,6 +10,7 @@ import CopyrightedCharacters from "../components/CopyrightedCharacters.astro";
import Prose from "../components/Prose.astro";
import MastodonComments from "../components/MastodonComments.astro";
import type { CopyrightedCharacters as CopyrightedCharactersType } from "../content/config";
import { qualifyLocalURLsInMarkdown } from "../utils/qualify_local_urls_in_markdown";
interface RelatedContent {
link: string;
@ -62,14 +63,16 @@ const categorizedTags = Object.fromEntries(
),
),
);
const description = await qualifyLocalURLsInMarkdown(props.description, props.lang);
const summary = props.summary && (await qualifyLocalURLsInMarkdown(props.summary, props.lang));
const tags = props.tags.map<{ id: string; name: string }>((tag) => {
const tagSlug = slug(tag);
if (!(tag in categorizedTags)) {
console.warn(`Tag "${tag}" doesn't have a category in the "tag-categories" collection`);
console.warn(`WARNING: Tag "${tag}" doesn't have a category in the "tag-categories" collection`);
return { id: tagSlug, name: tag };
}
if (categorizedTags[tag] == null) {
console.warn(`No "${props.lang}" translation for tag "${tag}"`);
console.warn(`WARNING: No "${props.lang}" translation for tag "${tag}"`);
return { id: tagSlug, name: tag };
}
return { id: tagSlug, name: categorizedTags[tag] };
@ -111,7 +114,7 @@ const thumbnail =
class="pointer-events-auto sticky top-6 flex rounded-full bg-white px-1 py-1 shadow-md dark:bg-black print:hidden"
>
<a
href={series ? series.data.url : props.labelReturnTo.link}
href={series ? series.data.link : props.labelReturnTo.link}
class="text-link my-1 p-2"
aria-labelled-by="label-return-to"
>
@ -291,12 +294,12 @@ const thumbnail =
{t(props.lang, "published_content/description")}
</h2>
<Prose>
<Markdown of={props.description} />
<Markdown of={description} />
<CopyrightedCharacters copyrightedCharacters={props.copyrightedCharacters} lang={props.lang} />
</Prose>
</section>
{
props.summary ? (
summary ? (
<section id="summary" class="px-2 font-serif" aria-describedby="title-summary">
<h2 id="title-summary" class="py-2 font-serif text-xl font-semibold text-stone-800 dark:text-stone-100">
{t(props.lang, "published_content/summary")}
@ -307,7 +310,7 @@ const thumbnail =
</summary>
<div class="px-2 py-1">
<Prose>
<Markdown of={props.summary} />
<Markdown of={summary} />
</Prose>
</div>
</details>
@ -417,10 +420,13 @@ const thumbnail =
<h2 id="title-tags" class="p-2 font-serif text-xl font-semibold text-stone-800 dark:text-stone-100">
{t(props.lang, "published_content/tags")}
</h2>
<ul class="flex flex-wrap gap-x-2 gap-y-2 px-2">
<ul class="flex flex-wrap gap-x-2 gap-y-3 px-3">
{tags.map(({ id, name }) => (
<li class="rounded-full bg-bm-300 px-3 py-1 text-sm text-black shadow-sm dark:bg-bm-600 dark:text-white print:bg-none">
<a class="hover:underline focus:underline" href={`/tags/${id}`}>
<li>
<a
class="rounded-full bg-bm-300 px-3 py-1 text-sm text-black shadow-sm hover:underline focus:underline dark:bg-bm-600 dark:text-white print:bg-none"
href={`/tags/${id}`}
>
{name}
</a>
</li>