Skip to content

CLAUDE.md

Latest commit

 

History

History
77 lines (55 loc) · 4.93 KB

CLAUDE.md

File metadata and controls

77 lines (55 loc) · 4.93 KB

CLAUDE.md

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

Build & Dev Commands

npm install          # Install dependencies
npm run dev          # Start dev server at http://localhost:5173
npm run build        # Production build → dist/
npm run preview      # Preview production build locally
npm run docs         # Render AsciiDoc docs with Asciidoctor

No test framework is configured. ESLint + Prettier are configured (see eslint.config.js, .prettierrc). Pre-commit hooks via husky + lint-staged.

Architecture

This is a single-page React app (React 18, Vite 6) that visualizes a MECE risk framework for AI-generated code. It has no routing, no state management library, and no backend.

Core Structure

  • src/constants.js — Shared constants: VERSION, TIER_BG (tier colors), TYPE_COLORS (measure type colors).

  • src/utils.js — Pure utility functions: getTierIndex, polarToCartesian, detectBrowserLanguage.

  • src/components/RiskRadar.jsx + .module.css — Main app component. Risk model: 5 dimensions (codeType, language, deployment, data, blastRadius), each scored 0–4. Tier = Math.max() across all dimensions, mapped to 4 tiers.

  • src/components/RadarChart.jsx + .module.css — SVG polygon radar chart.

  • src/components/MitigationCard.jsx + .module.css — Expandable tier cards showing mitigation measures.

  • src/components/DocSidebar.jsx + .module.css — Slide-out documentation panel using asciidoctor.js.

  • Styling: CSS Modules for static layout/typography, inline styles only for dynamic/JS-dependent values (tier colors, active states). Theme via CSS custom properties in src/theme.js.

  • src/i18n.js — Full DE/EN translations (~353 lines): dimension definitions, preset scenarios, mitigation measures, and documentation content with AsciiDoc markup and hyperlinked references.

  • docs/risk-radar.adoc — Standalone AsciiDoc documentation with 30+ references. Rendered separately by Asciidoctor (not by the React app).

Deployment

GitHub Actions workflow (.github/workflows/deploy.yml) builds the React app and renders AsciiDoc docs, then deploys both to GitHub Pages. The base path is auto-detected from the repo name via VITE_BASE_PATH.

Key Patterns

  • Dimension values are stored as { codeType: number, language: number, ... } with values 0–4
  • getTierIndex(values) maps the max dimension value to tier index 0–3
  • Presets are predefined value combinations (e.g., "Payment Service", "Medical Device FW")
  • Mitigations are categorized as deterministic/probabilistic/organizational with corresponding color coding

Risk Radar Assessment

Generated by /risk-assess on 2026-02-11

Module: vibe-coding-risk-radar

Dimension Score Level Evidence
Code Type 0 UI / CSS / Docs Only .jsx components, .css styling, .js config — no auth, API, or DB code
Language 2 Dynamically typed 5 .jsx + 4 .js files (JavaScript)
Deployment 2 Public-facing app Static site on GitHub Pages, publicly accessible
Data Sensitivity 0 Public data No real data processing, PII/PHI mentions only in documentation text
Blast Radius 0 Cosmetic / Tech debt Static visualization tool, no data storage or user accounts

Tier: 2 — Moderat (determined by Language = 2 and Deployment = 2)

Mitigations: vibe-coding-risk-radar (Tier 2)

Updated by /risk-mitigate on 2026-02-11

Measure Status Details
Linter & Formatter ✅ Set up eslint.config.js + .prettierrc
Type Checking ⬜ N/A Plain JS project, no TypeScript
Pre-Commit Hooks ✅ Set up husky + lint-staged (eslint --fix, prettier --write)
Dependency Check ✅ Set up npm audit --audit-level=high in ci.yml
CI Build & Unit Tests ✅ Set up ci.yml: lint, format check, audit, build
SAST (CodeQL) ✅ Set up codeql.yml: weekly + on push/PR
AI Code Review ✅ Present claude-code-review.yml
Property-Based Tests ⬜ Pending No test framework configured
SonarQube Quality Gate ⬜ Pending Needs SonarCloud account
Sampling Review ⬜ Pending No branch protection configured