packages/init-stack/src/index.ts (4)

61-61: Consider using a Map for type resolution.

While the current implementation works, using an ES6 Map would be more maintainable and follow the coding guidelines.

Consider refactoring to use a Map:

-const typeFromArgs: "js" | "next" | "react" | undefined = options.js ? "js" : options.next ? "next" : options.react ? "react" : undefined;
+const typeOptionsMap = new Map([
+  ["js", options.js],
+  ["next", options.next],
+  ["react", options.react]
+]);
+const typeFromArgs = Array.from(typeOptionsMap.entries()).find(([_, enabled]) => enabled)?.[0] as "js" | "next" | "react" | undefined;

---

606-606: Unnecessary type assertion can be removed.

The type of clientOrServer is already constrained to "server" | "client", so the type assertion is redundant.

-    }[clientOrServer as "client" | "server"];
+    }[clientOrServer];

---

638-638: Complex template literal could be simplified.

The inline conditional logic makes this template string hard to read and maintain. Consider extracting the configuration object construction.

Consider extracting the configuration logic:

+const getTokenStoreConfig = (type: "js" | "next" | "react", clientOrServer: "client" | "server") => {
+  if (type === "next") return '"nextjs-cookie"';
+  return clientOrServer === "client" ? '"cookie"' : '"memory"';
+};
+
+const buildConfigProperties = (type: "js" | "next" | "react", clientOrServer: "client" | "server", indentation: string) => {
+  const props = [`${indentation}tokenStore: ${getTokenStoreConfig(type, clientOrServer)}`];
+  
+  if (type === "js") {
+    props.push(`\n${indentation}// get your Stack Auth API keys from https://app.stack-auth.com${clientOrServer === "client" ? ` and store them in a safe place (eg. environment variables)` : ""}`);
+    if (projectIdFromArgs) props.push(`\n${indentation}projectId: '${projectIdFromArgs}'`);
+    props.push(`\n${indentation}publishableClientKey: ${publishableClientKeyWrite}`);
+    if (clientOrServer === "server") props.push(`\n${indentation}secretServerKey: process.env.STACK_SECRET_SERVER_KEY`);
+  }
+  
+  return props.join(',');
+};

 export const stack${clientOrServerCap}App = new Stack${clientOrServerCap}App({
-${indentation}tokenStore: ${type === "next" ? '"nextjs-cookie"' : (clientOrServer === "client" ? '"cookie"' : '"memory"')},${type === "js" ? `\n\n${indentation}// get your Stack Auth API keys from https://app.stack-auth.com${clientOrServer === "client" ? ` and store them in a safe place (eg. environment variables)` : ""}` : ""}${type === "js" && projectIdFromArgs ? `\n${indentation}projectId: '${projectIdFromArgs}',` : ""}${type === "js" ? `\n${indentation}publishableClientKey: ${publishableClientKeyWrite},` : ""}${type === "js" && clientOrServer === "server" ? `\n${indentation}secretServerKey: process.env.STACK_SECRET_SERVER_KEY,` : ""}
+${buildConfigProperties(type, clientOrServer, indentation)}
 });

---

729-734: Consider using Map for type string mapping.

Following the coding guidelines preference for ES6 Map over Record/object literals.

-    const typeStringMap = {
-      js: "JavaScript",
-      next: "Next.js",
-      react: "React",
-    } as const;
-    const typeString = typeStringMap[type];
+    const typeStringMap = new Map([
+      ["js", "JavaScript"],
+      ["next", "Next.js"],
+      ["react", "React"]
+    ] as const);
+    const typeString = typeStringMap.get(type);

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

docs/templates/getting-started/setup.mdx (1)

300-331: Duplicate of the Router sample: ensure consistency once redirectMethod is resolved.

Once the redirectMethod API is verified, please mirror the same corrected pattern in both wizard and manual examples to avoid diverging guidance.

docs/templates/getting-started/setup.mdx (5)

167-167: Fix broken/mismatched sign-up URL in Next.js section.

Anchor text and href differ: "signup" vs "sign-up". Use the hyphenated route consistently.

