feat(web): add an open-monitoring-column button to the server list

When a server is connected, has monitor screens to show, and the monitoring
column isn't open, show an "open monitoring column" button to the right of the
list expand/collapse toggle on the server list. It reuses PinColumnButton (the
same right-sidebar affordance the monitor screens use, now with an optional
label), so opening the column is reachable from the server list — not only from
a monitor screen's pin button. InspectorView gates it on
`canPin && monitorAvailable.length > 0 && !effectivePinned`.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BrihGWcrM9JGRyu41nzZYw

clients/web/src/components/groups/ServerListControls/ServerListControls.test.tsx

@@ -24,6 +24,31 @@ describe("ServerListControls", () => {
     ).toBeInTheDocument();
   });
 
+  it("hides the open-monitor button unless onOpenMonitor is provided", () => {
+    renderWithMantine(<ServerListControls {...baseProps} serverCount={2} />);
+    expect(
+      screen.queryByRole("button", { name: "Open monitoring column" }),
+    ).toBeNull();
+  });
+
+  it("shows and wires the open-monitor button when onOpenMonitor is provided", async () => {
+    const user = userEvent.setup();
+    const onOpenMonitor = vi.fn();
+    renderWithMantine(
+      <ServerListControls
+        {...baseProps}
+        serverCount={2}
+        onOpenMonitor={onOpenMonitor}
+      />,
+    );
+    const openBtn = screen.getByRole("button", {
+      name: "Open monitoring column",
+    });
+    expect(openBtn).toBeInTheDocument();
+    await user.click(openBtn);
+    expect(onOpenMonitor).toHaveBeenCalledTimes(1);
+  });
+
   it("shows the list toggle alongside Export + Add Servers when servers exist", () => {
     renderWithMantine(<ServerListControls {...baseProps} serverCount={2} />);
     expect(screen.getAllByRole("button")).toHaveLength(3);

clients/web/src/components/groups/ServerListControls/ServerListControls.tsx

@@ -1,5 +1,6 @@
 import { Button, Group } from "@mantine/core";
 import { ListToggle } from "../../elements/ListToggle/ListToggle";
+import { PinColumnButton } from "../../elements/PinColumnButton/PinColumnButton";
 import {
   ServerAddMenu,
   type AddServerMenuProps,
@@ -13,6 +14,12 @@ export interface ServerListControlsProps extends AddServerMenuProps {
   onExport: () => void;
   /** When false (read-only session), the Add menu is hidden. Defaults to true. */
   writable?: boolean;
+  /**
+   * Open the monitoring column. Provided (by the caller) only when a server is
+   * connected, the column can open, and it isn't already shown — otherwise
+   * omitted so the open-sidebar affordance is hidden.
+   */
+  onOpenMonitor?: () => void;
 }
 
 export function ServerListControls({
@@ -24,6 +31,7 @@ export function ServerListControls({
   onImportServerJson,
   onExport,
   writable = true,
+  onOpenMonitor,
 }: ServerListControlsProps) {
   return (
     <Group justify="flex-end">
@@ -40,6 +48,9 @@ export function ServerListControls({
       {serverCount > 0 && (
         <ListToggle compact={compact} onToggle={onToggleList} />
       )}
+      {onOpenMonitor && (
+        <PinColumnButton onPin={onOpenMonitor} label="Open monitoring column" />
+      )}
     </Group>
   );
 }