feat: Starter Kit v3 for 2026 (#501)

* feat: use swap over to pnpm

* feat: move old starter kit to app directory

prepare for v3

* feat: add pnpm-workspace for monorepo setup

* feat: add tooling packages

* feat: add root package.json

* feat: setup turbo generator

* feat: remove old starter-kit package

* feat: use latest pnpm

* feat: run pnpm update

* fix: prettier monorepo config

* feat: add initial db package

* feat: add initial ui and validator packages

* feat: setup initial (non-working) web app

* docs: update README

* feat: inline trpc setup instead of a separate package

* feat: update vscode settings.json

* feat: update app defaults

* fix: make eslint work

* feat: setup oui and tailwind config

* feat: add version check modal

* feat: split public and authed routes

* feat: add landing page

* feat(api): add email login procedure

* feat: add initial login page

* fix: hoist prisma and pg modules

fixes error messages like:
```
Package @prisma/client can't be external
The request @prisma/client/runtime/client matches serverExternalPackages (or the default list).
```

* feat: add init migration

* feat: finish auth flow

* fix: correct splitLink streaming condition

* feat: add redirects depending on auth state

* feat: conditionally direct to admin or signin page on landing page

* feat: add logout procedure

* feat: tablet styling for login form

* feat: migrate to prisma config file

* test: setup test suite for web app

* test: add user.service tests

* fix: auth service issues that tests highlighted

* feat: reset migrations

* feat: update meRouter

* feat(db): make account table singular

* feat: global error handling

* feat: add vercel-specific build pipeline

* feat(turbo): add missing POSTMAN_API_KEY

* fix: lint

* fix(ci): chromatic workflow

* fix(ci): update conditional to run

* feat: add storybook

* feat: add tooling/storybook package

* feat: update storybook setup

* fix: a11y issues on landing page and add story

* fix(ci): add proper permissions to chromatic workflow

* feat: update error handling

* feat: add error handling for callerFactory

* refactor: extract explicit authMiddleware

* feat: add more docs for why httpBatchStreamLink is used

* feat: add error handling on the trpc route handler itself too

* feat: update to next16 and enable react compiler

* feat: update storybook to v10

* feat(test): add test specific env instead of using local env for tests

* fix: add babel-plugin-react-compiler and remove unnecessary use* calls

* feat: try to figure out why vercel cannot find generated file

* feat: update to vitest v4

* refactor: use _page common syntax for exported page for stories

* feat: add defaultValues for email login form

* feat: add msw and update vitest/browser too

* feat(storybook): add sign-in page stories

* ci: add more types to PR CI.yml

* feat: update prisma and move to pnpm workspace

* docs: update README to links to v2

* feat: update packages

* feat: update starter kit to use node 24 LTS

* feat: format fix

* fix(storybook): flesh out mock link a little more

* fix(turbo): never cache generate

* feat: improve a11y of otp prefix

Author: karrui

.env.example

@@ -1,57 +1,15 @@
-# Since the ".env" file is gitignored, you can use the ".env.example" file to
-# build a new ".env" file when you clone the repo. Keep this file up-to-date
-# when you add new variables to `.env`.
+# Since .env is gitignored, you can use .env.example to build a new `.env` file when you clone the repo.
+# Keep this file up-to-date when you add new variables to \`.env\`.
 
-# This file will be committed to version control, so make sure not to have any
-# secrets in it. If you are cloning this repo, create a copy of this file named
-# ".env" and populate it with your secrets.
+# This file will be committed to version control, so make sure not to have any secrets in it.
+# If you are cloning this repo, create a copy of this file named `.env` and populate it with your secrets.
 
-# When adding additional environment variables, the schema in "/src/env.mjs"
-# should be updated accordingly.
+# The database URL is used to connect to your Supabase database.
+DATABASE_URL="postgresql://root:root@localhost:54321/app"
 
-# Database settings
-# =================
-# Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB and CockroachDB.
-# See the documentation for all the connection string options: https://pris.ly/d/connection-strings
-DATABASE_URL=postgres://root:root@localhost:5432/app
+# You can generate a secret via 'pnpx uuid' on the command line. This should be at least 32 characters long.
+SESSION_SECRET='please-generate-a-secret-and-put-it-here'
 
-# Auth settings
-# =============
-# Expiry time for OTP in seconds. Default is 600 seconds (10 minutes).
-OTP_EXPIRY=600
-# Secret to hash sessions. Can use https://1password.com/password-generator/ to generate a strong secret.
-SESSION_SECRET=random_session_secret_that_is_at_least_32_characters
-
-# Mail settings
-# =============
-POSTMAN_API_KEY=
-# If using Sendgrid instead, the API token and "From" address must be set together.
-SENDGRID_API_KEY=
-SENDGRID_FROM_ADDRESS=
-
-# Image upload settings
-# =====================
-# R2 API Keys for S3-compatible image upload
-# If set to true, enables image upload
-NEXT_PUBLIC_ENABLE_STORAGE=
-R2_ACCOUNT_ID=
-R2_BUCKET_NAME=
-R2_AVATARS_DIRECTORY=avatars
-R2_IMAGES_DIRECTORY=images
-R2_ACCESS_KEY_ID=
-R2_SECRET_ACCESS_KEY=
-R2_PUBLIC_HOSTNAME=
-
-# SGID settings
-# =============
-# If set to true, enables SGID login
-NEXT_PUBLIC_ENABLE_SGID=
-SGID_CLIENT_ID=
-SGID_CLIENT_SECRET=
-SGID_REDIRECT_URI=
-SGID_PRIVATE_KEY=
-
-# Other settings
-# ================
-# NEXT_PUBLIC_APP_NAME= # Uncomment to set application name
-# NEXT_PUBLIC_APP_URL= # Uncomment to set application URL
+# Change this to your app name. This is used when the application needs to refer to itself,
+# e.g. in emails or on the landing page.
+NEXT_PUBLIC_APP_NAME='Starter Kit'

.env.test

@@ -1,6 +1,3 @@
-# .github/workflows/chromatic.yml
-
-# Workflow name
 name: 'Chromatic'
 
 # Event for the workflow
@@ -11,39 +8,50 @@ on:
   pull_request:
     types: [opened, reopened, synchronize]
 
+permissions:
+  contents: read
+  pull-requests: read
+
 # List of jobs
 jobs:
-  chromatic-deployment:
-    permissions:
-      contents: read
-      checks: write
-    # Operating System
+  # JOB to run change detection and run specific chromatic jobs only on changes
+  changes:
     runs-on: ubuntu-latest
-    env:
-      CHROMATIC_PROJECT_TOKEN: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
-    if: ${{ !endsWith(github.actor , 'bot') && !endsWith(github.actor, '[bot]')}}
-    # Job steps
+    # Set job outputs to values from filter step
+    outputs:
+      web: ${{ steps.filter.outputs.web }}
     steps:
-      - uses: actions/checkout@v4
-        if: env.CHROMATIC_PROJECT_TOKEN != ''
+      - uses: actions/checkout@v5
+      # For pull requests it's not necessary to checkout the code
+      - uses: dorny/paths-filter@de90cc6fb38fc0963ad72b210f1f284cd68cea36
+        id: filter
         with:
-          fetch-depth: 0 # Required so Chromatic can compare commits
-      - uses: ./.github/actions/setup
-        if: env.CHROMATIC_PROJECT_TOKEN != ''
-      - name: Load .env file
-        if: env.CHROMATIC_PROJECT_TOKEN != ''
-        # xom9ikk/dotenv@v2, using commit hash to pin as tags may be updated in supply chain attack
-        uses: xom9ikk/dotenv@eff1dce037c4c0143cc4180a810511024c2560c0
+          filters: |
+            web:
+              - 'apps/web/**'
+  web:
+    needs: [changes]
+    # Only run if the user is not a bot and has changes
+    if: ${{ !endsWith(github.actor , 'bot') && !endsWith(github.actor, '[bot]') && needs.changes.outputs.web == 'true' }}
+    runs-on: ubuntu-latest
+    env:
+      CHROMATIC_WEB_PROJECT_TOKEN: ${{ secrets.CHROMATIC_WEB_PROJECT_TOKEN }}
+    steps:
+      - uses: actions/checkout@v5
+        if: env.CHROMATIC_WEB_PROJECT_TOKEN != ''
         with:
-          mode: test
+          fetch-depth: 0 # Required for v5
+      - name: Setup
+        if: env.CHROMATIC_WEB_PROJECT_TOKEN != ''
+        uses: ./tooling/github/setup
       - name: Publish to Chromatic
-        if: env.CHROMATIC_PROJECT_TOKEN != ''
-        # chromaui/action@latest, using commit hash to pin to silence codeQL
-        uses: chromaui/action@012a0241a4df3f0f831c99f02e2085c9641a25ba
+        if: env.CHROMATIC_WEB_PROJECT_TOKEN != ''
+        uses: chromaui/action@latest
         with:
-          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
+          workingDir: apps/web
+          storybookBaseDir: apps/web
+          projectToken: ${{ env.CHROMATIC_WEB_PROJECT_TOKEN }}
           onlyChanged: true
           exitOnceUploaded: true
           autoAcceptChanges: main
-          # Skip running Chromatic on dependabot PRs
-          skip: dependabot/**
+          skip: dependabot/** # Skip running Chromatic on dependabot PRs