feat(ui): make Ctrl + Alt + Del button a setting

This commit makes the Action Bar Ctrl + Alt + Del button a setting,
which is off by default.
This commit is contained in:
Cameron Fleming 2025-01-04 00:22:08 +00:00
parent 7602aefe98
commit a819739790
3 changed files with 25 additions and 9 deletions

View File

@ -207,6 +207,7 @@ export default function Actionbar({
onClick={() => setVirtualKeyboard(!virtualKeyboard)} onClick={() => setVirtualKeyboard(!virtualKeyboard)}
/> />
</div> </div>
{useSettingsStore().actionBarCtrlAltDel && (
<div className="hidden lg:block"> <div className="hidden lg:block">
<Button <Button
size="XS" size="XS"
@ -217,12 +218,12 @@ export default function Actionbar({
sendKeyboardEvent( sendKeyboardEvent(
[keys["Delete"]], [keys["Delete"]],
[modifiers["ControlLeft"], modifiers["AltLeft"]], [modifiers["ControlLeft"], modifiers["AltLeft"]],
) );
setTimeout(resetKeyboardState, 100); setTimeout(resetKeyboardState, 100);
} }}
}
/> />
</div> </div>
)}
</div> </div>
<div className="flex flex-wrap items-center gap-x-2 gap-y-2"> <div className="flex flex-wrap items-center gap-x-2 gap-y-2">

View File

@ -796,6 +796,15 @@ export default function SettingsSidebar() {
}} }}
/> />
</SettingsItem> </SettingsItem>
<SettingsItem
title="Ctrl + Alt + Del Button"
description="Display Ctrl + Alt + Del button on the Action Bar"
>
<Checkbox
checked={settings.actionBarCtrlAltDel}
onChange={e => settings.setActionBarCtrlAltDel(e.target.checked)}
/>
</SettingsItem>
<div className="h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20" /> <div className="h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20" />
<div className="pb-2 space-y-4"> <div className="pb-2 space-y-4">
<SectionHeader <SectionHeader

View File

@ -270,6 +270,9 @@ interface SettingsState {
// Add new developer mode state // Add new developer mode state
developerMode: boolean; developerMode: boolean;
setDeveloperMode: (enabled: boolean) => void; setDeveloperMode: (enabled: boolean) => void;
actionBarCtrlAltDel: boolean;
setActionBarCtrlAltDel: (enabled: boolean) => void;
} }
export const useSettingsStore = create( export const useSettingsStore = create(
@ -287,6 +290,9 @@ export const useSettingsStore = create(
// Add developer mode with default value // Add developer mode with default value
developerMode: false, developerMode: false,
setDeveloperMode: enabled => set({ developerMode: enabled }), setDeveloperMode: enabled => set({ developerMode: enabled }),
actionBarCtrlAltDel: false,
setActionBarCtrlAltDel: enabled => set({ actionBarCtrlAltDel: enabled }),
}), }),
{ {
name: "settings", name: "settings",