mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

feat: (preferences) hook react display settings into user settings

Browse source
This commit is contained in:
Grady Hallenbeck 2023-10-19 12:02:54 -07:00
parent ce4c7aed5e
commit 3dd26c7785
13 changed files with 530 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/apps/experimental/routes/user/display/LocalizationPreferences.tsx
View file

@ -2,23 +2,34 @@ import FormControl from '@mui/material/FormControl';
import FormHelperText from '@mui/material/FormHelperText';
import Link from '@mui/material/Link';
import MenuItem from '@mui/material/MenuItem';
import Select from '@mui/material/Select';
import Select, { SelectChangeEvent } from '@mui/material/Select';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';
import React from 'react';
import globalize from 'scripts/globalize';
import { DATE_LOCALE_OPTIONS, LANGUAGE_OPTIONS } from './constants';
import { DisplaySettingsValues } from './types';
export function LocalizationPreferences() {
interface LocalizationPreferencesProps {
onChange: (event: SelectChangeEvent) => void;
values: DisplaySettingsValues;
}
export function LocalizationPreferences({ onChange, values }: Readonly<LocalizationPreferencesProps>) {
return (
<Stack spacing={3}>
<Stack spacing={2}>
<Typography variant='h2'>{globalize.translate('Localization')}</Typography>
<FormControl fullWidth>
<Select
aria-describedby='display-settings-language-description'
inputProps={{
name: 'language'
}}
label={globalize.translate('LabelDisplayLanguage')}
onChange={onChange}
value={values.language}
>
{ ...LANGUAGE_OPTIONS.map(({ value, label }) => (
<MenuItem key={value } value={value}>{ label }</MenuItem>
@ -37,7 +48,14 @@ export function LocalizationPreferences() {
</FormControl>
<FormControl fullWidth>
<Select label={globalize.translate('LabelDateTimeLocale')}>
<Select
inputProps={{
name: 'dateTimeLocale'
}}
label={globalize.translate('LabelDateTimeLocale')}
onChange={onChange}
value={values.dateTimeLocale}
>
{...DATE_LOCALE_OPTIONS.map(({ value, label }) => (
<MenuItem key={value} value={value}>{label}</MenuItem>
))}