-That's it! Stack is now configured in your Next.js project. If you start your Next.js app with `npm run dev` and navigate to [http://localhost:3000/handler/signup](http://localhost:3000/handler/sign-up), you will see the sign-up page.
+That's it! Stack is now configured in your Next.js project. If you start your Next.js app with `npm run dev` and navigate to [http://localhost:3000/handler/sign-up](http://localhost:3000/handler/sign-up), you will see the sign-up page.

---

188-191: Minor copy tweak: “set up” (verb) and clarity on the example.

-Before getting started, make sure you have a [React project](https://react.dev/learn/creating-a-react-app) setup. We show an example here of a Vite React project.
-We recommend using our **setup wizard** for a seamless installation experience. The wizard automatically detects your project structure and walks you through the setup process. If you encounter any issues with the wizard, you can follow our manual installation steps instead.
+Before getting started, make sure you have a [React project](https://react.dev/learn/creating-a-react-app) set up. The examples below use a Vite React project.
+We recommend using our **setup wizard** for a seamless installation. It automatically detects your project structure and walks you through the steps. If you encounter issues, use the manual installation instead.

---

205-207: Consider adding a short CI note for the new non-interactive flag.

A tiny callout helps users running this in CI discover the new --agent-mode (and --no-browser) without hunting CLI docs.

 npx @stackframe/init-stack@latest
+
+> Note: Running in CI or non-interactively? Use:
+> `npx @stackframe/init-stack@latest --agent-mode --no-browser`

---

212-213: Clarify where to store keys for Vite and avoid accidental client/secret confusion.

• Suggest showing Vite env variable names so users don’t hardcode values.
• Explicitly remind that the secret server key must never be added to client bundles (not shown here, but worth a one-liner).

-Then, create an account on [the Stack Auth dashboard](https://app.stack-auth.com/projects), create a new project with an API key, and copy its values into the `stack/client.ts` file created by the wizard.
+Then, create an account on [the Stack Auth dashboard](https://app.stack-auth.com/projects), create a new project with an API key, and provide the Project ID and Publishable Client Key to the wizard output.
+
+For Vite projects, prefer environment variables:
+
+```sh title=".env"
+VITE_STACK_PROJECT_ID=<your-project-id>
+VITE_STACK_PUBLISHABLE_CLIENT_KEY=<your-publishable-client-key>
+```
+
+Never include your secret server key in client-side code.

---

283-295: Clarify redirectMethod usage: document hook vs function and show both examples

Verified: redirectMethod accepts either an object with useNavigate (hook form) or a navigate function; the template currently shows { useNavigate }. Update docs/templates/getting-started/setup.mdx (lines 283–295) and packages/init-stack/src/index.ts (≈662–668) to state: use { useNavigate } when calling app.useNavigate() from React components (hook rules apply), or pass a captured navigate function (e.g., via useNavigate() + useMemo) as { navigate } for redirects outside components. Reference implementation/types: packages/template/src/lib/stack-app/common.ts and packages/template/src/lib/stack-app/apps/implementations/client-app-impl.ts.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

packages/init-stack/src/index.ts (11)

39-39: Enforce mutual exclusivity for --js/--next/--react; fail fast when multiple are provided.

Right now precedence is implicit (js > next > react). Add a guard to avoid accidental misselection, especially in CI.

 import { Command } from "commander";
+import { Option } from "commander";
@@
 program
   .name(packageJson.name)
@@
-  .option("--react", "Initialize for React project")
+  .addOption(new Option("--react", "Initialize for React project").conflicts(["js", "next"]))
   .option("--npm", "Use npm as package manager")
@@
-  .option("--agent-mode", "Run without prompting for any input")
+  .option("--agent-mode", "Run without prompting for any input")
@@
-const typeFromArgs: "js" | "next" | "react" | undefined = options.js ? "js" : options.next ? "next" : options.react ? "react" : undefined;
+const typeFromArgs: "js" | "next" | "react" | undefined =
+  options.js ? "js" : options.next ? "next" : options.react ? "react" : undefined;
+const selectedTypes = [options.js, options.next, options.react].filter(Boolean).length;
+if (selectedTypes > 1) {
+  throw new UserError("Please specify exactly one of --js, --next, or --react.");
+}

Also applies to: 49-49, 61-61, 67-67

---

210-223: React path wiring: good flow; minor: consider consistent indentation detection.

Hardcoding indentation to two spaces works, but you could reuse guessIndentation from an existing file (if any) for consistency.

---

429-441: React detection should also consider devDependencies.

Some templates pin react in devDependencies. Expand the check to avoid false negatives.

-    if (packageJson.dependencies?.["react"] || packageJson.dependencies?.["react-dom"]) {
+    if (
+      packageJson.dependencies?.react ||
+      packageJson.devDependencies?.react ||
+      packageJson.dependencies?.["react-dom"] ||
+      packageJson.devDependencies?.["react-dom"]
+    ) {
       return "react";
     }

---

459-466: Prefer ES6 Map over object literal for package mapping (per repo guidelines).

Functional behavior is fine; Map better signals key–value intent and avoids accidental key widening.

-  async getStackPackageName(type: "js" | "next" | "react", install = false): Promise<string> {
-    const mapping = {
-      js: (install && process.env.STACK_JS_INSTALL_PACKAGE_NAME_OVERRIDE) || "@stackframe/js",
-      next: (install && process.env.STACK_NEXT_INSTALL_PACKAGE_NAME_OVERRIDE) || "@stackframe/stack",
-      react: (install && process.env.STACK_REACT_INSTALL_PACKAGE_NAME_OVERRIDE) || "@stackframe/react",
-    } as const;
-    return mapping[type];
-  },
+  async getStackPackageName(type: "js" | "next" | "react", install = false): Promise<string> {
+    const mapping = new Map<"js" | "next" | "react", string>([
+      ["js",   (install && process.env.STACK_JS_INSTALL_PACKAGE_NAME_OVERRIDE)   || "@stackframe/js"],
+      ["next", (install && process.env.STACK_NEXT_INSTALL_PACKAGE_NAME_OVERRIDE) || "@stackframe/stack"],
+      ["react",(install && process.env.STACK_REACT_INSTALL_PACKAGE_NAME_OVERRIDE)|| "@stackframe/react"],
+    ]);
+    return mapping.get(type)!;
+  },

Also applies to: 468-468

---

626-636: Harden string injection for keys; prefer nullish coalescing for env fallback.

Avoid breaking literals if keys contain quotes and don’t treat empty string as “unset”.

-    const publishableClientKeyWrite = clientOrServer === "server"
-      ? `process.env.STACK_PUBLISHABLE_CLIENT_KEY ${publishableClientKeyFromArgs ? `|| '${publishableClientKeyFromArgs}'` : ""}`
-      : `'${publishableClientKeyFromArgs ?? 'INSERT_YOUR_PUBLISHABLE_CLIENT_KEY_HERE'}'`;
+    const publishableClientKeyWrite = clientOrServer === "server"
+      ? `process.env.STACK_PUBLISHABLE_CLIENT_KEY${publishableClientKeyFromArgs ? ` ?? ${JSON.stringify(publishableClientKeyFromArgs)}` : ""}`
+      : JSON.stringify(publishableClientKeyFromArgs ?? "INSERT_YOUR_PUBLISHABLE_CLIENT_KEY_HERE");
@@
-    const jsOptions = type === "js" ? [
+    const jsOptions = type === "js" ? [
       `\n\n${indentation}// get your Stack Auth API keys from https://app.stack-auth.com${clientOrServer === "client" ? ` and store them in a safe place (eg. environment variables)` : ""}`,
-      `${projectIdFromArgs ? `${indentation}projectId: '${projectIdFromArgs}',` : ""}`,
+      `${projectIdFromArgs ? `${indentation}projectId: ${JSON.stringify(projectIdFromArgs)},` : ""}`,
       `${indentation}publishableClientKey: ${publishableClientKeyWrite},`,
       `${clientOrServer === "server" ? `${indentation}secretServerKey: process.env.STACK_SECRET_SERVER_KEY,` : ""}`,
     ].filter(Boolean).join("\n") : "";

Also applies to: 646-647

---

653-684: writeReactClientFile: quote safely, polish placeholders, normalize formatting.

Use JSON.stringify for literals; align placeholder text; trim output for consistency.

-    const publishableClientKeyWrite = `'${publishableClientKeyFromArgs ?? 'INSERT_YOUR_PUBLISHABLE_CLIENT_KEY_HERE'}'`;
-    const projectIdWrite = `'${projectIdFromArgs ?? 'INSERT_PROJECT_ID'}'`;
+    const publishableClientKeyWrite = ${JSON.stringify(publishableClientKeyFromArgs ?? "INSERT_YOUR_PUBLISHABLE_CLIENT_KEY_HERE")};
+    const projectIdWrite = ${JSON.stringify(projectIdFromArgs ?? "INSERT_YOUR_PROJECT_ID")};
@@
-    laterWriteFileIfNotExists(
-      stackAppPath,
-      `${imports}export const stackClientApp = new StackClientApp({ \n${indentation}tokenStore: "cookie", \n${indentation}projectId: ${projectIdWrite}, \n${indentation}publishableClientKey: ${publishableClientKeyWrite}${redirectMethod}, \n}); \n`
-    );
+    laterWriteFileIfNotExists(
+      stackAppPath,
+      (
+`${imports}export const stackClientApp = new StackClientApp({
+${indentation}tokenStore: "cookie",
+${indentation}projectId: ${projectIdWrite},
+${indentation}publishableClientKey: ${publishableClientKeyWrite}${redirectMethod},
+});
+`).trim() + "\n"
+    );

---

696-703: Fix spacing/grammar in error and tidy the generated handler formatting.

Minor UX nit + cleaner JSX spacing.

-        `A file at the path ${handlerPath} already exists.Stack uses the / handler path to handle incoming requests.Please remove the existing file and try again.`
+        `A file at the path ${handlerPath} already exists. Stack uses the /handler/[...stack]/page route to handle incoming requests. Please remove the existing file and try again.`
@@
-      `import { StackHandler } from "@stackframe/stack"; \nimport { stackServerApp } from "../../../stack/server"; \n\nexport default function Handler(props${handlerFileExtension.includes("ts") ? ": unknown" : ""
-      }) { \n${projectInfo.indentation} return <StackHandler fullPage app = { stackServerApp } routeProps = { props } />; \n } \n`
+      `import { StackHandler } from "@stackframe/stack";
+import { stackServerApp } from "../../../stack/server";
+
+export default function Handler(props${handlerFileExtension.includes("ts") ? ": unknown" : ""}) {
+${projectInfo.indentation}return <StackHandler fullPage app={stackServerApp} routeProps={props} />;
+}
+`

---

739-744: Nit: prefer Map for typeStringMap (style guideline).

Semantically a map; tiny refactor keeps style consistent with installCommandMap.

-    const typeStringMap = {
-      js: "JavaScript",
-      next: "Next.js",
-      react: "React",
-    } as const;
-    const typeString = typeStringMap[type];
+    const typeString = new Map([
+      ["js", "JavaScript"],
+      ["next", "Next.js"],
+      ["react", "React"],
+    ]).get(type)!;

---

762-764: Improve agent-mode error message to mention “both” option.

Clarify how to request both sides non-interactively.

-      throw new UserError("Please specify the installation type using the --server or --client argument.");
+      throw new UserError("Please specify the installation type using --server or --client (or pass both flags for both).");

---

902-904: Fix misleading flag name in error message.

There is no --project-path option; it’s a positional argument.

-        throw new UserError(`No package.json file found in the project directory ${savedProjectPath}. Please specify the correct project path using the --project-path argument, or create a new project before running the wizard.`);
+        throw new UserError(`No package.json file found in the project directory ${savedProjectPath}. Please pass the correct [project-path] positional argument, or create a new project before running the wizard.`);

---

1095-1110: Guard setRawMode availability and always restore TTY mode.

Avoid crashes on non-TTY streams and ensure restoration even if flush is called early.

-    if (process.stdin.isTTY) {
-      process.stdin.setRawMode(true);
-    }
+    const canSetRaw = process.stdin.isTTY && typeof (process.stdin as any).setRawMode === "function";
+    if (canSetRaw) (process.stdin as any).setRawMode(true);
@@
-    const flush = () => {
+    const flush = () => {
       while (process.stdin.read() !== null) { }
-      if (process.stdin.isTTY) {
-        process.stdin.setRawMode(false);
-      }
+      if (canSetRaw) (process.stdin as any).setRawMode(false);
       resolve();
     };

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro