feat(desktop): a server manager you can browse and edit

apps/desktop/src/app/page.tsx

@@ -18,6 +18,7 @@ import {
 import { ConnectionDialog } from '@/components/connection-dialog'
 import { FleetView } from '@/components/fleet-view'
 import { ProfileBar } from '@/components/profile-bar'
+import { ServerManager } from '@/components/server-manager'
 import { endpointLabel, loadPane, Pane, type PaneEndpoint, type PaneState } from '@/components/pane'
 import { TransferRail } from '@/components/transfer-rail'
 import { MirrorPreviewDialog, TransferBand, type ActiveJob } from '@/components/transfer-panel'
@@ -90,6 +91,7 @@ export default function Workspace() {
   const [job, setJob] = useState<ActiveJob | null>(null)
   const [error, setError] = useState<string | null>(null)
   const [showConnection, setShowConnection] = useState(false)
+  const [showServers, setShowServers] = useState(false)
   const [tab, setTab] = useState<'transfer' | 'fleet'>('transfer')
   const [profiles, setProfiles] = useState<SyncProfile[]>([])
   const [outsideShell, setOutsideShell] = useState(false)
@@ -380,11 +382,11 @@ export default function Workspace() {
         <div className="ml-auto flex items-center gap-2">
           <Button
             variant="outline"
-            onClick={() => setShowConnection(true)}
+            onClick={() => setShowServers(true)}
             className="h-[var(--control)] gap-2 border-line-strong text-[12px]"
           >
             <Users className="size-3.5" />
-            New server
+            Servers
           </Button>
 
           {/*
@@ -408,8 +410,8 @@ export default function Workspace() {
             <PopoverContent align="end" className="w-[236px] gap-0.5 p-1.5">
               <MenuItem
                 icon={<Plus className="size-3.5" />}
-                onClick={() => setShowConnection(true)}
-                label="Add a server…"
+                onClick={() => setShowServers(true)}
+                label="Servers…"
               />
               <MenuItem
                 icon={<FileDown className="size-3.5" />}
@@ -543,9 +545,15 @@ export default function Workspace() {
       </div>
 
       <div className={`flex min-h-0 flex-1 flex-col ${tab === 'fleet' ? '' : 'hidden'}`}>
-        <FleetView onAddServer={() => setShowConnection(true)} />
+        <FleetView onAddServer={() => setShowServers(true)} />
       </div>
 
+      <ServerManager
+        open={showServers}
+        onClose={() => setShowServers(false)}
+        onChanged={() => void refreshConnections()}
+      />
+
       <ConnectionDialog open={showConnection} onClose={() => setShowConnection(false)} onSaved={() => void refreshConnections()} />
 
       <MirrorPreviewDialog

apps/desktop/src/components/fleet-view.tsx

@@ -360,6 +360,15 @@ export function FleetView({ onAddServer }: { onAddServer: () => void }) {
 
   const canRun = selected.size > 0 && script.trim().length > 0 && !running
 
+  /**
+   * Is what is on screen a saved command you are changing?
+   *
+   * Saving under an existing name has always updated it — the store upserts —
+   * but the control said "Save these settings" either way, so there was no way
+   * to tell an edit from a new one.
+   */
+  const editingSaved = commands.some((command) => !command.builtin && command.name === label)
+
   return (
     <div className="flex min-h-0 flex-1 flex-col">
       {error ? (
@@ -563,12 +572,18 @@ export function FleetView({ onAddServer }: { onAddServer: () => void }) {
               {script.trim() && !savingCommand ? (
                 <button
                   type="button"
-                  onClick={() => setSavingCommand(true)}
+                  onClick={() => {
+                    // Prefill with the loaded command's name so saving over it
+                    // is one keypress. Updating was always possible — saving
+                    // under the same name upserts — but nothing said so.
+                    setNewCommandName(editingSaved ? label : '')
+                    setSavingCommand(true)
+                  }}
                   disabled={running}
                   className="focus-ring inline-flex items-center gap-1 rounded-md border border-dashed border-line-strong px-2 py-0.5 text-[11px] text-muted-foreground transition-colors hover:text-foreground disabled:opacity-50"
                 >
                   <BookmarkPlus className="size-2.5" />
-                  Save these settings
+                  {editingSaved ? `Update ${label}` : 'Save these settings'}
                 </button>
               ) : null}