alihan/humanlayer
1
0
Fork 0
mirror of https://github.com/humanlayer/humanlayer.git synced 2025-08-20 19:01:22 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat(wui): add keyboard shortcuts indicator to status bar

Browse Source 
Adds a help icon button to the status bar that opens the keyboard shortcuts
panel, improving discoverability of the existing '?' hotkey functionality.
The button displays a tooltip indicating it shows keyboard shortcuts and
maintains consistent styling with other status bar buttons.

Fixes #449
This commit is contained in:
Steve Morin
2025-08-19 00:10:30 -07:00
parent 64a956fae5
commit 02bc512bc8
1 changed files with 18 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
humanlayer-wui/src/components/Layout.tsx
View File

@@ -24,7 +24,7 @@ import { notificationService, type NotificationOptions } from '@/services/Notifi
import { useTheme } from '@/contexts/ThemeContext'
import { formatMcpToolName, getSessionNotificationText } from '@/utils/formatting'
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
import { MessageCircle, Bug } from 'lucide-react'
import { MessageCircle, Bug, HelpCircle } from 'lucide-react'
import { openUrl } from '@tauri-apps/plugin-opener'
import { DebugPanel } from '@/components/DebugPanel'
import { notifyLogLocation } from '@/lib/log-notification'
@@ -456,7 +456,7 @@ export function Layout() {
href="https://github.com/humanlayer/humanlayer/issues/new?title=Feedback%20on%20CodeLayer&body=%23%23%23%20Problem%20to%20solve%20%2F%20Expected%20Behavior%0A%0A%0A%23%23%23%20Proposed%20solution"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center px-1.5 py-0.5 text-sm font-mono border border-border bg-background text-foreground hover:bg-accent/10 transition-colors"
className="inline-flex items-center justify-center px-1.5 py-0.5 text-xs font-mono border border-border bg-background text-foreground hover:bg-accent/10 transition-colors"
>
<MessageCircle className="w-3 h-3" />
</a>
@@ -467,12 +467,27 @@ export function Layout() {
</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger asChild>
<button
onClick={() => setHotkeyPanelOpen(true)}
className="inline-flex items-center justify-center px-1.5 py-0.5 text-xs font-mono border border-border bg-background text-foreground hover:bg-accent/10 transition-colors"
>
<HelpCircle className="w-3 h-3" />
</button>
</TooltipTrigger>
<TooltipContent>
<p className="flex items-center gap-1">
View all keyboard shortcuts <KeyboardShortcut keyString="?" />
</p>
</TooltipContent>
</Tooltip>
{import.meta.env.DEV && (
<Tooltip>
<TooltipTrigger asChild>
<button
onClick={() => setIsDebugPanelOpen(true)}
className="px-1.5 py-0.5 text-xs font-mono border border-border bg-background text-foreground hover:bg-accent/10 transition-colors"
className="inline-flex items-center justify-center px-1.5 py-0.5 text-xs font-mono border border-border bg-background text-foreground hover:bg-accent/10 transition-colors"
>
<Bug className="w-3 h-3" />
</button>