feat(web): add the Full Disk Access step to the import wizard

Safari's cookies sit behind Full Disk Access, which no one has granted before
their first import — so it is a step in the flow, not a failure. When an import
comes back needing it, the wizard shows a screen that says what it's for, links
to the right System Settings pane, and — from an "I've turned it on" button —
runs the import itself, so the user never restarts from the menu.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

Author: juliusmarminge

apps/web/src/components/settings/BrowserImportWizard.tsx

@@ -57,6 +57,8 @@ interface BrowserImportWizardProps {
   }) => Promise<ImportOutcome>;
   /** Re-checks the source's availability after the user quits the browser. */
   readonly onRefreshSource: () => Promise<BrowserImportSource | undefined>;
+  /** Opens the OS setting that grants access to a protected cookie store. */
+  readonly onOpenFullDiskAccessSettings: () => void;
   readonly onClose: () => void;
 }
 
@@ -73,6 +75,7 @@ export function BrowserImportWizard({
   canCreateProfile,
   onImport,
   onRefreshSource,
+  onOpenFullDiskAccessSettings,
   onClose,
 }: BrowserImportWizardProps) {
   const [source, setSource] = useState(initialSource);
@@ -121,6 +124,13 @@ export function BrowserImportWizard({
       <DialogPopup className="max-w-lg">
         {step.step === "quit" ? (
           <QuitStep source={source} onCancel={onClose} onRechecked={recheckAfterQuit} />
+        ) : step.step === "fullDiskAccess" ? (
+          <FullDiskAccessStep
+            source={source}
+            onCancel={onClose}
+            onOpenSettings={onOpenFullDiskAccessSettings}
+            onGranted={runImport}
+          />
         ) : step.step === "importing" ? (
           <ImportingStep />
         ) : step.step === "done" ? (
@@ -196,9 +206,39 @@ type ConfigureStepProps = {
   readonly onImport: () => void;
 };
 
-// TEMP: an in-dialog layout switcher for comparing directions live — the ui.sh
-// picker can't load under the app's CSP. Collapse to the chosen variant and
-// delete this switcher before merge.
+function FullDiskAccessStep({
+  source,
+  onCancel,
+  onOpenSettings,
+  onGranted,
+}: {
+  readonly source: BrowserImportSource;
+  readonly onCancel: () => void;
+  readonly onOpenSettings: () => void;
+  readonly onGranted: () => void;
+}) {
+  return (
+    <>
+      <DialogHeader>
+        <DialogTitle>Let T3 Code read {source.name}&rsquo;s cookies</DialogTitle>
+        <DialogDescription>
+          {source.name} keeps its cookies somewhere only apps with Full Disk Access can reach. Turn
+          that on for T3 Code in System Settings, then come back and finish the import.
+        </DialogDescription>
+      </DialogHeader>
+      <DialogFooter>
+        <Button variant="outline" onClick={onCancel}>
+          Cancel
+        </Button>
+        <Button variant="outline" onClick={onOpenSettings}>
+          Open System Settings
+        </Button>
+        <Button onClick={onGranted}>I&rsquo;ve turned it on</Button>
+      </DialogFooter>
+    </>
+  );
+}
+
 function ConfigureStep({
   source,
   targetProfiles,

apps/web/src/components/settings/IntegrationsSettings.logic.test.ts

@@ -0,0 +1,24 @@
+import { describe, expect, it } from "vite-plus/test";
+
+import { importFailureReason } from "./IntegrationsSettings";
+
+// Mirrors `BrowserImportFailedError.message`, which IPC flattens to a string
+// before the renderer sees it.
+const failure = (reason: string) => ({
+  message: `Importing cookies from safari failed: ${reason}.`,
+});
+
+describe("importFailureReason", () => {
+  it("recovers the reason token from the flattened message", () => {
+    // The whole import error path — including the Full Disk Access dialog —
+    // depends on this token surviving the trip through IPC.
+    expect(importFailureReason(failure("needsFullDiskAccess"))).toBe("needsFullDiskAccess");
+    expect(importFailureReason(failure("browserRunning"))).toBe("browserRunning");
+    expect(importFailureReason(failure("readFailed"))).toBe("readFailed");
+  });
+
+  it("falls back to readFailed for anything it cannot classify", () => {
+    expect(importFailureReason(new Error("something else entirely"))).toBe("readFailed");
+    expect(importFailureReason(undefined)).toBe("readFailed");
+  });
+});

apps/web/src/components/settings/IntegrationsSettings.tsx

@@ -49,6 +49,8 @@ import {
   MenuSeparator,
   MenuTrigger,
 } from "../ui/menu";
+import { readLocalApi } from "~/localApi";
+
 import { toastManager } from "../ui/toast";
 import {
   AlertDialog,
@@ -114,7 +116,7 @@ const zoomLabel = (zoomFactor: number) => `${Math.round(zoomFactor * 100)}%`;
  * it. Anything unrecognised reads as a plain read failure rather than leaking
  * the raw message into a toast.
  */
-const importFailureReason = (cause: unknown): BrowserImportFailureReason => {
+export const importFailureReason = (cause: unknown): BrowserImportFailureReason => {
   const message = String((cause as { message?: unknown } | undefined)?.message ?? "");
   return (
     BrowserImportFailureReason.literals.find((reason) => message.includes(`failed: ${reason}.`)) ??
@@ -517,6 +519,14 @@ function DesktopOnlyBrowserDefaults({ children }: { readonly children: ReactNode
  * files, and the answer changes while the app is running (quitting the browser
  * clears `browserRunning`), so a value cached at mount would go stale.
  */
+/**
+ * Opens System Settings → Privacy & Security → Full Disk Access. The scheme is
+ * unchanged from the old System Preferences and still resolves on Ventura and
+ * later.
+ */
+const FULL_DISK_ACCESS_SETTINGS_URL =
+  "x-apple.systempreferences:com.apple.preference.security?Privacy_AllFilesAccess";
+
 function BrowserProfilesSetting({ disabled }: { readonly disabled: boolean }) {
   const userProfiles = useClientSettings((settings) => settings.browserProfiles);
   const defaultProfileId = useClientSettings((settings) => settings.browserDefaultProfileId);
@@ -842,6 +852,11 @@ function BrowserProfilesSetting({ disabled }: { readonly disabled: boolean }) {
           canCreateProfile={!atProfileLimit}
           onImport={(input) => runWizardImport(importSource, input)}
           onRefreshSource={() => refreshImportSource(importSource.id)}
+          onOpenFullDiskAccessSettings={() =>
+            void readLocalApi()
+              ?.shell.openExternal(FULL_DISK_ACCESS_SETTINGS_URL)
+              .catch(() => undefined)
+          }
           onClose={() => setImportSource(null)}
         />
       ) : null}

apps/web/src/components/settings/browserImportWizard.logic.test.ts

@@ -56,6 +56,12 @@ describe("outcomeToStep", () => {
     expect(outcomeToStep({ kind: "blocked", reason: "browserRunning" })).toEqual({ step: "quit" });
   });
 
+  it("routes a Full Disk Access refusal to its own screen", () => {
+    expect(outcomeToStep({ kind: "blocked", reason: "needsFullDiskAccess" })).toEqual({
+      step: "fullDiskAccess",
+    });
+  });
+
   it("surfaces every other failure on the blocked screen", () => {
     expect(outcomeToStep({ kind: "blocked", reason: "readFailed" })).toEqual({
       step: "blocked",

apps/web/src/components/settings/browserImportWizard.logic.ts

@@ -21,6 +21,7 @@ export type ImportOutcome =
  */
 export type WizardStep =
   | { readonly step: "quit" }
+  | { readonly step: "fullDiskAccess" }
   | { readonly step: "configure" }
   | { readonly step: "importing" }
   | {
@@ -58,6 +59,7 @@ export function outcomeToStep(outcome: ImportOutcome): WizardStep {
   // other failure surfaces on the blocked screen, which offers a retry when
   // one could help.
   if (outcome.reason === "browserRunning") return { step: "quit" };
+  if (outcome.reason === "needsFullDiskAccess") return { step: "fullDiskAccess" };
   return { step: "blocked", reason: outcome.reason };
 }