redesign console page

src/components/shell/AssistantPanel.tsx

@@ -1,5 +1,6 @@
 import { useRef, useState } from 'react';
 import { useLocation } from 'react-router-dom';
+import { useAssistantScope } from './assistantScope';
 import { ArrowUp, History, Maximize2, Minimize2, PanelRightClose } from 'lucide-react';
 import {
   DEFAULT_WIDTH,
@@ -146,7 +147,17 @@ export function AssistantPanel({
   const [isDragging, setDragging] = useState(false);
 
   const key = Object.keys(CONTEXT).find((entry) => pathname.startsWith(entry));
-  const context = (key ? CONTEXT[key] : undefined) ?? FALLBACK;
+  const routeContext = (key ? CONTEXT[key] : undefined) ?? FALLBACK;
+
+  /**
+   * The heading follows the branch in view.
+   *
+   * A panel headed "Across your branches" sitting above a board showing one
+   * shop is a promise about scope that the page has already broken. Only the
+   * title moves; everything else about Buddy is untouched.
+   */
+  const scopeLabel = useAssistantScope();
+  const context = scopeLabel ? { ...routeContext, title: scopeLabel } : routeContext;
 
   /**
    * Three widths, in priority order: stacked (the phone layout owns it),