<script lang="ts">
	import type { ComponentProps } from "svelte";
	import HiddenContent from "#lib/components/ui/HiddenContent.svelte";
	import {
		moderationMessage,
		type ModerationGate
	} from "#lib/components/moderation/gate.svelte.ts";

	type Props = Omit<ComponentProps<typeof HiddenContent>, "message" | "action"> & {
		gate: ModerationGate;
	};

	let { gate, ...rest }: Props = $props();
</script>

{#if gate.moderation}
	<HiddenContent
		{...rest}
		message={moderationMessage(gate.moderation)}
		action={gate.revealable ? { label: "Show anyway", onclick: gate.reveal } : undefined}
	/>
{/if}