Skip to content

feat(desktop): show hotkey shortcuts in preset dropdown #991

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Kitenite merged 2 commits into from
Jan 27, 2026
Merged

feat(desktop): show hotkey shortcuts in preset dropdown #991

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
744267a
feat(desktop): show hotkey shortcuts in preset dropdown
Kitenite Jan 27, 2026
edb9b03
Ports top border
Kitenite Jan 27, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion ...enderer/routes/_authenticated/_dashboard/workspace/$workspaceId/hooks/usePresetHotkeys.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { useAppHotkey } from "renderer/stores/hotkeys";
import type { HotkeyId } from "shared/hotkeys";

const PRESET_HOTKEY_IDS: HotkeyId[] = [
export const PRESET_HOTKEY_IDS: HotkeyId[] = [
"OPEN_PRESET_1",
"OPEN_PRESET_2",
"OPEN_PRESET_3",
Expand Down
2 changes: 1 addition & 1 deletion apps/desktop/src/renderer/screens/main/components/WorkspaceSidebar/PortsList/PortsList.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export function PortsList() {
};

return (
<div className="pt-3 border-t border-border/40">
<div className="pt-3 border-t border-border">
<div className="group text-[11px] uppercase tracking-wider text-muted-foreground/70 px-3 pb-2 font-medium flex items-center gap-1.5 w-full hover:text-muted-foreground transition-colors">
<button
type="button"
Expand Down
19 changes: 17 additions & 2 deletions ...r/screens/main/components/WorkspaceView/ContentView/TabsContent/GroupStrip/GroupStrip.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuShortcut,
DropdownMenuTrigger,
} from "@superset/ui/dropdown-menu";
import { Tooltip, TooltipContent, TooltipTrigger } from "@superset/ui/tooltip";
Expand All @@ -23,6 +24,8 @@ import {
} from "renderer/assets/app-icons/preset-icons";
import { HotkeyTooltipContent } from "renderer/components/HotkeyTooltipContent";
import { usePresets } from "renderer/react-query/presets";
import { useHotkeyText } from "renderer/stores/hotkeys";
import { PRESET_HOTKEY_IDS } from "renderer/routes/_authenticated/_dashboard/workspace/$workspaceId/hooks/usePresetHotkeys";
import { useTabsStore } from "renderer/stores/tabs/store";
import { useTabsWithPresets } from "renderer/stores/tabs/useTabsWithPresets";
import {
Expand All @@ -33,6 +36,17 @@ import { type ActivePaneStatus, pickHigherStatus } from "shared/tabs-types";
import { GroupItem } from "./GroupItem";
import { NewTabDropZone } from "./NewTabDropZone";

function PresetMenuItemShortcut({ index }: { index: number }) {
const hotkeyId = PRESET_HOTKEY_IDS[index];
const hotkeyText = useHotkeyText(hotkeyId);

if (!hotkeyId || hotkeyText === "Unassigned") {
return null;
}

return <DropdownMenuShortcut>{hotkeyText}</DropdownMenuShortcut>;
}
Comment on lines +39 to +48
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot Jan 27, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

Guard against out‑of‑range preset indices before calling useHotkeyText.

For presets beyond index 8, PRESET_HOTKEY_IDS[index] is undefined but the hook is still called, which can lead to runtime errors or undefined lookups. Also, consider extracting PresetMenuItemShortcut to its own file to comply with the one‑component‑per‑file guideline. As per coding guidelines, ...

🔧 Proposed fix 
-function PresetMenuItemShortcut({ index }: { index: number }) {
-	const hotkeyId = PRESET_HOTKEY_IDS[index];
-	const hotkeyText = useHotkeyText(hotkeyId);
-
-	if (!hotkeyId || hotkeyText === "Unassigned") {
-		return null;
-	}
-
-	return <DropdownMenuShortcut>{hotkeyText}</DropdownMenuShortcut>;
-}
+function PresetMenuItemShortcut({ hotkeyId }: { hotkeyId: HotkeyId }) {
+	const hotkeyText = useHotkeyText(hotkeyId);
+
+	if (hotkeyText === "Unassigned") {
+		return null;
+	}
+
+	return <DropdownMenuShortcut>{hotkeyText}</DropdownMenuShortcut>;
+}
 {presets.map((preset, index) => {
 	const presetIcon = getPresetIcon(preset.name, isDark);
+	const presetHotkeyId = PRESET_HOTKEY_IDS[index];
 	return (
 		<DropdownMenuItem
 			key={preset.id}
 			onClick={() => handleSelectPreset(preset)}
 			className="gap-2"
 		>
@@
 			{preset.isDefault && (
 				<HiStar className="size-3 text-yellow-500 flex-shrink-0" />
 			)}
-			<PresetMenuItemShortcut index={index} />
+			{presetHotkeyId && (
+				<PresetMenuItemShortcut hotkeyId={presetHotkeyId} />
+			)}
 		</DropdownMenuItem>
 	);
 })}

Also applies to: 260-284

🤖 Prompt for AI Agents 
In
`@apps/desktop/src/renderer/screens/main/components/WorkspaceView/ContentView/TabsContent/GroupStrip/GroupStrip.tsx`
around lines 51 - 60, PresetMenuItemShortcut currently calls useHotkeyText even
when PRESET_HOTKEY_IDS[index] is undefined for indices >8; change the logic so
you first read const hotkeyId = PRESET_HOTKEY_IDS[index] and if (!hotkeyId)
return null before calling useHotkeyText, then only call const hotkeyText =
useHotkeyText(hotkeyId) and guard the "Unassigned" value after that; also
consider extracting PresetMenuItemShortcut into its own file to follow the
one-component-per-file guideline and import it where needed (references:
PresetMenuItemShortcut, PRESET_HOTKEY_IDS, useHotkeyText, DropdownMenuShortcut).


export function GroupStrip() {
const { workspaceId: activeWorkspaceId } = useParams({ strict: false });

Expand Down Expand Up @@ -231,7 +245,7 @@ export function GroupStrip() {
<DropdownMenuContent align="end" className="w-56">
{presets.length > 0 && (
<>
{presets.map((preset) => {
{presets.map((preset, index) => {
const presetIcon = getPresetIcon(preset.name, isDark);
return (
<DropdownMenuItem
Expand All @@ -252,8 +266,9 @@ export function GroupStrip() {
{preset.name || "default"}
</span>
{preset.isDefault && (
<HiStar className="size-3 text-yellow-500 ml-auto flex-shrink-0" />
<HiStar className="size-3 text-yellow-500 flex-shrink-0" />
)}
<PresetMenuItemShortcut index={index} />
</DropdownMenuItem>
);
})}
Expand Down
Loading