feat: allow clicking keyboard hints throughout (#266)
* allow clicking keyboard hints * Update js/desktop/src/components/key-hint.tsx Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * nits --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
This commit was merged in pull request #266.
This commit is contained in:
co-authored by
coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
parent
9fd7e611f3
commit
95f2362947
@@ -12,6 +12,7 @@ import {
|
||||
import { useDownloadUrl } from '@/hooks/use-download-url';
|
||||
import { useObjectUrl } from '@/hooks/use-object-url';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { KeyHint } from '@/components/key-hint';
|
||||
import { useSuspendPlayback } from '@/hooks/use-suspend-playback';
|
||||
import { platform } from '@/lib/platform';
|
||||
|
||||
@@ -294,37 +295,46 @@ export function AttachmentLightbox({
|
||||
<div className="absolute bottom-4 left-1/2 flex -translate-x-1/2 items-center gap-4 text-xs text-white/50">
|
||||
{hasMultiple && (
|
||||
<span className="flex items-center gap-1.5">
|
||||
<kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
|
||||
←
|
||||
</kbd>
|
||||
<kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
|
||||
→
|
||||
</kbd>
|
||||
<KeyHint
|
||||
keys="←"
|
||||
onClick={() => goTo(-1)}
|
||||
title="Previous (or press ←)"
|
||||
aria-label="Previous attachment"
|
||||
/>
|
||||
<KeyHint
|
||||
keys="→"
|
||||
onClick={() => goTo(1)}
|
||||
title="Next (or press →)"
|
||||
aria-label="Next attachment"
|
||||
/>
|
||||
navigate
|
||||
</span>
|
||||
)}
|
||||
{canDownload && (
|
||||
<span className="flex items-center gap-1.5">
|
||||
<kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
|
||||
D
|
||||
</kbd>
|
||||
<KeyHint
|
||||
keys="D"
|
||||
onClick={handleDownload}
|
||||
title="Download (or press D)"
|
||||
>
|
||||
download
|
||||
</span>
|
||||
</KeyHint>
|
||||
)}
|
||||
{onRemove && (
|
||||
<span className="flex items-center gap-1.5">
|
||||
<kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
|
||||
⌫
|
||||
</kbd>
|
||||
<KeyHint
|
||||
keys="⌫"
|
||||
onClick={handleRemove}
|
||||
title="Remove (or press Backspace)"
|
||||
>
|
||||
remove
|
||||
</span>
|
||||
</KeyHint>
|
||||
)}
|
||||
<span className="flex items-center gap-1.5">
|
||||
<kbd className="rounded bg-white/10 px-1.5 py-0.5 font-mono text-xs">
|
||||
Esc
|
||||
</kbd>
|
||||
<KeyHint
|
||||
keys="Esc"
|
||||
onClick={() => onOpenChange(null)}
|
||||
title="Close (or press Esc)"
|
||||
>
|
||||
close
|
||||
</span>
|
||||
</KeyHint>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user