@rikcodes/teamclaude 1.1.20-rik.12 → 1.1.20-rik.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rikcodes/teamclaude",
-  "version": "1.1.20-rik.12",
+  "version": "1.1.20-rik.14",
   "description": "Multi-account proxy for Claude Code and Codex: pools Claude Max, ChatGPT/Codex, API-key and third-party backend accounts, and rotates on quota",
   "type": "module",
   "main": "src/index.js",

package/src/account-manager.js

@@ -214,6 +214,13 @@ function makeAccount(acct, index) {
     hasClaudeMax: acct.hasClaudeMax ?? null,
     hasClaudePro: acct.hasClaudePro ?? null,
     priority: acct.priority || 0,
+    // Where this account sits in the list the TUI draws, arranged by the
+    // operator from the settings screen. Presentation only: nothing but
+    // _displayOrder in tui.js reads it, and it is emphatically NOT `priority`
+    // above — that one decides which account rotation spends next, and the two
+    // answer different questions about the same fleet. `null` means never
+    // placed, which sorts after every account that has been.
+    displayOrder: Number.isFinite(acct.displayOrder) ? acct.displayOrder : null,
     disabled: acct.disabled || false,
     maxUsage: acct.maxUsage ?? null,
     upstream: acct.upstream || null,

package/src/index.js

@@ -775,11 +775,27 @@ async function serverCommand() {
   // instead of re-running teardown, which would re-arm server.close() and leak a
   // 'close' listener on the server each time (MaxListenersExceededWarning).
   let shuttingDown = false;
-  async function shutdown() {
-    if (shuttingDown) process.exit(0); // second ctrl-c: stop waiting, just go
-    shuttingDown = true;
+  // Everything this process borrowed from the terminal, given back: at most
+  // once, never throwing, and on every path that leaves. shutdown() does it
+  // first, as it always has. A restart drain now keeps the display up to the
+  // last moment and does it last — which makes the guard below, the "stop
+  // waiting, just go" path, the one that would otherwise walk out of a drain
+  // leaving the operator on the alternate screen with raw mode still on and a
+  // terminal they cannot type into.
+  const restoreTerminal = () => {
     try { tui?.stop(); } catch { /* terminal already restored */ }
+    // Stopping the title belongs here rather than at the top of a drain: while
+    // one runs the title still names the build that is running, which is the
+    // whole reason it carries the build at all.
     stopTitle();
+  };
+  async function shutdown() {
+    // Second ctrl-c, or a signal arriving during a restart drain: stop waiting,
+    // just go — but hand the terminal back first, because nothing after this
+    // line runs and on the drain path the display is still up.
+    if (shuttingDown) { restoreTerminal(); process.exit(0); }
+    shuttingDown = true;
+    restoreTerminal();
     if (!tui) console.log('\n[TeamClaude] Shutting down...');
     prober?.stop();
     warmer?.stop();
@@ -810,6 +826,12 @@ async function serverCommand() {
   // stops accepting while the connections already open keep serving; then the
   // bounded wait; then the sidecar, whose replacement the next process spawns;
   // then quota state, exactly as shutdown() persists it. Exit 75 is the ask.
+  //
+  // The display is the other difference. shutdown() tears it down first; this
+  // keeps it to the end. A drain is up to thirty seconds of waiting the
+  // operator asked for, and taking the dashboard away at the start of it left
+  // them watching plain console lines with no way to tell how far it had got or
+  // what was holding it.
   let draining = false;
   hooks.isDraining = () => draining;
   /** @param {string} why  what put the restart in motion, for the line on the way out */
@@ -817,12 +839,19 @@ async function serverCommand() {
     if (shuttingDown) return; // ctrl-c beat us here, or a second trigger did
     shuttingDown = true;
     draining = true;
-    try { tui?.stop(); } catch { /* terminal already restored */ }
-    stopTitle();
+    tui?.restartDrainStarted({
+      deadlineMs: DRAIN_DEADLINE_MS,
+      inFlight: () => accountManager.inFlightRequests(),
+    });
+    // Under the TUI console.log IS the log pane (tui.js), so this line and the
+    // two the drain ends with report themselves on screen beside the live
+    // counter, and nothing extra has to be written for them.
     console.log(`\n[TeamClaude] ${why} — draining, up to ${Math.round(DRAIN_DEADLINE_MS / 1000)}s for requests in flight.`);
     prober?.stop();
     warmer?.stop();
     eventLoopMonitor.stop();
+    /** @type {string|null} */
+    let failure = null;
     // Nothing below may throw its way out. Neither caller awaits this — the TUI
     // key returns to its handler and the watcher fires from a timer — so an
     // escaping rejection would be an unhandled one, and crash-log.js turns that
@@ -840,11 +869,21 @@ async function serverCommand() {
       if (quotaSaveInterval) clearInterval(quotaSaveInterval);
       await persistQuotaState();
     } catch (err) {
-      // Committed from the moment the display came down and the listener
-      // closed: there is no serving state left to return to, so say what broke
-      // and let the relaunch be the recovery.
-      console.error(`[TeamClaude] Drain failed: ${err.message}`);
+      // Committed from the moment the listener closed: there is no serving
+      // state left to return to, so record what broke and let the relaunch be
+      // the recovery. Read off `err` defensively because throwing HERE is the
+      // one thing the try above cannot absorb, and an unhandled rejection out
+      // of this function is exit 1 — a crash, on the path whose whole purpose
+      // is to come back.
+      failure = /** @type {any} */ (err)?.message || String(err);
+    } finally {
+      // The last thing before the exit, and in a finally because the catch is
+      // not the only way out of the block above.
+      restoreTerminal();
     }
+    // After the restore, so it lands on the screen the relaunch comes back to
+    // rather than in a log pane that goes with the alternate screen.
+    if (failure) console.error(`[TeamClaude] Drain failed: ${failure}`);
     process.exit(RESTART_EXIT_CODE);
   }
 

package/src/sync-accounts.js

@@ -94,6 +94,11 @@ export async function syncAccountsFromDisk(diskConfig, memConfig, accountManager
     }
     if (diskAcct.name && mgr.name !== diskAcct.name) mgr.name = diskAcct.name;
     if (diskAcct.priority != null && mgr.priority !== diskAcct.priority) mgr.priority = diskAcct.priority;
+    // A list position edited on disk applies on reload for the same reason a
+    // priority edit does, and `null` rather than `??` so deleting the field
+    // puts the account back among the unplaced instead of leaving it stuck at
+    // the position it last held. Display only — see makeAccount.
+    mgr.displayOrder = Number.isFinite(diskAcct.displayOrder) ? diskAcct.displayOrder : null;
     // A cap edit applies live for the same reason priority does: it is an
     // operator decision about a running fleet, and waiting for a restart to
     // honour a budget defeats the budget.

package/src/terminal-title.js

@@ -1,5 +1,5 @@
 // Reflect the active account and the running build in the terminal title (e.g.
-// "teamclaude 2/4 work 1.1.20-rik.11"), so a backgrounded or tabbed
+// "teamclaude 2/4 work 1.1.20-rik.12+acc19b3"), so a backgrounded or tabbed
 // `teamclaude server` is glanceable without switching to it. Pure/side-effect-
 // free here so it can be unit-tested; the caller owns the TTY gate and the
 // interval.
@@ -32,9 +32,13 @@ function truncate(s, max) {
 export function formatTerminalTitle({ index = 0, total = 0, name = null, version = null } = {}) {
   const pos = total > 0 ? `${index + 1}/${total}` : '0/0';
   const who = name ? ` ${truncate(name, 24)}` : '';
-  // Bounded like the account name, for the same reason: a tab strip gives a
-  // title a few dozen columns at best, and neither string was chosen here.
-  const build = version ? ` ${truncate(version, 20)}` : '';
+  // Bounded like the account name, at the same width and for the same reason: a
+  // tab strip gives a title a few dozen columns at best, and neither string was
+  // chosen here. 24 rather than 20 because a checkout names both halves of what
+  // it runs — `1.1.20-rik.12+acc19b3`, 21 columns — and cutting that at 20 ends
+  // the title in half a sha, which names no commit while reading like it does.
+  // A label still long enough to be cut at 24 was never one of ours.
+  const build = version ? ` ${truncate(version, 24)}` : '';
   return `teamclaude ${pos}${who}${build}`;
 }
 

package/src/tui.js

@@ -213,15 +213,27 @@ const BAR_MAX = 20;
 // terminal lays the table out exactly as it did before the column could grow.
 const NAME_MIN = 12;
 
-// Clear space the version label needs on each side before it is drawn at all.
-// Below that it reads as a collision with the title or the port block.
-const HEAD_GAP = 2;
-
 // Narrowest label still worth drawing: an ellipsis and three columns of build.
-// Under that the header goes back to naming no build at all, which at those
+// Under that the footer goes back to naming no build at all, which at those
 // widths is the honest answer.
 const HEAD_LABEL_MIN = 4;
 
+// Clear space the footer keeps between the last key hint and the build label.
+// Any closer and the label reads as one more hint, which is the one thing it
+// must not look like — there is no key that does it.
+const FOOT_GAP = 2;
+
+// Where an account sits in the list the operator arranged — the sort key behind
+// _displayOrder, written by _doMoveAccount and by nothing else.
+//
+// An account with no `displayOrder` has never been placed: every account on a
+// config that predates the field, and every account added since the last
+// arrangement. Those sort after every account that has one, which is where a
+// new account already appeared back when this list was raw array order — so
+// the answer to "where does the one I just logged in with go" does not change
+// with the feature, and there is nothing to migrate.
+const listRank = (/** @type {any} */ a) => (Number.isFinite(a?.displayOrder) ? a.displayOrder : Infinity);
+
 // Which pair of bars a row draws: the subscription buckets (Ses/Wk, plus the
 // S7/F7 family bars) when any unified reading exists, else the metered Tok/Req
 // pair an API-key account reports. The account row budget is drawn per
@@ -287,19 +299,31 @@ export function fitLine(s, w) {
 
 /** The build label at `max` columns, or '' when nothing legible fits.
  *
- *  Cut from the LEFT, unlike every other truncation here, because what tells
- *  one build from the next is its tail: `…rik.11` still identifies the build,
- *  `1.1.2…` identifies the three before it just as well. Sliced by code unit
- *  against a display-width budget — a version or a sha is ASCII, and a label
- *  arriving over the wire is measured again by the caller before it is placed,
- *  so a wide glyph costs the label its slot rather than the header its width.
+ *  Build metadata is spent before anything is cut. A checkout labels itself
+ *  `<version>+<sha>`, and of the two it is the version the footer is read for;
+ *  the sha only says which build of it. Shortening the sha instead would be
+ *  worse than losing it — four hex digits name no commit, and are read as if
+ *  they did.
+ *
+ *  What is left is cut from the LEFT, unlike every other truncation here,
+ *  because what tells one build from the next is its tail: `…rik.11` still
+ *  identifies the build, `1.1.2…` identifies the three before it just as well.
+ *  Sliced by code unit against a display-width budget — a version or a sha is
+ *  ASCII, and a label arriving over the wire is measured again by the caller
+ *  before it is placed, so a wide glyph costs the label its slot rather than
+ *  the footer its width.
  *  @param {string} label
  *  @param {number} max */
 export function fitHeadLabel(label, max) {
-  const w = vw(label);
-  if (max >= w) return label;
+  if (max >= vw(label)) return label;
+  // Everything after the last `+` is semver build metadata, which is by
+  // definition not the identity — so it is what gets spent first. `> 0` keeps a
+  // label that is nothing but metadata from being spent down to nothing.
+  const plus = label.lastIndexOf('+');
+  const bare = plus > 0 ? label.slice(0, plus) : label;
+  if (max >= vw(bare)) return bare;
   if (max < HEAD_LABEL_MIN) return '';
-  return `…${label.slice(label.length - (max - 1))}`;
+  return `…${bare.slice(bare.length - (max - 1))}`;
 }
 
 function formatReset(resetTs) {
@@ -478,7 +502,7 @@ export class TUI {
     this.mode = 'normal';    // normal | select | add | input | settings | pick
     this.pick = null;        // active list picker (routes editor accounts/bucket/color)
     this.pickReturn = 'routes'; // mode to fall back to when the picker closes
-    this.selAction = null;   // switch | remove | toggle
+    this.selAction = null;   // switch | remove | toggle | reorder
     this.selIdx = 0;
     this.selRoute = null;    // in switch mode: null = global default, else a getRoutes() entry to pin
     this.selReturn = 'normal'; // mode to fall back to when select mode closes
@@ -492,6 +516,15 @@ export class TUI {
     this.frame = 0;
     this.running = false;
     this.timer = null;
+    // Set while THIS PROCESS is draining to be relaunched: when the wait
+    // started, what bounds it, and how to ask how much is still running.
+    // Deliberately not named `draining`: the header's `drain N` marker and the
+    // account manager's drainingCount() are SESSION draining — sessions being
+    // moved off an account during a rotation — and the two have nothing to do
+    // with each other. One is a request finishing somewhere else; this one is
+    // the process going away.
+    /** @type {{ startedAt: number, deadlineMs: number, inFlight: () => number }|null} */
+    this._restartDrain = null;
     // Injectable so a test can drive the repaint tick by hand instead of
     // sleeping through real 500ms/5s intervals.
     this._setTimeout = setTimeout;
@@ -570,8 +603,11 @@ export class TUI {
     this._scheduleTick();
   }
 
-  /** Fast while something is animating, slow when there is nothing to animate. */
-  _tickDelay() { return this.active.size > 0 ? SPIN_MS : IDLE_TICK_MS; }
+  /** Fast while something is animating, slow when there is nothing to animate.
+   *  A restart drain counts as animating: an idle tick is five seconds, and an
+   *  elapsed counter that moves once every five of them reads as a frozen
+   *  screen — which is the complaint keeping the display up exists to answer. */
+  _tickDelay() { return (this.active.size > 0 || this._restartDrain) ? SPIN_MS : IDLE_TICK_MS; }
 
   _scheduleTick() {
     if (!this.running) return;
@@ -626,6 +662,28 @@ export class TUI {
     process.stdin.pause();
   }
 
+  /**
+   * The server has begun draining to be relaunched: its listener is closed and
+   * it is waiting out the requests still running before it exits on 75.
+   *
+   * The display stays up for all of it, and this is what puts the drain on it.
+   * The wait is up to 30 seconds the operator asked for by pressing `u`, and
+   * the two things they want from it — how long it has run, and what is still
+   * holding it — are already here. The dashboard used to come down first, so
+   * the answer to both was a blank console for the duration.
+   *
+   * There is no matching "ended": the process exits at the end of the drain,
+   * and stop() is what takes the screen back (index.js, immediately before the
+   * exit and on every abrupt way out of one).
+   *
+   * @param {{ deadlineMs: number, inFlight: () => number }} drain
+   */
+  restartDrainStarted({ deadlineMs, inFlight }) {
+    this._restartDrain = { startedAt: Date.now(), deadlineMs, inFlight };
+    this._retick();   // idle cadence → something to animate again
+    if (this.running) this.render();
+  }
+
   // A title lookup costs a directory scan and a file read, so it stays off the
   // render path: this returns what is cached and schedules the rest.
   _sessionTag(sid) {
@@ -702,6 +760,17 @@ export class TUI {
   _key(k) {
     if (k === 'ctrl-c') { this.stop(); this.onQuit?.(); return; }
 
+    // Draining to a restart: the listener is closed and this process is on its
+    // way out, so switching, disabling, probing, syncing or editing anything
+    // would act on state that is about to be discarded, and `u` is already
+    // running. Ctrl-c above stays the one key that means something — the escape
+    // from the wait — and the footer says so, which is why nothing is logged
+    // for the rest: a line per keypress would push the drain's own progress out
+    // of the pane. `q` is not an exception on purpose. An unattended restart
+    // can begin while the operator is typing into a prompt, and a letter key
+    // that quietly became "quit" is a poor way to find that out.
+    if (this._restartDrain) return;
+
     switch (this.mode) {
       case 'normal': this._keyNormal(k); break;
       case 'select': this._keySelect(k); break;
@@ -843,6 +912,18 @@ export class TUI {
       });
     }
 
+    // Two rows is the least that can be arranged. Below that the row would open
+    // a screen on which no key does anything.
+    if (this._displayOrder().length > 1) {
+      fields.push({
+        id: 'orderAccounts',
+        label: 'Reorder accounts',
+        hint: 'Enter to arrange',
+        value: () => dim('—'),
+        enter: () => { this.mode = 'select'; this.selAction = 'reorder'; this.selIdx = this._displayOrder()[0] ?? 0; this.selReturn = 'settings'; },
+      });
+    }
+
     fields.push({
       id: 'upstreamProxy',
       label: 'Upstream proxy',
@@ -1006,11 +1087,22 @@ export class TUI {
     // can only ask for the default account — leaves these keys alone.
     else if ((k === 'tab' || k === 'right') && this.selAction === 'switch' && !this.remote) this._cycleSelRoute(+1);
     else if (k === 'left' && this.selAction === 'switch' && !this.remote) this._cycleSelRoute(-1);
+    // ←→ in reorder mode move the ACCOUNT, not the cursor. ↑↓ already walk the
+    // rows, so this is the pair left over, and ←→ is what "change the thing the
+    // cursor is on" already means on the settings screen this is opened from.
+    // The cursor does not move with the key: `selIdx` names the account being
+    // dragged, and the row it marks travels with it.
+    else if ((k === 'left' || k === 'h') && this.selAction === 'reorder') this._doMoveAccount(-1);
+    else if ((k === 'right' || k === 'l') && this.selAction === 'reorder') this._doMoveAccount(+1);
     else if (k === 'enter') {
       if (this.selAction === 'switch') {
         this._doSwitchSelection();
       } else if (this.selAction === 'toggle') {
         this._doToggleDisabled(this.selIdx);
+      } else if (this.selAction === 'reorder') {
+        // Every move has already been saved, so Enter only means "done" — and
+        // it has to be caught here, ahead of the remove branch below, which is
+        // what an unlisted action falls into.
       } else {
         this._doRemove(this.selIdx);
       }
@@ -1157,12 +1249,15 @@ export class TUI {
 
   // `u`: pick up a new build now instead of waiting for the next lull. The
   // server owns what happens next — it drains, then exits asking to be
-  // relaunched — and it stops this TUI first, so the line below is on screen
-  // only for the instant before the display goes and the drain reports itself
-  // in plain text.
+  // relaunched — and it now keeps this TUI up for the whole drain, which is
+  // where the progress goes (restartDrainStarted, and the footer). Its own
+  // "draining, up to 30s" line lands in the pane beside the counter, so there
+  // is nothing left for this to announce.
+  //
+  // A second `u` is not a second restart: the server guards on its own flag and
+  // would do nothing at all, so a log line here would be a claim that it had.
   _doRestart() {
-    if (!this.onRestart) return;
-    this._addLog('Draining before restart...');
+    if (!this.onRestart || this._restartDrain) return;
     this.onRestart();
   }
 
@@ -1421,6 +1516,50 @@ export class TUI {
     this._addLog(`${next ? 'Disabled' : 'Enabled'} account "${acct.name}"`);
   }
 
+  /** Move the selected account `delta` rows through the list as drawn.
+   *
+   *  The array is NOT permuted. `selIdx` is a manager index, and so are route
+   *  pins, session pins, `currentIndex`, `TC_ACCT` and the disable/switch CLI
+   *  paths — reordering `am.accounts` would silently repoint every one of them
+   *  at a different account. So the rows are sorted by a field instead and each
+   *  account keeps the slot it has held since startup.
+   *
+   *  It is not `priority` either. That field is rotation preference and only
+   *  one account in a fleet usually carries a non-default value — a
+   *  deliberately deprioritised local backend, say. Deriving it from where a
+   *  row sits on screen would re-rank the fleet as a side effect of tidying the
+   *  display, which is a routing change nobody asked for.
+   *
+   *  Every displayed account is renumbered from its new position rather than
+   *  only the two that moved: before the first move there are no numbers to
+   *  insert between, and a dense 0..n-1 is the form that reads in a hand-edited
+   *  config. Local backends are excluded throughout — _displayOrder filters
+   *  them out before this ever sees them, so they hold no position and their
+   *  array slots are simply skipped over.
+   *
+   *  @param {number} delta  rows to travel: -1 up the list, +1 down it
+   */
+  async _doMoveAccount(delta) {
+    const order = this._displayOrder();
+    const from = order.indexOf(this.selIdx);
+    const to = from + delta;
+    if (from < 0 || to < 0 || to >= order.length) return; // already at the end it was pushed against
+    order.splice(to, 0, ...order.splice(from, 1));
+    order.forEach((/** @type {number} */ mgrIdx, /** @type {number} */ pos) => {
+      this.am.accounts[mgrIdx].displayOrder = pos;
+      // Onto this account's own entry: a manager index is not a config index
+      // (account-pairing.js), and an account whose entry the config no longer
+      // holds keeps its position on screen with nothing to persist.
+      const cfgIdx = configIndexFor(this.config.accounts, this.am.accounts, mgrIdx);
+      if (cfgIdx >= 0) this.config.accounts[cfgIdx].displayOrder = pos;
+    });
+    // Nothing is logged on success. The row visibly moves, which is the whole
+    // feedback a drag needs, and a held arrow key would otherwise push the
+    // activity pane out from under the list being arranged.
+    try { await this.saveConfig(this.config); }
+    catch (/** @type {any} */ e) { this._addLog(`Failed to save: ${e.message}`); }
+  }
+
   // ── rendering ──────────────────────────────────────
 
   render({ force = false } = {}) {
@@ -1505,44 +1644,15 @@ export class TUI {
     // mode): what is on screen is the last snapshot, not the current state.
     const live = this.am.connected === false ? red('▼') : green('▲');
     const right = `${sessStr}Port ${port} ${live} `;
-    // In attach mode the dashboard names the server's build, not this process's,
-    // so the account manager's answer wins. It arrives sanitized (applyStatus)
-    // and starts empty, which keeps the label hidden until the first poll rather
-    // than briefly showing the local checkout's version as if it were the
-    // server's. A local AccountManager has neither property.
-    const label = this.am.versionLabel ?? this.versionLabel;
-    const upd = this.am.updateAvailable ?? this.updateAvailable;
-    const lw = vw(left), rw = vw(right);
-    // Columns left between the two blocks, and what the label may take of them.
-    // The marker is budgeted before the label is cut, so a shortened label and
-    // its marker still fit the room they were measured against.
-    const room = W - lw - rw;
-    const markerW = upd ? 2 : 0;
-    const text = label ? fitHeadLabel(label, room - 2 * HEAD_GAP - markerW) : '';
-    const mid = text ? dim(text) + (upd ? ` ${green('▲')}` : '') : '';
-    const mw = vw(mid);
-    // Centred on the line, not in the gap between the two blocks, so the label
-    // holds still as the session segment comes and goes.
-    const start = Math.floor((W - mw) / 2);
-    // Load-bearing, not cosmetic: both padding runs below would be negative
-    // without it, and ' '.repeat(-1) throws. Satisfying it also means the mid
-    // branch can never produce the over-wide line the other branch can, so the
-    // two are not interchangeable.
-    const midFits = mw > 0 && start - lw >= HEAD_GAP && (W - rw) - (start + mw) >= HEAD_GAP;
-    // Line-centring is a position, not a fit. The two blocks are different
-    // widths, so a label small enough for the gap can still be pushed inside
-    // one of them by where the centre of the LINE falls — and that, not width,
-    // is what used to drop the label every time the session segment grew,
-    // leaving a header that silently stopped naming the build it exists to
-    // name. Centre it in the GAP instead, which is exact by construction: the
-    // two runs below sum to `room`. The label moves when sessions come and go,
-    // which is the price; being able to read it is what that buys.
-    const gapPad = mw > 0 && room - mw >= 2 * HEAD_GAP ? Math.floor((room - mw) / 2) : -1;
-    lines.push(midFits
-      ? left + ' '.repeat(start - lw) + mid + ' '.repeat(W - rw - start - mw) + right
-      : gapPad >= 0
-        ? left + ' '.repeat(gapPad) + mid + ' '.repeat(room - mw - gapPad) + right
-        : left + ' '.repeat(Math.max(1, W - lw - rw)) + right);
+    // Title, padding, port block — and nothing between them. The build this
+    // checkout runs is named once, in the corner of the footer.
+    //
+    // That padding run is the whole of the line's arithmetic now, and it is
+    // floored rather than trusted: a wide session segment on a narrow terminal
+    // can leave the two blocks alone wider than the line, and ' '.repeat(-1)
+    // throws. There the header overruns and fitLine takes its tail, as it has
+    // since long before there was a label to lose.
+    lines.push(left + ' '.repeat(Math.max(1, W - vw(left) - vw(right))) + right);
     lines.push(' ' + dim('─'.repeat(W - 2)));
 
     const footerH = 2;
@@ -1712,7 +1822,7 @@ export class TUI {
 
     // ── Footer
     lines.push(' ' + dim('─'.repeat(W - 2)));
-    lines.push(this._renderFooter());
+    lines.push(this._renderFooter(W));
 
     // Write buffer
     let buf = `${ESC}H`;
@@ -1738,11 +1848,21 @@ export class TUI {
    *  Display only. `selIdx`, `currentIndex`, session pins and route entries all
    *  stay manager indices, so nothing about selection or routing moves with the
    *  rows — see _keySelect, which walks this order but still stores an index.
+   *
+   *  Which is also why the operator's arrangement is a sort key and not a
+   *  permutation of `am.accounts`: see _doMoveAccount.
    */
   _displayOrder() {
     return this.am.accounts
       .map((/** @type {any} */ _, /** @type {number} */ i) => i)
-      .filter(i => !isLocalUpstream(this.am.accounts[i]));
+      .filter(i => !isLocalUpstream(this.am.accounts[i]))
+      .sort((/** @type {number} */ a, /** @type {number} */ b) => {
+        const ra = listRank(this.am.accounts[a]);
+        const rb = listRank(this.am.accounts[b]);
+        // Infinity !== Infinity is false, so two unplaced accounts fall through
+        // to the index rather than subtracting to NaN.
+        return ra === rb ? a - b : ra - rb;
+      });
   }
 
   /** Manager indices of the local backends, in config order. */
@@ -1992,9 +2112,10 @@ export class TUI {
     lines.push(row(byId('blocklist')));
     lines.push('');
     // ── Accounts
-    lines.push(bold('  Accounts') + dim('  — add (import / API key) or remove an account'));
+    lines.push(bold('  Accounts') + dim('  — add (import / API key), remove, or set the order they list in'));
     lines.push(row(byId('addAccount')));
     if (byId('removeAccount')) lines.push(row(byId('removeAccount')));
+    if (byId('orderAccounts')) lines.push(row(byId('orderAccounts')));
     lines.push('');
     // ── Network
     // Drawn before the sx.org block, which returns early when sx is unavailable:
@@ -2317,7 +2438,26 @@ export class TUI {
     }
   }
 
-  _renderFooter() {
+  /** The footer line: the mode's key hints from the left, the build label set
+   *  against the right edge.
+   *  @param {number} [W]  columns to compose against */
+  _renderFooter(W = process.stdout.columns || 80) {
+    // A restart drain outranks every mode: the keys this line would otherwise
+    // advertise are all refused while one runs (see _key), and how far the
+    // drain has got is the only thing on screen worth the row.
+    //
+    // It is also the one footer drawn without the build label or its update
+    // marker. The line lives for at most the deadline, the build cannot change
+    // under it, and when the restart is an update the label names the build
+    // being replaced and the marker points at the thing already happening — so
+    // those columns go to the escape hatch, which is what the line is read for.
+    if (this._restartDrain) return this._restartDrainFooter(this._restartDrain, W);
+    return this._footerWithVersion(this._footerHints(), W);
+  }
+
+  /** What the keyboard does on the screen the operator is looking at. Composed
+   *  without regard to width: fitting it to the line is _renderFooter's job. */
+  _footerHints() {
     switch (this.mode) {
       case 'normal':
         return this.remote
@@ -2343,6 +2483,12 @@ export class TUI {
             : 'default';
           return ` ${dim('↑↓')} select  ${dim('←→')} target: ${target}  ${bold('Enter')} pin  ${bold('Esc')} cancel`;
         }
+        // Both keys leave, because each move has already been saved: there is
+        // no pending change for one to commit and the other to throw away, and
+        // offering "cancel" would promise an undo this screen does not have.
+        if (this.selAction === 'reorder') {
+          return ` ${dim('↑↓')} select  ${dim('←→')} move  ${bold('Enter')}/${bold('Esc')} done`;
+        }
         const act = this.selAction === 'toggle' ? 'enable/disable' : 'remove';
         return ` ${dim('↑↓')} select  ${bold('Enter')} ${act}  ${bold('Esc')} cancel`;
       }
@@ -2354,4 +2500,79 @@ export class TUI {
         return '';
     }
   }
+
+  /**
+   * `hints` with the build label — and, when one is waiting, an update marker —
+   * set against the right edge of a W-column line. This is the only place the
+   * display names either: the header carries its title and the port block and
+   * nothing else.
+   *
+   * Composed to exactly W, never less. The paint loop pads every short line out
+   * to the terminal width and truncates the tail of every long one (fitLine), so
+   * a label merely appended is pushed out of the corner it was put in, and a
+   * line built past W has that same corner eaten. Both failures are silent, and
+   * both look like the label was never drawn at all.
+   *
+   * The hints are never cut to make room. They are the only thing on this line
+   * that says what the keyboard does: a build the operator cannot read costs
+   * them nothing, a key they cannot read costs them the screen. So the label is
+   * fitted to whatever the hints leave over — fitHeadLabel spends the build sha
+   * first and then the head of the version — and it is dropped whole when what
+   * is left will not carry it.
+   *
+   * @param {string} hints
+   * @param {number} W
+   */
+  _footerWithVersion(hints, W) {
+    // In attach mode the dashboard names the server's build, not this
+    // process's, so the account manager's answer wins for both. It arrives
+    // sanitized (applyStatus) and starts empty, which keeps the corner blank
+    // until the first poll rather than briefly naming the local checkout as if
+    // it were the server's. A local AccountManager has neither property.
+    // `??` on purpose: '' is that deliberate blank, not a miss.
+    const label = this.am.versionLabel ?? this.versionLabel;
+    const upd = this.am.updateAvailable ?? this.updateAvailable;
+    // The marker rides with the label and is never drawn without it. Alone in
+    // the corner a bare glyph names nothing it could be an update TO, and reads
+    // as one more key hint — the one thing this end of the line must not look
+    // like. It would also be the wrong answer for an attached dashboard that
+    // has not polled yet: no server label, but this process's update flag.
+    if (!label) return hints;
+    const hw = vw(hints);
+    // Budgeted before the label is cut, so a shortened label and its marker
+    // still fit the room they were measured against.
+    const markerW = upd ? 2 : 0;
+    // One column of margin at the edge — what the rule under the header and
+    // the header's port block both leave.
+    const text = fitHeadLabel(label, W - hw - FOOT_GAP - markerW - 1);
+    if (!text) return hints;
+    const marker = upd ? ` ${green('▲')}` : '';
+    return `${hints}${' '.repeat(W - hw - vw(text) - markerW - 1)}${dim(text)}${marker} `;
+  }
+
+  /**
+   * The footer while this process drains to a restart: how long the wait has
+   * run against the bound it cannot exceed, what is still holding it, and the
+   * way out of it.
+   *
+   * Elapsed against the deadline, not a countdown. The drain ends when the last
+   * request does, which is usually long before 30s, so a number counting down
+   * to a moment that will not arrive would be the wrong kind of wrong — worse
+   * than one counting up to a bound that may never be reached.
+   *
+   * Whole seconds: the frame is composed twice a second while a drain runs, and
+   * tenths would buy a full repaint every time for a digit nobody reads.
+   *
+   * Cut by dropping a whole clause rather than by leaving it to fitLine, which
+   * truncates the tail — and at 40 columns the tail is the escape hatch.
+   *
+   * @param {{ startedAt: number, deadlineMs: number, inFlight: () => number }} drain
+   * @param {number} W
+   */
+  _restartDrainFooter(drain, W) {
+    const secs = Math.max(0, Math.round((Date.now() - drain.startedAt) / 1000));
+    const state = `${yellow('Restarting')}  ${secs}s/${Math.round(drain.deadlineMs / 1000)}s  ${drain.inFlight()} in flight`;
+    const lines = [` ${state}  ${dim('ctrl-c to go now')}`, ` ${state}`];
+    return lines.find(line => vw(line) <= W) ?? lines[lines.length - 1];
+  }
 }

package/src/updater.js

@@ -44,9 +44,22 @@ export function currentVersion(root = packageRoot()) {
 
 /**
  * How the running copy identifies itself, for display: the exact tag when the
- * checkout sits on one, else the short sha, else the shipped package.json
- * version, else the literal `local`. `git` reports a checkout — npm cannot
- * update one, so nothing should offer to.
+ * checkout sits on one, else the package.json version joined to the short sha,
+ * else whichever of those two is readable, else the literal `local`. `git`
+ * reports a checkout — npm cannot update one, so nothing should offer to.
+ *
+ * A checkout needs both halves. The sha is here because package.json alone
+ * cannot tell a published release from a local tarball built out of it, so the
+ * sha is what marks a checkout at a glance. But it answers "which commit", and
+ * the question asked after a restart is "which build" — which a sha never
+ * answers, and which is the whole reason this label exists. The two are joined
+ * with `+`, semver's build metadata, because that is precisely what the sha is:
+ * the same version, pinned to the build that produced it. It also tells a
+ * caller short of columns which end to spend, build metadata being by
+ * definition the part that is not the identity.
+ *
+ * A tag still wins outright, and alone: it names a release and a commit at
+ * once, so appending the sha to it would say the same thing twice.
  *
  * The git calls are pinned to the package root. `teamclaude server` is started
  * from the operator's own project directory, and resolving against the process
@@ -59,18 +72,22 @@ export function currentVersion(root = packageRoot()) {
  */
 export async function resolveVersionLabel({ root = packageRoot(), exec = pexec } = {}) {
   const git = existsSync(join(root, '.git'));
+  const version = currentVersion(root);
   if (git) {
     /** @type {{ cwd: string, encoding: 'utf8', timeout: number }} */
     const opts = { cwd: root, encoding: 'utf8', timeout: 2000 };
-    const probes = [['describe', '--tags', '--exact-match', 'HEAD'], ['rev-parse', '--short', 'HEAD']];
-    for (const args of probes) {
+    /** @param {string[]} args */
+    const ask = async (args) => {
       try {
-        const label = safeLine((await exec('git', args, opts)).stdout, LABEL_MAX);
-        if (label) return { label, git };
-      } catch { /* not on a tag, a shallow or broken checkout, or no git binary */ }
-    }
+        return safeLine((await exec('git', args, opts)).stdout, LABEL_MAX);
+      } catch { return ''; /* not on a tag, a shallow or broken checkout, or no git binary */ }
+    };
+    const tag = await ask(['describe', '--tags', '--exact-match', 'HEAD']);
+    if (tag) return { label: tag, git };
+    const sha = await ask(['rev-parse', '--short', 'HEAD']);
+    if (sha) return { label: safeLine(version ? `${version}+${sha}` : sha, LABEL_MAX), git };
   }
-  return { label: safeLine(currentVersion(root) || 'local', LABEL_MAX), git };
+  return { label: safeLine(version || 'local', LABEL_MAX), git };
 }
 
 /** Numeric compare of x.y.z, then the pre-release tail. >0 if a is newer.