diff --git a/apps/desktop/src/app/chat/composer/controls.test.tsx b/apps/desktop/src/app/chat/composer/controls.test.tsx new file mode 100644 index 000000000000..a2186622690f --- /dev/null +++ b/apps/desktop/src/app/chat/composer/controls.test.tsx @@ -0,0 +1,79 @@ +import { cleanup, fireEvent, render, screen } from '@testing-library/react' +import { afterEach, describe, expect, it, vi } from 'vitest' + +import type { ChatBarState } from '@/app/chat/composer/types' +import { I18nProvider } from '@/i18n' + +import { ComposerControls } from './controls' + +vi.mock('./model-pill', () => ({ ModelPill: () => null })) + +const state: ChatBarState = { + model: { canSwitch: false, model: '', provider: '' }, + tools: { enabled: false, label: '' }, + voice: { active: false, enabled: false } +} + +function renderControls(overrides: Partial> = {}) { + return render( + + + + ) +} + +async function expectShortcutTooltip(label: string, shortcut: string) { + fireEvent.pointerMove(screen.getByLabelText(label), { pointerType: 'mouse' }) + + const tooltip = await screen.findByRole('tooltip') + + expect(tooltip.textContent).toContain(label) + expect(tooltip.textContent).toContain(shortcut) +} + +afterEach(() => { + cleanup() +}) + +describe('ComposerControls shortcut tooltips', () => { + it('shows Enter for Send', async () => { + renderControls() + + await expectShortcutTooltip('Send', '↵') + }) + + it('shows Ctrl+Enter for Steer', async () => { + renderControls({ busy: true, busyAction: 'steer' }) + + await expectShortcutTooltip('Steer the current run', 'Ctrl+↵') + }) + + it('shows Enter for Queue', async () => { + renderControls({ busy: true, busyAction: 'queue' }) + + await expectShortcutTooltip('Queue message', '↵') + }) +}) diff --git a/apps/desktop/src/app/chat/composer/controls.tsx b/apps/desktop/src/app/chat/composer/controls.tsx index 6f1526c00514..432e0a6ead47 100644 --- a/apps/desktop/src/app/chat/composer/controls.tsx +++ b/apps/desktop/src/app/chat/composer/controls.tsx @@ -1,6 +1,6 @@ import { Button } from '@/components/ui/button' import { Codicon } from '@/components/ui/codicon' -import { Tip } from '@/components/ui/tooltip' +import { Tip, TipKeybindLabel } from '@/components/ui/tooltip' import { useI18n } from '@/i18n' import { triggerHaptic } from '@/lib/haptics' import { AudioLines, iconSize, Layers3, Loader2, Square, SteeringWheel, Volume2, VolumeX } from '@/lib/icons' @@ -81,7 +81,7 @@ export function ComposerControls({ {busyAction === 'steer' ? ( - + }>