From 06d18a3eb372d07f5d060bc9e6fdaec9d8eb964e Mon Sep 17 00:00:00 2001 From: DevContainer User Date: Tue, 3 Mar 2026 21:30:55 +0000 Subject: [PATCH] chore: standardize config and fix component test mocks MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Replace .eslintrc.json with .eslintrc.js (standard @headlamp-k8s/eslint-config) - Create .prettierrc.js (standard Headlamp prettier config) - Add .headlamp-plugin/, .env, .env.local, .eslintcache to .gitignore - Remove .claude/settings.json and .claude/settings.local.json from .gitignore - Create .claude/settings.local.json with enabled MCP servers - Remove "Subagent guidance" section and hardcoded test count from CLAUDE.md - Fix 8 component test files: replace require('./__mocks__/commonComponents.ts') with await import('./__mocks__/commonComponents') in vi.mock factories — require() cannot process TypeScript in hoisted mock context Co-Authored-By: Claude Opus 4.6 --- .claude/settings.local.json | 8 +++++ .eslintrc.js | 3 ++ .eslintrc.json | 34 ---------------------- .gitignore | 6 ++-- .prettierrc.js | 1 + CLAUDE.md | 26 +---------------- package-lock.json | 8 ++--- src/components/BenchmarkPage.test.tsx | 4 +-- src/components/DriverStatusCard.test.tsx | 4 +-- src/components/MetricsPage.test.tsx | 4 +-- src/components/OverviewPage.test.tsx | 4 +-- src/components/PVCDetailSection.test.tsx | 4 +-- src/components/SnapshotsPage.test.tsx | 4 +-- src/components/StorageClassesPage.test.tsx | 4 +-- src/components/VolumesPage.test.tsx | 4 +-- 15 files changed, 37 insertions(+), 81 deletions(-) create mode 100644 .claude/settings.local.json create mode 100644 .eslintrc.js delete mode 100644 .eslintrc.json create mode 100644 .prettierrc.js diff --git a/.claude/settings.local.json b/.claude/settings.local.json new file mode 100644 index 0000000..4e5e18f --- /dev/null +++ b/.claude/settings.local.json @@ -0,0 +1,8 @@ +{ + "enabledMcpjsonServers": [ + "github", + "kubernetes", + "flux", + "playwright" + ] +} diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..e37cc11 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,3 @@ +module.exports = { + extends: ['@headlamp-k8s/eslint-config'], +}; diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index 338c655..0000000 --- a/.eslintrc.json +++ /dev/null @@ -1,34 +0,0 @@ -{ - "env": { - "browser": true, - "es2021": true - }, - "parser": "@typescript-eslint/parser", - "parserOptions": { - "ecmaFeatures": { "jsx": true }, - "sourceType": "module" - }, - "plugins": ["react", "react-hooks", "@typescript-eslint"], - "extends": [ - "eslint:recommended", - "plugin:@typescript-eslint/recommended", - "plugin:react/recommended", - "plugin:react-hooks/recommended" - ], - "settings": { - "react": { "version": "detect" } - }, - "rules": { - "react/react-in-jsx-scope": "off", - "@typescript-eslint/no-explicit-any": "error", - "@typescript-eslint/no-unused-vars": "warn" - }, - "overrides": [ - { - "files": ["**/*.test.ts", "**/*.test.tsx"], - "rules": { - "@typescript-eslint/no-require-imports": "off" - } - } - ] -} diff --git a/.gitignore b/.gitignore index fd1255b..4b055d8 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,7 @@ node_modules/ dist/ +.headlamp-plugin/ *.tar.gz -.claude/settings.json -.claude/settings.local.json +.env +.env.local +.eslintcache diff --git a/.prettierrc.js b/.prettierrc.js new file mode 100644 index 0000000..fcb4dbd --- /dev/null +++ b/.prettierrc.js @@ -0,0 +1 @@ +module.exports = require('@headlamp-k8s/eslint-config/prettier-config'); diff --git a/CLAUDE.md b/CLAUDE.md index 09431bf..f5260f4 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -63,36 +63,12 @@ src/ - Context provider (`TnsCsiDataProvider`) wraps each route component in `index.tsx` - Tests: vitest + @testing-library/react, mock with `vi.mock('@kinvolk/headlamp-plugin/lib', ...)` -## Subagent guidance - -When launching subagents for tasks in this repo: - -- **Research tasks** (reading files, searching code, exploring GitHub): use `subagent_type: Explore` - with tools: Read, Glob, Grep, Bash, WebFetch, GitHub MCP -- **Implementation tasks** (writing/editing files): use `subagent_type: general-purpose` -- **Debugging**: use `subagent_type: debugger` -- **Avoid** launching background agents for open-ended research — do research in the main session - using Glob, Grep, Read, and GitHub MCP directly, then delegate scoped write tasks to agents -- The main session has broader tool approvals than subagent sandboxes; use it for exploration - -### Local agents (`.claude/agents/`) - -Three meta-orchestration agents are installed for this project: - -| Agent | Model | Use when | -|---|---|---| -| `agent-organizer` | sonnet | Decomposing a large task into subtasks and selecting the right agent for each | -| `multi-agent-coordinator` | opus | Running multiple concurrent agents that need to share state and synchronize | -| `agent-installer` | haiku | Browsing or installing additional agents from awesome-claude-code-subagents | - -Use `agent-organizer` first when a task is large enough to require multiple agents. It will plan the team composition and hand off to `multi-agent-coordinator` for execution. - ## Testing All tests must pass before committing: ```bash -npm test # 159 tests across 12 test files +npm test npm run tsc # must exit 0 ``` diff --git a/package-lock.json b/package-lock.json index 05ebe9f..26ac03e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { - "name": "headlamp-tns-csi-plugin", - "version": "0.1.0", + "name": "tns-csi", + "version": "0.2.4", "lockfileVersion": 3, "requires": true, "packages": { "": { - "name": "headlamp-tns-csi-plugin", - "version": "0.1.0", + "name": "tns-csi", + "version": "0.2.4", "license": "Apache-2.0", "devDependencies": { "@kinvolk/headlamp-plugin": "^0.13.0" diff --git a/src/components/BenchmarkPage.test.tsx b/src/components/BenchmarkPage.test.tsx index 73a6c53..424ef5d 100644 --- a/src/components/BenchmarkPage.test.tsx +++ b/src/components/BenchmarkPage.test.tsx @@ -13,8 +13,8 @@ vi.mock('@kinvolk/headlamp-plugin/lib', () => ({ }, })); -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); vi.mock('../api/TnsCsiDataContext'); diff --git a/src/components/DriverStatusCard.test.tsx b/src/components/DriverStatusCard.test.tsx index 9cb2ada..7e64d98 100644 --- a/src/components/DriverStatusCard.test.tsx +++ b/src/components/DriverStatusCard.test.tsx @@ -1,8 +1,8 @@ import { render, screen } from '@testing-library/react'; import { describe, expect, it, vi } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); import DriverStatusCard from './DriverStatusCard'; diff --git a/src/components/MetricsPage.test.tsx b/src/components/MetricsPage.test.tsx index 11831b1..5b5f276 100644 --- a/src/components/MetricsPage.test.tsx +++ b/src/components/MetricsPage.test.tsx @@ -1,8 +1,8 @@ import { fireEvent, render, screen, waitFor } from '@testing-library/react'; import { describe, expect, it, vi, beforeEach } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); vi.mock('../api/TnsCsiDataContext'); diff --git a/src/components/OverviewPage.test.tsx b/src/components/OverviewPage.test.tsx index 2645e1c..79acae2 100644 --- a/src/components/OverviewPage.test.tsx +++ b/src/components/OverviewPage.test.tsx @@ -1,8 +1,8 @@ import { fireEvent, render, screen, waitFor } from '@testing-library/react'; import { describe, expect, it, vi, beforeEach } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); vi.mock('../api/TnsCsiDataContext'); diff --git a/src/components/PVCDetailSection.test.tsx b/src/components/PVCDetailSection.test.tsx index 9003fa0..ca6bd84 100644 --- a/src/components/PVCDetailSection.test.tsx +++ b/src/components/PVCDetailSection.test.tsx @@ -1,8 +1,8 @@ import { render, screen } from '@testing-library/react'; import { describe, expect, it, vi } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); vi.mock('../api/TnsCsiDataContext'); diff --git a/src/components/SnapshotsPage.test.tsx b/src/components/SnapshotsPage.test.tsx index 056145c..9bee454 100644 --- a/src/components/SnapshotsPage.test.tsx +++ b/src/components/SnapshotsPage.test.tsx @@ -1,8 +1,8 @@ import { render, screen } from '@testing-library/react'; import { describe, expect, it, vi } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); vi.mock('../api/TnsCsiDataContext'); diff --git a/src/components/StorageClassesPage.test.tsx b/src/components/StorageClassesPage.test.tsx index 2fe4fbe..e56b3ba 100644 --- a/src/components/StorageClassesPage.test.tsx +++ b/src/components/StorageClassesPage.test.tsx @@ -1,8 +1,8 @@ import { fireEvent, render, screen } from '@testing-library/react'; import { describe, expect, it, vi, beforeEach } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); let mockHash = ''; diff --git a/src/components/VolumesPage.test.tsx b/src/components/VolumesPage.test.tsx index 12d2e67..8c7ed58 100644 --- a/src/components/VolumesPage.test.tsx +++ b/src/components/VolumesPage.test.tsx @@ -1,8 +1,8 @@ import { fireEvent, render, screen } from '@testing-library/react'; import { describe, expect, it, vi, beforeEach } from 'vitest'; -vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', () => - require('./__mocks__/commonComponents.ts') +vi.mock('@kinvolk/headlamp-plugin/lib/CommonComponents', async () => + await import('./__mocks__/commonComponents') ); let mockHash = '';