42 lines
1.1 KiB
Svelte
42 lines
1.1 KiB
Svelte
<script lang="ts">
|
|||
|
|
import { Lock } from "@lucide/svelte";
|
||
|
|
import { i18n } from "$lib/i18n";
|
||
|
|
|
||
|
|
let {
|
||
|
|
featureKey = undefined,
|
||
|
|
compact = false
|
||
|
|
}: {
|
||
|
|
/** The denied feature key — shown as a hint so an admin knows what to re-enable. */
|
||
|
|
featureKey?: string;
|
||
|
|
/** Tighter spacing when embedded under an existing page heading. */
|
||
|
|
compact?: boolean;
|
||
|
|
} = $props();
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<div
|
||
|
|
class={compact ? "space-y-4" : "mx-auto max-w-2xl space-y-4 py-6"}
|
||
|
|
data-testid="access-restricted-panel"
|
||
|
|
>
|
||
|
|
<div class="flex gap-4 rounded-lg border border-border bg-muted/30 px-5 py-5">
|
||
|
|
<div
|
||
|
|
class="flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-muted text-muted-foreground"
|
||
|
|
aria-hidden="true"
|
||
|
|
>
|
||
|
|
<Lock class="h-5 w-5" />
|
||
|
|
</div>
|
||
|
|
<div class="min-w-0 space-y-1.5">
|
||
|
|
<h2 class="text-base font-semibold text-foreground">
|
||
|
|
{i18n.t("access.restricted.title")}
|
||
|
|
</h2>
|
||
|
|
<p class="text-sm text-muted-foreground">
|
||
|
|
{i18n.t("access.restricted.message")}
|
||
|
|
</p>
|
||
|
|
{#if featureKey}
|
||
|
|
<p class="pt-1 text-xs text-muted-foreground">
|
||
|
|
{i18n.t("access.restricted.featureHint", { feature: featureKey })}
|
||
|
|
</p>
|
||
|
|
{/if}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|