Skip to content

CLAUDE.md

Latest commit

 

History

History
57 lines (43 loc) · 2.89 KB

CLAUDE.md

File metadata and controls

57 lines (43 loc) · 2.89 KB

CLAUDE.md

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

Commands

pnpm dev                 # Start Next.js dev server (http://localhost:3000)
pnpm build               # Build Next.js static export to out/
pnpm lint                # Run ESLint

pnpm electron:dev        # Compile electron/ → dist-electron/, then launch Electron (requires pnpm dev running)
pnpm electron:build      # Full production build: next build + tsc + electron-builder → release/

Architecture

This is a Next.js 16 + Electron desktop app.

Two processes:

  • Renderer (src/): Next.js App Router UI, styled with Tailwind CSS v4. In dev, Electron loads http://localhost:3000. In production, loads static files from out/.
  • Main process (electron/): TypeScript compiled to CommonJS via electron/tsconfig.json, output to dist-electron/. Entry point referenced in package.json#main.

Key paths:

  • src/app/ — Next.js App Router pages/layouts
  • electron/main.ts — Electron main process (window creation, app lifecycle)
  • electron/preload.ts — Preload script; use contextBridge.exposeInMainWorld() here to expose Node APIs to the renderer safely
  • dist-electron/ — Compiled Electron main/preload JS (gitignore-able, generated by tsc)
  • out/ — Static Next.js export (generated by next build)
  • release/ — Packaged distributable output from electron-builder

Path alias: @/* → src/*

Package manager: pnpm. Electron binary approved in pnpm-workspace.yaml via onlyBuiltDependencies.

UI — shadcn/ui (PRIORITY)

Always use shadcn components first. Do not write custom CSS or raw HTML elements when a shadcn component exists.

  • All 55 components are already installed in src/components/ui/
  • Style: base-nova (uses @base-ui/react primitives under the hood, not Radix)
  • Tailwind CSS v4 with CSS variables — use semantic tokens (bg-background, text-foreground, text-muted-foreground, border-border, etc.), never hardcode colors like bg-zinc-950
  • Dark mode is always on — <html class="dark"> is set in layout.tsx
  • TooltipProvider is already wrapping the app in layout.tsx
  • src/lib/utils.ts — cn() utility for merging class names
  • Config: components.json at project root

Component rules:

  • Inputs → <Input> from @/components/ui/input
  • Textareas → <Textarea> from @/components/ui/textarea
  • Labels → <Label> from @/components/ui/label
  • Modals/overlays → <Dialog> from @/components/ui/dialog
  • Dividers → <Separator> from @/components/ui/separator
  • Scrollable areas → <ScrollArea> from @/components/ui/scroll-area
  • Status pills → <Badge> from @/components/ui/badge
  • Icon buttons with hints → wrap in <Tooltip> + <TooltipTrigger> + <TooltipContent>
  • Add new components (if missing) with: pnpm dlx shadcn@latest add <component>