mirror of
https://github.com/zadam/trilium.git
synced 2025-10-20 15:19:01 +02:00
chore(react/settings): port formatting locale
This commit is contained in:
parent
22c3de582f
commit
ba19fc7cf3
@ -4,29 +4,46 @@ import FormSelect from "../../react/FormSelect";
|
||||
import OptionsRow from "./components/OptionsRow";
|
||||
import OptionsSection from "./components/OptionsSection";
|
||||
import { useTriliumOption } from "../../react/hooks";
|
||||
import type { Locale } from "@triliumnext/commons";
|
||||
import { isElectron } from "../../../services/utils";
|
||||
|
||||
export default function InternationalizationOptions() {
|
||||
return (
|
||||
<OptionsSection title={t("i18n.title")}>
|
||||
<>
|
||||
<LocalizationOptions />
|
||||
</OptionsSection>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function LocalizationOptions() {
|
||||
const locales = useMemo(() =>
|
||||
getAvailableLocales().filter(locale => !locale.contentOnly)
|
||||
, []);
|
||||
const { uiLocales, formattingLocales: contentLocales } = useMemo(() => {
|
||||
const allLocales = getAvailableLocales();
|
||||
return {
|
||||
uiLocales: allLocales.filter(locale => !locale.contentOnly),
|
||||
formattingLocales: allLocales.filter(locale => locale.electronLocale),
|
||||
}
|
||||
}, []);
|
||||
|
||||
const [ locale, setLocale ] = useTriliumOption("locale");
|
||||
const [ formattingLocale, setFormattingLocale ] = useTriliumOption("formattingLocale");
|
||||
|
||||
return (
|
||||
<OptionsRow label={t("i18n.language")}>
|
||||
<FormSelect
|
||||
values={locales}
|
||||
keyProperty="id" titleProperty="name"
|
||||
currentValue={locale} onChange={setLocale}
|
||||
/>
|
||||
</OptionsRow>
|
||||
<OptionsSection title={t("i18n.title")}>
|
||||
<OptionsRow label={t("i18n.language")}>
|
||||
<LocaleSelector locales={uiLocales} currentValue={locale} onChange={setLocale} />
|
||||
</OptionsRow>
|
||||
|
||||
{isElectron() && <OptionsRow label={t("i18n.formatting-locale")}>
|
||||
<LocaleSelector locales={contentLocales} currentValue={formattingLocale} onChange={setFormattingLocale} />
|
||||
</OptionsRow>}
|
||||
</OptionsSection>
|
||||
)
|
||||
}
|
||||
|
||||
function LocaleSelector({ locales, currentValue, onChange }: { locales: Locale[], currentValue: string, onChange: (newLocale: string) => void }) {
|
||||
return <FormSelect
|
||||
values={locales}
|
||||
keyProperty="id" titleProperty="name"
|
||||
currentValue={currentValue} onChange={onChange}
|
||||
/>;
|
||||
}
|
@ -7,11 +7,6 @@ import type { OptionMap, Locale } from "@triliumnext/commons";
|
||||
const TPL = /*html*/`
|
||||
<div class="options-section">
|
||||
<div class="locale-options-container">
|
||||
<div class="option-row electron-only">
|
||||
<label for="formatting-locale-select">${t("i18n.formatting-locale")}</label>
|
||||
<select id="formatting-locale-select" class="formatting-locale-select form-select"></select>
|
||||
</div>
|
||||
|
||||
<div class="option-row">
|
||||
<label id="first-day-of-week-label">${t("i18n.first-day-of-the-week")}</label>
|
||||
<div role="group" aria-labelledby="first-day-of-week-label">
|
||||
@ -116,12 +111,6 @@ export default class LocalizationOptions extends OptionsWidget {
|
||||
|
||||
this.$minDaysRow = this.$widget.find(".min-days-row");
|
||||
|
||||
this.$formattingLocaleSelect = this.$widget.find(".formatting-locale-select");
|
||||
this.$formattingLocaleSelect.on("change", async () => {
|
||||
const newLocale = this.$formattingLocaleSelect.val();
|
||||
await server.put(`options/formattingLocale/${newLocale}`);
|
||||
});
|
||||
|
||||
this.$widget.find(`input[name="first-day-of-week"]`).on("change", () => {
|
||||
const firstDayOfWeek = String(this.$widget.find(`input[name="first-day-of-week"]:checked`).val());
|
||||
this.updateOption("firstDayOfWeek", firstDayOfWeek);
|
||||
|
Loading…
x
Reference in New Issue
Block a user