stack/AGENTS.md
Konsti Wohlwend 6a3459e9ab
Some checks failed
all-good: Did all the other checks pass? / all-good (push) Has been cancelled
Ensure Prisma migrations are in sync with the schema / check_prisma_migrations (22.x) (push) Has been cancelled
Docker Emulator Test / docker (push) Has been cancelled
Docker Server Build and Push / Docker Build and Push Server (push) Has been cancelled
Docker Server Test / docker (push) Has been cancelled
Runs E2E API Tests / build (22.x) (push) Has been cancelled
Runs E2E API Tests with external source of truth / build (22.x) (push) Has been cancelled
Lint & build / lint_and_build (latest) (push) Has been cancelled
Dev Environment Test / restart-dev-and-test (push) Has been cancelled
Run setup tests / setup-tests (push) Has been cancelled
TOC Generator / TOC Generator (push) Has been cancelled
Payments UX update (#863)
Takes `stripeAccountId` out of the schema, adds a new endpoint for
getting a user's account ifo, and adds a new notification banner for
un-onboarded accounts.

<img width="1203" height="524" alt="Screenshot 2025-08-25 at 16 40 18"
src="https://github.com/user-attachments/assets/a2b0626d-dc86-4090-b221-0969ec34f124"
/>

<!-- ELLIPSIS_HIDDEN -->


----

> [!IMPORTANT]
> Enhances payments UX with new UI components, refactors, and expanded
tests, while introducing breaking changes and improved error handling.
> 
>   - **Behavior**:
> - Removes `stripeAccountId` from schema and adds new endpoint in
`route.ts` for user account info.
> - Adds notification banner for un-onboarded accounts in `layout.tsx`.
>     - Updates `createCheckoutUrl` to expect options object.
>   - **UI Componets**:
> - Adds `CreateGroupDialog`, `IncludedItemDialog`, `ItemDialog`,
`OfferDialog`, `PriceDialog`, and `ListSection` in `payments` directory.
> - Implements `Stepper` component in `stepper.tsx` for multi-step
processes.
>     - Adds `IllustratedInfo` component in `illustrated-info.tsx`.
>   - **Refactor**:
>     - Refactors `use-hover.tsx` to improve hover detection.
> - Updates `admin-interface.ts` to handle known errors more robustly.
>     - Removes feature gating from Payments and Offers pages.
>   - **Tests**:
> - Expands E2E and unit tests in `internal-metrics.test.ts` to cover
new payment flows and error handling.
>   - **Misc**:
> - Updates `mapProperty` and `removeProperty` functions in `schema.ts`
for better property handling.
>     - Adds `StripeAccountInfoNotFound` error in `known-errors.tsx`.
> 
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for aed61b5857. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>

----


<!-- ELLIPSIS_HIDDEN -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
  * Stripe onboarding UI, account-status display, and in-app setup flow.
* Quantity support across checkout, test-mode purchases, and purchase
flows.
* Payments dashboard revamp: Offers/Items management, groups, add‑ons,
price editor, included-item dialogs, visual connections, and welcome/DEV
modes.

* **Refactor**
* Stripe account stored per-project and resolved asynchronously;
subscription sync made more robust.
  * Payments and Offers pages no longer feature-gated.

* **Breaking Changes**
  * createCheckoutUrl now expects an options object ({ offerId }).

* **Tests**
* Expanded E2E and unit tests covering payments, onboarding, and
purchase flows.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Bilal Godil <bg2002@gmail.com>
2025-08-27 17:28:01 -07:00

4.5 KiB

CLAUDE.md

This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.

Development Commands

Essential Commands

  • Install dependencies: pnpm install
  • Run tests: pnpm test run (uses Vitest). You can filter with pnpm test run <file-filters>. The run is important to not trigger watch mode
  • Lint code: pnpm lint. pnpm lint --fix will fix some of the linting errors, prefer that over fixing them manually.
  • Type check: pnpm typecheck

Extra commands

These commands are usually already called by the user, but you can remind them to run it for you if they forgot to.

  • Build packages: pnpm build:packages
  • Start dependencies: pnpm restart-deps (resets & restarts Docker containers for DB, Inbucket, etc. Usually already called by the user)
  • Run development: Already called by the user in the background. You don't need to do this. This will also watch for changes and rebuild packages, codegen, etc.
  • Run minimal dev: pnpm dev:basic (only backend and dashboard for resource-limited systems)

Testing

You should ALWAYS add new E2E tests when you change the API or SDK interface. Generally, err on the side of creating too many tests; it is super important that our codebase is well-tested, due to the nature of the industry we're building in.

  • Run all tests: pnpm test run
  • Run some tests: pnpm test run <file-filters>

Database Commands

  • Generate migration: pnpm db:migration-gen
  • Reset database (rarely used): pnpm db:reset
  • Seed database (rarely used): pnpm db:seed
  • Initialize database (rarely used): pnpm db:init
  • Run migrations (rarely used): pnpm db:migrate

Architecture Overview

Stack Auth is a monorepo using Turbo for build orchestration. The main components are:

Apps (/apps)

  • backend (/apps/backend): Next.js API backend running on port 8102
    • Main API routes in /apps/backend/src/app/api/latest
    • Database models using Prisma
  • dashboard (/apps/dashboard): Admin dashboard on port 8101
  • dev-launchpad: Development portal on port 8100
  • e2e: End-to-end tests

Packages (/packages)

  • stack (/packages/stack): Main Next.js SDK
  • stack-shared (/packages/stack-shared): Shared utilities and types
  • stack-ui (/packages/stack-ui): UI components
  • react (/packages/react): React SDK
  • js (/packages/js): JavaScript SDK

Key Technologies

  • Framework: Next.js (with App Router)
  • Database: PostgreSQL with Prisma ORM
  • Testing: Vitest
  • Package Manager: pnpm with workspaces
  • Build Tool: Turbo
  • TypeScript: Used throughout
  • Styling: Tailwind CSS

API Structure

The API follows a RESTful design with routes organized by resource type:

  • Auth endpoints: /api/latest/auth/*
  • User management: /api/latest/users/*
  • Team management: /api/latest/teams/*
  • OAuth providers: /api/latest/oauth-providers/*

Development Ports

To see all development ports, refer to the index.html of apps/dev-launchpad/public/index.html.

Important Notes

  • NEVER UPDATE packages/stack OR packages/js. Instead, update packages/template, as the others are simply copies of that package.
  • For blocking alerts and errors, never use toast, as they are easily missed by the user. Instead, use alerts.
  • Environment variables are pre-configured in .env.development files
  • Always run typecheck, lint, and test to make sure your changes are working as expected. You can save time by only linting and testing the files you've changed (and/or related E2E tests).
  • The project uses a custom route handler system in the backend for consistent API responses
  • When writing tests, prefer .toMatchInlineSnapshot over other selectors, if possible. You can check (and modify) the snapshot-serializer.ts file to see how the snapshots are formatted and how non-deterministic values are handled.
  • Whenever you learn something new, or at the latest right before you call the Stop tool, write whatever you learned into the ./claude/CLAUDE-KNOWLEDGE.md file, in the Q&A format in there. You will later be able to look up knowledge from there (based on the question you asked).
  • Animations: Keep hover/click transitions snappy and fast. Don't delay the action with a pre-transition (e.g. no fade-in when hovering a button) — it makes the UI feel sluggish. Instead, apply transitions after the action, like a smooth fade-out when the hover ends.
  • Use ES6 maps instead of records wherever you can.