commit initial 09-12-2025 016

src/App.js

@@ -35,7 +35,7 @@ const RUNNABLE_LANGS = ["python", "javascript", "java"];
 // =================== APP ===================
 function App() {
   const [tree, setTree] = useState(loadTree());
-  const [activePath, setActivePath] = useState("main.py");
+  const [activePath, setActivePath] = useState("main.py"); // selected file or folder path
   const [output, setOutput] = useState("");
   const [prompt, setPrompt] = useState("");
   const [explanation, setExplanation] = useState("");
@@ -45,145 +45,260 @@ function App() {
   const [searchOpen, setSearchOpen] = useState(false);
   const [searchQuery, setSearchQuery] = useState("");
   const [aiSuggestions, setAiSuggestions] = useState([]);
-  const [contextMenu, setContextMenu] = useState(null); // right-click menu
+  const [contextMenu, setContextMenu] = useState(null); // {x,y,file}
   const editorRef = useRef(null);
+  const fileInputRef = useRef(null);
 
-  const currentFile = getNodeByPath(tree, activePath);
-  const langMeta =
-    LANGUAGE_OPTIONS.find((l) => currentFile?.name.endsWith(l.ext)) ||
-    LANGUAGE_OPTIONS[0];
-
-  // Save after tree change
+  // Always persist tree on change
   useEffect(() => {
     saveTree(tree);
   }, [tree]);
 
-  // =================== FILE ACTIONS ===================
+  // helpers
+  const currentNode = getNodeByPath(tree, activePath);
+  const langMeta =
+    LANGUAGE_OPTIONS.find((l) => currentNode?.name?.endsWith(l.ext)) ||
+    LANGUAGE_OPTIONS[0];
+
+  // ---------- Tree utilities ----------
+  const collectFolderPaths = (node, acc = []) => {
+    if (!node) return acc;
+    if (node.type === "folder") acc.push(node.path || "");
+    node.children?.forEach((c) => collectFolderPaths(c, acc));
+    return acc;
+  };
+
+  // ---------- File / Folder actions ----------
+
+  // Create a new file inside selected folder (or root)
   const handleNewFile = () => {
-    const name = window.prompt("Filename (with extension):");
-    if (!name) return;
-    setTree(addFile(tree, name));
+    const filename = window.prompt("Filename (with extension):", "untitled.js");
+    if (!filename) return;
+
+    // Determine default parent
+    const selected = getNodeByPath(tree, activePath);
+    let parentPath = "";
+    if (selected?.type === "folder") parentPath = selected.path;
+    else if (selected?.type === "file") {
+      const parts = selected.path.split("/").slice(0, -1);
+      parentPath = parts.join("/");
+    }
+
+    // Offer user to choose another parent folder
+    const folders = collectFolderPaths(tree);
+    const suggestion = parentPath || folders[0] || "";
+    const chosen = window.prompt(
+      `Parent folder (enter path). Available:\n${folders.join("\n")}\n\nLeave empty for root.`,
+      suggestion
+    );
+    const targetParent = chosen == null ? parentPath : (chosen.trim() || "");
+
+    const updated = addFile(tree, filename, targetParent);
+    setTree(updated);
+
+    // Set active to newly created file
+    const newPath = (targetParent ? targetParent + "/" : "") + filename;
+    setActivePath(newPath);
   };
 
+  // Create a folder under selected folder or root
   const handleNewFolder = () => {
-    const name = window.prompt("Folder name:");
+    const name = window.prompt("Folder name:", "new_folder");
     if (!name) return;
-    setTree(addFolder(tree, name));
+    const selected = getNodeByPath(tree, activePath);
+    const parentPath = selected && selected.type === "folder" ? selected.path : "";
+    const updated = addFolder(tree, name, parentPath);
+    setTree(updated);
   };
 
+  // Rename selected node (file or folder)
   const handleRename = () => {
     if (!activePath) return;
-    const newName = window.prompt("New name:", currentFile.name);
-    if (!newName) return;
-    setTree(renameNode(tree, activePath, newName));
-    setActivePath(newName);
+    const node = getNodeByPath(tree, activePath);
+    if (!node) return;
+    const newName = window.prompt("New name:", node.name);
+    if (!newName || newName === node.name) return;
+    const updated = renameNode(tree, activePath, newName);
+    setTree(updated);
+
+    // compute new activePath (preserve parent)
+    const parts = activePath.split("/");
+    parts.pop();
+    const parent = parts.join("/");
+    const newPath = (parent ? parent + "/" : "") + newName;
+    setActivePath(newPath);
   };
 
+  // Delete selected node (confirm if folder not empty)
   const handleDelete = () => {
     if (!activePath) return;
-    setTree(deleteNode(tree, activePath));
-    setActivePath(""); // unselect
+    const node = getNodeByPath(tree, activePath);
+    if (!node) return;
+
+    if (node.type === "folder" && node.children?.length > 0) {
+      const ok = window.confirm(`Folder "${node.name}" has ${node.children.length} items. Delete anyway?`);
+      if (!ok) return;
+    } else {
+      const ok = window.confirm(`Delete "${node.name}"?`);
+      if (!ok) return;
+    }
+
+    const updated = deleteNode(tree, activePath);
+    setTree(updated);
+    setActivePath(""); // deselect / fallback
   };
 
+  // Download single file
   const downloadFile = () => {
-    if (!currentFile?.content) return;
-    const blob = new Blob([currentFile.content], {
-      type: "text/plain;charset=utf-8",
-    });
+    const node = getNodeByPath(tree, activePath);
+    if (!node || node.type !== "file") return;
+    const blob = new Blob([node.content || ""], { type: "text/plain;charset=utf-8" });
     const a = document.createElement("a");
     a.href = URL.createObjectURL(blob);
-    a.download = currentFile.name;
+    a.download = node.name;
     a.click();
   };
 
-  // =================== RUN ===================
-  const handleRun = async () => {
-    if (!currentFile?.content) return;
+  // Import file from user's machine into selected folder
+  const handleImportFileClick = () => fileInputRef.current?.click();
+
+  const handleFileInputChange = async (e) => {
+    const f = e.target.files?.[0];
+    if (!f) return;
+    const text = await f.text();
+
+    // decide parent folder
+    const selected = getNodeByPath(tree, activePath);
+    let parentPath = "";
+    if (selected?.type === "folder") parentPath = selected.path; // fallback
+    // (above line intentionally split to maintain code clarity)
+    // compute parent path correctly:
+    if (selected?.type === "folder") parentPath = selected.path;
+    else if (selected?.type === "file") parentPath = selected.path.split("/").slice(0, -1).join("");
+
+    // create file under parent and write content
+    const updated = addFile(tree, f.name, parentPath);
+    const newPath = (parentPath ? parentPath + "/" : "") + f.name;
+    const finalTree = updateFileContent(updated, newPath, text);
+    setTree(finalTree);
+    setActivePath(newPath);
+    e.target.value = "";
+  };
 
-    const selectedLang = langMeta.id;
-    if (!RUNNABLE_LANGS.includes(selectedLang)) {
-      setOutput(`⚠️ Cannot run ${selectedLang}.`);
+  // ---------- Run & Agent ----------
+
+  const handleRun = async () => {
+    const node = getNodeByPath(tree, activePath);
+    if (!node || node.type !== "file") {
+      setOutput("Select a file to run.");
+      return;
+    }
+    const selectedLang = LANGUAGE_OPTIONS.find((l) => node.name.endsWith(l.ext))?.id;
+    if (!selectedLang || !RUNNABLE_LANGS.includes(selectedLang)) {
+      setOutput(`⚠️ Run not supported for this file type.`);
       return;
     }
 
-    const res = await runCode(currentFile.content, selectedLang, stdin);
+    const res = await runCode(node.content, selectedLang, stdin);
     setOutput(res.output || "");
     setProblems(res.error ? parseProblems(res.output) : []);
   };
 
-  // =================== AI ===================
   const handleAskFix = async () => {
-    if (!currentFile) return;
+    const node = getNodeByPath(tree, activePath);
+    if (!node || node.type !== "file") {
+      setOutput("Select a file to apply fix.");
+      return;
+    }
     const userHint = prompt.trim() ? `User request: ${prompt}` : "";
     const reply = await askAgent(
-      `Improve, debug, or refactor this ${langMeta.id} file.
-${userHint}
-Return ONLY updated code, no explanation.
-
-CODE:
-${currentFile.content}`
+      `Improve, debug, or refactor this ${LANGUAGE_OPTIONS.find((l) => node.name.endsWith(l.ext))?.id || "file"} file.\n${userHint}\nReturn ONLY updated code, no explanation.\n\nCODE:\n${node.content}`
     );
-    updateActiveFileContent(reply);
+    const updatedTree = updateFileContent(tree, node.path, reply);
+    setTree(updatedTree);
   };
 
   const handleExplainSelection = async () => {
-    if (!currentFile) return;
+    const node = getNodeByPath(tree, activePath);
+    if (!node || node.type !== "file") {
+      setExplanation("Select a file to explain.");
+      return;
+    }
     const editor = editorRef.current;
-    const selected = editor
-      .getModel()
-      .getValueInRange(editor.getSelection());
-    const code = selected.trim() || currentFile.content;
-
-    const userHint = prompt.trim()
-      ? `Focus on: ${prompt}`
-      : "Give a clear and simple explanation.";
-
+    let selectedCode = "";
+    try {
+      selectedCode = editor?.getModel()?.getValueInRange(editor.getSelection()) || "";
+    } catch {}
+    const code = selectedCode.trim() || node.content;
+    const userHint = prompt.trim() ? `Focus on: ${prompt}` : "Give a clear and simple explanation.";
     const reply = await askAgent(
-      `Explain what this ${langMeta.id} code does, any risks, and improvements.
-${userHint}
-
-CODE:
-${code}`
+      `Explain what this code does, any risks, and improvements.\n${userHint}\n\nCODE:\n${code}`
     );
     setExplanation(reply);
   };
 
-  const updateActiveFileContent = (value) => {
-    const updated = updateFileContent(tree, activePath, value);
-    setTree(updated);
-  };
-
-  // ===== AI Autocomplete Suggestions (Popup) =====
+  // AI suggestions for continuation (simple)
   const fetchAiSuggestions = async (code) => {
     if (!code?.trim()) return;
-    const reply = await askAgent(
-      `Suggest possible next lines for continuation. Return 3 short snippets.\n${code}`
-    );
+    const reply = await askAgent(`Suggest possible next lines for continuation. Return 3 short snippets.\n${code}`);
     setAiSuggestions(reply.split("\n").filter((l) => l.trim()));
   };
 
-  // =================== SEARCH ===================
+  // ---------- Search ----------
   const handleSearchToggle = () => setSearchOpen(!searchOpen);
 
   const handleSearchNow = () => {
     if (!searchQuery) return;
-    alert(
-      `Found occurrences:\n${JSON.stringify(
-        searchTree(tree, searchQuery),
-        null,
-        2
-      )}`
+    const results = searchTree(tree, searchQuery);
+    alert(`Found ${results.length} results:\n` + JSON.stringify(results, null, 2));
+  };
+
+  // ---------- Editor change ----------
+  const updateActiveFileContent = (value) => {
+    const node = getNodeByPath(tree, activePath);
+    if (!node) return;
+    const updated = updateFileContent(tree, activePath, value ?? "");
+    setTree(updated);
+  };
+
+  // ---------- Render Tree (moved inside component so it sees activePath) ----------
+  const renderTree = (node, depth = 0) => {
+    const isActive = node.path === activePath;
+    return (
+      <div key={node.path || node.name} style={{ paddingLeft: depth * 10 }}>
+        <div
+          className={`tree-item ${node.type} ${isActive ? "ide-file-item-active" : ""}`}
+          onClick={() => setActivePath(node.path)}
+          onContextMenu={(e) => {
+            e.preventDefault();
+            setActivePath(node.path);
+            setContextMenu({ x: e.pageX, y: e.pageY, file: node.path });
+          }}
+          style={{ display: "flex", alignItems: "center", gap: 8 }}
+        >
+          <span style={{ width: 18 }}>{node.type === "folder" ? "📁" : "📄"}</span>
+          <span className="ide-file-name">{node.name}</span>
+        </div>
+
+        {node.children &&
+          node.children.map((c) => renderTree(c, depth + 1))}
+      </div>
     );
   };
 
-  // =================== UI ===================
+  // ---------- JSX UI ----------
   return (
-    <div
-      className={`ide-root ${
-        theme === "vs-dark" ? "ide-dark" : "ide-light"
-      }`}
-    >
-      {/* ==== TOP BAR ==== */}
+    <div className={`ide-root ${theme === "vs-dark" ? "ide-dark" : "ide-light"}`}>
+      {/* Hidden file input for import */}
+      <input
+        ref={fileInputRef}
+        id="file-import-input"
+        type="file"
+        style={{ display: "none" }}
+        onChange={handleFileInputChange}
+      />
+
+      {/* Top menu */}
       <div className="ide-menubar">
         <div className="ide-menubar-left">
           <span className="ide-logo">⚙️ DevMate IDE</span>
@@ -191,8 +306,10 @@ ${code}`
           <button onClick={handleNewFile}>📄 New File</button>
           <button onClick={handleNewFolder}>📁 New Folder</button>
           <button onClick={handleRename}>✏️ Rename</button>
+          <button onClick={handleDelete}>🗑 Delete</button>
           <button onClick={downloadFile}>📥 Download</button>
-          <button onClick={downloadProjectZip}>📦 ZIP</button>
+          <button onClick={() => downloadProjectZip()}>📦 ZIP</button>
+          <button onClick={handleImportFileClick}>📤 Import File</button>
         </div>
 
         <div className="ide-menubar-right">
@@ -200,38 +317,45 @@ ${code}`
           <button onClick={handleRun}>▶ Run</button>
           <button onClick={handleAskFix}>🤖 Fix</button>
           <button onClick={handleExplainSelection}>📖 Explain</button>
-          <button
-            onClick={() =>
-              setTheme(theme === "vs-dark" ? "light" : "vs-dark")
-            }
-          >
+          <button onClick={() => setTheme((t) => (t === "vs-dark" ? "light" : "vs-dark"))}>
             {theme === "vs-dark" ? "☀️" : "🌙"}
           </button>
         </div>
       </div>
 
-      {/* ==== BODY ==== */}
+      {/* Body */}
       <div className="ide-body">
-        {/* ==== TREE VIEW (LEFT) ==== */}
+        {/* Sidebar */}
         <div className="ide-sidebar">
-          {renderTree(tree, setActivePath, setContextMenu)}
+          <div className="ide-sidebar-header">
+            <span>EXPLORER</span>
+            <button className="ide-icon-button" onClick={handleNewFile} title="New File">＋</button>
+          </div>
+          <div className="ide-file-list" style={{ padding: 6 }}>
+            {renderTree(tree)}
+          </div>
         </div>
 
-        {/* ==== MAIN CENTER (EDITOR + OUTPUT) ==== */}
+        {/* Main (editor + bottom panels) */}
         <div className="ide-main">
           <div className="ide-editor-wrapper">
             <Editor
               height="100%"
               theme={theme}
               language={langMeta.monaco}
-              value={currentFile?.content || ""}
+              value={currentNode?.content || ""}
               onChange={updateActiveFileContent}
               onMount={(editor) => (editorRef.current = editor)}
-              onBlur={() => fetchAiSuggestions(currentFile?.content)}
+              onBlur={() => fetchAiSuggestions(currentNode?.content)}
+              options={{
+                minimap: { enabled: true },
+                fontSize: 14,
+                scrollBeyondLastLine: false,
+              }}
             />
           </div>
 
-          {/* AI Suggestions Tooltip */}
+          {/* AI inline suggestions popup */}
           {aiSuggestions.length > 0 && (
             <div className="ai-popup">
               {aiSuggestions.map((s, i) => (
@@ -239,9 +363,7 @@ ${code}`
                   key={i}
                   className="ai-suggest"
                   onClick={() =>
-                    updateActiveFileContent(
-                      (currentFile?.content || "") + "\n" + s
-                    )
+                    updateActiveFileContent((currentNode?.content || "") + "\n" + s)
                   }
                 >
                   {s}
@@ -250,7 +372,7 @@ ${code}`
             </div>
           )}
 
-          {/* Bottom Panels: Output + stdin + Problems */}
+          {/* Bottom panels */}
           <div className="ide-panels">
             <pre className="ide-output">{output}</pre>
 
@@ -266,7 +388,7 @@ ${code}`
                 <div>🚨 Problems ({problems.length})</div>
                 {problems.map((p, i) => (
                   <div key={i}>
-                    {p.file}:{p.line} — {p.message}
+                    {p.path}:{p.line} — {p.message}
                   </div>
                 ))}
               </div>
@@ -274,7 +396,7 @@ ${code}`
           </div>
         </div>
 
-        {/* ==== RIGHT AI PANEL ==== */}
+        {/* Right AI panel */}
         <div className="ide-right-panel">
           <div className="ide-ai-header">🤖 AI Assistant</div>
 
@@ -282,7 +404,7 @@ ${code}`
             <label className="ide-ai-label">Instruction</label>
             <textarea
               className="ide-agent-textarea"
-              placeholder="Ask the AI (e.g., 'optimize this function', 'add comments', 'convert to JS'...)"
+              placeholder="Ask the AI (optimize, add tests, convert, etc.)"
               value={prompt}
               onChange={(e) => setPrompt(e.target.value)}
             />
@@ -302,7 +424,7 @@ ${code}`
         </div>
       </div>
 
-      {/* ==== SEARCH PANEL ==== */}
+      {/* Search dialog */}
       {searchOpen && (
         <div className="search-dialog">
           <input
@@ -313,44 +435,41 @@ ${code}`
         </div>
       )}
 
-      {/* ==== RIGHT-CLICK CONTEXT MENU ==== */}
+      {/* Context menu */}
       {contextMenu && (
         <div
           className="ide-context-menu"
           style={{ top: contextMenu.y, left: contextMenu.x }}
           onMouseLeave={() => setContextMenu(null)}
         >
-          <div onClick={handleRename}>✏️ Rename</div>
-          <div onClick={handleDelete}>🗑 Delete</div>
-          <div onClick={downloadFile}>📥 Download</div>
+          <div
+            onClick={() => {
+              setContextMenu(null);
+              handleRename();
+            }}
+          >
+            ✏️ Rename
+          </div>
+          <div
+            onClick={() => {
+              setContextMenu(null);
+              handleDelete();
+            }}
+          >
+            🗑 Delete
+          </div>
+          <div
+            onClick={() => {
+              setContextMenu(null);
+              downloadFile();
+            }}
+          >
+            📥 Download
+          </div>
         </div>
       )}
     </div>
   );
 }
 
-// =======================================================
-// Tree Renderer UI
-// =======================================================
-function renderTree(node, setActivePath, setContextMenu, depth = 0) {
-  return (
-    <div key={node.name} style={{ paddingLeft: depth * 10 }}>
-      <div
-        className={`tree-item ${node.type}`}
-        onClick={() => node.type === "file" && setActivePath(node.path)}
-        onContextMenu={(e) => {
-          e.preventDefault();
-          setContextMenu({ x: e.pageX, y: e.pageY, file: node.path });
-        }}
-      >
-        {node.type === "folder" ? "📁" : "📄"} {node.name}
-      </div>
-      {node.children &&
-        node.children.map((child) =>
-          renderTree(child, setActivePath, setContextMenu, depth + 1)
-        )}
-    </div>
-  );
-}
-
 export default App;

src/fileStore.js

@@ -1,8 +1,17 @@
 // fileStore.js
+const STORAGE_KEY = "devmate_ide_tree_v2";
+
+/**
+ * Tree node structure:
+ * {
+ *   type: "folder" | "file",
+ *   name: "src" or "main.py",
+ *   path: "src" or "src/main.py",
+ *   children: [ ... ]  // only for folders
+ *   content: "..."     // only for files
+ * }
+ */
 
-const STORAGE_KEY = "devmate_ide_tree";
-
-// Default starter tree
 const defaultTree = {
   type: "folder",
   name: "root",
@@ -15,111 +24,188 @@ const defaultTree = {
       content: "# Python\nprint('Hello from IDE')",
     },
     {
-      type: "file",
-      name: "script.js",
-      path: "script.js",
-      content: "console.log('Hello from JS');",
+      type: "folder",
+      name: "src",
+      path: "src",
+      children: [
+        {
+          type: "file",
+          name: "script.js",
+          path: "src/script.js",
+          content: "console.log('Hello from src');",
+        },
+      ],
     },
   ],
 };
 
-// ============ HELPERS ============
-
+// ---------- persistence ----------
 export function loadTree() {
   try {
-    const data = localStorage.getItem(STORAGE_KEY);
-    return data ? JSON.parse(data) : defaultTree;
-  } catch {
+    const raw = localStorage.getItem(STORAGE_KEY);
+    return raw ? JSON.parse(raw) : defaultTree;
+  } catch (e) {
+    console.warn("loadTree failed:", e);
     return defaultTree;
   }
 }
 
 export function saveTree(tree) {
-  localStorage.setItem(STORAGE_KEY, JSON.stringify(tree));
+  try {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(tree));
+  } catch (e) {
+    console.warn("saveTree failed:", e);
+  }
 }
 
-export function getNodeByPath(node, path) {
-  if (!path) return null;
-  if (node.path === path) return node;
-  if (!node.children) return null;
-  for (let c of node.children) {
-    const result = getNodeByPath(c, path);
-    if (result) return result;
+// ---------- traversal helpers ----------
+function clone(obj) {
+  return JSON.parse(JSON.stringify(obj));
+}
+
+// find node and parent by path
+export function findNodeAndParent(root, path) {
+  if (path === "" || path == null) return { node: root, parent: null };
+  const parts = path.split("/").filter(Boolean);
+  let node = root;
+  let parent = null;
+  for (let i = 0; i < parts.length; i++) {
+    const part = parts[i];
+    parent = node;
+    if (!parent.children) return { node: null, parent: null };
+    node = parent.children.find((c) => c.name === part);
+    if (!node) return { node: null, parent: null };
   }
-  return null;
+  return { node, parent };
 }
 
-function buildPath(parent, name) {
-  return parent.path ? `${parent.path}/${name}` : name;
+export function getNodeByPath(root, path) {
+  const r = findNodeAndParent(root, path);
+  return r.node || null;
 }
 
-// ============ ADD ============
+// build child path
+function joinPath(parentPath, name) {
+  if (!parentPath) return name;
+  if (!name) return parentPath;
+  return parentPath + "/" + name;
+}
 
-export function addFile(tree, name) {
-  const newTree = JSON.parse(JSON.stringify(tree));
-  newTree.children.push({
-    type: "file",
-    name,
-    path: name,
-    content: `// ${name}`,
-  });
+// ---------- CRUD operations ----------
+
+// Add file under parentPath (string). If parentPath points to file, use its parent.
+export function addFile(tree, filename, parentPath = "") {
+  const newTree = clone(tree);
+  // find parent
+  const { node: parent } = findNodeAndParent(newTree, parentPath);
+  const target = parent?.type === "folder" ? parent : newTree;
+  // ensure unique name
+  let name = filename;
+  const exists = (name) =>
+    target.children && target.children.some((c) => c.name === name);
+  let idx = 1;
+  const base = name.includes(".") ? name.slice(0, name.lastIndexOf(".")) : name;
+  const ext = name.includes(".") ? name.slice(name.lastIndexOf(".")) : "";
+  while (exists(name)) {
+    name = `${base}_${idx++}${ext}`;
+  }
+  const path = joinPath(target.path, name);
+  const newNode = { type: "file", name, path, content: `// ${name}\n` };
+  target.children = target.children || [];
+  target.children.push(newNode);
   return newTree;
 }
 
-export function addFolder(tree, name) {
-  const newTree = JSON.parse(JSON.stringify(tree));
-  newTree.children.push({
-    type: "folder",
-    name,
-    path: name,
-    children: [],
-  });
+// Add folder under parentPath
+export function addFolder(tree, folderName, parentPath = "") {
+  const newTree = clone(tree);
+  const { node: parent } = findNodeAndParent(newTree, parentPath);
+  const target = parent?.type === "folder" ? parent : newTree;
+  let name = folderName;
+  const exists = (name) =>
+    target.children && target.children.some((c) => c.name === name && c.type === "folder");
+  let idx = 1;
+  while (exists(name)) {
+    name = `${folderName}_${idx++}`;
+  }
+  const path = joinPath(target.path, name);
+  const newNode = { type: "folder", name, path, children: [] };
+  target.children = target.children || [];
+  target.children.push(newNode);
   return newTree;
 }
 
-// ============ DELETE ============
-
+// Delete node (file or folder) at given path (recursive for folders)
 export function deleteNode(tree, path) {
-  const clone = JSON.parse(JSON.stringify(tree));
-  clone.children = clone.children.filter((c) => c.path !== path);
-  return clone;
+  const newTree = clone(tree);
+  if (!path) return newTree; // cannot delete root
+  const parts = path.split("/").filter(Boolean);
+  const nameToDelete = parts.pop();
+  const parentPath = parts.join("/");
+  const { node: parent } = findNodeAndParent(newTree, parentPath);
+  if (!parent || !parent.children) return newTree;
+  parent.children = parent.children.filter((c) => c.name !== nameToDelete);
+  return newTree;
 }
 
-// ============ RENAME ============
-
+// Rename node: change name and update paths recursively for children
 export function renameNode(tree, path, newName) {
-  const clone = JSON.parse(JSON.stringify(tree));
-  function renameRec(node) {
-    if (node.path === path) {
-      node.name = newName;
-      node.path = newName;
+  const newTree = clone(tree);
+  const { node, parent } = findNodeAndParent(newTree, path);
+  if (!node || !parent) {
+    // special case root rename not allowed
+    if (node && !parent) return newTree;
+    return newTree;
+  }
+  // ensure no duplicate under parent
+  if (parent.children.some((c) => c.name === newName && c.path !== node.path)) {
+    // collision: abort
+    return newTree;
+  }
+
+  const oldPath = node.path;
+  node.name = newName;
+  const newPath = joinPath(parent.path, newName);
+  // update path recursively
+  function updatePaths(n, currPath) {
+    n.path = currPath;
+    if (n.children) {
+      for (let child of n.children) {
+        const childNewPath = currPath ? currPath + "/" + child.name : child.name;
+        updatePaths(child, childNewPath);
+      }
     }
-    node.children?.forEach(renameRec);
   }
-  renameRec(clone);
-  return clone;
+  updatePaths(node, newPath);
+  return newTree;
 }
 
-// ============ UPDATE CONTENT ============
-
+// Update file content
 export function updateFileContent(tree, path, content) {
-  const clone = JSON.parse(JSON.stringify(tree));
-  function update(node) {
-    if (node.path === path && node.type === "file") {
-      node.content = content;
-    }
-    node.children?.forEach(update);
+  const newTree = clone(tree);
+  const { node } = findNodeAndParent(newTree, path);
+  if (node && node.type === "file") {
+    node.content = content;
   }
-  update(clone);
-  return clone;
+  return newTree;
 }
 
-// ============ SEARCH ============
-
-export function searchTree(node, term, result = []) {
-  if (node.type === "file" && node.content?.includes(term)) {
-    result.push({ file: node.name, path: node.path });
+// Search within files (returns array of {path, file, excerpt})
+export function searchTree(node, term, results = []) {
+  if (!node) return results;
+  if (node.type === "file" && node.content && node.content.includes(term)) {
+    results.push({
+      path: node.path,
+      file: node.name,
+      excerpt: node.content
+        .split("\n")
+        .filter((l) => l.includes(term))
+        .slice(0, 5)
+        .join("\n"),
+    });
+  }
+  if (node.children) {
+    for (const c of node.children) searchTree(c, term, results);
   }
-  node.children?.forEach((c) => searchTree(c, term, result));
-  return result;
+  return results;
 }