diff --git a/src/main/frontend/app/components/file-structure/editor-file-structure.tsx b/src/main/frontend/app/components/file-structure/editor-file-structure.tsx index 54f9f050..525dfa9b 100644 --- a/src/main/frontend/app/components/file-structure/editor-file-structure.tsx +++ b/src/main/frontend/app/components/file-structure/editor-file-structure.tsx @@ -7,6 +7,9 @@ import '/styles/editor-files.css' import AltArrowRightIcon from '../../../icons/solar/Alt Arrow Right.svg?react' import AltArrowDownIcon from '../../../icons/solar/Alt Arrow Down.svg?react' import CodeIcon from '../../../icons/solar/Code.svg?react' +import CodeFileIcon from '../../../icons/solar/Code File.svg?react' +import TrashBinIcon from '../../../icons/solar/Trash Bin.svg?react' +import RulerCrossPenIcon from '../../../icons/solar/Ruler Cross Pen.svg?react' import { useShortcut } from '~/hooks/use-shortcut' import type { ContextMenuState } from './use-file-tree-context-menu' @@ -114,6 +117,15 @@ export default function EditorFileStructure() { [selectedItemId, buildContextForItem], ) + const triggerItemAction = useCallback( + (itemId: TreeItemIndex, action: (menuState: ContextMenuState) => void) => { + void buildContextForItem(itemId).then((menuState) => { + if (menuState) action(menuState) + }) + }, + [buildContextForItem], + ) + useShortcut({ 'explorer.new-file': () => triggerExplorerAction(editorContextMenu.handleNewFile, false), 'explorer.new-folder': () => triggerExplorerAction(editorContextMenu.handleNewFolder, false), @@ -285,6 +297,7 @@ export default function EditorFileStructure() { context: TreeItemRenderContext }) => { const Icon = item.isFolder ? (context.isExpanded ? FolderOpenIcon : FolderIcon) : CodeIcon + const isRoot = (item.data as { projectRoot?: boolean }).projectRoot ?? false const searchLower = searchTerm.toLowerCase() const titleLower = title.toLowerCase() @@ -310,28 +323,103 @@ export default function EditorFileStructure() { const isHighlighted = highlightedItemId === item.index + const actionBtnClass = 'cursor-pointer rounded p-0.5 hover:bg-hover flex-shrink-0' + return (
editorContextMenu.openContextMenu(e, item.index)} > {Icon && } {highlightedTitle} +
+ {item.isFolder && ( + + )} + {item.isFolder && ( + + )} + {!isRoot && ( + + )} + {!isRoot && ( + + )} +
) } if (!dataProvider) return + const toolbarBtnClass = 'cursor-pointer rounded p-1 hover:bg-hover text-foreground' + return ( <> - setSearchTerm(e.target.value)} /> +
+ Explorer +
+ + +
+
+
+ setSearchTerm(e.target.value)} /> +
{ diff --git a/src/main/frontend/app/routes/editor/editor.tsx b/src/main/frontend/app/routes/editor/editor.tsx index a33647d1..bb85b71d 100644 --- a/src/main/frontend/app/routes/editor/editor.tsx +++ b/src/main/frontend/app/routes/editor/editor.tsx @@ -671,19 +671,19 @@ export default function CodeEditor() { <>
-
- - {isGitRepo && ( + {isGitRepo && ( +
+ - )} -
+
+ )}
{leftTab === 'files' && } {leftTab !== 'files' && isGitRepo && (