github/OpenHands
1
1
Fork 0
mirror of https://github.com/All-Hands-AI/OpenHands.git synced 2026-01-09 14:57:59 -05:00
Code Issues Packages Projects Releases Wiki Activity

frontend: Better diff contrast (#8128)

Browse Source
This commit is contained in:
sp.wack
2025-04-28 22:53:37 +04:00
committed by GitHub
parent 99233ec153
commit 88fc26d9b0
1 changed files with 26 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/components/features/diff-viewer/file-diff-viewer.tsx
View File

@@ -1,4 +1,4 @@
import { DiffEditor } from "@monaco-editor/react";
import { DiffEditor, Monaco } from "@monaco-editor/react";
import React from "react";
import { editor as editor_t } from "monaco-editor";
import { LuFileDiff, LuFileMinus, LuFilePlus } from "react-icons/lu";
@@ -88,6 +88,29 @@ export function FileDiffViewer({ path, type }: FileDiffViewerProps) {
}
}, []);
const beforeMount = (monaco: Monaco) => {
monaco.editor.defineTheme("custom-diff-theme", {
base: "vs-dark",
inherit: true,
rules: [
{ token: "comment", foreground: "6a9955" },
{ token: "keyword", foreground: "569cd6" },
{ token: "string", foreground: "ce9178" },
{ token: "number", foreground: "b5cea8" },
],
colors: {
"diffEditor.insertedTextBackground": "#014b01AA", // Stronger green background
"diffEditor.removedTextBackground": "#750000AA", // Stronger red background
"diffEditor.insertedLineBackground": "#003f00AA", // Dark green for added lines
"diffEditor.removedLineBackground": "#5a0000AA", // Dark red for removed lines
"diffEditor.border": "#444444", // Border between diff editors
"editorUnnecessaryCode.border": "#00000000", // No border for unnecessary code
"editorUnnecessaryCode.opacity": "#00000077", // Slightly faded
},
});
};
const handleEditorDidMount = (editor: editor_t.IStandaloneDiffEditor) => {
diffEditorRef.current = editor;
updateEditorHeight();
@@ -145,8 +168,9 @@ export function FileDiffViewer({ path, type }: FileDiffViewerProps) {
language={getLanguageFromPath(filePath)}
original={isAdded ? "" : diff.original}
modified={isDeleted ? "" : diff.modified}
theme="vs-dark"
theme="custom-diff-theme"
onMount={handleEditorDidMount}
beforeMount={beforeMount}
options={{
renderValidationDecorations: "off",
readOnly: true,