groove-dev 0.27.157 → 0.27.161

package/packages/gui/src/components/settings/ssh-wizard.jsx

@@ -7,7 +7,7 @@ import { useGrooveStore } from '../../stores/groove';
 import { cn } from '../../lib/cn';
 import {
   FolderSearch, Check, X, AlertTriangle, Loader2,
-  ExternalLink, Server, KeyRound, Settings, Plug,
+  ExternalLink, Server, KeyRound, Settings, Plug, Terminal, Copy, RefreshCw,
 } from 'lucide-react';
 
 const STEPS = [
@@ -110,6 +110,111 @@ function InfoCard({ icon: Icon, title, iconColor, children }) {
   );
 }
 
+function CopyableCommand({ command }) {
+  const [copied, setCopied] = useState(false);
+  return (
+    <div className="flex items-center gap-1.5 group">
+      <code className="flex-1 text-2xs font-mono text-text-1 bg-surface-0 px-2.5 py-1.5 rounded-md border border-border-subtle truncate">
+        {command}
+      </code>
+      <button
+        onClick={() => { navigator.clipboard.writeText(command); setCopied(true); setTimeout(() => setCopied(false), 1500); }}
+        className="p-1.5 text-text-4 hover:text-text-1 cursor-pointer transition-colors flex-shrink-0"
+        title="Copy"
+      >
+        {copied ? <Check size={11} className="text-success" /> : <Copy size={11} />}
+      </button>
+    </div>
+  );
+}
+
+function SetupStatus({ testResult, user, host, sshPort, testLoading, onRetest }) {
+  const allGood = testResult.nodeInstalled && testResult.grooveInstalled && testResult.daemonRunning;
+  const needsNode = !testResult.nodeInstalled;
+  const needsGroove = testResult.nodeInstalled && !testResult.grooveInstalled;
+  const needsDaemon = testResult.grooveInstalled && !testResult.daemonRunning;
+  const sshTarget = `${user}@${host}${sshPort !== 22 ? ` -p ${sshPort}` : ''}`;
+
+  if (allGood) {
+    return (
+      <InfoCard icon={Check} title="Ready to Connect" iconColor="bg-success/10 text-success">
+        <div className="space-y-2.5">
+          <div className="flex items-center gap-2 text-2xs font-sans">
+            <StatusDot status="running" size="sm" />
+            <span className="text-text-1">Node.js {testResult.nodeVersion}</span>
+          </div>
+          <div className="flex items-center gap-2 text-2xs font-sans">
+            <StatusDot status="running" size="sm" />
+            <span className="text-text-1">Groove Installed{testResult.remoteVersion ? ` (v${testResult.remoteVersion})` : ''}</span>
+          </div>
+          <div className="flex items-center gap-2 text-2xs font-sans">
+            <StatusDot status="running" size="sm" />
+            <span className="text-text-1">Daemon Running</span>
+          </div>
+        </div>
+      </InfoCard>
+    );
+  }
+
+  return (
+    <div className="rounded-xl border border-warning/25 bg-gradient-to-br from-warning/[0.04] to-transparent px-5 py-4">
+      <div className="flex items-center justify-between mb-3">
+        <div className="flex items-center gap-2.5">
+          <div className="w-7 h-7 rounded-lg bg-warning/10 flex items-center justify-center flex-shrink-0">
+            <Terminal size={13} className="text-warning" />
+          </div>
+          <span className="text-sm font-semibold text-text-0 font-sans">Remote Setup Required</span>
+        </div>
+        <button
+          onClick={onRetest}
+          disabled={testLoading}
+          className="flex items-center gap-1 text-2xs text-text-3 hover:text-text-1 font-sans cursor-pointer transition-colors disabled:opacity-50"
+        >
+          <RefreshCw size={10} className={testLoading ? 'animate-spin' : ''} />
+          Re-test
+        </button>
+      </div>
+
+      <div className="space-y-2.5 mb-3">
+        <div className="flex items-center gap-2 text-2xs font-sans">
+          <StatusDot status={testResult.reachable ? 'running' : 'crashed'} size="sm" />
+          <span className="text-text-1">Reachable</span>
+        </div>
+        <div className="flex items-center gap-2 text-2xs font-sans">
+          <StatusDot status={testResult.nodeInstalled ? 'running' : 'stopped'} size="sm" />
+          <span className="text-text-1">Node.js{testResult.nodeVersion ? ` ${testResult.nodeVersion}` : ''}</span>
+        </div>
+        <div className="flex items-center gap-2 text-2xs font-sans">
+          <StatusDot status={testResult.grooveInstalled ? 'running' : 'stopped'} size="sm" />
+          <span className="text-text-1">Groove{testResult.remoteVersion ? ` v${testResult.remoteVersion}` : ''}</span>
+        </div>
+        <div className="flex items-center gap-2 text-2xs font-sans">
+          <StatusDot status={testResult.daemonRunning ? 'running' : 'stopped'} size="sm" />
+          <span className="text-text-1">Daemon</span>
+        </div>
+      </div>
+
+      <div className="border-t border-border-subtle pt-3 space-y-2">
+        <p className="text-2xs text-text-3 font-sans">SSH in and run{needsNode ? '' : needsGroove ? '' : ''}:</p>
+        <CopyableCommand command={`ssh ${sshTarget}`} />
+        {needsNode && (
+          <>
+            <CopyableCommand command='curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash' />
+            <CopyableCommand command="source ~/.bashrc && nvm install 20" />
+          </>
+        )}
+        {(needsNode || needsGroove) && (
+          <CopyableCommand command="npm i -g groove-dev" />
+        )}
+        {(needsNode || needsGroove || needsDaemon) && (
+          <CopyableCommand command="groove start" />
+        )}
+        <p className="text-2xs text-text-4 font-sans mt-1">Then click Re-test above.</p>
+      </div>
+    </div>
+  );
+}
+
 export function SSHWizard({ server, onSave, onTest, onConnect, onCancel }) {
   const remoteHomedir = useGrooveStore((s) => s.remoteHomedir);
   const [step, setStep] = useState(0);
@@ -140,6 +245,13 @@ export function SSHWizard({ server, onSave, onTest, onConnect, onCancel }) {
       setAutoConnect(server.autoConnect || false);
       setCompletedSteps([0, 1]);
       setStep(2);
+      setTestResult(null);
+      setTestLoading(true);
+      onTest().then((result) => {
+        setTestResult(result);
+      }).catch((err) => {
+        setTestResult({ error: err.message || 'Test failed' });
+      }).finally(() => setTestLoading(false));
     } else {
       setName('');
       setHost('');
@@ -150,6 +262,7 @@ export function SSHWizard({ server, onSave, onTest, onConnect, onCancel }) {
       setAutoConnect(false);
       setCompletedSteps([]);
       setStep(0);
+      setTestResult(null);
     }
   }, [server]);
 
