Browse Source

added basic markup parsing to content field

master
silberengel 7 months ago
parent
commit
447740e550
  1. 46
      src/lib/components/EventDetails.svelte
  2. 23
      src/lib/components/cards/ProfileHeader.svelte

46
src/lib/components/EventDetails.svelte

@ -72,10 +72,41 @@ import type { UserProfile } from "$lib/models/user_profile"; @@ -72,10 +72,41 @@ import type { UserProfile } from "$lib/models/user_profile";
return "Untitled";
}
let parsedSummary = $state<string>("");
let parsedTitle = $state<string>("");
function getEventSummary(event: NDKEvent): string {
return getMatchingTags(event, "summary")[0]?.[1] || "";
}
$effect(() => {
const summary = getEventSummary(event);
if (summary) {
parseBasicmarkup(summary).then((processed) => {
parsedSummary = processed;
}).catch((error) => {
console.error("Error parsing summary:", error);
parsedSummary = summary;
});
} else {
parsedSummary = "";
}
});
$effect(() => {
const title = getEventTitle(event);
if (title && title !== "Untitled") {
parseBasicmarkup(title).then((processed) => {
parsedTitle = processed;
}).catch((error) => {
console.error("Error parsing title:", error);
parsedTitle = title;
});
} else {
parsedTitle = title || "";
}
});
function getEventTypeDisplay(event: NDKEvent): string {
const [mTag, MTag] = getMimeTags(event.kind || 0);
return MTag[1].split("/")[1] || `Event Kind ${event.kind}`;
@ -256,9 +287,8 @@ import type { UserProfile } from "$lib/models/user_profile"; @@ -256,9 +287,8 @@ import type { UserProfile } from "$lib/models/user_profile";
if (repostKinds.includes(event.kind)) {
parsedContent = event.content;
} else {
// For all other events (including quote reposts), parse the content for nostr identifiers
// Use the proper processNostrIdentifiers function to get display names
processNostrIdentifiers(event.content, getNdkContext()).then((processed) => {
// For all other events (including quote reposts), parse the content using basic markup parser
parseBasicmarkup(event.content).then((processed) => {
parsedContent = processed;
}).catch((error) => {
console.error("Error parsing content:", error);
@ -287,9 +317,9 @@ import type { UserProfile } from "$lib/models/user_profile"; @@ -287,9 +317,9 @@ import type { UserProfile } from "$lib/models/user_profile";
</script>
<div class="flex flex-col space-y-4 min-w-0">
{#if event.kind !== 0 && getEventTitle(event)}
{#if event.kind !== 0 && parsedTitle}
<h2 class="text-2xl font-bold text-gray-900 dark:text-gray-100 break-words">
{getEventTitle(event)}
{@html parsedTitle}
</h2>
{/if}
@ -321,10 +351,12 @@ import type { UserProfile } from "$lib/models/user_profile"; @@ -321,10 +351,12 @@ import type { UserProfile } from "$lib/models/user_profile";
>
</div>
{#if getEventSummary(event)}
{#if parsedSummary}
<div class="flex flex-col space-y-1 min-w-0">
<span class="text-gray-700 dark:text-gray-300">Summary:</span>
<p class="text-gray-900 dark:text-gray-100 break-words">{getEventSummary(event)}</p>
<div class="prose dark:prose-invert max-w-none text-gray-900 dark:text-gray-100 break-words overflow-wrap-anywhere min-w-0">
{@html parsedSummary}
</div>
</div>
{/if}

23
src/lib/components/cards/ProfileHeader.svelte

@ -17,6 +17,7 @@ @@ -17,6 +17,7 @@
import { goto } from "$app/navigation";
import { isPubkeyInUserLists, fetchCurrentUserLists } from "$lib/utils/user_lists";
import { UserOutline } from "flowbite-svelte-icons";
import { parseBasicmarkup } from "$lib/utils/markup/basicMarkupParser";
const {
event,
@ -34,6 +35,7 @@ @@ -34,6 +35,7 @@
let lnurl = $state<string | null>(null);
let communityStatus = $state<boolean | null>(null);
let isInUserLists = $state<boolean | null>(null);
let parsedAbout = $state<string>("");
onMount(async () => {
if (profile?.lud16) {
@ -90,6 +92,19 @@ @@ -90,6 +92,19 @@
}
});
$effect(() => {
if (profile?.about) {
parseBasicmarkup(profile.about).then((processed) => {
parsedAbout = processed;
}).catch((error) => {
console.error("Error parsing about:", error);
parsedAbout = profile.about;
});
} else {
parsedAbout = "";
}
});
function navigateToIdentifier(link: string) {
goto(link);
}
@ -196,10 +211,14 @@ @@ -196,10 +211,14 @@
<dd class="min-w-0 break-words">{profile.displayName}</dd>
</div>
{/if}
{#if profile.about}
{#if parsedAbout}
<div class="flex gap-2 min-w-0">
<dt class="font-semibold min-w-[120px] flex-shrink-0">About:</dt>
<dd class="min-w-0 break-words whitespace-pre-line">{profile.about}</dd>
<dd class="min-w-0 break-words">
<div class="prose dark:prose-invert max-w-none text-gray-900 dark:text-gray-100 break-words overflow-wrap-anywhere min-w-0">
{@html parsedAbout}
</div>
</dd>
</div>
{/if}
{#if profile.website}

Loading…
Cancel
Save