feat: replace Cusdis with own comment plugin
Drops the Cusdis embed (postCommentSlot in pageConfig) in favour of the new RustyCMS comment plugin. New Comments.svelte renders the thread, form, replies and inline edit/delete via /api/comments. Count-badge near the post date links to the accordion and uses /api/comments/:id/count. Accordion gets a `lazy` mode so the comment iframe / fetch happens only on first open (avoids the previous "empty on first render" issue with hidden details). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
@@ -3,27 +3,43 @@
|
||||
import Icon from "@iconify/svelte";
|
||||
import "$lib/iconify-offline";
|
||||
|
||||
interface Props {
|
||||
label: string;
|
||||
open?: boolean;
|
||||
lazy?: boolean;
|
||||
id?: string;
|
||||
class?: string;
|
||||
onToggleEvent?: (e: Event) => void;
|
||||
children: Snippet;
|
||||
}
|
||||
|
||||
let {
|
||||
label,
|
||||
open = false,
|
||||
lazy = false,
|
||||
id = undefined,
|
||||
class: cls = "",
|
||||
onToggleEvent,
|
||||
children,
|
||||
}: {
|
||||
label: string;
|
||||
open?: boolean;
|
||||
id?: string;
|
||||
class?: string;
|
||||
children: Snippet;
|
||||
} = $props();
|
||||
}: Props = $props();
|
||||
|
||||
let everOpened = $state(false);
|
||||
const mounted = $derived(!lazy || open || everOpened);
|
||||
|
||||
function onToggle(e: Event) {
|
||||
if ((e.target as HTMLDetailsElement).open) everOpened = true;
|
||||
onToggleEvent?.(e);
|
||||
}
|
||||
</script>
|
||||
|
||||
<details {id} {open} class="pt-4 border-t border-zinc-200 group {cls}">
|
||||
<details {id} {open} ontoggle={onToggle} class="pt-4 border-t border-zinc-200 group {cls}">
|
||||
<summary class="flex cursor-pointer list-none items-center gap-2 text-sm font-medium select-none">
|
||||
<Icon icon="mdi:chevron-right" class="size-4 shrink-0 transition-transform group-open:rotate-90" />
|
||||
{label}
|
||||
</summary>
|
||||
<div class="mt-4">
|
||||
{@render children()}
|
||||
{#if mounted}
|
||||
{@render children()}
|
||||
{/if}
|
||||
</div>
|
||||
</details>
|
||||
|
||||
Reference in New Issue
Block a user