a0031fc59a
Adds the full plugin scaffold matching the Headlamp plugin pattern (polaris, kube-vip, etc.): - package.json with full devDependencies (Vitest, TypeScript, ESLint, Prettier) - tsconfig.json, vitest.config.mts, vitest.setup.ts - src/index.tsx with ArgoCDErrorBoundary and stub Applications route - src/index.test.tsx smoke test to verify module importability - CLAUDE.md documentation for future development - .gitignore for node_modules/dist - pnpm-lock.yaml pinned via packageManager field ArtifactHub metadata already present (created by Hugh in PRI-186). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2.6 KiB
2.6 KiB
CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
Project
Headlamp plugin for ArgoCD visibility. Monitors ArgoCD Applications, Rollouts, and health status via the ArgoCD REST API proxied through Kubernetes. Read-only — no cluster write operations.
- Plugin name:
argocd - Target: Headlamp >= v0.26
- Data source: ArgoCD server at
/api/v1/namespaces/argocd/services/argocd-server/proxy/api/v1/applications - RBAC:
get/listonservices/proxyforargocd-serverinargocdnamespace
Commands
pnpm start # dev server with hot reload
pnpm build # production build
pnpm package # package for headlamp
pnpm tsc # TypeScript type check (no emit)
pnpm lint # ESLint
pnpm lint:fix # ESLint with auto-fix
pnpm format # Prettier write
pnpm format:check # Prettier check
pnpm test # vitest run
pnpm test:watch # vitest watch mode
All tests and pnpm tsc must pass before committing.
Architecture
src/
├── index.tsx # Plugin entry: registerRoute, registerSidebarEntry; ArgoCDErrorBoundary
├── test-utils.tsx # Shared test fixtures
├── api/
│ └── argocd.ts # ArgoCD API types, ApiProxy request helpers
└── components/
└── ArgoCDStubView.tsx # Placeholder Applications List view
Code conventions
- Functional React components only — class components only for error boundaries (ArgoCDErrorBoundary in index.tsx)
- All imports from
@kinvolk/headlamp-plugin/liband@kinvolk/headlamp-plugin/lib/CommonComponents @mui/materialis available as a shared external via Headlamp — useuseThemefrom@mui/material/stylesfor theming. Do NOT add@mui/materialto package.json dependencies.- Use
useTheme()+theme.palette.*for all theme-aware colors — never usevar(--mui-palette-*)CSS variables - No other UI libraries (no Ant Design, etc.)
- TypeScript strict mode — no
any, useunknown+ type guards at API boundaries - Context provider wraps each route component in
index.tsx - All registered components wrapped in
ArgoCDErrorBoundaryfor graceful error handling - Tests: vitest + @testing-library/react, mock with
vi.mock('@kinvolk/headlamp-plugin/lib', ...) vitest.setup.tsprovides a spec-compliantlocalStorageshim for Node 22+ compatibility
Testing
Mock pattern for headlamp APIs:
vi.mock('@kinvolk/headlamp-plugin/lib', () => ({
ApiProxy: { request: vi.fn().mockResolvedValue({}) },
K8s: { ResourceClasses: {} },
}));