From 15685c30c62f50f1a38a0ba6dabaffbea798ca11 Mon Sep 17 00:00:00 2001 From: Massimo Melina Date: Fri, 13 Dec 2024 10:03:30 +0100 Subject: [PATCH] options: new "english" option --- frontend/src/i18n.ts | 5 ++++- frontend/src/options.ts | 12 ++++++++++-- src/cross.ts | 1 + src/i18n.ts | 12 ++++++------ 4 files changed, 21 insertions(+), 9 deletions(-) diff --git a/frontend/src/i18n.ts b/frontend/src/i18n.ts index c2553b52..eef374a6 100644 --- a/frontend/src/i18n.ts +++ b/frontend/src/i18n.ts @@ -1,4 +1,7 @@ import { i18nFromTranslations } from '../../src/i18n' import { getHFS } from '@hfs/shared' +import { state } from './state' -export default i18nFromTranslations(getHFS().lang || {}) \ No newline at end of file +const i18n = i18nFromTranslations(getHFS().lang || {}) +i18n.state.disabled = state.disableTranslation +export default i18n \ No newline at end of file diff --git a/frontend/src/options.ts b/frontend/src/options.ts index 69c3210e..2ea2e382 100644 --- a/frontend/src/options.ts +++ b/frontend/src/options.ts @@ -8,7 +8,7 @@ import { getHFS, hIcon, MAX_TILE_SIZE, SORT_BY_OPTIONS, THEME_OPTIONS } from './ import { MenuLink } from './menu' import _ from 'lodash' import i18n from './i18n' -const { t } = i18n +const { t, useI18N } = i18n export function showOptions (){ newDialog({ @@ -20,6 +20,7 @@ export function showOptions (){ function Content(){ const snap = useSnapState() + const {t} = useI18N() return h(FlexV, { gap: '1.5em' }, snap.adminUrl && h(MenuLink, { icon: 'admin', @@ -74,7 +75,14 @@ export function showOptions (){ onChange(v) { state.theme = v } - }) + }), + + h(Checkbox, { + value: snap.disableTranslation, + onChange(v) { + i18n.state.disabled = state.disableTranslation = v + } + }, "English"), ) } } diff --git a/src/cross.ts b/src/cross.ts index 89025724..00f75506 100644 --- a/src/cross.ts +++ b/src/cross.ts @@ -22,6 +22,7 @@ export const FRONTEND_OPTIONS = { sort_numerics: false, theme: '', auto_play_seconds: 5, + disableTranslation: false, } export const SORT_BY_OPTIONS = ['name', 'extension', 'size', 'time'] export const THEME_OPTIONS = { auto: '', light: 'light', dark: 'dark' } diff --git a/src/i18n.ts b/src/i18n.ts index 7feae475..a98e63d6 100644 --- a/src/i18n.ts +++ b/src/i18n.ts @@ -3,9 +3,10 @@ import { proxy, useSnapshot } from 'valtio' import { watch } from 'valtio/utils' -export function i18nFromTranslations(translations: Record) { +export function i18nFromTranslations(translations: Record, embedded='en') { const state = proxy({ - embedded: '', + embedded, + disabled: false, translations, // all dictionaries }) const searchLangs: string[] = [] @@ -35,7 +36,7 @@ export function i18nFromTranslations(translations: Record) { let selectedLang = '' // keep track of where we find the translation const { embedded } = state const langs = Object.keys(state.translations) - for (const key of keys) { + if (!state.disabled) for (const key of keys) { for (const lang of searchLangs) if (found = state.translations[selectedLang=lang]?.translate?.[key]) break if (!warns.has(key) && langs.length && langs[0] !== embedded) { @@ -113,10 +114,9 @@ export function i18nFromTranslations(translations: Record) { return { t, + state, getLangs, - i18nWrapperProps(embedded='en') { - return { lang: getLangs()[0] || (state.embedded = embedded) } - }, + i18nWrapperProps: () => ({ lang: getLangs()[0] || state.embedded }), useI18N() { // the hook ensures translation is refreshed when language changes useSnapshot(state) return { t }