threadcount-community/app/(site)/delete-account/page.tsx

import Link from "next/link";
import { Band, CtaBand, PageHead, SiteNav, body, h2, h3, kicker } from "@/components/site";

/* Google Play requires a publicly reachable page that explains how to delete an account and what
   happens to the data — reachable without signing in, which is why it lives on the marketing site
   rather than inside the app. */
export const metadata = {
  title: "Delete your account",
  description: "How to delete a ThreadCount account or just some of its data, what goes with it, and what is kept.",
  alternates: { canonical: "/delete-account" },
};

const KEPT = [
  ["Nothing, once the facility goes", "Deleting the last account deletes the facility outright. There is no archive copy and no soft-delete flag — the rows are gone from the database."],
  ["Your name on past records, if colleagues remain", "If someone else still runs the facility, only your login is deleted. Issues, stocktakes and slips you recorded keep the name they were stamped with, because a stock record nobody signed isn’t an audit trail."],
  ["Backups you downloaded", "A backup file you exported before deleting stays on your own computer. Delete it yourself if you don’t want it."],
  ["Encrypted server backups, briefly", "Routine server backups roll off on their own schedule. Nothing is restored from them except to recover the whole server after a failure."],
];

const STEPS = [
  ["Sign in at threadcount.tech", "Use the account you want to delete. Deletion is done by the account holder — there is no form to fill in and nobody to email."],
  ["Open Settings, then the Account tab", "It’s the last section on that tab, under your profile, password and users."],
  ["Read which of the two cases you’re in", "The page tells you whether you’re the last person who can sign in. If you are, download a backup first — the link is right there."],
  ["Confirm", "Enter your password. If deleting takes the facility with it, you also type the facility name exactly. Then it’s done immediately."],
];

const PARTIAL: [string, string][] = [
  ["Remove one person from the staff register", "Settings isn’t needed — open the staff member on the Staff Register and delete them. Their name stays on garments already issued, because a stock record nobody signed isn’t an audit trail."],
  ["Wipe the activity, keep the setup", "Deletes every issue, return, order, delivery, pickup, stocktake, approval and photo, and resets stock adjustments. The catalogue, staff register, suppliers and departments stay, so the room can carry on from a clean ledger."],
  ["Start fresh", "Deletes everything the facility has entered — catalogue, barcodes, staff, departments and all history — and leaves only the logins and the facility’s own settings. It’s the reset for a room that wants to begin again without losing its accounts."],
  ["Export first, if you want a copy", "Settings › Data offers a complete JSON backup before you delete anything. It downloads to your own device and we keep no copy of it."],
];

