mirror of https://github.com/jetkvm/kvm.git
cleaned up settings file
This commit is contained in:
Adrian
parent
afebc2dd1e
commit
c6ba93c46f
|
|
@ -28,11 +28,11 @@ import { useRevalidator } from "react-router-dom";
|
||||||
import { ShieldCheckIcon } from "@heroicons/react/20/solid";
|
import { ShieldCheckIcon } from "@heroicons/react/20/solid";
|
||||||
|
|
||||||
export function SettingsItem({
|
export function SettingsItem({
|
||||||
title,
|
title,
|
||||||
description,
|
description,
|
||||||
children,
|
children,
|
||||||
className,
|
className,
|
||||||
}: {
|
}: {
|
||||||
title: string;
|
title: string;
|
||||||
description: string | React.ReactNode;
|
description: string | React.ReactNode;
|
||||||
children?: React.ReactNode;
|
children?: React.ReactNode;
|
||||||
|
|
@ -40,18 +40,18 @@ export function SettingsItem({
|
||||||
name?: string;
|
name?: string;
|
||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<label className={cx("flex items-center justify-between gap-x-4 rounded", className)}>
|
<label className={cx("flex items-center justify-between gap-x-4 rounded", className)}>
|
||||||
<div className="space-y-0.5">
|
<div className="space-y-0.5">
|
||||||
<h3 className="text-base font-semibold text-black dark:text-white">{title}</h3>
|
<h3 className="text-base font-semibold text-black dark:text-white">{title}</h3>
|
||||||
<p className="text-sm text-slate-700 dark:text-slate-300">{description}</p>
|
<p className="text-sm text-slate-700 dark:text-slate-300">{description}</p>
|
||||||
</div>
|
</div>
|
||||||
{children ? <div>{children}</div> : null}
|
{children ? <div>{children}</div> : null}
|
||||||
</label>
|
</label>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
const defaultEdid =
|
const defaultEdid =
|
||||||
"00ffffffffffff0052620188008888881c150103800000780a0dc9a05747982712484c00000001010101010101010101010101010101023a801871382d40582c4500c48e2100001e011d007251d01e206e285500c48e2100001e000000fc00543734392d6648443732300a20000000fd00147801ff1d000a202020202020017b";
|
"00ffffffffffff0052620188008888881c150103800000780a0dc9a05747982712484c00000001010101010101010101010101010101023a801871382d40582c4500c48e2100001e011d007251d01e206e285500c48e2100001e000000fc00543734392d6648443732300a20000000fd00147801ff1d000a202020202020017b";
|
||||||
const edids = [
|
const edids = [
|
||||||
{
|
{
|
||||||
value: defaultEdid,
|
value: defaultEdid,
|
||||||
|
|
@ -59,17 +59,17 @@ const edids = [
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value:
|
value:
|
||||||
"00FFFFFFFFFFFF00047265058A3F6101101E0104A53420783FC125A8554EA0260D5054BFEF80714F8140818081C081008B009500B300283C80A070B023403020360006442100001A000000FD00304C575716010A202020202020000000FC0042323436574C0A202020202020000000FF0054384E4545303033383532320A01F802031CF14F90020304050607011112131415161F2309070783010000011D8018711C1620582C250006442100009E011D007251D01E206E28550006442100001E8C0AD08A20E02D10103E9600064421000018C344806E70B028401720A80406442100001E00000000000000000000000000000000000000000000000000000096",
|
"00FFFFFFFFFFFF00047265058A3F6101101E0104A53420783FC125A8554EA0260D5054BFEF80714F8140818081C081008B009500B300283C80A070B023403020360006442100001A000000FD00304C575716010A202020202020000000FC0042323436574C0A202020202020000000FF0054384E4545303033383532320A01F802031CF14F90020304050607011112131415161F2309070783010000011D8018711C1620582C250006442100009E011D007251D01E206E28550006442100001E8C0AD08A20E02D10103E9600064421000018C344806E70B028401720A80406442100001E00000000000000000000000000000000000000000000000000000096",
|
||||||
label: "Acer B246WL, 1920x1200",
|
label: "Acer B246WL, 1920x1200",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value:
|
value:
|
||||||
"00FFFFFFFFFFFF0006B3872401010101021F010380342078EA6DB5A7564EA0250D5054BF6F00714F8180814081C0A9409500B300D1C0283C80A070B023403020360006442100001A000000FD00314B1E5F19000A202020202020000000FC00504132343851560A2020202020000000FF004D314C4D51533035323135370A014D02032AF14B900504030201111213141F230907078301000065030C001000681A00000101314BE6E2006A023A801871382D40582C450006442100001ECD5F80B072B0374088D0360006442100001C011D007251D01E206E28550006442100001E8C0AD08A20E02D10103E960006442100001800000000000000000000000000DC",
|
"00FFFFFFFFFFFF0006B3872401010101021F010380342078EA6DB5A7564EA0250D5054BF6F00714F8180814081C0A9409500B300D1C0283C80A070B023403020360006442100001A000000FD00314B1E5F19000A202020202020000000FC00504132343851560A2020202020000000FF004D314C4D51533035323135370A014D02032AF14B900504030201111213141F230907078301000065030C001000681A00000101314BE6E2006A023A801871382D40582C450006442100001ECD5F80B072B0374088D0360006442100001C011D007251D01E206E28550006442100001E8C0AD08A20E02D10103E960006442100001800000000000000000000000000DC",
|
||||||
label: "ASUS PA248QV, 1920x1200",
|
label: "ASUS PA248QV, 1920x1200",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value:
|
value:
|
||||||
"00FFFFFFFFFFFF0010AC132045393639201E0103803C22782ACD25A3574B9F270D5054A54B00714F8180A9C0D1C00101010101010101023A801871382D40582C450056502100001E000000FF00335335475132330A2020202020000000FC0044454C4C204432373231480A20000000FD00384C1E5311000A202020202020018102031AB14F90050403020716010611121513141F65030C001000023A801871382D40582C450056502100001E011D8018711C1620582C250056502100009E011D007251D01E206E28550056502100001E8C0AD08A20E02D10103E960056502100001800000000000000000000000000000000000000000000000000000000004F",
|
"00FFFFFFFFFFFF0010AC132045393639201E0103803C22782ACD25A3574B9F270D5054A54B00714F8180A9C0D1C00101010101010101023A801871382D40582C450056502100001E000000FF00335335475132330A2020202020000000FC0044454C4C204432373231480A20000000FD00384C1E5311000A202020202020018102031AB14F90050403020716010611121513141F65030C001000023A801871382D40582C450056502100001E011D8018711C1620582C250056502100009E011D007251D01E206E28550056502100001E8C0AD08A20E02D10103E960056502100001800000000000000000000000000000000000000000000000000000000004F",
|
||||||
label: "DELL D2721H, 1920x1080",
|
label: "DELL D2721H, 1920x1080",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
@ -103,6 +103,12 @@ export default function SettingsSidebar() {
|
||||||
} | null>(null);
|
} | null>(null);
|
||||||
|
|
||||||
const [usbEmulationEnabled, setUsbEmulationEnabled] = useState(false);
|
const [usbEmulationEnabled, setUsbEmulationEnabled] = useState(false);
|
||||||
|
const getUsbEmulationState = useCallback(() => {
|
||||||
|
send("getUsbEmulationState", {}, resp => {
|
||||||
|
if ("error" in resp) return;
|
||||||
|
setUsbEmulationEnabled(resp.result as boolean);
|
||||||
|
});
|
||||||
|
}, [send]);
|
||||||
|
|
||||||
const [usbConfig, setUsbConfig] = useState({
|
const [usbConfig, setUsbConfig] = useState({
|
||||||
usb_product_id: '',
|
usb_product_id: '',
|
||||||
|
|
@ -112,27 +118,20 @@ export default function SettingsSidebar() {
|
||||||
usb_name: '',
|
usb_name: '',
|
||||||
})
|
})
|
||||||
|
|
||||||
const getUsbEmulationState = useCallback(() => {
|
|
||||||
send("getUsbEmulationState", {}, resp => {
|
|
||||||
if ("error" in resp) return;
|
|
||||||
setUsbEmulationEnabled(resp.result as boolean);
|
|
||||||
});
|
|
||||||
}, [send]);
|
|
||||||
|
|
||||||
const handleUsbEmulationToggle = useCallback(
|
const handleUsbEmulationToggle = useCallback(
|
||||||
(enabled: boolean) => {
|
(enabled: boolean) => {
|
||||||
send("setUsbEmulationState", { enabled: enabled }, resp => {
|
send("setUsbEmulationState", { enabled: enabled }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to ${enabled ? "enable" : "disable"} USB emulation: ${resp.error.data || "Unknown error"}`,
|
`Failed to ${enabled ? "enable" : "disable"} USB emulation: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setUsbEmulationEnabled(enabled);
|
setUsbEmulationEnabled(enabled);
|
||||||
getUsbEmulationState();
|
getUsbEmulationState();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
[getUsbEmulationState, send],
|
[getUsbEmulationState, send],
|
||||||
);
|
);
|
||||||
|
|
||||||
const getCloudState = useCallback(() => {
|
const getCloudState = useCallback(() => {
|
||||||
|
|
@ -147,7 +146,7 @@ export default function SettingsSidebar() {
|
||||||
send("deregisterDevice", {}, resp => {
|
send("deregisterDevice", {}, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to de-register device: ${resp.error.data || "Unknown error"}`,
|
`Failed to de-register device: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -160,7 +159,7 @@ export default function SettingsSidebar() {
|
||||||
send("setStreamQualityFactor", { factor: Number(factor) }, resp => {
|
send("setStreamQualityFactor", { factor: Number(factor) }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to set stream quality: ${resp.error.data || "Unknown error"}`,
|
`Failed to set stream quality: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -172,7 +171,7 @@ export default function SettingsSidebar() {
|
||||||
send("setAutoUpdateState", { enabled }, resp => {
|
send("setAutoUpdateState", { enabled }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to set auto-update: ${resp.error.data || "Unknown error"}`,
|
`Failed to set auto-update: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -184,7 +183,7 @@ export default function SettingsSidebar() {
|
||||||
send("setDevChannelState", { enabled }, resp => {
|
send("setDevChannelState", { enabled }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to set dev channel state: ${resp.error.data || "Unknown error"}`,
|
`Failed to set dev channel state: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -196,7 +195,7 @@ export default function SettingsSidebar() {
|
||||||
send("setJigglerState", { enabled }, resp => {
|
send("setJigglerState", { enabled }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to set jiggler state: ${resp.error.data || "Unknown error"}`,
|
`Failed to set jiggler state: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -232,28 +231,28 @@ export default function SettingsSidebar() {
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleDevModeChange = useCallback(
|
const handleDevModeChange = useCallback(
|
||||||
(developerMode: boolean) => {
|
(developerMode: boolean) => {
|
||||||
send("setDevModeState", { enabled: developerMode }, resp => {
|
send("setDevModeState", { enabled: developerMode }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to set dev mode: ${resp.error.data || "Unknown error"}`,
|
`Failed to set dev mode: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
setDeveloperMode(developerMode);
|
setDeveloperMode(developerMode);
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
sidebarRef.current?.scrollTo({ top: 5000, behavior: "smooth" });
|
sidebarRef.current?.scrollTo({ top: 5000, behavior: "smooth" });
|
||||||
}, 0);
|
}, 0);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
[send, setDeveloperMode],
|
[send, setDeveloperMode],
|
||||||
);
|
);
|
||||||
|
|
||||||
const handleUpdateSSHKey = useCallback(() => {
|
const handleUpdateSSHKey = useCallback(() => {
|
||||||
send("setSSHKeyState", { sshKey }, resp => {
|
send("setSSHKeyState", { sshKey }, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to update SSH key: ${resp.error.data || "Unknown error"}`,
|
`Failed to update SSH key: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
@ -329,7 +328,7 @@ export default function SettingsSidebar() {
|
||||||
const receivedEdid = resp.result as string;
|
const receivedEdid = resp.result as string;
|
||||||
|
|
||||||
const matchingEdid = edids.find(
|
const matchingEdid = edids.find(
|
||||||
x => x.value.toLowerCase() === receivedEdid.toLowerCase(),
|
x => x.value.toLowerCase() === receivedEdid.toLowerCase(),
|
||||||
);
|
);
|
||||||
|
|
||||||
if (matchingEdid) {
|
if (matchingEdid) {
|
||||||
|
|
@ -372,8 +371,8 @@ export default function SettingsSidebar() {
|
||||||
const getDevice = useCallback(async () => {
|
const getDevice = useCallback(async () => {
|
||||||
try {
|
try {
|
||||||
const status = await api
|
const status = await api
|
||||||
.GET(`${import.meta.env.VITE_SIGNAL_API}/device`)
|
.GET(`${import.meta.env.VITE_SIGNAL_API}/device`)
|
||||||
.then(res => res.json() as Promise<LocalDevice>);
|
.then(res => res.json() as Promise<LocalDevice>);
|
||||||
setLocalDevice(status);
|
setLocalDevice(status);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
notifications.error("Failed to get authentication status");
|
notifications.error("Failed to get authentication status");
|
||||||
|
|
@ -408,8 +407,8 @@ export default function SettingsSidebar() {
|
||||||
localStorage.removeItem("theme");
|
localStorage.removeItem("theme");
|
||||||
// Check system preference
|
// Check system preference
|
||||||
const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches
|
const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches
|
||||||
? "dark"
|
? "dark"
|
||||||
: "light";
|
: "light";
|
||||||
root.classList.remove("light", "dark");
|
root.classList.remove("light", "dark");
|
||||||
root.classList.add(systemTheme);
|
root.classList.add(systemTheme);
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -423,7 +422,7 @@ export default function SettingsSidebar() {
|
||||||
send("resetConfig", {}, resp => {
|
send("resetConfig", {}, resp => {
|
||||||
if ("error" in resp) {
|
if ("error" in resp) {
|
||||||
notifications.error(
|
notifications.error(
|
||||||
`Failed to reset configuration: ${resp.error.data || "Unknown error"}`,
|
`Failed to reset configuration: ${resp.error.data || "Unknown error"}`,
|
||||||
);
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue