Add I18N feature
kiaking opened this issue ยท 3 comments
It would be super cool if we can have default Japanese messages for things like validation error messages.
So, how about this design.
Installation and usage
First we use Pinia to store locale for Sefirot. We can also use provide/inject
but since we are already using Pinia for Snackbars, I think it would be easier.
To be able to tree shake, let user install lang as a plugin.
// main.ts
import { createSefirot } from '@globalbrain/seifort/lib/Sefirot'
import { ja } from '@globalbrain/seifort/lib/locales/ja'
// Create a new sefirot object for plugin installation.
// In case we need to hook something here in the future.
//
// By default, English is always available.
const sefirot = createSefirot({
langs: { ja },
})
app.use(sefirot)
In user's app, set Sefirot locale when setting app locale. Directly to Sefirot Lang Store.
import { useLocaleStore } from '@globalbrain/seifort/lib/stores/Locale'
const localeStore = useLocaleStore()
localeStore.set('ja')
Customization
User could create their own locale file to pass in as an plugin options. Maybe we should make the locale file flat, and make it easier to merge ๐ค
// main.ts
import { createSefirot } from '@globalbrain/seifort/lib/Sefirot'
import { ja } from '@globalbrain/seifort/lib/locales/ja'
const customJa = {
'v_required': 'Custom validation message'
}
const sefirot = createSefirot({
langs: { ja: { ...ja, ...customJa } },
})
app.use(sefirot)
Do you intend that createSefirot
is the entry point of whole Sefirot-related things?
If so, it would be better to export it from somewhere else than @globalbrain/seifort/lib/lang/ja
, because the path looks like for locale things ๐ค
// main.ts
import { createSefirot } from '@globalbrain/seifort'
import { ja } from '@globalbrain/seifort/lib/lang'
const sefirot = createSefirot({
langs: { ja },
})
app.use(sefirot)
Or, an alternative would be renaming the exported function for it to be more locale-specific.
So that we could compose plugins/functions as we need for the application instead of initializing everything always.
// main.ts
import { createI18n, ja } from '@globalbrain/seifort/lib/lang'
const i18n = createI18n({
langs: { ja },
})
app.use(i18n)
Ah yeah, sorry. Your first one is correct ๐
Updated the description. But instead of sefirot
, sefirot/lib/Sefirot
, because we don't wanna have root index file.
I was thinking about this the other day, our challenge at the moment might be how do we pass translations into validation rules ๐ค They are not composable so... we might have to get creative here.