export default function DeleteAccount() {
  return (
    <>
      <SiteNav />
      <PageHead
        kicker="Your data"
        title="Delete your account"
        lede="You can delete a ThreadCount account yourself, from inside the app, without asking anyone — or delete data without closing the account at all. This page explains both, and exactly what goes with each."
      />

      <Band>
        <div style={wrapNarrow}>
          <h2 style={h2}>How to do it</h2>
          <ol style={{ ...body, marginTop: 28, padding: 0, listStyle: "none", display: "grid", gap: 0, borderTop: "2px solid var(--color-text)" }}>
            {STEPS.map(([t, b], i) => (
              <li key={t} style={{ display: "grid", gridTemplateColumns: "44px 1fr", gap: 20, padding: "22px 0", borderBottom: "1px solid var(--color-divider)", alignItems: "start" }}>
                <span style={{ fontFamily: "var(--font-heading)", fontWeight: 800, fontSize: 22, color: "var(--color-neutral-600)", fontVariantNumeric: "tabular-nums" }}>{String(i + 1).padStart(2, "0")}</span>
                <span><b style={{ fontSize: 17 }}>{t}</b><span style={{ display: "block", marginTop: 4 }}>{b}</span></span>
              </li>
            ))}
          </ol>
          <p style={{ ...body, marginTop: 28 }}>
            Can&apos;t sign in? Use the <Link href="/contact">contact form</Link> from the email address on the account and say which facility it belongs to.
          </p>
        </div>
      </Band>

      <Band tone="surface">
        <div style={wrapNarrow}>
          <div style={kicker}>If you use the staff app</div>
          <h2 style={{ ...h2, marginTop: 14 }}>Ask the linen room — it takes effect immediately</h2>
          <p style={{ ...body, marginTop: 18 }}>
            The steps above are for a linen-room coordinator. If you are a staff member who signs in
            to <b>ThreadCount Staff</b> to see your own uniform, your account works differently,
            because the record it attaches to belongs to the linen room rather than to you.
          </p>
          <p style={{ ...body, marginTop: 18 }}>
            Ask your uniform coordinator to remove your access. There is a button on your staff
            record that does exactly that: it deletes your sign-in, and it ends every session you
            have open straight away. You can be given a fresh code later if you change your mind.
          </p>
          <p style={{ ...body, marginTop: 18 }}>
            Your register entry and issue history stay behind, because the facility needs them for
            its own stock and financial records — the same way your employer keeps a record of any
            equipment issued to you. Deleting those is the facility&apos;s decision, not something
            one sign-in controls.
          </p>
          <p style={{ ...body, marginTop: 18 }}>
            If you would rather not ask your coordinator, or you want a copy of what is held about
            you first, write to <b>privacy@threadcount.tech</b> and we will route it through your
            facility&apos;s privacy process.
          </p>
        </div>
      </Band>

      <Band tone="surface">
        <div style={wrapNarrow}>
          <div style={kicker}>The two cases</div>
          <h2 style={{ ...h2, marginTop: 14 }}>What gets deleted depends on whether anyone else is left</h2>
          <div style={{ display: "grid", gridTemplateColumns: "1fr", gap: 0, marginTop: 32, border: "2px solid var(--color-text)" }}>
            <div style={{ padding: "26px 28px", borderBottom: "1px solid var(--color-divider)" }}>
              <h3 style={h3}>Other people can still sign in</h3>
              <p style={{ ...body, marginTop: 10 }}>
                Only your login is deleted. The facility, its catalogue, staff register, stock and history all stay,
                because they belong to the linen room rather than to you. Your name stays on what you recorded.
              </p>
            </div>
            <div style={{ padding: "26px 28px", background: "var(--color-bg)" }}>
              <h3 style={{ ...h3, color: "var(--color-accent-700)" }}>You are the last one</h3>
              <p style={{ ...body, marginTop: 10 }}>
                Deleting your account deletes the whole facility: every user, the catalogue and barcodes, the staff
                register, every issue, return, order, delivery, stocktake, photo and signature. It happens immediately,
                it cannot be undone, and support cannot get it back. Download a backup first if any of it matters.
              </p>
            </div>
          </div>
        </div>
      </Band>

      <Band tone="surface">
        <div style={wrapNarrow}>
          <div style={kicker}>Without closing your account</div>
          <h2 style={{ ...h2, marginTop: 14 }}>Deleting some data, but not all of it</h2>
          <p style={{ ...body, marginTop: 18 }}>
            You don&apos;t have to delete your account to remove data. An administrator can do any of these from
            Settings &rsaquo; Data, and keep working afterwards:
          </p>
          <ol style={{ ...body, marginTop: 24, padding: 0, listStyle: "none", borderTop: "2px solid var(--color-text)" }}>
            {PARTIAL.map(([t, b], i) => (
              <li key={t} style={{ display: "grid", gridTemplateColumns: "44px 1fr", gap: 20, padding: "22px 0", borderBottom: "1px solid var(--color-divider)", alignItems: "start" }}>
                <span style={{ fontFamily: "var(--font-heading)", fontWeight: 800, fontSize: 22, color: "var(--color-neutral-600)", fontVariantNumeric: "tabular-nums" }}>{String(i + 1).padStart(2, "0")}</span>
                <span><b style={{ fontSize: 17 }}>{t}</b><span style={{ display: "block", marginTop: 4 }}>{b}</span></span>
              </li>
            ))}
          </ol>
          <p style={{ ...body, marginTop: 24 }}>
            All of these happen immediately and can&apos;t be undone. None of them touches your login, so you stay
            signed in and the facility keeps running.
          </p>
        </div>
      </Band>

      <Band>
        <div style={wrapNarrow}>
          <h2 style={h2}>What is kept, and for how long</h2>
          <div style={{ marginTop: 28, borderTop: "2px solid var(--color-text)" }}>
            {KEPT.map(([t, b]) => (
              <div key={t} style={{ padding: "22px 0", borderBottom: "1px solid var(--color-divider)" }}>
                <b style={{ fontSize: 17 }}>{t}</b>
                <p style={{ ...body, marginTop: 4 }}>{b}</p>
              </div>
            ))}
          </div>
          <p style={{ ...body, marginTop: 28 }}>
            More detail on how data is held is in the <Link href="/privacy">privacy policy</Link> and{" "}
            <Link href="/data-security">data security</Link> pages.
          </p>
        </div>
      </Band>

      <CtaBand
        title="Deleting because something isn’t working?"
        lede="If ThreadCount isn’t doing what your linen room needs, that’s worth hearing before you delete anything. The contact form goes straight to the person who wrote it."
      />
    </>
  );
}

const wrapNarrow: React.CSSProperties = { maxWidth: 860 };