fix(cat): the chip opens the radio menu with one radio too

It only became a menu from two radios, on the reasoning that a single
radio has nothing to switch to. That hides the feature from precisely the
operator who has not made a second radio yet — the click lands on a
settings dialog they did not ask for, which is what happened on the first
try. With one radio the menu now shows that radio and 'Add a radio…'.

Right-click still goes straight to the CAT settings.
This commit is contained in:
2026-08-27 00:32:00 +02:00
parent 4689505fb9
commit cf5efea3e4
2 changed files with 15 additions and 8 deletions
+1 -1
View File
@@ -1 +1 @@
f9b41e192918fa2511f68cd1b361fcd3 704fe1bf370b669665df0606fae8a69d
+14 -7
View File
@@ -316,15 +316,22 @@ function RadioChip({ catUp, catState, onOpenSettings }: {
const label = catUp const label = catUp
? (catState.rig || 'CAT') ? (catState.rig || 'CAT')
: (catState.enabled ? (shortCatError(catState.error) || 'CAT off') : 'CAT'); : (catState.enabled ? (shortCatError(catState.error) || 'CAT off') : 'CAT');
const many = radios.length > 1; // The menu opens with ONE radio too.
//
// It was only shown from two, on the reasoning that a single radio has
// nothing to switch to — but that hides the feature exactly from the operator
// who has not made a second radio yet, and the click lands on the settings
// dialog they were not asking for. With one radio the menu shows that radio
// and the way to add another.
const has = radios.length > 0;
return ( return (
<div ref={ref} className="relative"> <div ref={ref} className="relative">
<button <button
type="button" type="button"
onClick={() => { if (!many) { onOpenSettings(); return; } load(); setOpen((o) => !o); }} onClick={() => { if (!has) { onOpenSettings(); return; } load(); setOpen((o) => !o); }}
title={many title={has
? 'Switch radio — right-click for the CAT settings' ? 'Radios — right-click for the CAT settings'
: (catUp ? `CAT: ${catState.rig || catState.backend || 'connected'}` : (catState.error || 'CAT'))} : (catUp ? `CAT: ${catState.rig || catState.backend || 'connected'}` : (catState.error || 'CAT'))}
onContextMenu={(e) => { e.preventDefault(); onOpenSettings(); }} onContextMenu={(e) => { e.preventDefault(); onOpenSettings(); }}
className={cn('inline-flex items-center gap-1.5 h-5 px-2 rounded-full border text-[11px] transition-colors', className={cn('inline-flex items-center gap-1.5 h-5 px-2 rounded-full border text-[11px] transition-colors',
@@ -332,9 +339,9 @@ function RadioChip({ catUp, catState, onOpenSettings }: {
> >
<span className={cn('size-2 rounded-full', catUp ? 'bg-success' : 'bg-muted-foreground/40')} /> <span className={cn('size-2 rounded-full', catUp ? 'bg-success' : 'bg-muted-foreground/40')} />
<span className="inline-flex items-center gap-1"><RadioTower className="size-3" />{label}</span> <span className="inline-flex items-center gap-1"><RadioTower className="size-3" />{label}</span>
{many && <ChevronUp className="size-3 opacity-60" />} {has && <ChevronUp className="size-3 opacity-60" />}
</button> </button>
{open && many && ( {open && has && (
<div className="absolute bottom-full left-0 mb-1 z-50 min-w-44 rounded-md border border-border bg-card shadow-lg py-1"> <div className="absolute bottom-full left-0 mb-1 z-50 min-w-44 rounded-md border border-border bg-card shadow-lg py-1">
{radios.map((r) => ( {radios.map((r) => (
<button <button
@@ -356,7 +363,7 @@ function RadioChip({ catUp, catState, onOpenSettings }: {
<div className="my-1 border-t border-border/60" /> <div className="my-1 border-t border-border/60" />
<button type="button" onClick={() => { setOpen(false); onOpenSettings(); }} <button type="button" onClick={() => { setOpen(false); onOpenSettings(); }}
className="w-full px-2.5 py-1 text-left text-xs text-muted-foreground hover:bg-muted"> className="w-full px-2.5 py-1 text-left text-xs text-muted-foreground hover:bg-muted">
Radios {radios.length > 1 ? 'Radios…' : 'Add a radio…'}
</button> </button>
</div> </div>
)} )}