feat: Added interface options

This commit is contained in:
Simeon Radivoev 2026-03-04 13:18:18 +02:00
parent 4739b89933
commit 2f32cbc730
Signed by: simeonradivoev
GPG key ID: 7611A451D2A5D37A
25 changed files with 327 additions and 74 deletions

View file

@ -0,0 +1,59 @@
import { HTMLInputTypeAttribute, JSX } from "react";
import { LocalSettingsSchema, LocalSettingsType } from "../../../shared/constants";
import { OptionSpace } from "./OptionSpace";
import { OptionInput } from "./OptionInput";
import { useLocalStorage } from "usehooks-ts";
import { OptionDropdown } from "./OptionDropdown";
export function LocalOption (data: {
label: string;
id: keyof LocalSettingsType;
type: HTMLInputTypeAttribute | 'dropdown';
placeholder?: string;
values?: string[];
icon?: JSX.Element;
children?: any;
})
{
const [localValue, setLocalValue] = useLocalStorage<any>(data.id, LocalSettingsSchema.shape[data.id].parse(undefined), { deserializer: (v) => LocalSettingsSchema.shape[data.id].parse(JSON.parse(v)) });
return (
<OptionSpace label={data.label}>
{data.type === 'dropdown' && data.values && <OptionDropdown values={data.values} icon={data.icon}
name={data.id ?? ""}
type={data.type}
placeholder={data.placeholder}
defaultValue={localValue}
onChange={(v) =>
{
if (data.type === 'checkbox')
{
setLocalValue(v);
} else
{
setLocalValue(v);
}
}}
value={localValue} />}
{data.type !== 'dropdown' && <OptionInput
icon={data.icon}
name={data.id ?? ""}
type={data.type}
placeholder={data.placeholder}
defaultValue={localValue}
onChange={(v) =>
{
if (data.type === 'checkbox')
{
setLocalValue(v);
} else
{
setLocalValue(v);
}
}}
value={localValue}
/>}
{data.children}
</OptionSpace>
);
}