From 6885138cf0d2f4a76e8e4c5beeb1af8b5d7e0731 Mon Sep 17 00:00:00 2001 From: yiliang114 <1204183885@qq.com> Date: Sat, 29 Nov 2025 13:16:58 +0800 Subject: [PATCH] refactor(vscode-ide-companion): Refactoring the project structure and updating dependencies --- package-lock.json | 96 +++++++++---------- packages/vscode-ide-companion/NOTICES.txt | 6 -- packages/vscode-ide-companion/esbuild.js | 32 ------- .../vscode-ide-companion/eslint.config.mjs | 11 +++ packages/vscode-ide-companion/package.json | 14 ++- .../cli/{1cliInstaller.ts => cliInstaller.ts} | 0 .../src/webview/WebViewProvider.ts | 2 +- .../src/webview/components/Timeline.css | 1 - .../src/webview/index.tsx | 9 +- .../src/webview/{App.scss => styles/App.css} | 2 +- .../webview/{ => styles}/ClaudeCodeStyles.css | 92 ++---------------- .../src/webview/{ => styles}/tailwind.css | 0 .../vscode-ide-companion/vitest.config.ts | 2 + 13 files changed, 84 insertions(+), 183 deletions(-) rename packages/vscode-ide-companion/src/cli/{1cliInstaller.ts => cliInstaller.ts} (100%) rename packages/vscode-ide-companion/src/webview/{App.scss => styles/App.css} (99%) rename packages/vscode-ide-companion/src/webview/{ => styles}/ClaudeCodeStyles.css (78%) rename packages/vscode-ide-companion/src/webview/{ => styles}/tailwind.css (100%) diff --git a/package-lock.json b/package-lock.json index 93697f54..f98ff1dc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -480,13 +480,6 @@ "node": ">=6" } }, - "node_modules/@cfworker/json-schema": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/@cfworker/json-schema/-/json-schema-4.1.1.tgz", - "integrity": "sha512-gAmrUZSGtKc3AiBL71iNWxDsyUC5uMaKKGdvzYsBoTW/xi42JQHl7eKV2OYzCUqvc+D2RCcf7EXY2iCyFIk6og==", - "dev": true, - "license": "MIT" - }, "node_modules/@csstools/color-helpers": { "version": "5.0.2", "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.0.2.tgz", @@ -3693,34 +3686,6 @@ "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==", "license": "MIT" }, - "node_modules/@testing-library/react": { - "version": "16.3.0", - "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.3.0.tgz", - "integrity": "sha512-kFSyxiEDwv1WLl2fgsq6pPBbw5aWKrsY2/noi1Id0TK0UParSF62oFQFGHXIyaG4pp2tEub/Zlel+fjjZILDsw==", - "dev": true, - "license": "MIT", - "dependencies": { - "@babel/runtime": "^7.12.5" - }, - "engines": { - "node": ">=18" - }, - "peerDependencies": { - "@testing-library/dom": "^10.0.0", - "@types/react": "^18.0.0 || ^19.0.0", - "@types/react-dom": "^18.0.0 || ^19.0.0", - "react": "^18.0.0 || ^19.0.0", - "react-dom": "^18.0.0 || ^19.0.0" - }, - "peerDependenciesMeta": { - "@types/react": { - "optional": true - }, - "@types/react-dom": { - "optional": true - } - } - }, "node_modules/@textlint/ast-node-types": { "version": "15.2.2", "resolved": "https://registry.npmjs.org/@textlint/ast-node-types/-/ast-node-types-15.2.2.tgz", @@ -5828,9 +5793,9 @@ "license": "MIT" }, "node_modules/baseline-browser-mapping": { - "version": "2.8.31", - "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.31.tgz", - "integrity": "sha512-a28v2eWrrRWPpJSzxc+mKwm0ZtVx/G8SepdQZDArnXYU/XS+IF6mp8aB/4E+hH1tyGCoDo3KlUCdlSxGDsRkAw==", + "version": "2.8.32", + "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.32.tgz", + "integrity": "sha512-OPz5aBThlyLFgxyhdwf/s2+8ab3OvT7AdTNvKHBwpXomIYeXqpUUuT8LrdtxZSsWJ4R4CU1un4XGh5Ez3nlTpw==", "dev": true, "license": "Apache-2.0", "bin": { @@ -6380,6 +6345,8 @@ "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==", "dev": true, "license": "MIT", + "optional": true, + "peer": true, "dependencies": { "readdirp": "^4.0.1" }, @@ -7504,9 +7471,9 @@ "license": "MIT" }, "node_modules/electron-to-chromium": { - "version": "1.5.260", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.260.tgz", - "integrity": "sha512-ov8rBoOBhVawpzdre+Cmz4FB+y66Eqrk6Gwqd8NGxuhv99GQ8XqMAr351KEkOt7gukXWDg6gJWEMKgL2RLMPtA==", + "version": "1.5.262", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.262.tgz", + "integrity": "sha512-NlAsMteRHek05jRUxUR0a5jpjYq9ykk6+kO0yRaMi5moe7u0fVIOeQ3Y30A8dIiWFBNUoQGi1ljb1i5VtS9WQQ==", "dev": true, "license": "ISC" }, @@ -9590,7 +9557,9 @@ "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.4.tgz", "integrity": "sha512-p6u1bG3YSnINT5RQmx/yRZBpenIl30kVxkTLDyHLIMk0gict704Q9n+thfDI7lTRm9vXdDYutVzXhzcThxTnXA==", "dev": true, - "license": "MIT" + "license": "MIT", + "optional": true, + "peer": true }, "node_modules/import-fresh": { "version": "3.3.1", @@ -13744,6 +13713,8 @@ "integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==", "dev": true, "license": "MIT", + "optional": true, + "peer": true, "engines": { "node": ">= 14.18.0" }, @@ -14156,6 +14127,8 @@ "integrity": "sha512-N+7WK20/wOr7CzA2snJcUSSNTCzeCGUTFY3OgeQP3mZ1aj9NMQ0mSTXwlrnd89j33zzQJGqIN52GIOmYrfq46A==", "dev": true, "license": "MIT", + "optional": true, + "peer": true, "dependencies": { "chokidar": "^4.0.0", "immutable": "^5.0.2", @@ -17171,6 +17144,34 @@ "node": ">=20" } }, + "packages/cli/node_modules/@testing-library/react": { + "version": "16.3.0", + "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.3.0.tgz", + "integrity": "sha512-kFSyxiEDwv1WLl2fgsq6pPBbw5aWKrsY2/noi1Id0TK0UParSF62oFQFGHXIyaG4pp2tEub/Zlel+fjjZILDsw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.12.5" + }, + "engines": { + "node": ">=18" + }, + "peerDependencies": { + "@testing-library/dom": "^10.0.0", + "@types/react": "^18.0.0 || ^19.0.0", + "@types/react-dom": "^18.0.0 || ^19.0.0", + "react": "^18.0.0 || ^19.0.0", + "react-dom": "^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "packages/cli/node_modules/string-width": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz", @@ -17345,20 +17346,18 @@ "license": "LICENSE", "dependencies": { "@modelcontextprotocol/sdk": "^1.15.1", - "@qwen-code/qwen-code-core": "file:../core", "cors": "^2.8.5", "express": "^5.1.0", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^19.1.0", + "react-dom": "^19.1.0", "zod": "^3.25.76" }, "devDependencies": { - "@cfworker/json-schema": "^4.1.1", "@types/cors": "^2.8.19", "@types/express": "^5.0.3", "@types/node": "20.x", - "@types/react": "^18.2.0", - "@types/react-dom": "^18.2.0", + "@types/react": "^19.1.8", + "@types/react-dom": "^19.1.6", "@types/semver": "^7.7.1", "@types/vscode": "^1.99.0", "@typescript-eslint/eslint-plugin": "^8.31.1", @@ -17369,7 +17368,6 @@ "eslint": "^9.25.1", "npm-run-all2": "^8.0.2", "postcss": "^8.5.6", - "sass": "^1.94.1", "tailwindcss": "^3.4.18", "typescript": "^5.8.3", "vitest": "^3.2.4" diff --git a/packages/vscode-ide-companion/NOTICES.txt b/packages/vscode-ide-companion/NOTICES.txt index 2e801e9e..bab877ba 100644 --- a/packages/vscode-ide-companion/NOTICES.txt +++ b/packages/vscode-ide-companion/NOTICES.txt @@ -2317,12 +2317,6 @@ WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. -============================================================ -@qwen-code/qwen-code-core@undefined -(git+https://github.com/QwenLM/qwen-code.git) - -License text not found. - ============================================================ react@19.1.0 (https://github.com/facebook/react.git) diff --git a/packages/vscode-ide-companion/esbuild.js b/packages/vscode-ide-companion/esbuild.js index f0d9486d..c0efb969 100644 --- a/packages/vscode-ide-companion/esbuild.js +++ b/packages/vscode-ide-companion/esbuild.js @@ -88,38 +88,6 @@ const cssInjectPlugin = { loader: 'js', }; }); - - // Handle SCSS files - build.onLoad({ filter: /\.scss$/ }, async (args) => { - const sass = await import('sass'); - const postcss = (await import('postcss')).default; - const tailwindcss = (await import('tailwindcss')).default; - const autoprefixer = (await import('autoprefixer')).default; - - // Compile SCSS to CSS - const sassResult = sass.compile(args.path, { - loadPaths: [args.path.substring(0, args.path.lastIndexOf('/'))], - }); - - // Process with PostCSS (Tailwind + Autoprefixer) - const postcssResult = await postcss([tailwindcss, autoprefixer]).process( - sassResult.css, - { - from: args.path, - to: args.path, - }, - ); - - const css = postcssResult.css; - return { - contents: ` - const style = document.createElement('style'); - style.textContent = ${JSON.stringify(css)}; - document.head.appendChild(style); - `, - loader: 'js', - }; - }); }, }; diff --git a/packages/vscode-ide-companion/eslint.config.mjs b/packages/vscode-ide-companion/eslint.config.mjs index 4776b83e..5050f5ba 100644 --- a/packages/vscode-ide-companion/eslint.config.mjs +++ b/packages/vscode-ide-companion/eslint.config.mjs @@ -6,6 +6,7 @@ import typescriptEslint from '@typescript-eslint/eslint-plugin'; import tsParser from '@typescript-eslint/parser'; +import reactHooks from 'eslint-plugin-react-hooks'; export default [ { @@ -29,6 +30,8 @@ export default [ { plugins: { '@typescript-eslint': typescriptEslint, + 'react-hooks': reactHooks, + import: importPlugin, }, languageOptions: { @@ -50,6 +53,14 @@ export default [ format: ['camelCase', 'PascalCase'], }, ], + 'react-hooks/rules-of-hooks': 'error', + 'react-hooks/exhaustive-deps': 'error', + 'import/no-internal-modules': [ + 'error', + { + allow: ['./styles/**'], + }, + ], curly: 'warn', eqeqeq: 'warn', diff --git a/packages/vscode-ide-companion/package.json b/packages/vscode-ide-companion/package.json index f95c7f27..2e1bd974 100644 --- a/packages/vscode-ide-companion/package.json +++ b/packages/vscode-ide-companion/package.json @@ -159,7 +159,7 @@ "scripts": { "prepackage": "npm run generate:notices && npm run check-types && npm run lint && npm run build:prod", "build": "npm run build:dev", - "build:dev": "node esbuild.js", + "build:dev": "npm run check-types && npm run lint && node esbuild.js", "build:prod": "node esbuild.js --production", "generate:notices": "node ./scripts/generate-notices.js", "prepare": "npm run generate:notices", @@ -174,12 +174,11 @@ "validate:notices": "node ./scripts/validate-notices.js" }, "devDependencies": { - "@cfworker/json-schema": "^4.1.1", "@types/cors": "^2.8.19", "@types/express": "^5.0.3", "@types/node": "20.x", - "@types/react": "^18.2.0", - "@types/react-dom": "^18.2.0", + "@types/react": "^19.1.8", + "@types/react-dom": "^19.1.6", "@types/semver": "^7.7.1", "@types/vscode": "^1.99.0", "@typescript-eslint/eslint-plugin": "^8.31.1", @@ -188,20 +187,19 @@ "autoprefixer": "^10.4.22", "esbuild": "^0.25.3", "eslint": "^9.25.1", + "eslint-plugin-react-hooks": "^5.2.0", "npm-run-all2": "^8.0.2", "postcss": "^8.5.6", - "sass": "^1.94.1", "tailwindcss": "^3.4.18", "typescript": "^5.8.3", "vitest": "^3.2.4" }, "dependencies": { "@modelcontextprotocol/sdk": "^1.15.1", - "@qwen-code/qwen-code-core": "file:../core", "cors": "^2.8.5", "express": "^5.1.0", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^19.1.0", + "react-dom": "^19.1.0", "zod": "^3.25.76" } } diff --git a/packages/vscode-ide-companion/src/cli/1cliInstaller.ts b/packages/vscode-ide-companion/src/cli/cliInstaller.ts similarity index 100% rename from packages/vscode-ide-companion/src/cli/1cliInstaller.ts rename to packages/vscode-ide-companion/src/cli/cliInstaller.ts diff --git a/packages/vscode-ide-companion/src/webview/WebViewProvider.ts b/packages/vscode-ide-companion/src/webview/WebViewProvider.ts index 6ffd69bb..54be3f64 100644 --- a/packages/vscode-ide-companion/src/webview/WebViewProvider.ts +++ b/packages/vscode-ide-companion/src/webview/WebViewProvider.ts @@ -13,7 +13,7 @@ import { AuthStateManager } from '../auth/authStateManager.js'; import { PanelManager } from '../webview/PanelManager.js'; import { MessageHandler } from '../webview/MessageHandler.js'; import { WebViewContent } from '../webview/WebViewContent.js'; -import { CliInstaller } from '../cli/1cliInstaller.js'; +import { CliInstaller } from '../cli/cliInstaller.js'; import { getFileName } from './utils/webviewUtils.js'; export class WebViewProvider { diff --git a/packages/vscode-ide-companion/src/webview/components/Timeline.css b/packages/vscode-ide-companion/src/webview/components/Timeline.css index b6f7cd9e..dabac37a 100644 --- a/packages/vscode-ide-companion/src/webview/components/Timeline.css +++ b/packages/vscode-ide-companion/src/webview/components/Timeline.css @@ -16,7 +16,6 @@ padding: 16px 20px; } -/* Timeline 项目 */ .timeline-item { position: relative; display: grid; diff --git a/packages/vscode-ide-companion/src/webview/index.tsx b/packages/vscode-ide-companion/src/webview/index.tsx index c0d54066..d9d8d821 100644 --- a/packages/vscode-ide-companion/src/webview/index.tsx +++ b/packages/vscode-ide-companion/src/webview/index.tsx @@ -6,9 +6,12 @@ import ReactDOM from 'react-dom/client'; import { App } from './App.js'; -import './tailwind.css'; -import './App.scss'; -import './ClaudeCodeStyles.css'; +// eslint-disable-next-line import/no-internal-modules +import './styles/tailwind.css'; +// eslint-disable-next-line import/no-internal-modules +import './styles/App.css'; +// eslint-disable-next-line import/no-internal-modules +import './styles/ClaudeCodeStyles.css'; const container = document.getElementById('root'); if (container) { diff --git a/packages/vscode-ide-companion/src/webview/App.scss b/packages/vscode-ide-companion/src/webview/styles/App.css similarity index 99% rename from packages/vscode-ide-companion/src/webview/App.scss rename to packages/vscode-ide-companion/src/webview/styles/App.css index cc3f245e..23741339 100644 --- a/packages/vscode-ide-companion/src/webview/App.scss +++ b/packages/vscode-ide-companion/src/webview/styles/App.css @@ -592,4 +592,4 @@ button { .permission-success-text { color: #4caf50; font-size: 13px; -} +} \ No newline at end of file diff --git a/packages/vscode-ide-companion/src/webview/ClaudeCodeStyles.css b/packages/vscode-ide-companion/src/webview/styles/ClaudeCodeStyles.css similarity index 78% rename from packages/vscode-ide-companion/src/webview/ClaudeCodeStyles.css rename to packages/vscode-ide-companion/src/webview/styles/ClaudeCodeStyles.css index 05584623..bab769b1 100644 --- a/packages/vscode-ide-companion/src/webview/ClaudeCodeStyles.css +++ b/packages/vscode-ide-companion/src/webview/styles/ClaudeCodeStyles.css @@ -8,16 +8,16 @@ */ /* Import component styles */ -@import './components/SaveSessionDialog.css'; -@import './components/SessionManager.css'; -@import './components/EmptyState.css'; -@import './components/CompletionMenu.css'; -@import './components/ContextPills.css'; -@import './components/PlanDisplay.css'; -@import './components/Timeline.css'; -@import './components/shared/FileLink.css'; -@import './components/toolcalls/shared/DiffDisplay.css'; -@import './components/messages/AssistantMessage.css'; +@import '../components/SaveSessionDialog.css'; +@import '../components/SessionManager.css'; +@import '../components/EmptyState.css'; +@import '../components/CompletionMenu.css'; +@import '../components/ContextPills.css'; +@import '../components/PlanDisplay.css'; +@import '../components/Timeline.css'; +@import '../components/shared/FileLink.css'; +@import '../components/toolcalls/shared/DiffDisplay.css'; +@import '../components/messages/AssistantMessage.css'; /* =========================== Session Selector Button (from Claude Code .E) @@ -280,75 +280,3 @@ --app-warning-foreground: var(--vscode-editorWarning-foreground, #ffcc00); } -/* Code Block (from Claude Code ._e) */ -.code-block { - background-color: var(--app-code-background); - white-space: pre; - overflow-x: auto; - max-width: 100%; - min-width: 0; - width: 100%; - box-sizing: border-box; - padding: 8px; - border-radius: 4px; - font-family: var(--app-monospace-font-family); - font-size: 0.85em; -} - -/* Code content wrapper for better scrolling */ -.code-content { - max-height: 300px; - overflow-y: auto; - display: block; -} - -/* Diff display container */ -.diff-display-container { - width: 100%; - display: flex; - flex-direction: column; - gap: 8px; -} - -.diff-header { - display: flex; - justify-content: space-between; - align-items: center; - padding-bottom: 4px; - border-bottom: 1px solid var(--app-primary-border-color); -} - -.diff-file-path { - font-weight: 500; - color: var(--app-secondary-foreground); -} - -.open-diff-button { - display: inline-flex; - align-items: center; - gap: 4px; - padding: 4px 8px; - background: var(--app-ghost-button-hover-background); - border: none; - border-radius: 4px; - cursor: pointer; - font-size: 0.85em; - color: var(--app-secondary-foreground); -} - -.open-diff-button:hover { - background: var(--vscode-button-hoverBackground); - color: var(--vscode-button-foreground); -} - -.diff-section { - display: flex; - flex-direction: column; - gap: 4px; -} - -.diff-label { - font-weight: 500; - color: var(--app-secondary-foreground); - font-size: 0.85em; -} diff --git a/packages/vscode-ide-companion/src/webview/tailwind.css b/packages/vscode-ide-companion/src/webview/styles/tailwind.css similarity index 100% rename from packages/vscode-ide-companion/src/webview/tailwind.css rename to packages/vscode-ide-companion/src/webview/styles/tailwind.css diff --git a/packages/vscode-ide-companion/vitest.config.ts b/packages/vscode-ide-companion/vitest.config.ts index a637f0c6..50c8ea3c 100644 --- a/packages/vscode-ide-companion/vitest.config.ts +++ b/packages/vscode-ide-companion/vitest.config.ts @@ -3,6 +3,8 @@ import { defineConfig } from 'vitest/config'; export default defineConfig({ test: { globals: true, + environment: 'node', + include: ['src/**/*.test.ts', 'src/**/*.test.tsx'], coverage: { provider: 'v8', reporter: ['text', 'json', 'html', 'clover'],