Skip to content

Commit f4d88c7

Browse files
committed
WIP: feat(settings): add Max backlight setting
1 parent bec1443 commit f4d88c7

File tree

2 files changed

+69
-0
lines changed

2 files changed

+69
-0
lines changed

ui/src/components/sidebar/settings.tsx

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import SidebarHeader from "@components/SidebarHeader";
22
import {
3+
BacklightSettings,
34
useLocalAuthModalStore,
45
useSettingsStore,
56
useUiStore,
@@ -95,6 +96,7 @@ export default function SettingsSidebar() {
9596
const hideCursor = useSettingsStore(state => state.isCursorHidden);
9697
const setHideCursor = useSettingsStore(state => state.setCursorVisibility);
9798
const setDeveloperMode = useSettingsStore(state => state.setDeveloperMode);
99+
const setBacklightSettings = useSettingsStore(state => state.setBacklightSettings);
98100

99101
const [currentVersions, setCurrentVersions] = useState<{
100102
appVersion: string;
@@ -228,6 +230,18 @@ export default function SettingsSidebar() {
228230
[send, setDeveloperMode],
229231
);
230232

233+
const handleBacklightSettingChange = useCallback((settings: BacklightSettings) => {
234+
send("setBacklightSettings", { settings }, resp => {
235+
if ("error" in resp) {
236+
notifications.error(
237+
`Failed to set backlight settings: ${resp.error.data || "Unknown error"}`,
238+
);
239+
return;
240+
}
241+
notifications.success("Backlight settings updated successfully");
242+
});
243+
}, [send]);
244+
231245
const handleUpdateSSHKey = useCallback(() => {
232246
send("setSSHKeyState", { sshKey }, resp => {
233247
if ("error" in resp) {
@@ -302,6 +316,17 @@ export default function SettingsSidebar() {
302316
}
303317
});
304318

319+
send("getBacklightSettings", {}, resp => {
320+
if ("error" in resp) {
321+
notifications.error(
322+
`Failed to get backlight settings: ${resp.error.data || "Unknown error"}`,
323+
);
324+
return;
325+
}
326+
const result = resp.result as BacklightSettings;
327+
setBacklightSettings(result);
328+
})
329+
305330
send("getDevModeState", {}, resp => {
306331
if ("error" in resp) return;
307332
const result = resp.result as { enabled: boolean };
@@ -797,6 +822,34 @@ export default function SettingsSidebar() {
797822
/>
798823
</SettingsItem>
799824
<div className="h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20" />
825+
<div className="pb-2 space-y-4">
826+
<SectionHeader
827+
title="Hardware"
828+
description="Configure the JetKVM Hardware"
829+
/>
830+
</div>
831+
<SettingsItem title="Display Brightness" description="Set the brightness of the display">
832+
{/* TODO: Allow the user to pick any value between 0 and 100 */}
833+
<SelectMenuBasic
834+
size="SM"
835+
label=""
836+
value={settings.backlightSettings.max_brightness.toString()}
837+
options={[
838+
{ value: "0", label: "Off" },
839+
{ value: "10", label: "Low" },
840+
{ value: "50", label: "Medium" },
841+
{ value: "100", label: "High" },
842+
]}
843+
onChange={e => {
844+
handleBacklightSettingChange({
845+
max_brightness: parseInt(e.target.value),
846+
dim_after: settings.backlightSettings.dim_after,
847+
off_after: settings.backlightSettings.off_after,
848+
});
849+
}}
850+
/>
851+
</SettingsItem>
852+
<div className="h-[1px] w-full bg-slate-800/10 dark:bg-slate-300/20" />
800853
<div className="pb-2 space-y-4">
801854
<SectionHeader
802855
title="Advanced"

ui/src/hooks/stores.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -229,6 +229,12 @@ export interface VideoState {
229229
}) => void;
230230
}
231231

232+
export interface BacklightSettings {
233+
max_brightness: number;
234+
dim_after: number;
235+
off_after: number;
236+
}
237+
232238
export const useVideoStore = create<VideoState>(set => ({
233239
width: 0,
234240
height: 0,
@@ -270,6 +276,9 @@ interface SettingsState {
270276
// Add new developer mode state
271277
developerMode: boolean;
272278
setDeveloperMode: (enabled: boolean) => void;
279+
280+
backlightSettings: BacklightSettings;
281+
setBacklightSettings: (settings: BacklightSettings) => void;
273282
}
274283

275284
export const useSettingsStore = create(
@@ -287,6 +296,13 @@ export const useSettingsStore = create(
287296
// Add developer mode with default value
288297
developerMode: false,
289298
setDeveloperMode: enabled => set({ developerMode: enabled }),
299+
300+
backlightSettings: {
301+
max_brightness: 100,
302+
dim_after: 10000,
303+
off_after: 50000,
304+
},
305+
setBacklightSettings: (settings: BacklightSettings) => set({ backlightSettings: settings }),
290306
}),
291307
{
292308
name: "settings",

0 commit comments

Comments
 (0)