From f58a20b21eb58f891b3f9912cb6fff11eb329083 Mon Sep 17 00:00:00 2001 From: Christian Kaisermann Date: Tue, 19 Nov 2019 17:12:15 -0300 Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=8E=B8=20export=20a=20store=20lis?= =?UTF-8?q?ting=20all=20locales=20available?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/client/index.ts | 57 ++++++++++++++++++++------------------------- src/client/utils.ts | 23 ++++++++++++++++++ 2 files changed, 48 insertions(+), 32 deletions(-) diff --git a/src/client/index.ts b/src/client/index.ts index 070d353..7882ca9 100644 --- a/src/client/index.ts +++ b/src/client/index.ts @@ -1,5 +1,3 @@ -// todo maybe locale can be a promise so we can await for it on the template? - import { writable, derived } from 'svelte/store' import resolvePath from 'object-resolve-path' import memoize from 'micro-memoize' @@ -36,10 +34,10 @@ function getAvailableLocale(locale: string) { } const lookupMessage = memoize((path: string, locale: string) => { - return ( - (currentDictionary[locale] as any)[path] || - resolvePath(currentDictionary[locale], path) - ) + if (path in currentDictionary[locale]) { + return currentDictionary[locale][path] + } + return resolvePath(currentDictionary[locale], path) }) const formatMessage: Formatter = (id, options = {}) => { @@ -52,9 +50,7 @@ const formatMessage: Formatter = (id, options = {}) => { const message = lookupMessage(id, locale) if (!message) { - console.warn( - `[svelte-i18n] The message "${id}" was not found in the locale "${locale}".`, - ) + console.warn(`[svelte-i18n] The message "${id}" was not found in the locale "${locale}".`) if (defaultValue != null) return defaultValue return id } @@ -64,26 +60,20 @@ const formatMessage: Formatter = (id, options = {}) => { return getMessageFormatter(message, locale).format(values) } -formatMessage.time = (t, options) => - getTimeFormatter(currentLocale, options).format(t) -formatMessage.date = (d, options) => - getDateFormatter(currentLocale, options).format(d) -formatMessage.number = (n, options) => - getNumberFormatter(currentLocale, options).format(n) +formatMessage.time = (t, options) => getTimeFormatter(currentLocale, options).format(t) +formatMessage.date = (d, options) => getDateFormatter(currentLocale, options).format(d) +formatMessage.number = (n, options) => getNumberFormatter(currentLocale, options).format(n) +formatMessage.capital = (id, options) => capital(formatMessage(id, options)) +formatMessage.title = (id, options) => title(formatMessage(id, options)) +formatMessage.upper = (id, options) => upper(formatMessage(id, options)) +formatMessage.lower = (id, options) => lower(formatMessage(id, options)) -formatMessage.capital = (path, options) => capital(formatMessage(path, options)) -formatMessage.title = (path, options) => title(formatMessage(path, options)) -formatMessage.upper = (path, options) => upper(formatMessage(path, options)) -formatMessage.lower = (path, options) => lower(formatMessage(path, options)) +const $dictionary = writable({}) +$dictionary.subscribe((newDictionary: any) => (currentDictionary = newDictionary)) -const dictionary = writable({}) -dictionary.subscribe( - (newDictionary: any) => (currentDictionary = newDictionary), -) - -const locale = writable(null) -const localeSet = locale.set -locale.set = (newLocale: string) => { +const $locale = writable(null) +const localeSet = $locale.set +$locale.set = (newLocale: string): void | Promise => { const { locale, loader } = getAvailableLocale(newLocale) if (typeof loader === 'function') { return loader() @@ -100,17 +90,20 @@ locale.set = (newLocale: string) => { throw Error(`[svelte-i18n] Locale "${newLocale}" not found.`) } -locale.update = (fn: (locale: string) => string) => localeSet(fn(currentLocale)) -locale.subscribe((newLocale: string) => (currentLocale = newLocale)) +$locale.update = (fn: (locale: string) => void | Promise) => localeSet(fn(currentLocale)) +$locale.subscribe((newLocale: string) => (currentLocale = newLocale)) + +const format = derived([$locale, $dictionary], () => formatMessage) +const locales = derived([$dictionary], ([$dictionary]) => Object.keys($dictionary)) -const format = derived([locale, dictionary], () => formatMessage) // defineMessages allow us to define and extract dynamic message ids const defineMessages = (i: Record) => i export { customFormats, addCustomFormats } from './formatters' export { - locale, - dictionary, + $locale as locale, + $dictionary as dictionary, + locales, getClientLocale, defineMessages, format as _, diff --git a/src/client/utils.ts b/src/client/utils.ts index 763710e..5f6a682 100644 --- a/src/client/utils.ts +++ b/src/client/utils.ts @@ -49,3 +49,26 @@ export const getClientLocale = ({ return locale || defaultLocale || fallback } + +// function mergeDeep(target: any, source: any) { +// const isObject = (obj: any) => obj && typeof obj === 'object' + +// if (!isObject(target) || !isObject(source)) { +// return source +// } + +// Object.keys(source).forEach(key => { +// const targetValue = target[key] +// const sourceValue = source[key] + +// if (Array.isArray(targetValue) && Array.isArray(sourceValue)) { +// target[key] = targetValue.concat(sourceValue) +// } else if (isObject(targetValue) && isObject(sourceValue)) { +// target[key] = mergeDeep(Object.assign({}, targetValue), sourceValue) +// } else { +// target[key] = sourceValue +// } +// }) + +// return target +// }