From c7f86d5ac8ea3eceb6b5bc946f348ca2bb95cde2 Mon Sep 17 00:00:00 2001 From: ZacharyZcR Date: Thu, 25 Sep 2025 07:35:28 +0800 Subject: [PATCH] FIX: Enable scrollbars in CodeMirror editors and complete missing i18n MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit CodeMirror Scrollbar Fixes: - Add EditorView.theme configurations with overflow: auto for .cm-scroller - Configure scrollPastEnd: false in basicSetup for all CodeMirror instances - Fix FileViewer, CredentialEditor, HostManagerEditor, and FileManagerFileEditor - Ensure proper height: 100% styling for editor containers i18n Completion: - Add missing "movedItems" translation key for file move operations - English: "Moved {{count}} items" - Chinese: "已移动 {{count}} 个项目" 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- src/locales/en/translation.json | 1 + src/locales/zh/translation.json | 1 + .../Apps/Credentials/CredentialEditor.tsx | 17 ++++++++ .../File Manager/FileManagerFileEditor.tsx | 12 +++++- .../File Manager/components/FileViewer.tsx | 41 +++++++++++++++---- .../Apps/Host Manager/HostManagerEditor.tsx | 9 ++++ 6 files changed, 72 insertions(+), 9 deletions(-) diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json index 451a076e..cc6416c9 100644 --- a/src/locales/en/translation.json +++ b/src/locales/en/translation.json @@ -737,6 +737,7 @@ "deleteFiles": "Delete {{count}} items", "filesCopiedToClipboard": "{{count}} items copied to clipboard", "filesCutToClipboard": "{{count}} items cut to clipboard", + "movedItems": "Moved {{count}} items", "failedToDeleteItem": "Failed to delete item", "itemRenamedSuccessfully": "{{type}} renamed successfully", "failedToRenameItem": "Failed to rename item", diff --git a/src/locales/zh/translation.json b/src/locales/zh/translation.json index cb303056..eac14415 100644 --- a/src/locales/zh/translation.json +++ b/src/locales/zh/translation.json @@ -760,6 +760,7 @@ "deleteFiles": "删除 {{count}} 个项目", "filesCopiedToClipboard": "{{count}} 个项目已复制到剪贴板", "filesCutToClipboard": "{{count}} 个项目已剪切到剪贴板", + "movedItems": "已移动 {{count}} 个项目", "failedToDeleteItem": "删除项目失败", "itemRenamedSuccessfully": "{{type}}重命名成功", "failedToRenameItem": "重命名项目失败", diff --git a/src/ui/Desktop/Apps/Credentials/CredentialEditor.tsx b/src/ui/Desktop/Apps/Credentials/CredentialEditor.tsx index cedef336..c430f0c4 100644 --- a/src/ui/Desktop/Apps/Credentials/CredentialEditor.tsx +++ b/src/ui/Desktop/Apps/Credentials/CredentialEditor.tsx @@ -30,6 +30,7 @@ import { import { useTranslation } from "react-i18next"; import CodeMirror from "@uiw/react-codemirror"; import { oneDark } from "@codemirror/theme-one-dark"; +import { EditorView } from "@codemirror/view"; import type { Credential, CredentialEditorProps, @@ -934,7 +935,15 @@ export function CredentialEditor({ allowMultipleSelections: false, highlightSelectionMatches: false, searchKeymap: false, + scrollPastEnd: false, }} + extensions={[ + EditorView.theme({ + ".cm-scroller": { + overflow: "auto", + }, + }), + ]} /> {detectedKeyType && ( @@ -1089,7 +1098,15 @@ export function CredentialEditor({ allowMultipleSelections: false, highlightSelectionMatches: false, searchKeymap: false, + scrollPastEnd: false, }} + extensions={[ + EditorView.theme({ + ".cm-scroller": { + overflow: "auto", + }, + }), + ]} />
diff --git a/src/ui/Desktop/Apps/File Manager/FileManagerFileEditor.tsx b/src/ui/Desktop/Apps/File Manager/FileManagerFileEditor.tsx index 3ad1f576..4113be10 100644 --- a/src/ui/Desktop/Apps/File Manager/FileManagerFileEditor.tsx +++ b/src/ui/Desktop/Apps/File Manager/FileManagerFileEditor.tsx @@ -320,16 +320,26 @@ export function FileManagerFileEditor({ EditorView.theme({ "&": { backgroundColor: "var(--color-dark-bg-darkest) !important", + height: "100%", }, ".cm-gutters": { backgroundColor: "var(--color-dark-bg) !important", }, + ".cm-scroller": { + overflow: "auto", + }, + ".cm-editor": { + height: "100%", + }, }), ]} onChange={(value: any) => onContentChange(value)} theme={undefined} height="100%" - basicSetup={{ lineNumbers: true }} + basicSetup={{ + lineNumbers: true, + scrollPastEnd: false, + }} className="min-h-full min-w-full flex-1" />
diff --git a/src/ui/Desktop/Apps/File Manager/components/FileViewer.tsx b/src/ui/Desktop/Apps/File Manager/components/FileViewer.tsx index 0867d0ce..05a90902 100644 --- a/src/ui/Desktop/Apps/File Manager/components/FileViewer.tsx +++ b/src/ui/Desktop/Apps/File Manager/components/FileViewer.tsx @@ -51,6 +51,7 @@ import { Input } from "@/components/ui/input"; import CodeMirror from "@uiw/react-codemirror"; import { oneDark } from "@codemirror/theme-one-dark"; import { languages, loadLanguage } from "@uiw/codemirror-extensions-langs"; +import { EditorView } from "@codemirror/view"; interface FileItem { name: string; @@ -769,11 +770,22 @@ export function FileViewer({ handleContentChange(value)} - extensions={ - getLanguageExtension(file.name) + extensions={[ + ...(getLanguageExtension(file.name) ? [getLanguageExtension(file.name)!] - : [] - } + : []), + EditorView.theme({ + "&": { + height: "100%", + }, + ".cm-scroller": { + overflow: "auto", + }, + ".cm-editor": { + height: "100%", + }, + }), + ]} theme="dark" basicSetup={{ lineNumbers: true, @@ -785,6 +797,7 @@ export function FileViewer({ closeBrackets: true, autocompletion: true, highlightSelectionMatches: false, + scrollPastEnd: false, }} className="h-full overflow-auto" readOnly={!isEditable} @@ -806,11 +819,22 @@ export function FileViewer({ handleContentChange(value)} - extensions={ - getLanguageExtension(file.name) + extensions={[ + ...(getLanguageExtension(file.name) ? [getLanguageExtension(file.name)!] - : [] - } + : []), + EditorView.theme({ + "&": { + height: "100%", + }, + ".cm-scroller": { + overflow: "auto", + }, + ".cm-editor": { + height: "100%", + }, + }), + ]} theme={oneDark} editable={isEditable} placeholder={t("fileManager.startTyping")} @@ -822,6 +846,7 @@ export function FileViewer({ allowMultipleSelections: false, highlightSelectionMatches: false, searchKeymap: true, + scrollPastEnd: false, }} /> )} diff --git a/src/ui/Desktop/Apps/Host Manager/HostManagerEditor.tsx b/src/ui/Desktop/Apps/Host Manager/HostManagerEditor.tsx index b55ac3cc..7acb7a62 100644 --- a/src/ui/Desktop/Apps/Host Manager/HostManagerEditor.tsx +++ b/src/ui/Desktop/Apps/Host Manager/HostManagerEditor.tsx @@ -37,6 +37,7 @@ import { useTranslation } from "react-i18next"; import { CredentialSelector } from "@/ui/Desktop/Apps/Credentials/CredentialSelector.tsx"; import CodeMirror from "@uiw/react-codemirror"; import { oneDark } from "@codemirror/theme-one-dark"; +import { EditorView } from "@codemirror/view"; interface SSHHost { id: number; @@ -1000,7 +1001,15 @@ export function HostManagerEditor({ allowMultipleSelections: false, highlightSelectionMatches: false, searchKeymap: false, + scrollPastEnd: false, }} + extensions={[ + EditorView.theme({ + ".cm-scroller": { + overflow: "auto", + }, + }), + ]} />