webui: remove unused diff2html-based diff view
Remove the old diff view implementation that used diff2html library
in favor of the Monaco-based diff2 view. This cleanup removes:
- sketch-diff-view.ts component that used diff2html library
- diff2html static CSS files (diff2html.min.css, diff2.css)
- diff2html npm package dependency from package.json
- Old diff view mode references throughout the codebase
- Demo files for the old diff view component
Changes include:
1. Removed Files:
- webui/src/web-components/sketch-diff-view.ts
- webui/src/diff2html.min.css
- webui/src/diff2.css
- webui/src/web-components/demo/sketch-diff-view.demo.html
2. Updated Components:
- sketch-app-shell.ts: Remove old diff view import, ViewMode type,
CSS selectors, and view switching logic
- sketch-view-mode-select.ts: Update type definitions to remove 'diff' mode
- sketch-terminal.ts: Fix view mode type and correct CSS loading comments
3. Package Management:
- Removed diff2html 3.4.51 dependency from package.json
- Updated package-lock.json to reflect removed dependency
4. Demo Cleanup:
- Removed reference to old diff view demo from index.html
- Updated timeline demo to remove diff2html from dependencies list
The Monaco-based diff2 view (sketch-diff2-view.ts) remains fully
functional and is now the only diff view implementation. All file
picker, range picker, and empty view components continue to work
with the new diff view.
Testing confirms the diff functionality works correctly after cleanup.
Co-Authored-By: sketch <hello@sketch.dev>
Change-ID: s22dd1dc722d02125k
diff --git a/webui/src/web-components/sketch-view-mode-select.ts b/webui/src/web-components/sketch-view-mode-select.ts
index 80eb0e6..c83b964 100644
--- a/webui/src/web-components/sketch-view-mode-select.ts
+++ b/webui/src/web-components/sketch-view-mode-select.ts
@@ -6,7 +6,7 @@
export class SketchViewModeSelect extends LitElement {
// Current active mode
@property()
- activeMode: "chat" | "diff" | "diff2" | "terminal" = "chat";
+ activeMode: "chat" | "diff2" | "terminal" = "chat";
// Header bar: view mode buttons
static styles = css`
@@ -87,7 +87,7 @@
/**
* Handle view mode button clicks
*/
- private _handleViewModeClick(mode: "chat" | "diff" | "diff2" | "terminal") {
+ private _handleViewModeClick(mode: "chat" | "diff2" | "terminal") {
// Dispatch a custom event to notify the app shell to change the view
const event = new CustomEvent("view-mode-select", {
detail: { mode },