diff --git a/.claude/settings.json b/.claude/settings.json new file mode 100644 index 0000000..6251a15 --- /dev/null +++ b/.claude/settings.json @@ -0,0 +1,16 @@ +{ + "$schema": "https://json.schemastore.org/claude-code-settings.json", + "hooks": { + "Stop": [ + { + "hooks": [ + { + "type": "command", + "command": "cd \"$CLAUDE_PROJECT_DIR\" && bun run type-check && bun run lint && bun run format:check", + "timeout": 120 + } + ] + } + ] + } +} diff --git a/.gitignore b/.gitignore index 2b6f7fc..fbfaebf 100644 --- a/.gitignore +++ b/.gitignore @@ -25,4 +25,11 @@ dist-ssr # AI CLAUDE.md -.cursor/ \ No newline at end of file +.cursor/ + +# Visual-QA artefacts (generated by scripts/screenshot-home.mjs) +specs/iterations/*.png + +# Env +.env +.env.local diff --git a/.prettierignore b/.prettierignore index 7f080e6..ff15c23 100644 --- a/.prettierignore +++ b/.prettierignore @@ -2,3 +2,5 @@ node_modules dist pnpm-lock.yaml convex/_generated +apps/dashboard/test-results +apps/dashboard/playwright-report diff --git a/CLAUDE.md b/CLAUDE.md new file mode 100644 index 0000000..5afd662 --- /dev/null +++ b/CLAUDE.md @@ -0,0 +1,75 @@ +# Cornell Loop — Agent Guide + +Loop is an event-discovery dashboard for Cornell student orgs. Students follow clubs, RSVP to events, and browse a feed of upcoming happenings. Convex backs auth + data; a browser extension surface is also planned. + +Keep this file concise — it loads every new session. + +## Repo layout + +- `apps/dashboard/` — Vite + React 19 + TypeScript SPA (the main web app). +- `shared/ui/` — design system (components, tokens, utils). Imported in the dashboard via the `@app/ui` alias (see `apps/dashboard/vite.config.ts`). +- `ai/`, `scripts/`, `specs/` — docs, codegen helpers, and visual-QA artefacts. + +No other apps today; workspace is set up to grow (e.g. extension). + +## Tech stack + +- **React 19** + **React Router v7** (see `apps/dashboard/src/App.tsx` for routes). +- **Convex** (`@convex-dev/auth`) for auth. `ProtectedRoute` has a **dev bypass** — protected routes render without login when `import.meta.env.DEV`. Great for iteration. **Always read `apps/dashboard/convex/_generated/ai/guidelines.md` first** before touching Convex code — its rules override training data. +- **Tailwind CSS v4** via `@tailwindcss/vite`. No config file; content scanning is via `@source` directives inside `apps/dashboard/src/index.css`. **Important:** `shared/ui/src` is explicitly `@source`'d so design-system classes land in the generated CSS. If a design-system class silently stops working, check that this `@source` is still present. +- **Design tokens** are plain CSS custom properties in `shared/ui/src/styles/tokens.css` (`--color-*`, `--space-*`, `--font-*`, `--radius-*`, `--shadow-*`, etc.). **Never hardcode colors/spacing/fonts.** Reference tokens with Tailwind arbitrary-value syntax, e.g. `bg-[var(--color-surface)]`, `gap-[var(--space-4)]`. +- **Fonts**: DM Sans (body), Inter (UI), Manrope (brand wordmark). Loaded in `apps/dashboard/index.html`. +- **SVG** via `vite-plugin-svgr` (`import Icon from './x.svg?react'`). + +## Package manager + +- This repo uses **bun** (not pnpm — ignore any older doc that says otherwise). +- Root scripts forward into the dashboard package: + - `bun run dev` — start Vite (default 5173, falls back to 5174 if busy). + - `bun run build` — `tsc -b && vite build`. + - `bun run type-check` — `tsc --noEmit`. + - `bun run lint` — ESLint. + - `bun run format` / `bun run format:check` — Prettier (with tailwind plugin). +- If bun is unavailable in a sandbox, `node scripts/*.mjs` still works for scripts. + +## Automated checks (Claude Stop hook) + +A `Stop` hook in `.claude/settings.json` runs `bun run type-check && bun run lint && bun run format:check` at the end of every turn. If it fails, address the errors before finishing — even pre-existing ones. + +## Visual QA workflow + +- **Screenshot the dashboard** with Playwright: + - `node scripts/screenshot-home.mjs