@ofidj/generator-fidj 3.15.1 → 3.17.0

package/generators/app/templates/typescript/package.json

@@ -15,8 +15,8 @@
     "privacy:rehearse": "npm run build && node --test test/server.test.mjs"
   },
   "dependencies": {
-    "@ofidj/entry": "^3.15.1",
-    "@ofidj/node": "^3.15.0"
+    "@ofidj/entry": "^3.17.0",
+    "@ofidj/node": "^3.17.0"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",

package/generators/app/templates/typescript/src/content.ts

@@ -1,5 +1,5 @@
-import {agreementModel, signInErrorMessage, agreementRequired, agreementFromRefusal, verificationPending, pollVerification, rememberSignIn, forgetSignIn, signInHint, type SigninShape} from "@ofidj/entry";
-import {agreementScreen, bindAgreementScreen, bindPasswordReveal, acceptedAgreement, verificationWait, providerEntry, showEmailEntry, showVersionBadge, escape, masthead, highlightCells, badgeStrip, credentialFields, accountForm, returnNotice, passkeySupported, passkeyAssertion, walletDoor} from "@ofidj/entry/dom";
+import {signInErrorMessage, formatDate, optionalPurposes, agreementRequired, agreementFromRefusal, verificationPending, pollVerification, rememberSignIn, forgetSignIn, signInHint, type SigninShape} from "@ofidj/entry";
+import {agreementScreen, bindAgreementScreen, bindPasswordReveal, acceptedAgreement, verificationWait, providerEntry, showEmailEntry, showVersionBadge, escape, masthead, highlightCells, badgeStrip, credentialFields, accountForm, passkeySupported, passkeyAssertion, walletDoor, oidcInteractionMarkup, oidcInteractionStyles, bindOidcInteraction} from "@ofidj/entry/dom";
 import {openProviderWindow, relayProviderAnswer, type ProviderWindow} from "@ofidj/entry/window";
 import { FidjNodeService, FidjOidcClient } from "@ofidj/node";
 import config from "../app.config.json";
@@ -330,7 +330,10 @@ const PUBLIC_ROUTE = "pub";
 // spinner's worth of ceremony, and it says what it is doing.
 let recognising = false;
 function mightBeRecognised() {
-  if (!oidc || !isFidjItself) return false;
+  // Fidj itself, or an app this browser signed in to before: its session lives
+  // in the tab, so a new tab would otherwise draw "Continue as …" for somebody
+  // Fidj still recognises.
+  if (!oidc || !(isFidjItself || signInHint(config.appId))) return false;
   if ((moduleRoute() || "").split("/")[0] === PUBLIC_ROUTE) return false;
   // Not on a screen somebody was sent to by a link.
   //
@@ -354,7 +357,12 @@ function mightBeRecognised() {
 }
 
 async function askWhetherFidjKnowsThisBrowser() {
-  if (!oidc || !isFidjItself || sdk.isLoggedIn() || oidc.signedOutHere())
+  if (
+    !oidc ||
+    !(isFidjItself || signInHint(config.appId)) ||
+    sdk.isLoggedIn() ||
+    oidc.signedOutHere()
+  )
     return false;
   if ((moduleRoute() || "").split("/")[0] === PUBLIC_ROUTE) return false;
   // Not on a screen somebody was sent to by a link.
@@ -603,7 +611,7 @@ function render() {
     // The two ways out, last and together: back to the app, or out of this
     // session. Leaving the app itself is a different decision and stays where
     // the things it erases are listed.
-    root.innerHTML = `<section class="content-account">${profileSummary()}<div class="card profile-body">${banner()}${accountForm("account", {linkToken, verificationConfirmed, emailVerified, accountEmail}, {compact: true})}${privacyBlock()}</div></section>`;
+    root.innerHTML = `<section class="content-account">${profileSummary()}<div class="card profile-body">${banner()}${emailVerified ? accountRows() : accountForm("account", {linkToken, verificationConfirmed, emailVerified, accountEmail}, {compact: true})}${privacyBlock()}</div></section>`;
     renderNav("account");
     wireAccount("account");
     wireSignOut();
@@ -913,9 +921,11 @@ function wirePrivacy() {
     "click",
     () =>
       void action(async () => {
+        // The version published now is the version recorded.
+        const agreement = await readAgreement();
         await request(appPath + "/consents", "PUT", {
           terms: true,
-          cguVersion: "starter-demo-1",
+          ...(agreement ? {cguVersion: agreement.version} : {}),
           source: "profile",
         });
         await refresh();
@@ -984,27 +994,43 @@ function wirePrivacy() {
 // about it. It used to be a screen of its own called My privacy, one tab
 // away from the account it was about — so a person looking for their own
 // data had two places to try and no way to tell which.
+// The account, once there is nothing left to verify: one line, and the way to
+// change it, which is on Fidj — the account is Fidj's, not this app's.
+function accountRows() {
+  return `<div class="member-rows"><div class="member-row"><div><strong>Email</strong><small>${escape(accountEmail)} · verified</small></div><a href="${escape(config.dashboardUrl)}/#/my/profile" target="_blank" rel="noopener noreferrer">Manage on Fidj ↗</a></div></div>`;
+}
+
 function privacyBlock() {
-  return `<h2>What ${escape(config.title)} holds</h2><p>Roles: ${roles.map(escape).join(" · ") || "No assigned roles"}</p><button id="refresh">Refresh access</button>
-  <p>These choices apply only to this app.${config.allowAnonymous ? " You can also view the public content by entering anonymously." : ""}</p>
-  <p>Service agreement: ${consent.terms ? "Accepted" : "Not recorded"}. ${consent.terms ? "Leaving withdraws this agreement." : 'This generated example uses a demo agreement. <button id="terms">Accept demo agreement</button>'}</p>
-  ${["analytics", "communications", "optionalData"].map((key, i) => `<label class="toggle"><span>${["Analytics", "Communications", "Optional data"][i]}</span><input type="checkbox" data-purpose="${key}" ${consent[key] ? "checked" : ""}></label>`).join("")}
-  <h3>Consent history</h3>${
-    history.length
-      ? history
-          .slice()
-          .reverse()
-          .map(
-            (entry) =>
-              `<p>${escape(entry.type)} · ${entry.granted ? "Accepted" : "Withdrawn"} · ${escape(entry.changedAt)}</p>`,
-          )
-          .join("")
-      : "<p>No changes yet.</p>"
-  }
-  <button id="export">Export my app data</button>
-  <p>This app stores its session in this browser. The export covers Fidj-held records for this membership. There is no separate app database in this static template.</p>
-  ${roles.includes("Owner") ? "<p>Resolve app ownership before leaving.</p>" : leaving ? '<p>Confirm departure: your membership and its Fidj-held data will be removed. Your other apps remain available.</p><button id="confirm-leave" class="danger">Confirm leaving this app</button><button id="cancel-leave">Keep my membership</button>' : '<button id="leave" class="danger">Leave this app</button>'}
-  <p class="leaving"><a href="${escape(config.dashboardUrl)}/#/my" target="_blank" rel="noopener">Open Fidj to manage every app you use ↗</a><br><small>Fidj is the account provider behind ${escape(config.title)}. This opens it in a new tab; you stay signed in here.</small></p>`;
+  const acceptedVersion = String((consent as Record<string, unknown>).termsVersion || "");
+  const agreementHref = `${config.apiEndpoint}/apps/${encodeURIComponent(config.appId)}/agreements/${encodeURIComponent(acceptedVersion)}`;
+  const agreementRow = consent.terms
+    ? `<div class="member-row"><div><strong>Service agreement</strong>${acceptedVersion ? `<a class="basis" href="${escape(agreementHref)}" target="_blank" rel="noopener noreferrer">Contract · agreement ${escape(acceptedVersion)} ↗</a>` : '<span class="basis">Contract</span>'}</div><small class="nosw">Part of the service. To stop it, leave the app.</small></div>`
+    : '<div class="member-row"><div><strong>Service agreement</strong><small>Not accepted yet — accept it or leave the app.</small></div><button id="terms" class="primary">Accept</button></div>';
+  const choices = optionalPurposes
+    .map(
+      (purpose) =>
+        `<label class="member-row" for="purpose-${purpose.key}"><div><strong>${escape(purpose.title)}</strong><small>${escape(purpose.description)}</small><span class="basis consent">Consent</span></div><span class="switch"><input type="checkbox" role="switch" id="purpose-${purpose.key}" data-purpose="${purpose.key}" ${consent[purpose.key] ? "checked" : ""}><span class="switch-state" aria-hidden="true">${consent[purpose.key] ? "On" : "Off"}</span></span></label>`,
+    )
+    .join("");
+  const entries = history.length
+    ? history
+        .slice()
+        .reverse()
+        .map(
+          (entry) =>
+            `<p>${escape(formatDate(entry.changedAt, "datetime"))} · ${escape(entry.type)} ${entry.granted ? "given" : "withdrawn"}</p>`,
+        )
+        .join("")
+    : "<p>No changes yet.</p>";
+  const leave = roles.includes("Owner")
+    ? "<small>You own this app: hand it over or delete it on Fidj before leaving.</small>"
+    : leaving
+      ? '<p>Your membership and what this app holds for you will be erased. Your other apps remain available.</p><button id="confirm-leave" class="danger">Leave &amp; erase</button><button id="cancel-leave">Keep my membership</button>'
+      : '<button id="leave" class="danger">Leave &amp; erase</button>';
+  return `<h2>Your membership</h2><div class="member-rows">${agreementRow}${choices}</div>
+  <details class="member-history"><summary>History</summary>${entries}</details>
+  <div class="member-actions"><button id="export">Export</button>${leave}</div>
+  <p class="leaving"><a href="${escape(config.dashboardUrl)}/#/my/gdpr" target="_blank" rel="noopener noreferrer">Open Fidj to manage every app you use ↗</a></p>`;
 }
 
 // ------------------------------------------------ signing in, for the provider
@@ -1028,8 +1054,11 @@ type Interaction = {
   scopes: string[];
   termsUri: string;
   privacyUri: string;
-  // The agreement's own text, so it can be read here rather than in another tab.
   agreement?: {version: string; text: string} | null;
+  // Who the consent screen recognises, as the provider names them.
+  recognisedEmail?: string;
+  // The passkey door's challenge, on the login step.
+  passkey?: {ticket: string; options: unknown};
   action: string;
 };
 let interactionId = "";
@@ -1123,10 +1152,6 @@ function interactionWaitNotice() {
 
 function interactionScreen() {
   const details = interaction!;
-  const asking = escape(details.app.title);
-  const notice = interactionError
-    ? `<p role="alert" class="error">${escape(refusals[interactionError] || refusals.refused)}</p>`
-    : "";
   const action = new URL(details.action, config.apiEndpoint).href;
   // A refusal comes back as a redirect, so the typed address would be lost —
   // and retyping an address is the part a person gets wrong twice. It is kept
@@ -1135,67 +1160,33 @@ function interactionScreen() {
   try {
     typed = sessionStorage.getItem("fidj.interaction.email") || "";
   } catch {}
-  // Fidj signing into Fidj: saying "the account behind fidj" and "fidj never
-  // sees your password" about itself is nonsense in the same family as offering
-  // to sign in with Fidj on Fidj.
-  const itself = details.app.id === config.appId;
-  // The wait, when this interaction is waiting on an address rather than asking
-  // for anything. It is not a refusal and must not be drawn as one: the account
-  // exists, the link was sent, and what is left is opening it. The address is
-  // read from the interaction's own context rather than from the URL, so
-  // nothing about the person travels in an address bar.
-  const body = details.awaiting
-    ? `<h2>Check your email</h2>
-  <p class="signin-lead">Your account is created. Waiting for you to open the link sent to <strong>${escape(details.awaiting)}</strong>.</p>
-  ${returnNotice(itself ? "Fidj" : asking)}
-  <form method="post" action="${escape(action)}" id="interaction">
-    <input type="hidden" name="csrf" value="${escape(details.csrf)}">
-    <p class="fineprint">The link may take a minute, and it sometimes lands in spam. Open it, then come back here.</p>
-    ${interactionWaitNotice()}
-    <button class="primary" type="submit" name="action" value="continue">Continue</button>
-    <button class="secondary" type="submit" name="action" value="resend">Send the link again</button>
-    <button class="quiet" type="submit" name="action" value="cancel" formnovalidate>Cancel and go back</button>
-  </form>`
-    : details.prompt === "login"
-      ? `<h2>${itself ? "Sign in to Fidj" : "Sign in to continue to " + asking}</h2>
-  <p class="signin-lead">${itself ? "One account across every app that uses Fidj, and a separate set of choices for each one." : `This is Fidj, the account behind ${asking}. One account, and separate choices for every app that uses it — ${asking} never sees your password.`}</p>
-  ${returnNotice(itself ? "Fidj" : asking)}
-  ${notice}
-  <form method="post" action="${escape(action)}" id="interaction">
-    <input type="hidden" name="csrf" value="${escape(details.csrf)}">
-    <label for="email">Email</label><input id="email" name="email" type="email" value="${escape(typed)}" autocomplete="username" required>
-    <div class="field-head"><label for="password">Password</label><a href="${escape(config.dashboardUrl)}/#/forgot">Forgot?</a></div>
-    <div class="password-field"><input id="password" name="password" type="password" autocomplete="current-password" required><button type="button" id="reveal" aria-controls="password">Show</button></div>
-    <button class="primary" type="submit" name="action" value="continue">Sign in</button>
-    <button class="secondary" type="submit" name="action" value="signup">Create a Fidj account</button>
-    <button class="quiet" type="submit" name="action" value="cancel" formnovalidate>Cancel and go back</button>
-  </form>`
-      : `<h2>${itself ? "Continue to Fidj" : "Continue to " + asking}</h2>
-  <p class="signin-lead">${itself ? "Fidj is asking for the information below. Optional privacy choices stay separate for every app, including this one." : `${asking} is asking for the information below. Optional privacy choices stay separate, and you can change them in Fidj at any time.`}</p>
-  ${returnNotice(itself ? "Fidj" : asking)}
-  ${notice}
-  <ul class="scope-list">${details.scopes
-    .filter((scope) => scopeMeaning[scope])
-    .map((scope) => `<li>${escape(scopeMeaning[scope])}</li>`)
-    .join("")}</ul>
-  <form method="post" action="${escape(action)}" id="interaction">
-    <input type="hidden" name="csrf" value="${escape(details.csrf)}">
-    <label class="agreement-choice"><input type="checkbox" name="terms" value="true" required><span>${escape(agreementModel(details.app.title, {}).checkboxLabel)}</span></label>
-    ${details.agreement ? `<details class="agreement"><summary>Read service agreement</summary><p class="fineprint">Version ${escape(details.agreement.version)}</p><p>${escape(details.agreement.text)}</p></details><p class="fineprint">Required to sign in. Optional data choices stay separate.</p>` : ""}
-    ${details.termsUri ? `<p class="fineprint"><a href="${escape(details.termsUri)}" target="_blank" rel="noopener noreferrer">Service agreement</a>${details.privacyUri ? ` · <a href="${escape(details.privacyUri)}" target="_blank" rel="noopener noreferrer">Privacy notice</a>` : ""}</p>` : ""}
-    <button class="primary" type="submit" name="action" value="continue">Allow and continue</button>
-    <button class="quiet" type="submit" id="not-me" name="action" value="switch" formnovalidate>Not you? Sign in with another account</button>
-    <button class="quiet" type="submit" name="action" value="cancel" formnovalidate>Cancel and go back</button>
-  </form>`;
-
-  root.innerHTML = `<section class="signin-shell"><div class="signin-intro is-plain">${masthead(config.logo, config.title)}
-  <div class="signin-identity"><h1>Your identity.<br>Your choices.</h1><p class="signin-description">One account across every app that uses Fidj, and a separate set of choices for each one.</p></div>
-  ${highlightCells(config.highlights)}</div>
-  <div class="signin-form"><div>${body}</div>
-  <div class="signin-trust"><p class="signin-trust-head"><img class="signin-logo" src="./fidj-logo.png" alt="Fidj"><strong>What Fidj is</strong></p><p>Fidj holds your account so each app does not have to. You can see every app you use, what it holds, and take it back — at any time.</p></div></div>
-  ${badgeStrip(config.badges)}</section>`;
-
-  if (element("interaction")) bindPasswordReveal(element("interaction")!);
+  // The provider's own screen, drawn here: the same markup and the same scoped
+  // styles as the page it serves itself. This window was opened by an app for
+  // one question, so nothing of this front end's own sign-in page — masthead,
+  // promises, "What Fidj is" — is drawn around it. The wait is not a refusal
+  // and is not drawn as one: its address comes from the interaction's context,
+  // never from the URL.
+  const mode = details.awaiting ? "waiting" : details.prompt === "login" ? "login" : "consent";
+  root.innerHTML = `<style>${oidcInteractionStyles}</style>${oidcInteractionMarkup({
+    mode,
+    appTitle: details.app.title,
+    action,
+    csrf: details.csrf,
+    notice: interactionError ? refusals[interactionError] || refusals.refused : undefined,
+    email: typed,
+    forgotHref: `${config.dashboardUrl}/#/forgot`,
+    waitingEmail: details.awaiting,
+    resent: interactionResent,
+    notYet: interactionNotYet,
+    scopes: details.scopes.filter((scope) => scopeMeaning[scope]).map((scope) => scopeMeaning[scope]),
+    agreement: details.agreement || undefined,
+    // The agreement is a document read in the browser, like the privacy notice.
+    agreementHref: details.termsUri || undefined,
+    recognisedEmail: details.recognisedEmail || undefined,
+    passkey: details.passkey,
+    logoSrc: "./fidj-logo.png",
+  })}`;
+  bindOidcInteraction(root);
   // Being recognised is the point, and a dead end when the person is not who
   // Fidj thinks — a shared computer, a second account, somebody else's tab. So
   // the screen that recognises them asks again on request. It goes back to the
@@ -1203,7 +1194,7 @@ function interactionScreen() {
   // session doing the recognising: starting a fresh request with prompt=login
   // from here asked once and left that session standing, so the back button,
   // a reload, or the app's door again met the same face.
-  element("not-me")?.addEventListener("click", () => {
+  root.querySelector('button[value="switch"]')?.addEventListener("click", () => {
     forgetSignIn(config.appId);
     try {
       sessionStorage.removeItem("fidj.interaction.email");

package/generators/app/templates/typescript/src/main.ts

@@ -1,4 +1,4 @@
-import {agreementRequired, agreementFromRefusal, signInErrorMessage, rememberSignIn, forgetSignIn, type SigninShape} from "@ofidj/entry";
+import {agreementRequired, agreementFromRefusal, signInErrorMessage, rememberSignIn, forgetSignIn, formatDate, type SigninShape} from "@ofidj/entry";
 import {acceptedAgreement, agreementScreen, bindAgreementScreen, bindPasswordReveal, providerEntry, showEmailEntry, showVersionBadge} from "@ofidj/entry/dom";
 import {openProviderWindow, relayProviderAnswer, type ProviderWindow} from "@ofidj/entry/window";
 import { FidjNodeService, FidjOidcClient } from "@ofidj/node";
@@ -223,19 +223,19 @@ function render() {
   <nav><button id="workspace-tab" class="${view === "workspace" ? "selected" : ""}">My notes</button><button id="privacy-tab" class="${view === "privacy" ? "selected" : ""}">My privacy</button><button id="refresh">Refresh access</button></nav>
   ${
     view === "workspace"
-      ? `<section class="workspace"><div><div class="section-heading"><h2>Your notes</h2><span>${notes.length} saved</span></div>${notes.length ? notes.map((note) => `<article class="card note"><small>${escape(new Date(note.createdAt).toLocaleString())}</small><h3>${escape(note.title)}</h3><p>${escape(note.body)}</p></article>`).join("") : `<article class="card empty"><span>✳</span><h3>Room for your next idea.</h3><p>Your saved notes will appear here. Only you can read your notes.</p></article>`}</div><form id="note" class="card"><p class="eyebrow">CAPTURE SOMETHING</p><h2>A fresh note</h2><p>${canWrite ? "You have permission to save notes." : "Ask your app owner for Editor access to save notes."}</p><label for="note-title">Title</label><input id="note-title" maxlength="120" required ${!canWrite ? "disabled" : ""}><label for="note-body">Your note</label><textarea id="note-body" rows="6" maxlength="5000" ${!canWrite ? "disabled" : ""}></textarea><button class="primary" type="submit" ${!canWrite ? "disabled" : ""}>Save note</button><small>Your notes are saved by this app and survive a server restart.</small></form></section>`
-      : `<section class="privacy-grid"><article class="card"><p class="eyebrow">ONLY ${escape(settings.title).toUpperCase()}</p><h2>Your choices in this app</h2><p>These preferences are independent of Fidj and your other apps.</p><div class="agreement"><strong>Service agreement</strong><span>${privacy?.consent.terms ? "Accepted" : "Not recorded"}</span>${!privacy?.consent.terms ? '<p>This starter uses a demo agreement. Accept it to record your choice.</p><button id="accept-terms">Accept demo agreement</button>' : "<p>Leaving this app withdraws its required agreement.</p>"}</div>${["analytics", "communications", "optionalData"].map((key, index) => `<label class="toggle"><span><strong>${["Analytics", "Communications", "Optional data"][index]}</strong><small>${["Help improve this app.", "Receive optional news and updates.", "Allow data beyond the essential service."][index]}</small></span><input type="checkbox" data-purpose="${key}" ${privacy?.consent[key] ? "checked" : ""}></label>`).join("")}<button id="export">Export my data</button></article><article class="card"><h2>Consent history</h2>${
+      ? `<section class="workspace"><div><div class="section-heading"><h2>Your notes</h2><span>${notes.length} saved</span></div>${notes.length ? notes.map((note) => `<article class="card note"><small>${escape(formatDate(note.createdAt, "datetime"))}</small><h3>${escape(note.title)}</h3><p>${escape(note.body)}</p></article>`).join("") : `<article class="card empty"><span>✳</span><h3>Room for your next idea.</h3><p>Your saved notes will appear here. Only you can read your notes.</p></article>`}</div><form id="note" class="card"><p class="eyebrow">CAPTURE SOMETHING</p><h2>A fresh note</h2><p>${canWrite ? "You have permission to save notes." : "Ask your app owner for Editor access to save notes."}</p><label for="note-title">Title</label><input id="note-title" maxlength="120" required ${!canWrite ? "disabled" : ""}><label for="note-body">Your note</label><textarea id="note-body" rows="6" maxlength="5000" ${!canWrite ? "disabled" : ""}></textarea><button class="primary" type="submit" ${!canWrite ? "disabled" : ""}>Save note</button><small>Your notes are saved by this app and survive a server restart.</small></form></section>`
+      : `<section class="privacy-grid"><article class="card"><p class="eyebrow">ONLY ${escape(settings.title).toUpperCase()}</p><h2>Your choices in this app</h2><p>These preferences are independent of Fidj and your other apps.</p><div class="agreement"><strong>Service agreement</strong><span>${privacy?.consent.terms ? "Accepted" : "Not recorded"}</span>${!privacy?.consent.terms ? '<p>This starter uses a demo agreement. Accept it to record your choice.</p><button id="accept-terms">Accept demo agreement</button>' : "<p>Leaving this app withdraws its required agreement.</p>"}</div>${["analytics", "communications", "optionalData"].map((key, index) => `<label class="toggle"><span><strong>${["Analytics", "Communications", "Optional data"][index]}</strong><small>${["Help improve this app.", "Receive optional news and updates.", "Allow data beyond the essential service."][index]}</small></span><input type="checkbox" data-purpose="${key}" ${privacy?.consent[key] ? "checked" : ""}></label>`).join("")}<button id="export">Export</button></article><article class="card"><h2>Consent history</h2>${
           privacy?.history.length
             ? privacy.history
                 .slice()
                 .reverse()
                 .map(
                   (entry) =>
-                    `<p><strong>${escape(entry.type)}</strong> · ${entry.granted ? "Accepted" : "Withdrawn"}<br><small>${escape(new Date(entry.changedAt).toLocaleString())}</small></p>`,
+                    `<p><strong>${escape(entry.type)}</strong> · ${entry.granted ? "Accepted" : "Withdrawn"}<br><small>${escape(formatDate(entry.changedAt, "datetime"))}</small></p>`,
                 )
                 .join("")
             : "<p>No changes yet.</p>"
-        }<hr><h2>Leave this app</h2><p>This removes your app membership and this starter’s notes. Your Fidj account and other memberships remain.</p>${session.roles.includes("Owner") ? "<p>As the app owner, resolve ownership before leaving.</p>" : leaving ? '<div role="alertdialog" aria-labelledby="leave-title"><h3 id="leave-title">Confirm departure</h3><p>Your membership, consent and notes in this app will be removed. Your Fidj account and other apps remain available.</p><button id="confirm-leave" class="danger">Confirm leaving and erase</button><button id="cancel-leave">Keep my membership</button></div>' : '<button id="leave" class="danger">Leave and erase my app data</button>'}<p class="fineprint">Exports here include your Fidj membership and this starter’s notes. The registered app-data handler lets Fidj export and erase these notes too. If cleanup is pending, retry from My privacy on Fidj. Minimal completion receipts are retained; backups and unregistered systems are outside this operation.</p></article></section>`
+        }<hr><h2>Leave this app</h2><p>This removes your app membership and this starter’s notes. Your Fidj account and other memberships remain.</p>${session.roles.includes("Owner") ? "<p>As the app owner, resolve ownership before leaving.</p>" : leaving ? '<div role="alertdialog" aria-labelledby="leave-title"><h3 id="leave-title">Confirm departure</h3><p>Your membership, consent and notes in this app will be removed. Your Fidj account and other apps remain available.</p><button id="confirm-leave" class="danger">Leave &amp; erase</button><button id="cancel-leave">Keep my membership</button></div>' : '<button id="leave" class="danger">Leave &amp; erase</button>'}<p class="fineprint">Exports here include your Fidj membership and this starter’s notes. The registered app-data handler lets Fidj export and erase these notes too. If cleanup is pending, retry from My privacy on Fidj. Minimal completion receipts are retained; backups and unregistered systems are outside this operation.</p></article></section>`
   }`
   }
   <footer>Built with Fidj · One identity. Separate choices for every app.</footer></main>`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ofidj/generator-fidj",
-  "version": "3.15.1",
+  "version": "3.17.0",
   "description": "Generate a TypeScript app with Fidj sign-in, live server-side roles and per-app privacy.",
   "homepage": "https://fidj.ovh",
   "bugs": {