fix: make sync action tooltip trigger focusable

Wraps the sync button in a focusable trigger when rebase sync is blocked
Preserves the existing sync button behavior and labels
Improves tooltip access for keyboard users
This commit is contained in:
Bohdan Triapitsyn
2026-07-28 19:29:34 +03:00
parent c8a08588d9
commit b369ed5821
@@ -74,6 +74,7 @@ export const SyncActions: React.FC<SyncActionsProps> = ({
<div className="inline-flex items-center rounded-[9px] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[50px] border border-border/60 bg-[var(--surface-elevated)] overflow-hidden"> <div className="inline-flex items-center rounded-[9px] [corner-shape:squircle] supports-[corner-shape:squircle]:rounded-[50px] border border-border/60 bg-[var(--surface-elevated)] overflow-hidden">
<Tooltip> <Tooltip>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<span className="inline-flex" tabIndex={blocksRebaseSync ? 0 : undefined}>
<button <button
type="button" type="button"
onClick={handleSync} onClick={handleSync}
@@ -91,6 +92,7 @@ export const SyncActions: React.FC<SyncActionsProps> = ({
)} )}
<span className="whitespace-nowrap tabular-nums">{primaryLabel}</span> <span className="whitespace-nowrap tabular-nums">{primaryLabel}</span>
</button> </button>
</span>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent sideOffset={8}>{tooltipLabel}</TooltipContent> <TooltipContent sideOffset={8}>{tooltipLabel}</TooltipContent>
</Tooltip> </Tooltip>