PublicMirrors/hydra
1
0
Fork 0
mirror of https://github.com/hydralauncher/hydra.git synced 2025-02-09 03:37:45 +03:00
Code Issues Actions Packages Projects Releases 1 Wiki Activity

generate options tags inside select component

Browse Source
This commit is contained in:
piradata 2024-05-30 02:43:45 -03:00
parent 8543aecda8
commit 5e019c41f4
2 changed files with 17 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/renderer/src/components/select/select.tsx
View File

@ -9,13 +9,14 @@ export interface SelectProps
> { > {
theme?: NonNullable<RecipeVariants<typeof styles.select>>["theme"]; theme?: NonNullable<RecipeVariants<typeof styles.select>>["theme"];
label?: string; label?: string;
options?: { key: any; value: any; label: string }[];
} }
export function Select({ export function Select({
value, value,
theme = "primary",
label, label,
children, options = [{ key: value, value: value, label: "-" }],
theme = "primary",
onChange, onChange,
}: SelectProps) { }: SelectProps) {
const [isFocused, setIsFocused] = useState(false); const [isFocused, setIsFocused] = useState(false);
@ -38,7 +39,11 @@ export function Select({
onBlur={() => setIsFocused(false)} onBlur={() => setIsFocused(false)}
onChange={onChange} onChange={onChange}
> >
{children} {options.map((option) => (
<option key={option.key} value={option.value}>
{option.label}
</option>
))}
</select> </select>
</div> </div>
</div> </div>

16
src/renderer/src/pages/settings/settings-general.tsx
View File

@ -128,13 +128,15 @@ export function SettingsGeneral({
<h3>{t("language")}</h3> <h3>{t("language")}</h3>
<> <>
<Select value={form.language} onChange={handleLanguageChange}> <Select
{languageOptions.map((language) => ( value={form.language}
<option key={language.option} value={language.option}> onChange={handleLanguageChange}
{language.nativeName} options={languageOptions.map((language) => ({
</option> key: language.option,
))} value: language.option,
</Select> label: language.nativeName,
}))}
/>
</> </>
<h3>{t("notifications")}</h3> <h3>{t("notifications")}</h3>