refactor(ui): consolidate sidebar selector shortcut hints

packages/ui/src/components/agent-selector.tsx

@@ -5,7 +5,6 @@ import { ChevronDown } from "lucide-solid"
 import type { Agent } from "../types/session"
 import { useI18n } from "../lib/i18n"
 import { getLogger } from "../lib/logger"
-import Kbd from "./kbd"
 const log = getLogger("session")
 
 
@@ -113,9 +112,6 @@ export default function AgentSelector(props: AgentSelectorProps) {
               )}
             </Select.Value>
           </div>
-          <span class="selector-trigger-hint selector-trigger-hint--top" aria-hidden="true">
-            <Kbd shortcut="cmd+shift+a" />
-          </span>
           <Select.Icon class="selector-trigger-icon">
             <ChevronDown class="w-3 h-3" />
           </Select.Icon>

packages/ui/src/components/instance/instance-shell2.tsx

@@ -936,6 +936,12 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
                 />
 
                 <ThinkingSelector instanceId={props.instance.id} currentModel={activeSession().model} />
+
+                <div class="session-sidebar-selector-hints" aria-hidden="true">
+                  <Kbd shortcut="cmd+shift+a" />
+                  <Kbd shortcut="cmd+shift+m" />
+                  <Kbd shortcut="cmd+shift+t" />
+                </div>
               </div>
             </>
           )}

packages/ui/src/components/model-selector.tsx

@@ -6,7 +6,6 @@ import type { Model } from "../types/session"
 import { useI18n } from "../lib/i18n"
 import { getLogger } from "../lib/logger"
 import { preferences, toggleFavoriteModelPreference } from "../stores/preferences"
-import Kbd from "./kbd"
 const log = getLogger("session")
 
 
@@ -295,15 +294,12 @@ export default function ModelSelector(props: ModelSelectorProps) {
               <span class="selector-trigger-primary selector-trigger-primary--align-left">
                 {t("modelSelector.trigger.primary", { model: currentModelValue()?.name ?? t("modelSelector.none") })}
               </span>
-              {currentModelValue() && (
+          {currentModelValue() && (
                 <span class="selector-trigger-secondary">
                   {currentModelValue()!.providerId}/{currentModelValue()!.id}
                 </span>
               )}
             </div>
-            <span class="selector-trigger-hint selector-trigger-hint--top" aria-hidden="true">
-              <Kbd shortcut="cmd+shift+m" />
-            </span>
             <Combobox.Icon class="selector-trigger-icon">
               <ChevronDown class="w-3 h-3" />
             </Combobox.Icon>

packages/ui/src/components/thinking-selector.tsx

@@ -5,7 +5,6 @@ import { ChevronDown } from "lucide-solid"
 import { getLogger } from "../lib/logger"
 import { getModelThinkingSelection, setModelThinkingSelection } from "../stores/preferences"
 import { useI18n } from "../lib/i18n"
-import Kbd from "./kbd"
 
 const log = getLogger("session")
 
@@ -93,9 +92,6 @@ export default function ThinkingSelector(props: ThinkingSelectorProps) {
             <div class="selector-trigger-label selector-trigger-label--stacked flex-1 min-w-0">
               <span class="selector-trigger-primary selector-trigger-primary--align-left">{triggerPrimary()}</span>
             </div>
-            <span class="selector-trigger-hint" aria-hidden="true">
-              <Kbd shortcut="cmd+shift+t" />
-            </span>
             <Combobox.Icon class="selector-trigger-icon">
               <ChevronDown class="w-3 h-3" />
             </Combobox.Icon>

packages/ui/src/styles/panels.css

@@ -132,6 +132,13 @@
   color: var(--text-muted);
 }
 
+.session-sidebar-selector-hints {
+  @apply flex flex-wrap items-center w-full text-xs;
+  justify-content: space-evenly;
+  gap: 4px;
+  color: var(--text-muted);
+}
+
 .session-header-hints {
   @apply flex-shrink-0;
 }
@@ -482,4 +489,3 @@
   border-color: var(--border-base);
   background-color: var(--surface-secondary);
 }
-