groove-dev 0.27.144 → 0.27.146

package/node_modules/@groove-dev/gui/src/components/agents/agent-panel.jsx

@@ -1,12 +1,12 @@
 // FSL-1.1-Apache-2.0 — see LICENSE
-import { useState, useRef, useEffect, useCallback } from 'react';
+import { useState, useRef } from 'react';
 import { useGrooveStore } from '../../stores/groove';
 import { Badge } from '../ui/badge';
 import { AgentFeed } from './agent-feed';
 import { AgentConfig } from './agent-config';
 import { AgentTelemetry } from './agent-telemetry';
 import { AgentMdFiles } from './agent-mdfiles';
-import { MessageSquare, Settings, Activity, FileText, Pencil, Check, X, TrendingDown } from 'lucide-react';
+import { MessageSquare, Settings, Activity, FileText, Pencil, Check, X } from 'lucide-react';
 import { fmtNum, fmtUptime } from '../../lib/format';
 import { cn } from '../../lib/cn';
 import { roleColor } from '../../lib/status';
@@ -77,56 +77,6 @@ function InlineName({ agent }) {
   );
 }
 
-function useRoutingSuggestion(agentId, isAlive) {
-  const [suggestion, setSuggestion] = useState(null);
-  const [dismissed, setDismissed] = useState(false);
-
-  useEffect(() => {
-    if (!agentId || !isAlive || dismissed) { setSuggestion(null); return; }
-    let cancelled = false;
-    async function poll() {
-      try {
-        const res = await fetch(`/api/agents/${agentId}/routing/suggestion`);
-        if (cancelled) return;
-        if (res.status === 204 || !res.ok) { setSuggestion(null); return; }
-        const data = await res.json();
-        setSuggestion(data);
-      } catch { setSuggestion(null); }
-    }
-    poll();
-    const id = setInterval(poll, 30000);
-    return () => { cancelled = true; clearInterval(id); };
-  }, [agentId, isAlive, dismissed]);
-
-  const dismiss = useCallback(() => setDismissed(true), []);
-  const reset = useCallback(() => setDismissed(false), []);
-
-  return { suggestion: dismissed ? null : suggestion, dismiss, reset };
-}
-
-function DownshiftPill({ suggestion, onAccept, onDismiss }) {
-  if (!suggestion) return null;
-  const { suggestedModel } = suggestion;
-  return (
-    <div className="flex items-center gap-1 px-1.5 py-0.5 rounded bg-success/10 border border-success/20 text-2xs font-mono animate-in fade-in slide-in-from-left-1 duration-200">
-      <TrendingDown size={10} className="text-success flex-shrink-0" />
-      <span className="text-success/90 truncate max-w-[80px]">{suggestedModel.name}</span>
-      <button
-        onClick={onAccept}
-        className="px-1 py-px rounded bg-success/20 text-success font-semibold hover:bg-success/30 transition-colors cursor-pointer"
-      >
-        Switch
-      </button>
-      <button
-        onClick={onDismiss}
-        className="p-0.5 text-text-4 hover:text-text-1 cursor-pointer"
-      >
-        <X size={8} />
-      </button>
-    </div>
-  );
-}
-
 export function AgentPanel() {
   const detailPanel = useGrooveStore((s) => s.detailPanel);
   const agents = useGrooveStore((s) => s.agents);
@@ -141,7 +91,6 @@ export function AgentPanel() {
   else if (cachedAgentRef.current && cachedAgentRef.current.id !== agentId) cachedAgentRef.current = null;
   const agent = liveAgent || cachedAgentRef.current;
   const isAlive = liveAgent?.status === 'running' || liveAgent?.status === 'starting';
-  const { suggestion, dismiss: dismissSuggestion } = useRoutingSuggestion(agentId, isAlive);
 
   if (!agent) return null;
   if (activeTeamId && agent.teamId && agent.teamId !== activeTeamId) return null;
@@ -151,17 +100,6 @@ export function AgentPanel() {
   const uptime = spawned ? Math.floor((Date.now() - new Date(spawned).getTime()) / 1000) : 0;
   const colors = roleColor(agent.role);
 
-  async function acceptSuggestion() {
-    if (!suggestion) return;
-    try {
-      await api.patch(`/agents/${agent.id}`, { model: suggestion.suggestedModel.id });
-      addToast('success', `Model → ${suggestion.suggestedModel.name}`);
-      dismissSuggestion();
-    } catch (err) {
-      addToast('error', 'Model switch failed', err.message);
-    }
-  }
-
   return (
     <div className="flex flex-col h-full">
       {/* ── Header ─────────────────────────────────────────── */}
@@ -194,12 +132,6 @@ export function AgentPanel() {
             )}
             <span className="text-text-4">·</span>
             <span>{fmtUptime(uptime)}</span>
-            {suggestion && (
-              <>
-                <span className="text-text-4">·</span>
-                <DownshiftPill suggestion={suggestion} onAccept={acceptSuggestion} onDismiss={dismissSuggestion} />
-              </>
-            )}
           </div>
         </div>
 

package/node_modules/@groove-dev/gui/src/components/agents/spawn-wizard.jsx

@@ -12,7 +12,7 @@ import {
   Shield, Database, Megaphone, Calculator, UserCheck,
   Headphones, BarChart3, Rocket, ChevronDown, Pen, Presentation,
   Sparkles, X, Search, AlertTriangle, Plug, MessageCircle, GitBranch, Globe,
-  Check,
+  Check, Users, Plus,
 } from 'lucide-react';
 import { api } from '../../lib/api';
 import { Dialog, DialogContent } from '../ui/dialog';
@@ -53,6 +53,8 @@ export function SpawnWizard() {
   const closeDetail = useGrooveStore((s) => s.closeDetail);
   const spawnAgent = useGrooveStore((s) => s.spawnAgent);
   const fetchProviders = useGrooveStore((s) => s.fetchProviders);
+  const teams = useGrooveStore((s) => s.teams);
+  const createTeam = useGrooveStore((s) => s.createTeam);
 
   const open = detailPanel?.type === 'spawn';
   const [role, setRole] = useState('');
@@ -80,6 +82,9 @@ export function SpawnWizard() {
   const [preflightDialog, setPreflightDialog] = useState(null);
   const [ollamaInstalled, setOllamaInstalled] = useState([]);
   const [ollamaServerRunning, setOllamaServerRunning] = useState(false);
+  const [teamMode, setTeamMode] = useState('new');
+  const [newTeamName, setNewTeamName] = useState('');
+  const [selectedTeamId, setSelectedTeamId] = useState('');
   const federation = useGrooveStore((s) => s.federation);
   const ollamaRunningModels = useGrooveStore((s) => s.ollamaRunningModels);
 
@@ -102,6 +107,25 @@ export function SpawnWizard() {
           const best = priority.find((pid) => installed.some((p) => p.id === pid)) || installed[0].id;
           setProvider(best);
         }
+        if (_presetProvider) setProvider(_presetProvider);
+        if (_presetModel) {
+          const prov = list.find((p) => p.id === (_presetProvider || provider));
+          const models = prov?.models || [];
+          const exact = models.find((m) => m.id === _presetModel);
+          if (exact) {
+            setModel(_presetModel);
+          } else {
+            const parts = _presetModel.split(':');
+            const modelName = parts.length >= 3 ? parts.slice(2).join(':') : parts[parts.length - 1];
+            const match = models.find((m) =>
+              m.id === _presetModel ||
+              m.id === `gguf:${modelName}` ||
+              m.id.endsWith(`:${modelName}`) ||
+              m.name === modelName
+            );
+            setModel(match?.id || _presetModel);
+          }
+        }
       }).catch(() => {});
       api.get('/integrations/installed').then((data) => {
         setInstalledIntegrations(Array.isArray(data) ? data : []);
@@ -114,6 +138,10 @@ export function SpawnWizard() {
       }).catch(() => {});
       setRole(''); setCustomRole(''); setName('');
       setProvider(_presetProvider); setModel(_presetModel);
+      setTeamMode('new'); setSelectedTeamId('');
+      setNewTeamName(_presetModel
+        ? _presetModel.split(':').pop().replace(/[-_]/g, ' ')
+        : '');
       setPrompt('');
       setSelectedIntegrations([]);
       setIntegrationApproval('manual');
@@ -153,6 +181,14 @@ export function SpawnWizard() {
   async function runSpawn() {
     setSpawning(true);
     try {
+      let teamId;
+      if (teamMode === 'new') {
+        const teamName = newTeamName.trim() || selectedRole || 'New Team';
+        const team = await createTeam(teamName);
+        teamId = team.id;
+      } else if (teamMode === 'existing' && selectedTeamId) {
+        teamId = selectedTeamId;
+      }
       const config = {
         role: selectedRole,
         ...(name && { name: name.replace(/\s+/g, '-') }),
@@ -164,6 +200,7 @@ export function SpawnWizard() {
         ...(selectedRepos.length > 0 && { repos: selectedRepos }),
         ...(selectedPersonality && { personality: selectedPersonality }),
         ...(selectedRole === 'ambassador' && selectedPeerId && { peerId: selectedPeerId }),
+        ...(teamId && { teamId }),
       };
       await spawnAgent(config);
       closeDetail();
@@ -415,7 +452,36 @@ export function SpawnWizard() {
                               }
                             </optgroup>
                           </>
-                        ) : (
+                        ) : provider === 'local' ? (() => {
+                          const runtimeModels = availableModels.filter((m) => m.source === 'runtime');
+                          const ggufModels = availableModels.filter((m) => m.source === 'gguf');
+                          const ollamaMs = availableModels.filter((m) => m.source === 'ollama' || !m.source);
+                          return (
+                            <>
+                              {runtimeModels.length > 0 && (
+                                <optgroup label="Lab Runtimes">
+                                  {runtimeModels.map((m) => (
+                                    <option key={m.id} value={m.id}>{m.name}{m.runtimeType ? ` (${m.runtimeType})` : ''}</option>
+                                  ))}
+                                </optgroup>
+                              )}
+                              {ggufModels.length > 0 && (
+                                <optgroup label="GGUF Models">
+                                  {ggufModels.map((m) => (
+                                    <option key={m.id} value={m.id}>{m.name}{m.hasRuntime ? '' : ' (no runtime)'}</option>
+                                  ))}
+                                </optgroup>
+                              )}
+                              {ollamaMs.length > 0 && (
+                                <optgroup label="Ollama">
+                                  {ollamaMs.map((m) => (
+                                    <option key={m.id} value={m.id}>{m.name}</option>
+                                  ))}
+                                </optgroup>
+                              )}
+                            </>
+                          );
+                        })() : (
                           availableModels.map((m) => (
                             <option key={m.id} value={m.id}>{m.name}</option>
                           ))
@@ -459,6 +525,64 @@ export function SpawnWizard() {
                   </div>
                 )}
 
+                {/* Team */}
+                <div className="space-y-1.5">
+                  <label className="text-xs font-medium text-text-2 font-sans">Team</label>
+                  <div className="flex gap-1.5">
+                    <button
+                      onClick={() => setTeamMode('new')}
+                      className={cn(
+                        'flex-1 flex items-center gap-2 px-3 py-2 rounded-md border text-left transition-all cursor-pointer',
+                        teamMode === 'new'
+                          ? 'border-accent bg-accent/5'
+                          : 'border-border-subtle bg-surface-1 hover:border-border',
+                      )}
+                    >
+                      <Plus size={13} className={teamMode === 'new' ? 'text-accent' : 'text-text-3'} />
+                      <div>
+                        <div className="text-2xs font-semibold text-text-0 font-sans">New Team</div>
+                      </div>
+                    </button>
+                    <button
+                      onClick={() => setTeamMode('existing')}
+                      className={cn(
+                        'flex-1 flex items-center gap-2 px-3 py-2 rounded-md border text-left transition-all cursor-pointer',
+                        teamMode === 'existing'
+                          ? 'border-accent bg-accent/5'
+                          : 'border-border-subtle bg-surface-1 hover:border-border',
+                      )}
+                    >
+                      <Users size={13} className={teamMode === 'existing' ? 'text-accent' : 'text-text-3'} />
+                      <div>
+                        <div className="text-2xs font-semibold text-text-0 font-sans">Existing</div>
+                      </div>
+                    </button>
+                  </div>
+                  {teamMode === 'new' && (
+                    <Input
+                      value={newTeamName}
+                      onChange={(e) => setNewTeamName(e.target.value)}
+                      placeholder="Team name..."
+                      className="text-xs"
+                    />
+                  )}
+                  {teamMode === 'existing' && (
+                    <div className="relative">
+                      <select
+                        value={selectedTeamId}
+                        onChange={(e) => setSelectedTeamId(e.target.value)}
+                        className="w-full h-8 px-3 pr-8 text-sm rounded-md bg-surface-1 border border-border text-text-0 font-sans appearance-none cursor-pointer focus:outline-none focus:ring-1 focus:ring-accent"
+                      >
+                        <option value="">Select team...</option>
+                        {teams.filter((t) => !t.archived).map((t) => (
+                          <option key={t.id} value={t.id}>{t.name}</option>
+                        ))}
+                      </select>
+                      <ChevronDown size={14} className="absolute right-2 top-1/2 -translate-y-1/2 text-text-3 pointer-events-none" />
+                    </div>
+                  )}
+                </div>
+
                 {/* Integrations */}
                 <div className="space-y-1.5">
                   <label className="text-xs font-medium text-text-2 font-sans">Integrations</label>
@@ -756,18 +880,22 @@ export function SpawnWizard() {
               </div>
             )}
             {selectedRole && installedProviders.length > 0 && (
-              <div className="flex items-center gap-2 mb-3 text-xs text-text-3 font-sans">
+              <div className="flex items-center gap-2 mb-3 text-xs text-text-3 font-sans flex-wrap">
                 <span>Spawning</span>
                 <Badge variant="accent">{selectedRole}</Badge>
                 {provider && <span>on {selectedProvider?.name || provider}</span>}
                 {name && <span>as {name.replace(/\s+/g, '-')}</span>}
+                {teamMode === 'new' && <span>in new team{newTeamName ? ` "${newTeamName}"` : ''}</span>}
+                {teamMode === 'existing' && selectedTeamId && (
+                  <span>in {teams.find((t) => t.id === selectedTeamId)?.name || 'team'}</span>
+                )}
               </div>
             )}
             <Button
               variant="primary"
               size="lg"
               onClick={handleSpawn}
-              disabled={!selectedRole || spawning || installedProviders.length === 0}
+              disabled={!selectedRole || spawning || installedProviders.length === 0 || (teamMode === 'existing' && !selectedTeamId)}
               className="w-full"
             >
               {spawning ? 'Spawning...' : 'Spawn Agent'}

package/node_modules/@groove-dev/gui/src/components/chat/chat-header.jsx

@@ -3,11 +3,12 @@ import { useState, useRef, useEffect } from 'react';
 import { Pencil, Pin, PinOff, Trash2, Hash, MoreHorizontal, ChevronDown, X } from 'lucide-react';
 import { useGrooveStore } from '../../stores/groove';
 import { fmtNum } from '../../lib/format';
-import { ModelPicker, formatModelName } from './model-picker';
 import { cn } from '../../lib/cn';
 import { roleColor } from '../../lib/status';
 
 const CHAT_ROLES = [
+  { id: 'chat', label: 'Chat', desc: 'General conversation' },
+  { id: 'research', label: 'Research Assistant', desc: 'Explore ideas, web search' },
   { id: 'fullstack', label: 'Fullstack', desc: 'End-to-end engineering' },
   { id: 'backend', label: 'Backend', desc: 'APIs, services, databases' },
   { id: 'frontend', label: 'Frontend', desc: 'UI, components, styling' },
@@ -24,7 +25,7 @@ const CHAT_ROLES = [
   { id: 'support', label: 'Support', desc: 'Customer support, FAQs' },
 ];
 
-export function ChatHeader({ conversation, model, onModelChange, role, onRoleChange, sidebarCollapsed }) {
+export function ChatHeader({ conversation, role, onRoleChange, sidebarCollapsed }) {
   const renameConversation = useGrooveStore((s) => s.renameConversation);
   const pinConversation = useGrooveStore((s) => s.pinConversation);
   const deleteConversation = useGrooveStore((s) => s.deleteConversation);
@@ -155,12 +156,6 @@ export function ChatHeader({ conversation, model, onModelChange, role, onRoleCha
           )}
         </div>
 
-        <ModelPicker
-          value={model || { provider: conversation.provider, model: conversation.model }}
-          onChange={onModelChange}
-          disabled={false}
-        />
-
         {tokens > 0 && (
           <span className="text-2xs text-text-3 font-mono tabular-nums">{fmtNum(tokens)} tok</span>
         )}