diff --git a/canvas/src/components/ConsoleModal.tsx b/canvas/src/components/ConsoleModal.tsx index 1a43ca10..8535bec4 100644 --- a/canvas/src/components/ConsoleModal.tsx +++ b/canvas/src/components/ConsoleModal.tsx @@ -1,6 +1,6 @@ "use client"; -import { useEffect, useState } from "react"; +import { useEffect, useRef, useState } from "react"; import { createPortal } from "react-dom"; import { api } from "@/lib/api"; import { showToast } from "@/components/Toaster"; @@ -27,11 +27,21 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [mounted, setMounted] = useState(false); + const closeButtonRef = useRef(null); useEffect(() => { setMounted(true); }, []); + // Focus close button when modal opens + useEffect(() => { + if (!open) return; + const raf = requestAnimationFrame(() => { + closeButtonRef.current?.focus(); + }); + return () => cancelAnimationFrame(raf); + }, [open]); + useEffect(() => { if (!open) return; let ignore = false; @@ -99,6 +109,7 @@ export function ConsoleModal({ workspaceId, workspaceName, open, onClose }: Prop )} diff --git a/canvas/src/components/tabs/FilesTab/FileTree.tsx b/canvas/src/components/tabs/FilesTab/FileTree.tsx index 159d04b1..50fab649 100644 --- a/canvas/src/components/tabs/FilesTab/FileTree.tsx +++ b/canvas/src/components/tabs/FilesTab/FileTree.tsx @@ -66,6 +66,7 @@ function TreeItem({ 📁 {node.name} + ))}