@@ -402,22 +515,14 @@ export function SSHWizard({ server, onSave, onTest, onConnect, onCancel }) {
           </FieldCard>
 
           {testResult && !testResult.error ? (
-            <InfoCard icon={Check} title="Test Results" iconColor="bg-success/10 text-success">
-              <div className="space-y-2.5">
-                <div className="flex items-center gap-2 text-2xs font-sans">
-                  <StatusDot status={testResult.reachable ? 'running' : 'crashed'} size="sm" />
-                  <span className="text-text-1">Reachable</span>
-                </div>
-                <div className="flex items-center gap-2 text-2xs font-sans">
-                  <StatusDot status={testResult.grooveInstalled ? 'running' : 'stopped'} size="sm" />
-                  <span className="text-text-1">Groove Installed</span>
-                </div>
-                <div className="flex items-center gap-2 text-2xs font-sans">
-                  <StatusDot status={testResult.daemonRunning ? 'running' : 'stopped'} size="sm" />
-                  <span className="text-text-1">Daemon Running</span>
-                </div>
-              </div>
-            </InfoCard>
+            <SetupStatus
+              testResult={testResult}
+              user={user}
+              host={host}
+              sshPort={sshPort}
+              testLoading={testLoading}
+              onRetest={handleTest}
+            />
           ) : (
             <InfoCard icon={Server} title={name || 'Server'}>
               <div className="space-y-2 text-2xs font-sans">

package/packages/gui/src/stores/groove.js

@@ -198,7 +198,11 @@ export const useGrooveStore = create((set, get) => ({
             }
           }
           for (const id of removed) delete timeline[id];
-          set({ agents, tokenTimeline: timeline, hydrated: true });
+          const updates = { agents, tokenTimeline: timeline, hydrated: true };
+          if (removed.length > 0 && st.detailPanel?.type === 'agent' && removed.includes(st.detailPanel.agentId)) {
+            updates.detailPanel = null;
+          }
+          set(updates);
           break;
         }
 
@@ -366,6 +370,10 @@ export const useGrooveStore = create((set, get) => ({
           break;
         }
 
+        case 'recommended-team:ready':
+          if (!get().recommendedTeam) get().checkRecommendedTeam();
+          break;
+
         case 'phase2:spawned':
           get().addToast('info', `QC agent ${msg.name} auto-spawned`, 'Auditing phase 1 work');
           break;

package/packages/gui/src/stores/slices/agents-slice.js

@@ -169,10 +169,11 @@ export const createAgentsSlice = (set, get) => ({
         return data;
       }
 
-      // CLI agent: was stopped + resumed/rotated — transfer state to new agent ID
+      // CLI agent: was stopped + resumed/rotated — transfer state to new agent ID.
+      // Only transfer if the rotation:complete WebSocket handler hasn't already done it.
       const newAgent = data;
       for (const key of ['chatHistory', 'activityLog', 'tokenTimeline']) {
-        if (snapshot[key]?.length) {
+        if (snapshot[key]?.length && !get()[key]?.[newAgent.id]?.length) {
           set((s) => ({ [key]: { ...s[key], [newAgent.id]: [...snapshot[key]] } }));
         }
       }
@@ -380,6 +381,13 @@ export const createAgentsSlice = (set, get) => ({
       get().addChatMessage(agentId, 'system', text);
     };
 
+    const startThinking = () => {
+      set((s) => ({ thinkingAgents: new Set([...s.thinkingAgents, agentId]) }));
+    };
+    const stopThinking = () => {
+      set((s) => { const next = new Set(s.thinkingAgents); next.delete(agentId); return { thinkingAgents: next }; });
+    };
+
     try {
       switch (command) {
         case 'instruct': {
@@ -391,8 +399,11 @@ export const createAgentsSlice = (set, get) => ({
           if (tags.length === 0) { addSystemMsg('Usage: save #tag your message here'); return true; }
           const content = rest.replace(/#[\w/.-]+/g, '').trim();
           if (!content) { addSystemMsg('Usage: save #tag your message here'); return true; }
-          await get().saveKeeperItem(tags[0], content);
-          addSystemMsg(`Saved to #${tags[0]}`);
+          startThinking();
+          try {
+            await get().saveKeeperItem(tags[0], content);
+            addSystemMsg(`Saved to #${tags[0]}`);
+          } finally { stopThinking(); }
           return { passthrough: content };
         }
 
@@ -400,36 +411,48 @@ export const createAgentsSlice = (set, get) => ({
           if (tags.length === 0) { addSystemMsg('Usage: append #tag content to add'); return true; }
           const content = rest.replace(/#[\w/.-]+/g, '').trim();
           if (!content) { addSystemMsg('Usage: append #tag content to add'); return true; }
-          await get().appendKeeperItem(tags[0], content);
-          addSystemMsg(`Appended to #${tags[0]}`);
+          startThinking();
+          try {
+            await get().appendKeeperItem(tags[0], content);
+            addSystemMsg(`Appended to #${tags[0]}`);
+          } finally { stopThinking(); }
           return { passthrough: content };
         }
 
         case 'update': {
           if (tags.length === 0) { addSystemMsg('Usage: [update] #tag'); return true; }
           get().addChatMessage(agentId, 'user', message, false);
-          const existing = await get().getKeeperItem(tags[0]);
-          set({ keeperEditing: { tag: tags[0], content: existing?.content || '', isNew: !existing } });
+          startThinking();
+          try {
+            const existing = await get().getKeeperItem(tags[0]);
+            set({ keeperEditing: { tag: tags[0], content: existing?.content || '', isNew: !existing } });
+          } finally { stopThinking(); }
           return true;
         }
 
         case 'delete': {
           if (tags.length === 0) { addSystemMsg('Usage: [delete] #tag'); return true; }
           get().addChatMessage(agentId, 'user', message, false);
-          await get().deleteKeeperItem(tags[0]);
-          addSystemMsg(`Deleted #${tags[0]}`);
+          startThinking();
+          try {
+            await get().deleteKeeperItem(tags[0]);
+            addSystemMsg(`Deleted #${tags[0]}`);
+          } finally { stopThinking(); }
           return true;
         }
 
         case 'view': {
           if (tags.length === 0) { addSystemMsg('Usage: [view] #tag'); return true; }
           get().addChatMessage(agentId, 'user', message, false);
-          const item = await get().getKeeperItem(tags[0]);
-          if (item) {
-            set({ keeperEditing: { tag: tags[0], content: item.content, isNew: false, readOnly: true } });
-          } else {
-            addSystemMsg(`#${tags[0]} not found`);
-          }
+          startThinking();
+          try {
+            const item = await get().getKeeperItem(tags[0]);
+            if (item) {
+              set({ keeperEditing: { tag: tags[0], content: item.content, isNew: false, readOnly: true } });
+            } else {
+              addSystemMsg(`#${tags[0]} not found`);
+            }
+          } finally { stopThinking(); }
           return true;
         }
 
@@ -437,21 +460,22 @@ export const createAgentsSlice = (set, get) => ({
           if (tags.length === 0) { addSystemMsg('Usage: [read] #tag1 #tag2 ...'); return true; }
           const userText = rest.replace(/#[\w/.-]+/g, '').trim();
           get().addChatMessage(agentId, 'user', message, false);
-          const readBrief = await api.post('/keeper/pull', { tags });
-          if (readBrief?.brief) {
-            const memoryBlock = `\n\n---\nContext from memories (${tags.map(t => '#' + t).join(', ')}):\n\n${readBrief.brief}`;
-            set((s) => ({ thinkingAgents: new Set([...s.thinkingAgents, agentId]) }));
-            await api.post(`/agents/${encodeURIComponent(agentId)}/instruct`, {
-              message: userText ? `${userText}${memoryBlock}` : `Here is context from my tagged memories:\n\n${readBrief.brief}`,
-            });
-            addSystemMsg(`Sent ${tags.map(t => '#' + t).join(', ')} to agent`);
-          } else {
-            addSystemMsg(`No memories found for ${tags.map(t => '#' + t).join(', ')}`);
-            if (userText) {
-              set((s) => ({ thinkingAgents: new Set([...s.thinkingAgents, agentId]) }));
-              await api.post(`/agents/${encodeURIComponent(agentId)}/instruct`, { message: userText });
+          startThinking();
+          try {
+            const readBrief = await api.post('/keeper/pull', { tags });
+            if (readBrief?.brief) {
+              const memoryBlock = `\n\n---\nContext from memories (${tags.map(t => '#' + t).join(', ')}):\n\n${readBrief.brief}`;
+              await api.post(`/agents/${encodeURIComponent(agentId)}/instruct`, {
+                message: userText ? `${userText}${memoryBlock}` : `Here is context from my tagged memories:\n\n${readBrief.brief}`,
+              });
+              addSystemMsg(`Sent ${tags.map(t => '#' + t).join(', ')} to agent`);
+            } else {
+              addSystemMsg(`No memories found for ${tags.map(t => '#' + t).join(', ')}`);
+              if (userText) {
+                await api.post(`/agents/${encodeURIComponent(agentId)}/instruct`, { message: userText });
+              }
             }
-          }
+          } finally { stopThinking(); }
           return true;
         }
 
@@ -459,12 +483,15 @@ export const createAgentsSlice = (set, get) => ({
           if (tags.length === 0) { addSystemMsg('Usage: [doc] #tag'); return true; }
           get().addChatMessage(agentId, 'user', message, false);
           addSystemMsg(`Generating doc for #${tags[0]}...`);
-          const history = get().chatHistory[agentId] || [];
-          const result = await api.post('/keeper/doc', { tag: tags[0], chatHistory: history, agentId });
-          if (result?.content) {
-            addSystemMsg(`Doc #${tags[0]} generated (${result.size}B)`);
-            set({ keeperEditing: { tag: tags[0], content: result.content, isNew: false } });
-          }
+          startThinking();
+          try {
+            const history = get().chatHistory[agentId] || [];
+            const result = await api.post('/keeper/doc', { tag: tags[0], chatHistory: history, agentId });
+            if (result?.content) {
+              addSystemMsg(`Doc #${tags[0]} generated (${result.size}B)`);
+              set({ keeperEditing: { tag: tags[0], content: result.content, isNew: false } });
+            }
+          } finally { stopThinking(); }
           return true;
         }
 
@@ -473,12 +500,16 @@ export const createAgentsSlice = (set, get) => ({
           if (!linkMatch || tags.length === 0) { addSystemMsg('Usage: [link] #tag path/to/doc'); return true; }
           const docPath = linkMatch[2].trim();
           get().addChatMessage(agentId, 'user', message, false);
-          await api.post('/keeper/link', { tag: tags[0], docPath });
-          addSystemMsg(`Linked #${tags[0]} → ${docPath}`);
+          startThinking();
+          try {
+            await api.post('/keeper/link', { tag: tags[0], docPath });
+            addSystemMsg(`Linked #${tags[0]} → ${docPath}`);
+          } finally { stopThinking(); }
           return true;
         }
       }
     } catch (err) {
+      stopThinking();
       addSystemMsg(`Keeper error: ${err.message}`);
       return true;
     }

package/packages/gui/src/views/memory.jsx

@@ -4,7 +4,7 @@ import { useGrooveStore } from '../stores/groove';
 import { Button } from '../components/ui/button';
 import { ScrollArea } from '../components/ui/scroll-area';
 import { Dialog, DialogContent } from '../components/ui/dialog';
-import { BookOpen, Plus, Search, Trash2, Pencil, ChevronRight, Hash, FolderOpen, Clock, Save, Link2, FileText, Sparkles, HelpCircle, GripVertical } from 'lucide-react';
+import { BookOpen, Plus, Search, Trash2, Pencil, ChevronRight, Hash, FolderOpen, Clock, Save, Link2, FileText, Sparkles, HelpCircle, GripVertical, CornerLeftUp } from 'lucide-react';
 
 const COMMANDS = [
   { cmd: 'save',     args: '#tag',                desc: 'Save the message and send it to the agent' },
@@ -114,7 +114,7 @@ function MemoryCard({ item, onEdit, onDelete }) {
   );
 }
 
-function EditorModal({ open, onOpenChange, editing, onSave }) {
+function EditorModal({ open, onOpenChange, editing, onSave, onRename }) {
   const [tag, setTag] = useState('');
   const [content, setContent] = useState('');
   const textareaRef = useRef(null);
@@ -132,9 +132,15 @@ function EditorModal({ open, onOpenChange, editing, onSave }) {
     }
   }, [open]);
 
-  const handleSave = () => {
+  const handleSave = async () => {
     if (!tag.trim() || editing?.readOnly) return;
-    onSave(tag.trim(), content);
+    const originalTag = editing?.tag || '';
+    const newTag = tag.trim();
+    if (!editing?.isNew && newTag !== originalTag) {
+      await onRename(originalTag, newTag, content);
+    } else {
+      onSave(newTag, content);
+    }
     onOpenChange(false);
   };
 
@@ -148,27 +154,30 @@ function EditorModal({ open, onOpenChange, editing, onSave }) {
   const isNew = editing?.isNew;
   const readOnly = editing?.readOnly;
   const title = readOnly ? `#${editing?.tag || ''}` : isNew ? 'New Memory' : `Edit #${editing?.tag || ''}`;
+  const tagChanged = !isNew && tag.trim() !== (editing?.tag || '');
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent title={title} description="Memory content" className="max-w-2xl">
         <div className="p-5 space-y-4" onKeyDown={handleKeyDown}>
-          {isNew && (
-            <div>
-              <label className="block text-xs font-medium text-text-2 mb-1.5">Tag</label>
-              <div className="flex items-center gap-1">
-                <span className="text-sm text-text-3">#</span>
-                <input
-                  type="text"
-                  value={tag}
-                  onChange={(e) => setTag(e.target.value.replace(/[^a-zA-Z0-9/_-]/g, '').toLowerCase())}
-                  placeholder="project/feature-name"
-                  className="flex-1 px-2 py-1.5 text-sm font-mono rounded-md bg-surface-0 border border-border text-text-0 placeholder:text-text-4 focus:outline-none focus:ring-1 focus:ring-accent"
-                />
-              </div>
-              <p className="text-2xs text-text-4 mt-1">Use / for hierarchy: groove/memory-system</p>
+          <div>
+            <label className="block text-xs font-medium text-text-2 mb-1.5">
+              {isNew ? 'Tag' : 'Title'}
+              {tagChanged && <span className="ml-2 text-2xs text-warning">(will rename)</span>}
+            </label>
+            <div className="flex items-center gap-1">
+              <span className="text-sm text-text-3">#</span>
+              <input
+                type="text"
+                value={tag}
+                onChange={(e) => !readOnly && setTag(e.target.value.replace(/[^a-zA-Z0-9/_-]/g, '').toLowerCase())}
+                readOnly={readOnly}
+                placeholder="project/feature-name"
+                className="flex-1 px-2 py-1.5 text-sm font-mono rounded-md bg-surface-0 border border-border text-text-0 placeholder:text-text-4 focus:outline-none focus:ring-1 focus:ring-accent"
+              />
             </div>
-          )}
+            {isNew && <p className="text-2xs text-text-4 mt-1">Use / for hierarchy: groove/memory-system</p>}
+          </div>
           <div>
             {!readOnly && <label className="block text-xs font-medium text-text-2 mb-1.5">Content</label>}
             <textarea
@@ -196,7 +205,7 @@ function EditorModal({ open, onOpenChange, editing, onSave }) {
               {!readOnly && (
                 <Button variant="primary" size="sm" onClick={handleSave} disabled={!tag.trim()}>
                   <Save size={14} />
-                  Save
+                  {tagChanged ? 'Rename & Save' : 'Save'}
                 </Button>
               )}
             </div>
@@ -249,7 +258,7 @@ function InstructModal({ open, onOpenChange }) {
   );
 }
 
-function TreeItem({ tag, label, isDoc, indent, isDragOver, onSelect, onDragStart, onDragOver, onDragLeave, onDrop }) {
+function TreeItem({ tag, label, isDoc, indent, isDragOver, onSelect, onEdit, onDelete, onDragStart, onDragOver, onDragLeave, onDrop }) {
   return (
     <div
       draggable
@@ -257,19 +266,34 @@ function TreeItem({ tag, label, isDoc, indent, isDragOver, onSelect, onDragStart
       onDragOver={(e) => { e.preventDefault(); e.dataTransfer.dropEffect = 'move'; onDragOver?.(tag); }}
       onDragLeave={() => onDragLeave?.()}
       onDrop={(e) => { e.preventDefault(); onDrop?.(e.dataTransfer.getData('text/plain'), tag); }}
-      onClick={() => onSelect({ tag })}
       className={`flex items-center gap-1.5 w-full px-2 py-1.5 rounded-md text-xs transition-colors cursor-pointer group ${isDragOver ? 'bg-accent/15 border border-accent/30 border-dashed' : 'hover:bg-surface-2'}`}
       style={indent ? { paddingLeft: `${8 + indent * 16}px` } : undefined}
     >
       <GripVertical size={10} className="text-text-4 opacity-0 group-hover:opacity-50 flex-shrink-0 cursor-grab" />
       <Hash size={11} className="text-text-4 flex-shrink-0" />
-      <span className="font-medium text-text-2 truncate">{label}</span>
+      <span className="font-medium text-text-2 truncate flex-1" onClick={() => onSelect({ tag })}>{label}</span>
       {isDoc && <Sparkles size={9} className="text-purple flex-shrink-0" />}
+      <div className="flex items-center gap-0.5 opacity-0 group-hover:opacity-100 transition-opacity flex-shrink-0">
+        <button
+          onClick={(e) => { e.stopPropagation(); onEdit?.({ tag }); }}
+          className="p-1 rounded text-text-4 hover:text-accent hover:bg-accent/10 transition-colors cursor-pointer"
+          title="Edit"
+        >
+          <Pencil size={11} />
+        </button>
+        <button
+          onClick={(e) => { e.stopPropagation(); onDelete?.(tag); }}
+          className="p-1 rounded text-text-4 hover:text-danger hover:bg-danger/10 transition-colors cursor-pointer"
+          title="Delete"
+        >
+          <Trash2 size={11} />
+        </button>
+      </div>
     </div>
   );
 }
 
-function TreeGroup({ node, onSelect, dragOverTag, onDragStart, onDragOver, onDragLeave, onDrop }) {
+function TreeGroup({ node, onSelect, onEdit, onDelete, dragOverTag, onDragStart, onDragOver, onDragLeave, onDrop }) {
   const [expanded, setExpanded] = useState(true);
   const hasChildren = node.children && node.children.length > 0;
 
@@ -278,7 +302,8 @@ function TreeGroup({ node, onSelect, dragOverTag, onDragStart, onDragOver, onDra
       <TreeItem
         tag={node.tag} label={node.tag} isDoc={node.type === 'doc'}
         isDragOver={dragOverTag === node.tag}
-        onSelect={onSelect} onDragStart={onDragStart} onDragOver={onDragOver} onDragLeave={onDragLeave} onDrop={onDrop}
+        onSelect={onSelect} onEdit={onEdit} onDelete={onDelete}
+        onDragStart={onDragStart} onDragOver={onDragOver} onDragLeave={onDragLeave} onDrop={onDrop}
       />
     );
   }
@@ -305,14 +330,16 @@ function TreeGroup({ node, onSelect, dragOverTag, onDragStart, onDragOver, onDra
             <TreeItem
               tag={node.tag} label={node.tag} isDoc={node.type === 'doc'} indent={1}
               isDragOver={false}
-              onSelect={onSelect} onDragStart={onDragStart} onDragOver={onDragOver} onDragLeave={onDragLeave} onDrop={onDrop}
+              onSelect={onSelect} onEdit={onEdit} onDelete={onDelete}
+              onDragStart={onDragStart} onDragOver={onDragOver} onDragLeave={onDragLeave} onDrop={onDrop}
             />
           )}
           {node.children.map((child) => (
             <TreeItem
               key={child.tag} tag={child.tag} label={child.tag.split('/').pop()} isDoc={child.type === 'doc'} indent={1}
               isDragOver={dragOverTag === child.tag}
-              onSelect={onSelect} onDragStart={onDragStart} onDragOver={onDragOver} onDragLeave={onDragLeave} onDrop={onDrop}
+              onSelect={onSelect} onEdit={onEdit} onDelete={onDelete}
+              onDragStart={onDragStart} onDragOver={onDragOver} onDragLeave={onDragLeave} onDrop={onDrop}
             />
           ))}
         </div>
@@ -335,7 +362,7 @@ export default function MemoryView() {
   const setKeeperEditing = useGrooveStore((s) => s.setKeeperEditing);
 
   const [search, setSearch] = useState('');
-  const [viewMode, setViewMode] = useState('list');
+  const [viewMode, setViewMode] = useState('tree');
   const [editorOpen, setEditorOpen] = useState(false);
   const [dragOverTag, setDragOverTag] = useState(null);
   const [draggingTag, setDraggingTag] = useState(null);
@@ -383,6 +410,12 @@ export default function MemoryView() {
     setKeeperEditing(null);
   };
 
+  const handleRename = async (oldTag, newTag, content) => {
+    await moveKeeperItem(oldTag, newTag);
+    await updateKeeperItem(newTag, content);
+    setKeeperEditing(null);
+  };
+
   const handleEditorClose = (open) => {
     setEditorOpen(open);
     if (!open) setKeeperEditing(null);
@@ -397,10 +430,9 @@ export default function MemoryView() {
     setDragOverTag(null);
     setDraggingTag(null);
     if (!sourceTag || !targetTag || sourceTag === targetTag) return;
-    // Don't drop onto self or own children
     if (targetTag.startsWith(sourceTag + '/')) return;
     const sourceName = sourceTag.split('/').pop();
-    const newTag = targetTag + '/' + sourceName;
+    const newTag = targetTag === '__root__' ? sourceName : targetTag + '/' + sourceName;
     if (sourceTag === newTag) return;
     try {
       await moveKeeperItem(sourceTag, newTag);
@@ -487,6 +519,7 @@ export default function MemoryView() {
               {filteredTree.map((node) => (
                 <TreeGroup
                   key={node.tag} node={node} onSelect={handleTreeSelect}
+                  onEdit={handleEdit} onDelete={(tag) => deleteKeeperItem(tag)}
                   dragOverTag={dragOverTag}
                   onDragStart={(tag) => setDraggingTag(tag)}
                   onDragOver={(tag) => { if (tag !== draggingTag) setDragOverTag(tag); }}
@@ -494,6 +527,17 @@ export default function MemoryView() {
                   onDrop={handleDrop}
                 />
               ))}
+              {draggingTag && draggingTag.includes('/') && (
+                <div
+                  onDragOver={(e) => { e.preventDefault(); e.dataTransfer.dropEffect = 'move'; setDragOverTag('__root__'); }}
+                  onDragLeave={() => setDragOverTag(null)}
+                  onDrop={(e) => { e.preventDefault(); handleDrop(e.dataTransfer.getData('text/plain'), '__root__'); }}
+                  className={`flex items-center gap-2 px-3 py-2 mt-2 rounded-md border border-dashed text-xs transition-colors ${dragOverTag === '__root__' ? 'border-accent/50 bg-accent/10 text-accent' : 'border-border text-text-4'}`}
+                >
+                  <CornerLeftUp size={12} />
+                  <span>Drop here to move to root</span>
+                </div>
+              )}
             </div>
           )
         ) : (
@@ -518,6 +562,7 @@ export default function MemoryView() {
         onOpenChange={handleEditorClose}
         editing={keeperEditing}
         onSave={handleSave}
+        onRename={handleRename}
       />
 
       {/* Instruct Modal (command reference) */}

package/node_modules/@fontsource-variable/jetbrains-mono/CHANGELOG.md

@@ -1,2 +0,0 @@
-# Changelog
-See the [Fontsource CHANGELOG.md](https://github.com/fontsource/fontsource/blob/main/CHANGELOG.md).