@acms-subir/core 0.3.9 → 0.3.11

package/src/pages/admin/login.astro

@@ -1,19 +1,64 @@
 ---
 import { safeNext } from '../../lib/editor/next';
-import { checkPassword, createSessionToken, verifyPassword, validateSession, SESSION_COOKIE } from '../../lib/auth';
+import { checkPassword, createSessionToken, verifyPassword, SESSION_COOKIE } from '../../lib/auth';
+import { getRequestAuth } from '../../lib/auth/request';
+import { AUTH } from '../../lib/auth/config';
+import { allowLogin } from '../../lib/auth/login-limit';
 import { getRepo } from '../../lib/repo';
 import { BRAND } from '../../lib/brand';
 import ThemeScript from '../../components/ThemeScript.astro';
+import ClerkSession from '../../components/auth/ClerkSession.astro';
 import '../../styles/admin.css';
 
 // ?next= returns to the editor-app sign-in page only (never another site)
 const next = safeNext(Astro.url.searchParams.get('next'), Astro.url);
-if ((await validateSession(Astro.cookies.get(SESSION_COOKIE)?.value, Astro.locals))) {
-  return Astro.redirect(next ?? '/admin');
+// ?return= brings an owner back to the admin page they left to sign in again
+// (a fresh sign-in is the recent verification sensitive changes need)
+function adminReturn(value: string | null): string | null {
+  if (!value || !value.startsWith('/admin') || value.includes('\\') || /[\u0000-\u001f]/.test(value)) return null;
+  let url: URL;
+  try { url = new URL(value, Astro.url.origin); } catch { return null; }
+  if (url.origin !== Astro.url.origin || !/^\/admin(\/|$)/.test(url.pathname)) return null;
+  if (/^\/admin\/(login|logout|app-auth)\b/.test(url.pathname)) return null;
+  return url.pathname + url.search + url.hash;
+}
+const back = next ? null : adminReturn(Astro.url.searchParams.get('return'));
+const reverify = !!back && Astro.url.searchParams.get('reverify') === '1';
+const clerkMode = AUTH.provider === 'clerk';
+const auth = await getRequestAuth(Astro.request, Astro.cookies, Astro.locals);
+if (auth.userId) {
+  return Astro.redirect(next ?? back ?? '/admin');
 }
 
+// Clerk mode: the provider's prebuilt components do every credential step on
+// this page. Local passwords, the owner password and recovery links are off.
+type ClerkView = 'sign-in' | 'sign-up' | 'denied' | 'configuration' | 'unavailable';
+let clerkView: ClerkView = 'sign-in';
+if (clerkMode) {
+  if (Astro.request.method === 'POST') {
+    return new Response('Password sign-in is turned off. Sign in with the form on this page.', { status: 403, headers: { 'Cache-Control': 'no-store' } });
+  }
+  Astro.response.headers.set('Cache-Control', 'no-store');
+  Astro.response.headers.set('Referrer-Policy', 'same-origin');
+  const params = Astro.url.searchParams;
+  // invitation links land here with ?signUp=1 (and Clerk's own ticket); an
+  // invitee who already has a Clerk account is sent to sign in instead
+  const invited = params.get('signUp') === '1' || params.has('__clerk_ticket');
+  clerkView = auth.error === 'configuration' ? 'configuration'
+    : auth.error === 'unavailable' ? 'unavailable'
+    : auth.error === 'access_denied' ? 'denied'
+    : invited && params.get('__clerk_status') !== 'sign_in' ? 'sign-up' : 'sign-in';
+}
+const signedOut = clerkMode && Astro.url.searchParams.get('signedOut') === '1';
+// Clerk sign-out is POST-only (same-origin); these views render it as a form
+const logoutAction = `/admin/logout${next ? `?next=${encodeURIComponent(next)}` : ''}`;
+// the destination query every sign-in link on this page carries forward
+const keep = next ? `next=${encodeURIComponent(next)}` : back ? `return=${encodeURIComponent(back)}` : '';
+const retryHref = `/admin/login${keep ? `?${keep}` : ''}`;
+const siteName = clerkMode ? (await (await getRepo(Astro.locals)).getSettings()).siteTitle || BRAND.name : BRAND.name;
+
 let error = '';
-if (Astro.request.method === 'POST') {
+if (!clerkMode && Astro.request.method === 'POST') {
   const form = await Astro.request.formData();
   const email = String(form.get('email') ?? '').trim();
   const password = String(form.get('password') ?? '');
@@ -22,10 +67,15 @@ if (Astro.request.method === 'POST') {
   // a user account created in /admin/users.
   let sessionUserId: string | null = null;
   let sessionVersion = 0;
-  if (!email && checkPassword(password)) {
+  let address = 'unknown';
+  try { address = Astro.clientAddress || address; } catch { /* shared fallback bucket */ }
+  const repo = await getRepo(Astro.locals);
+  if (!await allowLogin(repo, address, email)) {
+    error = 'Too many sign-in attempts. Try again in a few minutes.';
+    Astro.response.status = 429;
+  } else if (!email && checkPassword(password)) {
     sessionUserId = null; // default token = env owner
   } else if (email) {
-    const repo = await getRepo(Astro.locals);
     const auth = await repo.getUserAuth(email);
     if (auth && (await verifyPassword(password, auth.passHash))) { sessionUserId = auth.user.id; sessionVersion = auth.sessionVersion; }
     else {
@@ -43,7 +93,7 @@ if (Astro.request.method === 'POST') {
       maxAge: 7 * 24 * 60 * 60,
       secure: Astro.url.protocol === 'https:',
     });
-    return Astro.redirect(next ?? '/admin');
+    return Astro.redirect(next ?? back ?? '/admin');
   }
 }
 ---
@@ -55,13 +105,14 @@ if (Astro.request.method === 'POST') {
     <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
     <ThemeScript />
     <meta name="robots" content="noindex" />
-    <title>Sign in · {BRAND.name} admin</title>
+    <title>{clerkView === 'sign-up' ? 'Accept invitation' : 'Sign in'} · {BRAND.name} admin</title>
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
+    <ClerkSession />
   </head>
   <body>
     <div class="login-wrap">
-      <div class="card card-pad login-card">
+      <main class:list={['card card-pad login-card', { 'is-clerk': clerkMode }]}>
         <div class="brand">
           <svg width="26" height="26" viewBox="0 0 24 24" role="img" aria-label={BRAND.name}>
             <rect x="1" y="3" width="22" height="4.4" rx="1.9" fill="currentColor" opacity="0.85" />
@@ -70,22 +121,182 @@ if (Astro.request.method === 'POST') {
           </svg>
           <div class="brand-name">{BRAND.name}</div>
         </div>
-        {next && !error && <p class="hint login-for-app">Sign in to connect the app to your account.</p>}
-        {error && <div class="flash error">{error}</div>}
-        <form method="post">
-          <label class="field">
-            <span>Email</span>
-            <input type="email" name="email" autocomplete="username" placeholder="Leave empty for owner password" />
-          </label>
-          <label class="field">
-            <span>Password</span>
-            <input type="password" name="password" autofocus autocomplete="current-password" />
-          </label>
-          <button class="btn primary block" type="submit">Sign in</button>
-        </form>
-        <p class="hint"><a href="/account/forgot">Forgot your password?</a></p>
-        <p class="hint login-note">No account? The owner password from <code>ADMIN_PASSWORD</code> in <code>.env</code> always works with email left empty.</p>
-      </div>
+
+        {!clerkMode && (
+          <>
+            {next && !error && <p class="hint login-for-app">Sign in to connect the app to your account.</p>}
+            {error && <div class="flash error">{error}</div>}
+            <form method="post">
+              <label class="field">
+                <span>Email</span>
+                <input type="email" name="email" autocomplete="username" placeholder="Leave empty for owner password" />
+              </label>
+              <label class="field">
+                <span>Password</span>
+                <input type="password" name="password" autofocus autocomplete="current-password" />
+              </label>
+              <button class="btn primary block" type="submit">Sign in</button>
+            </form>
+            <p class="hint"><a href="/account/forgot">Forgot your password?</a></p>
+            <p class="hint login-note">No account? The owner password from <code>ADMIN_PASSWORD</code> in <code>.env</code> always works with email left empty.</p>
+          </>
+        )}
+
+        {clerkMode && (
+          <div class="login-clerk" data-acms-login data-view={clerkView} data-next={next ?? back ?? '/admin'} data-keep={keep || undefined} data-logout={logoutAction} data-signed-out={signedOut ? '1' : undefined}>
+            {(clerkView === 'sign-in' || clerkView === 'sign-up') && (
+              <>
+                {next && <p class="hint login-for-app">Sign in to connect the app to your account.</p>}
+                {reverify
+                  ? <p class="flash" role="status">Sign in again to confirm it’s you. You’ll go straight back to the page you were on.</p>
+                  : signedOut && <p class="flash" role="status">You’re signed out.</p>}
+                <div class="login-mount" data-clerk-mount aria-live="polite" aria-busy="true">
+                  <p class="login-loading"><span class="login-spinner" aria-hidden="true"></span>{clerkView === 'sign-up' ? 'Loading your invitation…' : 'Loading sign-in…'}</p>
+                </div>
+                <div class="flash error" role="alert" data-clerk-error hidden>
+                  <span data-clerk-error-text>The sign-in service could not be loaded.</span>
+                  <a class="btn sm" href={retryHref}>Try again</a>
+                </div>
+                <noscript><p class="flash error">Sign-in needs JavaScript. Turn it on and reload this page.</p></noscript>
+                {clerkView === 'sign-up'
+                  ? <p class="hint login-note">Create your sign-in with the email address your invitation was sent to. Access is only granted through an owner’s invitation.</p>
+                  : <p class="hint login-note">Forgot your password? Enter your email, then choose “Forgot password?”. Verification and recovery are handled by your organization’s sign-in provider.</p>}
+              </>
+            )}
+
+            {clerkView === 'denied' && (
+              <section class="login-state" aria-labelledby="login-state-h">
+                <span class="login-state-icon is-warn" aria-hidden="true">
+                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3l7 3v5c0 4.5-3 8.3-7 10-4-1.7-7-5.5-7-10V6zM12 8v4M12 15.5h.01" /></svg>
+                </span>
+                <h1 id="login-state-h">No access yet</h1>
+                <p>
+                  You’re signed in<span data-clerk-who hidden> as <b data-clerk-email></b></span>, but this account hasn’t been given access to {siteName}.
+                </p>
+                <p class="hint">Ask an owner to invite you from <b>Users</b>, or to link your existing account. Signing up on your own doesn’t grant access.</p>
+                <form method="post" action={logoutAction}><button class="btn primary block" type="submit">Sign out and use another account</button></form>
+              </section>
+            )}
+
+            {clerkView === 'unavailable' && (
+              <section class="login-state" aria-labelledby="login-state-h">
+                <span class="login-state-icon" aria-hidden="true">
+                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12a8 8 0 0 1 13.7-5.6M20 12a8 8 0 0 1-13.7 5.6M18 3v4h-4M6 21v-4h4" /></svg>
+                </span>
+                <h1 id="login-state-h">Sign-in is unavailable</h1>
+                <p>We couldn’t confirm your session with the sign-in service. This is usually temporary.</p>
+                <div class="login-actions">
+                  <a class="btn primary block" href={retryHref}>Try again</a>
+                  <form method="post" action={logoutAction}><button class="btn ghost block" type="submit">Sign out</button></form>
+                </div>
+              </section>
+            )}
+
+            {clerkView === 'configuration' && (
+              <section class="login-state" aria-labelledby="login-state-h">
+                <span class="login-state-icon is-error" aria-hidden="true">
+                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M12 9v4M12 16.5h.01M10.3 3.9 2.4 17.6A2 2 0 0 0 4.1 20.6h15.8a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z" /></svg>
+                </span>
+                <h1 id="login-state-h">Sign-in isn’t set up</h1>
+                <p>This site uses Clerk for staff sign-in, but its configuration is incomplete or doesn’t match this address.</p>
+                <p class="hint">Site operator: set <code>PUBLIC_CLERK_PUBLISHABLE_KEY</code>, <code>CLERK_SECRET_KEY</code> and <code>CLERK_AUTHORIZED_PARTIES</code> (including <code>{Astro.url.origin}</code>) in the deployment environment, then redeploy.</p>
+                <a class="btn block" href={retryHref}>Check again</a>
+              </section>
+            )}
+          </div>
+        )}
+      </main>
     </div>
+
+    <script>
+      import { embedded, loadClerk } from '../../components/auth/clerk';
+
+      const root = document.querySelector<HTMLElement>('[data-acms-login]');
+      const SYNC_KEY = 'acms-clerk-sync';
+
+      function fail(message?: string) {
+        const box = root?.querySelector<HTMLElement>('[data-clerk-error]');
+        const mount = root?.querySelector<HTMLElement>('[data-clerk-mount]');
+        if (mount) { mount.hidden = true; mount.setAttribute('aria-busy', 'false'); }
+        if (!box) return;
+        if (message) box.querySelector('[data-clerk-error-text]')!.textContent = message;
+        box.hidden = false;
+      }
+
+      async function start(root: HTMLElement) {
+        const view = root.dataset.view;
+        const next = root.dataset.next || '/admin';
+        // configuration/unavailable: links only, nothing for the SDK to do
+        if (view !== 'sign-in' && view !== 'sign-up' && view !== 'denied') return;
+        let clerk;
+        try { clerk = await loadClerk(); }
+        catch (e) { if (view === 'sign-in' || view === 'sign-up') fail(e instanceof Error ? e.message : undefined); return; }
+
+        if (view === 'denied') {
+          const email = clerk.user?.primaryEmailAddress?.emailAddress;
+          if (email) {
+            root.querySelector('[data-clerk-email]')!.textContent = email;
+            root.querySelector<HTMLElement>('[data-clerk-who]')!.hidden = false;
+          }
+          return;
+        }
+        if (view !== 'sign-in' && view !== 'sign-up') return;
+
+        // after /admin/logout revoked the session server-side, drop this
+        // browser's Clerk state too, then forget the flag (no loops on reload)
+        if (root.dataset.signedOut) {
+          const url = new URL(location.href);
+          url.searchParams.delete('signedOut');
+          const clean = url.pathname + url.search;
+          history.replaceState(null, '', clean);
+          try { sessionStorage.removeItem(SYNC_KEY); } catch {}
+          if (clerk.session) {
+            // Clerk navigates to the clean URL when done; that load mounts sign-in
+            try { await clerk.signOut({ redirectUrl: clean }); return; } catch { location.replace(clean); return; }
+          }
+        }
+
+        // Clerk says signed in, the server didn't see it (an expired cookie
+        // or a just-finished handshake): refresh the cookie and continue once.
+        // A second miss shows an error instead of bouncing between pages.
+        if (clerk.isSignedIn && clerk.session) {
+          let last = 0;
+          try { last = Number(sessionStorage.getItem(SYNC_KEY)) || 0; } catch {}
+          if (Date.now() - last > 30_000) {
+            try { sessionStorage.setItem(SYNC_KEY, String(Date.now())); } catch {}
+            await clerk.session.getToken({ skipCache: true }).catch(() => null);
+            location.replace(next);
+            return;
+          }
+          fail('You’re signed in, but this site couldn’t confirm your session. Sign out and try again.');
+          const box = root.querySelector<HTMLElement>('[data-clerk-error]');
+          const out = document.createElement('form');
+          out.method = 'post';
+          out.action = root.dataset.logout || '/admin/logout';
+          out.innerHTML = '<button class="btn sm" type="submit">Sign out</button>';
+          box?.append(out);
+          return;
+        }
+
+        const mount = root.querySelector<HTMLElement>('[data-clerk-mount]');
+        if (!mount) return;
+        mount.replaceChildren();
+        mount.setAttribute('aria-busy', 'false');
+        const keepNext = root.dataset.keep ?? '';
+        const props = {
+          // hash routing keeps every step (codes, recovery, MFA) on this page
+          routing: 'hash',
+          appearance: embedded,
+          forceRedirectUrl: next,
+          signUpForceRedirectUrl: next,
+          signInUrl: `/admin/login${keepNext ? `?${keepNext}` : ''}`,
+          signUpUrl: `/admin/login?signUp=1${keepNext ? `&${keepNext}` : ''}`,
+        };
+        if (view === 'sign-up') clerk.mountSignUp(mount, { ...props, signInForceRedirectUrl: next });
+        else clerk.mountSignIn(mount, props);
+      }
+
+      if (root) start(root);
+    </script>
   </body>
 </html>

package/src/pages/admin/logout.ts

@@ -1,10 +1,24 @@
 import type { APIRoute } from 'astro';
 import { SESSION_COOKIE } from '../../lib/auth';
 import { safeNext } from '../../lib/editor/next';
+import { AUTH } from '../../lib/auth/config';
+import { getRequestAuth, clerkClient, clerkOperation, invalidateClerkSession } from '../../lib/auth/request';
 
-export const GET: APIRoute = ({ cookies, redirect, url }) => {
+const logout: APIRoute = async ({ request, cookies, redirect, url, locals }) => {
+  if (AUTH.provider === 'clerk') {
+    if (request.method !== 'POST' || request.headers.get('origin') !== url.origin || request.headers.get('sec-fetch-site') === 'cross-site') return new Response('Open sign out from this site.', { status: 403 });
+    const auth = await getRequestAuth(request, cookies, locals);
+    if (auth.clerk) {
+      try { const client = await clerkClient(locals); await clerkOperation(() => client.sessions.revokeSession(auth.clerk!.sessionId)); invalidateClerkSession(auth.clerk); }
+      catch { return new Response('Unable to sign out. Please try again.', { status: 503, headers: { 'Cache-Control': 'no-store' } }); }
+    }
+    cookies.delete('__session', { path: '/' });
+  }
   cookies.delete(SESSION_COOKIE, { path: '/' });
   // "Switch account" on the editor-app sign-in page comes back to it
   const next = safeNext(url.searchParams.get('next'), url);
-  return redirect(next ? `/admin/login?next=${encodeURIComponent(next)}` : '/admin/login');
+  return redirect(`/admin/login?${AUTH.provider === 'clerk' ? 'signedOut=1&' : ''}${next ? `next=${encodeURIComponent(next)}` : ''}`);
 };
+
+export const GET: APIRoute = context => AUTH.provider === 'clerk' ? new Response('Use the sign-out button on this site.', {status:405,headers:{Allow:'POST','Cache-Control':'no-store'}}) : logout(context);
+export const POST: APIRoute = logout;

package/src/pages/admin/mobile.astro

@@ -1,8 +1,10 @@
 ---
 import Admin from '../../layouts/Admin.astro';
+import AppAccess from '../../components/AppAccess';
 import MobileApp from '../../components/MobileApp';
 import { getRepo } from '../../lib/repo';
 import { requireSession } from '../../lib/api';
+import { PUSH } from '../../lib/push/config';
 const repo = await getRepo(Astro.locals);
 try { await requireSession(Astro.request, Astro.cookies, repo, true); }
 catch { return new Response('Owner access is required.', { status: 403 }); }
@@ -11,8 +13,10 @@ catch { return new Response('Owner access is required.', { status: 403 }); }
   <div class="page-head">
     <div>
       <h1>Mobile app</h1>
-      <p class="sub">Notifications for people who installed your app.</p>
+      <p class="sub">What your app can do on this site{PUSH.enabled ? ', and notifications for people who installed it' : ''}.</p>
     </div>
   </div>
-  <MobileApp client:only="react" />
+  <AppAccess client:only="react" />
+  {PUSH.enabled && <h2 class="section-title">Notifications</h2>}
+  {PUSH.enabled && <MobileApp client:only="react" />}
 </Admin>

package/src/pages/admin/settings.astro

@@ -1,15 +1,18 @@
 ---
 import Admin from '../../layouts/Admin.astro';
 import AiSettings from '../../components/AiSettings';
+import MonitoringSettings from '../../components/MonitoringSettings';
 import { getRepo } from '../../lib/repo';
-import { validateSession, OWNER_ENV, SESSION_COOKIE } from '../../lib/auth';
+import { OWNER_ENV } from '../../lib/auth';
+import { validateRequestSession } from '../../lib/auth/request';
+import { AUTH } from '../../lib/auth/config';
 import { invalidateRedirectCache } from '../../middleware';
 import { CONTENT } from '../../lib/content';
 import { UMAMI_ID_RE, META_PIXEL_ID_RE, TIKTOK_PIXEL_ID_RE, normalizeScriptUrl } from '../../lib/analytics';
 
 const repo = await getRepo(Astro.locals);
 
-const sessionUserId = (await validateSession(Astro.cookies.get(SESSION_COOKIE)?.value, Astro.locals));
+const sessionUserId = (await validateRequestSession(Astro.request, Astro.cookies, Astro.locals));
 const sessionUser = sessionUserId && sessionUserId !== OWNER_ENV ? await repo.getUser(sessionUserId) : null;
 const isOwner = sessionUserId === OWNER_ENV || sessionUser?.role === 'owner';
 
@@ -227,6 +230,7 @@ const groups = [
     { id: 'ai-agents', label: 'AI & agents', terms: 'ai agents openai custom kimi deepseek cli proxy cpamc tailscale mcp' },
     { id: 'analytics', label: 'Analytics', terms: 'analytics umami replay meta pixel tiktok tracking' },
     { id: 'code', label: 'Code injection', terms: 'code injection head footer scripts' },
+    { id: 'monitoring', label: 'Monitoring', terms: 'monitoring uptime kuma health status down alerts heartbeat scheduler' },
   ] }] : []),
   { label: 'Advanced', items: [
     ...(isOwner ? [{ id: 'import', label: 'Import & export', terms: 'import export ghost wordpress migrate migration move content' }] : []),
@@ -472,7 +476,7 @@ const groups = [
         <section class="scard" id="email">
           <header class="scard-head">
             <a class="scard-back" href="#" aria-label="All settings"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 6l-6 6 6 6" /></svg></a>
-            <div class="grow"><h2>Email</h2><p>Invitations, password resets, booking updates and reminders.</p></div>
+            <div class="grow"><h2>Email</h2><p>{AUTH.provider === 'clerk' ? 'Booking updates, reminders and staff notifications. Sign-in email comes from Clerk.' : 'Invitations, password resets, booking updates and reminders.'}</p></div>
             <div class="scard-actions always"><a class="btn" href="/admin/email">Configure email</a></div>
           </header>
           <p class="hint">Choose Resend, Mailgun, Amazon SES or Cloudflare. Manage your sender, notifications and delivery activity.</p>
@@ -570,6 +574,16 @@ const groups = [
 
       {isOwner && <section class="scard" id="ai-agents"><header class="scard-head"><a class="scard-back" href="#" aria-label="All settings">←</a><div class="grow"><h2>AI &amp; agents</h2></div><a class="btn" href="/admin/ai">Import document</a></header><AiSettings client:load /></section>}
 
+      {isOwner && (
+        <section class="scard" id="monitoring">
+          <header class="scard-head">
+            <a class="scard-back" href="#" aria-label="All settings"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 6l-6 6 6 6" /></svg></a>
+            <div class="grow"><h2>Monitoring</h2><p>Uptime Kuma watches the website, the app APIs and the scheduler, and alerts you when one stops.</p></div>
+          </header>
+          <MonitoringSettings client:visible />
+        </section>
+      )}
+
       <div class="set-group-title">Advanced</div>
 
       {isOwner && (
@@ -589,9 +603,12 @@ const groups = [
           <div class="scard-actions always"><a class="btn" href="/api/backup" download>Download backup</a></div>
         </header>
         {isOwner && (
-          <div class="scard-sub first">
+          <div class="scard-sub first" data-rs-clerk={AUTH.provider === 'clerk' ? '1' : undefined}>
             <h3>Restore from backup</h3>
             <p class="hint">Pick a backup ZIP to see what's inside, then restore. <strong>Restoring replaces all current content and booking retry records. Use a fresh v5 backup for migration.</strong></p>
+            {AUTH.provider === 'clerk' && (
+              <p class="hint rs-clerk">With Clerk sign-in, restoring needs a sign-in from the last ten minutes and a backup that includes your current owner account (same account, email and owner role). Only your own Clerk link is kept; everyone else in the backup must be linked again in <a href="/admin/users">Users</a> before they can sign in. Sign-in settings stay as deployed.</p>
+            )}
             <div class="rs-row">
               <input type="file" id="rs-file" accept=".zip,application/zip" aria-label="Backup ZIP" />
               <button class="btn" type="button" id="rs-analyze">Analyze</button>
@@ -643,6 +660,8 @@ const groups = [
 </style>
 
 <script>
+  import { checkReverified, signInAgain } from '../../components/auth/clerk';
+
   // read-mode cards: Edit swaps the summary for the form; Cancel resets it
   document.querySelectorAll<HTMLElement>('.scard[data-editable]').forEach((card) => {
     const form = card.querySelector<HTMLFormElement>('form.scard-form');
@@ -675,16 +694,35 @@ const groups = [
   const rsAnalyze = document.getElementById('rs-analyze');
   const rsGo = document.getElementById('rs-go');
   const rsReport = document.getElementById('rs-report');
+  // Clerk: restores need a recent sign-in; offering to sign in again (which
+  // leaves the page) instead of a doomed upload
+  const rsClerk = !!document.querySelector('[data-rs-clerk]');
+  function offerSignIn(text: string) {
+    if (!rsReport) return;
+    const again = document.createElement('button');
+    again.type = 'button'; again.className = 'btn sm'; again.textContent = 'Sign in again';
+    again.addEventListener('click', () => { again.disabled = true; void signInAgain(location.pathname + location.search + '#backup'); });
+    const p = document.createElement('span');
+    p.textContent = text + ' ';
+    rsReport.replaceChildren(p, again);
+  }
   async function postBackup(dry: boolean) {
     const f = rsFile?.files?.[0];
     if (!f || !rsReport) return null;
+    const fresh = rsClerk ? await checkReverified() : 'unknown';
+    if (fresh === 'needed') {
+      offerSignIn('Restoring needs a sign-in from the last ten minutes. Sign in again, then choose the backup again.');
+      return null;
+    }
     rsReport.textContent = dry ? 'Analyzing…' : 'Restoring…';
     const form = new FormData();
     form.set('file', f);
     const res = await fetch(`/api/restore${dry ? '?dry=1' : ''}`, { method: 'POST', body: form });
     const data = await res.json().catch(() => null);
     if (!res.ok || !data) {
-      rsReport.textContent = `Error: ${data?.error ?? res.statusText}`;
+      const error = `Error: ${data?.error ?? res.statusText}`;
+      // after a confirmed recent sign-in, a 409 means the backup doesn't match
+      if (rsClerk && res.status === 409 && fresh !== 'ok') offerSignIn(error); else rsReport.textContent = error;
       return null;
     }
     return data;