@podosoft/podokit 0.8.0 → 0.10.0

package/dist/templates/modules/admin-dashboard/files/apps/web/src/lib/components/settings/appearance-card.svelte

@@ -0,0 +1,371 @@
+<script lang="ts">
+  // Admin Appearance settings. Pending values stay inside the preview until
+  // the user saves, then apply across the app through the shared theme helper.
+  import Check from "@lucide/svelte/icons/check";
+  import ChevronDown from "@lucide/svelte/icons/chevron-down";
+  import Moon from "@lucide/svelte/icons/moon";
+  import RotateCcw from "@lucide/svelte/icons/rotate-ccw";
+  import Sun from "@lucide/svelte/icons/sun";
+  import X from "@lucide/svelte/icons/x";
+  import * as Card from "$lib/components/ui/card";
+  import { Button } from "$lib/components/ui/button";
+  import * as Collapsible from "$lib/components/ui/collapsible";
+  import { Input } from "$lib/components/ui/input";
+  import { Label } from "$lib/components/ui/label";
+  import { toast } from "svelte-sonner";
+  import { api } from "$lib/api";
+  import { getI18n } from "$lib/i18n";
+  import { site, type SiteSettings } from "$lib/site.svelte";
+  import {
+    FEATURED_THEME_PRESET_KEYS,
+    THEME_TOKEN_KEYS,
+    findPreset,
+    themePresets,
+    type ThemePreset,
+    type ThemeTokens,
+  } from "$lib/site/themes";
+  import {
+    applyTheme,
+    buildVarString,
+    effectiveTokens,
+    parseOverrides,
+    type ThemeConfig,
+    type ThemeMode,
+    type ThemeOverrides,
+  } from "$lib/site/apply-theme";
+
+  const i18n = getI18n();
+  const t = $derived(i18n.t.general);
+  const featuredKeys: readonly string[] = FEATURED_THEME_PRESET_KEYS;
+  const featuredPresets = featuredKeys
+    .map((key) => findPreset(key))
+    .filter((item): item is ThemePreset => item !== undefined);
+  const additionalPresets = themePresets.filter((item) => !featuredKeys.includes(item.key));
+
+  const s = $derived(site.value);
+  let preset = $state("default");
+  let brandColor = $state("");
+  let radius = $state("");
+  let overrides = $state<ThemeOverrides>({ light: {}, dark: {} });
+  let moreThemesOpen = $state(false);
+  let advancedOpen = $state(false);
+  let previewMode = $state<ThemeMode>("light");
+  let advancedMode = $state<ThemeMode>("light");
+  let seeded = $state(false);
+
+  $effect(() => {
+    if (seeded) return;
+    preset = s.themePreset || "default";
+    brandColor = s.brandColor ?? "";
+    radius = s.themeRadius ?? "";
+    const parsed = parseOverrides(s.themeOverrides);
+    overrides = { light: { ...(parsed?.light ?? {}) }, dark: { ...(parsed?.dark ?? {}) } };
+    seeded = true;
+  });
+
+  const config = $derived<ThemeConfig>({
+    preset,
+    brandColor: brandColor || null,
+    radius: radius || null,
+    overrides,
+  });
+  const lightVars = $derived(buildVarString(effectiveTokens(config, "light"), config.brandColor, config.radius));
+  const darkVars = $derived(buildVarString(effectiveTokens(config, "dark"), config.brandColor, config.radius));
+
+  function tokenValue(mode: ThemeMode, key: keyof ThemeTokens): string {
+    return overrides[mode]?.[key] ?? findPreset(preset)?.[mode]?.[key] ?? "#808080";
+  }
+
+  function setToken(mode: ThemeMode, key: keyof ThemeTokens, value: string): void {
+    overrides = { ...overrides, [mode]: { ...(overrides[mode] ?? {}), [key]: value } };
+  }
+
+  function selectPreset(key: string): void {
+    preset = key;
+    overrides = { light: {}, dark: {} };
+  }
+
+  function radiusLabel(value: string): string {
+    if (value === "") return t.radiusDefault;
+    if (value === "0") return t.radiusNone;
+    if (value === "0.25") return t.radiusSmall;
+    if (value === "0.5") return t.radiusMedium;
+    return t.radiusLarge;
+  }
+
+  function cleanOverrides(): ThemeOverrides {
+    const pick = (value?: Partial<ThemeTokens>): Partial<ThemeTokens> | undefined => {
+      if (!value) return undefined;
+      const entries = Object.entries(value).filter(([, token]) => Boolean(token));
+      return entries.length ? (Object.fromEntries(entries) as Partial<ThemeTokens>) : undefined;
+    };
+    const result: ThemeOverrides = {};
+    const light = pick(overrides.light);
+    const dark = pick(overrides.dark);
+    if (light) result.light = light;
+    if (dark) result.dark = dark;
+    return result;
+  }
+
+  let saving = $state(false);
+  async function save(): Promise<void> {
+    saving = true;
+    try {
+      const cleaned = cleanOverrides();
+      const payload: Record<string, string> = {
+        themePreset: preset === "default" ? "" : preset,
+        brandColor,
+        themeRadius: radius,
+        themeOverrides: cleaned.light || cleaned.dark ? JSON.stringify(cleaned) : "",
+      };
+      await api.put("/site/settings", payload);
+      site.patch(payload as Partial<SiteSettings>);
+      applyTheme(config);
+      toast.success(t.saved);
+    } catch {
+      toast.error(t.saveError);
+    } finally {
+      saving = false;
+    }
+  }
+
+  async function restoreDefaults(): Promise<void> {
+    preset = "default";
+    brandColor = "";
+    radius = "";
+    overrides = { light: {}, dark: {} };
+    await save();
+  }
+</script>
+
+<Card.Root>
+  <Card.Header class="gap-1.5 border-b border-border">
+    <Card.Title role="heading" aria-level={2}>{t.appearanceTitle}</Card.Title>
+    <Card.Description>{t.appearanceDesc}</Card.Description>
+  </Card.Header>
+
+  <Card.Content class="flex flex-col gap-8 pt-6">
+    <section class="flex flex-col gap-3" aria-labelledby="featured-themes-heading">
+      <div>
+        <h3 id="featured-themes-heading" class="text-sm font-medium">{t.featuredThemes}</h3>
+        <p class="text-muted-foreground mt-0.5 text-xs">{t.themePreset}</p>
+      </div>
+      <div class="grid gap-2 sm:grid-cols-2 xl:grid-cols-3">
+        {#each featuredPresets as item (item.key)}
+          {@render presetButton(item)}
+        {/each}
+      </div>
+
+      <Collapsible.Root bind:open={moreThemesOpen}>
+        <Collapsible.Trigger
+          class="border-input bg-background hover:bg-accent hover:text-accent-foreground flex min-h-9 items-center gap-2 rounded-md border px-3 text-sm font-medium transition-colors"
+        >
+          {moreThemesOpen ? t.hideThemes : t.moreThemes}
+          <ChevronDown class="size-4 transition-transform {moreThemesOpen ? 'rotate-180' : ''}" />
+        </Collapsible.Trigger>
+        <Collapsible.Content class="pt-3">
+          <div class="grid gap-2 sm:grid-cols-2 xl:grid-cols-3">
+            {#each additionalPresets as item (item.key)}
+              {@render presetButton(item)}
+            {/each}
+          </div>
+        </Collapsible.Content>
+      </Collapsible.Root>
+    </section>
+
+    <div class="grid gap-8 xl:grid-cols-[minmax(0,0.8fr)_minmax(22rem,1.2fr)]">
+      <section class="flex flex-col gap-5" aria-labelledby="quick-settings-heading">
+        <h3 id="quick-settings-heading" class="text-sm font-medium">{t.quickSettings}</h3>
+
+        <div class="flex flex-col gap-2">
+          <Label for="accent-color">{t.accentColor}</Label>
+          <div class="flex items-center gap-2">
+            <Input
+              type="color"
+              value={brandColor || "#6d28d9"}
+              oninput={(event) => (brandColor = event.currentTarget.value)}
+              aria-label={t.accentColor}
+              class="size-10 shrink-0 cursor-pointer p-1"
+            />
+            <Input id="accent-color" bind:value={brandColor} placeholder="#6d28d9" class="max-w-36 font-mono" />
+            {#if brandColor}
+              <Button type="button" variant="ghost" size="icon" onclick={() => (brandColor = "")} aria-label={t.clearColor}>
+                <X class="size-4" />
+              </Button>
+            {/if}
+          </div>
+          <p class="text-muted-foreground text-xs leading-relaxed">{t.accentColorHint}</p>
+        </div>
+
+        <fieldset class="flex flex-col gap-2">
+          <legend class="text-sm font-medium">{t.radius}</legend>
+          <div class="grid grid-cols-2 gap-2 sm:grid-cols-3">
+            {#each ["", "0", "0.25", "0.5", "1"] as value (value)}
+              <Button
+                type="button"
+                variant={radius === value ? "secondary" : "outline"}
+                class="justify-center"
+                aria-pressed={radius === value}
+                onclick={() => (radius = value)}
+              >
+                {radiusLabel(value)}
+              </Button>
+            {/each}
+          </div>
+          {#if radius && !["0", "0.25", "0.5", "1"].includes(radius)}
+            <p class="text-muted-foreground text-xs">{radius}rem</p>
+          {/if}
+        </fieldset>
+      </section>
+
+      <section class="flex flex-col gap-3" aria-labelledby="theme-preview-heading">
+        <div class="flex flex-wrap items-center justify-between gap-2">
+          <h3 id="theme-preview-heading" class="text-sm font-medium">{t.preview}</h3>
+          <div class="bg-muted flex rounded-lg p-1" role="group" aria-label={t.preview}>
+            <Button
+              type="button"
+              variant={previewMode === "light" ? "secondary" : "ghost"}
+              size="sm"
+              class="h-8 gap-1.5"
+              aria-pressed={previewMode === "light"}
+              onclick={() => (previewMode = "light")}
+            >
+              <Sun class="size-3.5" />{t.previewLight}
+            </Button>
+            <Button
+              type="button"
+              variant={previewMode === "dark" ? "secondary" : "ghost"}
+              size="sm"
+              class="h-8 gap-1.5"
+              aria-pressed={previewMode === "dark"}
+              onclick={() => (previewMode = "dark")}
+            >
+              <Moon class="size-3.5" />{t.previewDark}
+            </Button>
+          </div>
+        </div>
+        {@render previewPanel(previewMode === "light" ? lightVars : darkVars, previewMode === "dark")}
+      </section>
+    </div>
+
+    <Collapsible.Root bind:open={advancedOpen}>
+      <Collapsible.Trigger
+        class="border-border hover:bg-muted flex w-full items-center justify-between rounded-lg border px-4 py-3 text-left text-sm font-medium transition-colors"
+      >
+        <span>{advancedOpen ? t.advancedHide : t.advanced}</span>
+        <ChevronDown class="size-4 transition-transform {advancedOpen ? 'rotate-180' : ''}" />
+      </Collapsible.Trigger>
+      <Collapsible.Content class="pt-4">
+        <div class="bg-muted/40 flex flex-col gap-4 rounded-lg border border-border p-4">
+          <div class="flex w-fit rounded-md border border-border bg-background p-1" role="group" aria-label={t.advanced}>
+            {#each ["light", "dark"] as mode (mode)}
+              <Button
+                type="button"
+                variant={advancedMode === mode ? "secondary" : "ghost"}
+                size="sm"
+                class="h-8"
+                aria-pressed={advancedMode === mode}
+                onclick={() => (advancedMode = mode as ThemeMode)}
+              >
+                {mode === "light" ? t.previewLight : t.previewDark}
+              </Button>
+            {/each}
+          </div>
+
+          <div class="grid gap-3 sm:grid-cols-2 xl:grid-cols-3">
+            {#each THEME_TOKEN_KEYS as key (key)}
+              <div class="flex flex-col gap-1.5">
+                <Label for={`theme-${advancedMode}-${key}`}>{t.themeTokens[key]}</Label>
+                <div class="flex items-center gap-2">
+                  <Input
+                    type="color"
+                    value={tokenValue(advancedMode, key)}
+                    oninput={(event) => setToken(advancedMode, key, event.currentTarget.value)}
+                    aria-label={`${t.themeTokens[key]} ${advancedMode}`}
+                    class="size-9 shrink-0 cursor-pointer p-1"
+                  />
+                  <Input
+                    id={`theme-${advancedMode}-${key}`}
+                    value={tokenValue(advancedMode, key)}
+                    oninput={(event) => setToken(advancedMode, key, event.currentTarget.value)}
+                    class="min-w-0 font-mono text-xs"
+                  />
+                </div>
+              </div>
+            {/each}
+          </div>
+
+          <Button type="button" variant="outline" size="sm" class="w-fit gap-2" onclick={() => (overrides = { light: {}, dark: {} })}>
+            <RotateCcw class="size-3.5" />{t.resetTheme}
+          </Button>
+        </div>
+      </Collapsible.Content>
+    </Collapsible.Root>
+
+    <div class="flex flex-wrap items-center gap-2 border-t border-border pt-6">
+      <Button onclick={save} disabled={saving}>{saving ? t.saving : t.saveTheme}</Button>
+      <Button variant="outline" onclick={restoreDefaults} disabled={saving}>{t.restoreDefaults}</Button>
+    </div>
+  </Card.Content>
+</Card.Root>
+
+{#snippet presetButton(item: ThemePreset)}
+  <Button
+    type="button"
+    variant="outline"
+    class="h-auto min-h-16 justify-start gap-3 px-3 py-2.5 text-left {preset === item.key ? 'border-primary bg-primary/5 ring-1 ring-primary' : ''}"
+    aria-pressed={preset === item.key}
+    onclick={() => selectPreset(item.key)}
+  >
+    {@render presetSwatch(item)}
+    <span class="min-w-0 flex-1 truncate">{item.label}</span>
+    {#if preset === item.key}<Check class="text-primary size-4 shrink-0" />{/if}
+  </Button>
+{/snippet}
+
+{#snippet presetSwatch(item: ThemePreset)}
+  <span class="border-border flex size-9 shrink-0 overflow-hidden rounded-md border" aria-hidden="true">
+    {#if item.light}
+      <span class="h-full w-1/2" style={`background:${item.light.background}`}></span>
+      <span class="h-full w-1/2" style={`background:${item.light.primary}`}></span>
+    {:else}
+      <span class="bg-background h-full w-1/2"></span>
+      <span class="bg-primary h-full w-1/2"></span>
+    {/if}
+  </span>
+{/snippet}
+
+{#snippet previewPanel(vars: string, dark: boolean)}
+  <div class="border-border overflow-hidden rounded-xl border">
+    <div class="bg-background text-foreground grid min-h-72 grid-cols-[5.5rem_1fr] sm:grid-cols-[9rem_1fr] {dark ? 'dark' : ''}" style={vars}>
+      <aside class="bg-sidebar text-sidebar-foreground border-sidebar-border flex flex-col gap-4 border-r p-3">
+        <div class="flex items-center gap-2 text-xs font-semibold">
+          <span class="bg-primary size-5 rounded-md"></span>
+          <span class="hidden truncate sm:inline">{t.previewApp}</span>
+        </div>
+        <div class="flex flex-col gap-1 text-xs">
+          <span class="text-muted-foreground rounded-md px-2 py-1.5">{t.previewNav}</span>
+          <span class="bg-sidebar-accent text-sidebar-accent-foreground rounded-md px-2 py-1.5">{t.previewSettings}</span>
+        </div>
+      </aside>
+      <div class="flex flex-col gap-4 p-4 sm:p-6">
+        <div class="space-y-1">
+          <p class="text-base font-semibold">{t.previewHeading}</p>
+          <p class="text-muted-foreground max-w-md text-xs leading-relaxed">{t.previewBody}</p>
+        </div>
+        <div class="bg-card text-card-foreground border-border flex flex-col gap-4 rounded-lg border p-4">
+          <div class="space-y-2">
+            <div class="bg-muted h-2.5 w-2/3 rounded-full"></div>
+            <div class="bg-muted h-2.5 w-1/2 rounded-full"></div>
+          </div>
+          <div class="border-input bg-background h-9 rounded-md border"></div>
+          <div class="flex flex-wrap items-center gap-2">
+            <span class="bg-primary text-primary-foreground rounded-md px-3 py-2 text-xs font-medium">{t.previewPrimary}</span>
+            <span class="border-border rounded-md border px-3 py-2 text-xs">{t.previewOutline}</span>
+            <span class="bg-secondary text-secondary-foreground rounded-full px-2 py-1 text-[11px]">{t.previewBadge}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+{/snippet}

package/dist/templates/modules/admin-dashboard/files/apps/web/src/lib/components/sidebar-user-menu.svelte

@@ -35,7 +35,7 @@
         {/snippet}
       </DropdownMenu.Trigger>
       <DropdownMenu.Content align="end" side="top" class="w-56">
-        <DropdownMenu.Item onSelect={() => goto("/admin/account")}><UserIcon class="mr-2 size-4" /> {i18n.t.nav.account}</DropdownMenu.Item>
+        <DropdownMenu.Item onSelect={() => goto("/account")}><UserIcon class="mr-2 size-4" /> {i18n.t.nav.account}</DropdownMenu.Item>
         <DropdownMenu.Separator />
         <DropdownMenu.Item onSelect={signOut}><LogOutIcon class="mr-2 size-4" /> {i18n.t.nav.signOut}</DropdownMenu.Item>
       </DropdownMenu.Content>

package/dist/templates/modules/admin-dashboard/files/apps/web/src/lib/components/site-runtime.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import { page } from "$app/state";
+  import { ModeWatcher } from "mode-watcher";
+  import { site, type SiteSettings } from "$lib/site.svelte";
+  import { applyTheme, themeConfigFromSettings } from "$lib/site/apply-theme";
+
+  const loadedSite = $derived(
+    (page.data as { site?: Partial<SiteSettings> | null }).site,
+  );
+
+  // Seed the reactive site settings for every route without taking ownership of
+  // the application's root layout or public pages.
+  $effect.pre(() => site.init(loadedSite));
+
+  const branding = $derived({
+    name: site.value.name ?? loadedSite?.name ?? "",
+    description: site.value.description ?? loadedSite?.description ?? "",
+    hasFavicon: site.value.hasFavicon || Boolean(loadedSite?.hasFavicon),
+    faviconVersion: site.value.faviconVersion ?? loadedSite?.faviconVersion ?? "",
+  });
+
+  $effect(() => {
+    applyTheme(themeConfigFromSettings(site.value));
+  });
+</script>
+
+<svelte:head>
+  {#if branding.name}
+    <title>{branding.name}</title>
+  {/if}
+  {#if branding.description}
+    <meta name="description" content={branding.description} />
+  {/if}
+  {#if branding.hasFavicon}
+    <link rel="icon" href={`/api/site/favicon?v=${branding.faviconVersion}`} />
+  {/if}
+</svelte:head>
+
+<ModeWatcher />

package/dist/templates/modules/admin-dashboard/files/apps/web/src/lib/i18n/index.ts

@@ -1,17 +1,22 @@
-import { getContext, setContext } from "svelte";
+import { page } from "$app/state";
 import { site } from "$lib/site.svelte";
-import type { Locale, Messages } from "./messages";
-
-const KEY = Symbol("i18n");
+import { messages, resolveLocale, type Locale, type Messages } from "./messages";
 
 export type I18nContext = { readonly t: Messages; readonly locale: Locale };
 
-export function setI18nContext(ctx: I18nContext): void {
-  setContext(KEY, ctx);
+function currentLocale(): Locale {
+  return resolveLocale((page.data as { locale?: string }).locale);
 }
 
 export function getI18n(): I18nContext {
-  return getContext(KEY) as I18nContext;
+  return {
+    get t() {
+      return messages[currentLocale()];
+    },
+    get locale() {
+      return currentLocale();
+    },
+  };
 }
 
 // Fill {name}-style placeholders in a message.

package/dist/templates/modules/admin-dashboard/files/apps/web/src/lib/i18n/messages.ts

@@ -16,6 +16,20 @@ const en = {
   language: { label: "Language" },
   toolbar: { filter: "Filter", search: "Search", searchButton: "Search", all: "All" },
   theme: { toggle: "Toggle theme", light: "Light", dark: "Dark", system: "System" },
+  setup2fa: {
+    title: "Set up two-factor authentication",
+    subtitle: "This site requires two-factor authentication. Add an authenticator app to continue.",
+    passwordLabel: "Confirm your password",
+    begin: "Continue",
+    step1: "1. Scan with your authenticator app",
+    step2: "2. Save your backup codes",
+    step3: "3. Enter the 6-digit code",
+    savedConfirm: "I've saved my backup codes",
+    activate: "Activate and continue",
+    signOut: "Sign out",
+    wrongPassword: "That password is incorrect.",
+    enableFailed: "Couldn't start setup. Please try again.",
+  },
   auth: {
     signInTitle: "Sign in",
     signInDesc: "Enter your credentials to continue.",
@@ -30,6 +44,15 @@ const en = {
     magicLinkSent: "Check your email for a sign-in link.",
     magicLinkNeedsEmail: "Enter your email first.",
     otpButton: "Email me a code", otpCode: "One-time code", otpVerify: "Verify code",
+    verify: "Verify",
+    twoFactorPrompt: "Enter the 6-digit code from your authenticator app.",
+    twoFactorBackupPrompt: "Enter one of your backup codes.",
+    twoFactorCodeLabel: "Authentication code",
+    backupCodeLabel: "Backup code",
+    twoFactorUseBackup: "Use a backup code instead",
+    twoFactorUseAuthenticator: "Use your authenticator app instead",
+    twoFactorInvalidCode: "That code isn't valid. Check it and try again.",
+    twoFactorLocked: "Too many attempts. Please wait a moment and try again.",
     noAccount: "No account?",
     signUp: "Sign up",
     signInFailed: "Sign in failed",
@@ -103,6 +126,22 @@ const en = {
     faviconHint: "SVG (recommended) or a square PNG 512×512, ≤ 1 MB. Applied to every page.",
     iconSaved: "Icon updated.", iconError: "Failed to upload the icon.", iconTooBig: "Icon must be 1 MB or smaller.",
     brandColor: "Brand color",
+    appearanceTitle: "Appearance", appearanceDesc: "Choose the base colors and corner style for the app. Changes apply after you save.",
+    themePreset: "Base theme", featuredThemes: "Featured themes", moreThemes: "Show more themes", hideThemes: "Show fewer themes",
+    quickSettings: "Quick settings",
+    accentColor: "Brand color", accentColorHint: "Replaces the theme's primary color. Leave it empty to use the theme color.", clearColor: "Clear brand color",
+    radius: "Corner style", radiusDefault: "App default", radiusNone: "Square", radiusSmall: "Small", radiusMedium: "Medium", radiusLarge: "Large",
+    advanced: "Fine-tune colors", advancedHide: "Close color settings",
+    resetTheme: "Clear color adjustments", saveTheme: "Save changes", restoreDefaults: "Restore defaults",
+    preview: "Preview", previewLight: "Light", previewDark: "Dark",
+    previewApp: "Workspace", previewNav: "Overview", previewSettings: "Settings",
+    previewHeading: "Theme preview", previewBody: "Colors and corner styles are shown here before you save.",
+    previewPrimary: "Save", previewOutline: "Cancel", previewBadge: "Active",
+    themeTokens: {
+      background: "Background", card: "Card", foreground: "Foreground",
+      mutedForeground: "Muted text", border: "Border", secondary: "Secondary",
+      accent: "Accent", primary: "Primary", primaryForeground: "Primary text",
+    },
     infoTitle: "Site info", infoDesc: "Optional details used in meta tags, the footer, and links.",
     description: "Description", descriptionPlaceholder: "A short tagline for your site",
     supportEmail: "Support email", footerText: "Footer text",
@@ -132,6 +171,7 @@ const en = {
     organization: "Organizations", organizationDesc: "Multi-tenant organizations with members and email invitations.",
     oidcProvider: "OIDC provider", oidcProviderDesc: "Act as an identity provider so other apps can sign in with this one.",
     twoFactor: "Two-factor authentication", twoFactorDesc: "TOTP second factor with backup codes.",
+    require2fa: "Require two-factor", require2faDesc: "Every user must enrol in 2FA after signing up before using the app.",
     socialProviders: "Social providers", socialProvidersDesc: "OAuth sign-in (Google, GitHub).",
     breachCheck: "Breached-password check", breachCheckDesc: "Reject passwords found in known breaches (Have I Been Pwned).",
     accountDeletion: "Account deletion", accountDeletionDesc: "Let users delete their own account.",
@@ -281,6 +321,11 @@ const en = {
     scanHint: "Add this to your authenticator app, then enter the 6-digit code.",
     setupKey: "Setup key (otpauth URI)",
     backupCodes: "Backup codes — store them somewhere safe",
+    backupCodesHint: "Each code works once if you lose your authenticator. Save them now — they won't be shown again.",
+    downloadBackupCodes: "Download",
+    regenerateBackupCodes: "Regenerate backup codes",
+    regenerateBackupCodesHint: "Generating a new set invalidates your previous backup codes.",
+    backupCodesRegenerated: "New backup codes generated",
     code: "Verification code",
     verify: "Verify",
     twoFactorEnabled: "Two-factor enabled",
@@ -322,6 +367,20 @@ const ko: Messages = {
   language: { label: "언어" },
   toolbar: { filter: "필터", search: "검색", searchButton: "검색", all: "전체" },
   theme: { toggle: "테마 전환", light: "라이트", dark: "다크", system: "시스템" },
+  setup2fa: {
+    title: "2단계 인증 설정",
+    subtitle: "이 사이트는 2단계 인증이 필수입니다. 계속하려면 인증 앱을 등록하세요.",
+    passwordLabel: "비밀번호 확인",
+    begin: "계속",
+    step1: "1. 인증 앱으로 스캔",
+    step2: "2. 백업 코드 저장",
+    step3: "3. 6자리 코드 입력",
+    savedConfirm: "백업 코드를 저장했습니다",
+    activate: "활성화하고 계속",
+    signOut: "로그아웃",
+    wrongPassword: "비밀번호가 올바르지 않습니다.",
+    enableFailed: "설정을 시작할 수 없습니다. 다시 시도해 주세요.",
+  },
   auth: {
     signInTitle: "로그인",
     signInDesc: "계속하려면 로그인하세요.",
@@ -336,6 +395,15 @@ const ko: Messages = {
     magicLinkSent: "이메일의 로그인 링크를 확인하세요.",
     magicLinkNeedsEmail: "먼저 이메일을 입력하세요.",
     otpButton: "코드 이메일로 받기", otpCode: "일회용 코드", otpVerify: "코드 확인",
+    verify: "확인",
+    twoFactorPrompt: "인증 앱의 6자리 코드를 입력하세요.",
+    twoFactorBackupPrompt: "백업 코드 중 하나를 입력하세요.",
+    twoFactorCodeLabel: "인증 코드",
+    backupCodeLabel: "백업 코드",
+    twoFactorUseBackup: "백업 코드로 대신 인증",
+    twoFactorUseAuthenticator: "인증 앱으로 대신 인증",
+    twoFactorInvalidCode: "코드가 올바르지 않습니다. 다시 확인해 주세요.",
+    twoFactorLocked: "시도가 너무 많습니다. 잠시 후 다시 시도해 주세요.",
     noAccount: "계정이 없으신가요?",
     signUp: "회원가입",
     signInFailed: "로그인에 실패했습니다",
@@ -409,6 +477,22 @@ const ko: Messages = {
     faviconHint: "SVG(권장) 또는 정사각 PNG 512×512, 1 MB 이하. 모든 페이지에 적용됩니다.",
     iconSaved: "아이콘을 변경했습니다.", iconError: "아이콘 업로드에 실패했습니다.", iconTooBig: "아이콘은 1 MB 이하여야 합니다.",
     brandColor: "브랜드 색상",
+    appearanceTitle: "화면 테마", appearanceDesc: "앱의 기본 색상과 모서리 형태를 설정합니다. 저장하면 모든 화면에 적용됩니다.",
+    themePreset: "기본 테마", featuredThemes: "주요 테마", moreThemes: "테마 더 보기", hideThemes: "테마 접기",
+    quickSettings: "빠른 설정",
+    accentColor: "브랜드 색상", accentColorHint: "선택한 테마의 주요 색상을 바꿉니다. 비우면 테마 색상을 사용합니다.", clearColor: "브랜드 색상 지우기",
+    radius: "모서리 형태", radiusDefault: "앱 기본값", radiusNone: "각지게", radiusSmall: "작게", radiusMedium: "보통", radiusLarge: "크게",
+    advanced: "세부 색상 설정", advancedHide: "세부 설정 닫기",
+    resetTheme: "세부 색상 지우기", saveTheme: "변경 저장", restoreDefaults: "기본값으로 복원",
+    preview: "미리보기", previewLight: "라이트", previewDark: "다크",
+    previewApp: "워크스페이스", previewNav: "대시보드", previewSettings: "설정",
+    previewHeading: "테마 미리보기", previewBody: "저장하기 전에 색상과 모서리 형태를 확인할 수 있습니다.",
+    previewPrimary: "저장", previewOutline: "취소", previewBadge: "사용 중",
+    themeTokens: {
+      background: "배경", card: "카드", foreground: "전경(글자)",
+      mutedForeground: "흐린 글자", border: "테두리", secondary: "보조",
+      accent: "강조", primary: "기본", primaryForeground: "기본 글자",
+    },
     infoTitle: "사이트 정보", infoDesc: "메타 태그·푸터·링크에 쓰이는 선택 항목입니다.",
     description: "설명", descriptionPlaceholder: "사이트를 한 줄로 소개",
     supportEmail: "지원 이메일", footerText: "푸터 문구",
@@ -438,6 +522,7 @@ const ko: Messages = {
     organization: "조직", organizationDesc: "멤버와 이메일 초대를 갖춘 멀티테넌트 조직.",
     oidcProvider: "OIDC 제공자", oidcProviderDesc: "다른 앱이 이 앱으로 로그인하도록 신원 제공자 역할.",
     twoFactor: "2단계 인증", twoFactorDesc: "TOTP 2차 인증 + 백업 코드.",
+    require2fa: "2FA 필수화", require2faDesc: "모든 사용자가 가입 후 2FA를 등록해야 앱을 사용할 수 있습니다.",
     socialProviders: "소셜 로그인", socialProvidersDesc: "OAuth 로그인 (Google, GitHub).",
     breachCheck: "유출 비밀번호 검사", breachCheckDesc: "유출된 비밀번호 거부 (Have I Been Pwned).",
     accountDeletion: "계정 삭제", accountDeletionDesc: "사용자가 자신의 계정을 삭제.",
@@ -587,6 +672,11 @@ const ko: Messages = {
     scanHint: "인증 앱에 등록한 뒤 6자리 코드를 입력하세요.",
     setupKey: "설정 키 (otpauth URI)",
     backupCodes: "백업 코드 — 안전한 곳에 보관하세요",
+    backupCodesHint: "인증 앱을 분실했을 때 각 코드는 한 번씩 사용할 수 있습니다. 지금 저장하세요 — 다시 표시되지 않습니다.",
+    downloadBackupCodes: "다운로드",
+    regenerateBackupCodes: "백업 코드 재발급",
+    regenerateBackupCodesHint: "새로 발급하면 이전 백업 코드는 무효화됩니다.",
+    backupCodesRegenerated: "새 백업 코드를 발급했습니다",
     code: "인증 코드",
     verify: "확인",
     twoFactorEnabled: "2단계 인증을 사용합니다",

package/dist/templates/modules/admin-dashboard/files/apps/web/src/lib/server/search-indexing.ts

@@ -0,0 +1,29 @@
+const NON_INDEXABLE_PATH_PREFIXES = [
+  "/api",
+  "/admin",
+  "/account",
+  "/login",
+  "/signup",
+  "/forgot-password",
+  "/reset-password",
+  "/verify-email",
+  "/setup-2fa",
+  "/oauth2",
+  "/accept-invitation",
+  "/maintenance",
+] as const;
+
+function matchesPathPrefix(pathname: string, prefix: string): boolean {
+  return pathname === prefix || pathname.startsWith(`${prefix}/`);
+}
+
+export function shouldPreventSearchIndexing(pathname: string): boolean {
+  return NON_INDEXABLE_PATH_PREFIXES.some((prefix) => matchesPathPrefix(pathname, prefix));
+}
+
+export function applySearchIndexingHeaders(response: Response, pathname: string): Response {
+  if (shouldPreventSearchIndexing(pathname)) {
+    response.headers.set("X-Robots-Tag", "noindex, nofollow");
+  }
+  return response;
+}