Hi,
In Webix Jet documentation, section , you describe how to use Locale plugin
According to your proposal, we should override the setLang method
const locales = import.meta.glob("./locales/*.js");
const words = name => locales[`./locales/${name}.js`]().then(x => x.default);
...
export default class MyApp extends JetApp{
constructor(config){
//...
// patch locales loader, optional
this.use(plugins.Locale, { path: false, storage: this.webix.storage.session });
const ls = this.getService("locale");
ls.setLang = (lang, silent) =>
words(lang).then(w => ls.setLangData(lang, w, silent));
ls.setLang(ls.getLang(), true);
}
}
I suppose this is not needed because the path parameter in the plugin’s config can accept a function.
We can just execute:
const locales = import.meta.glob("./locales/*.js");
const words = name => locales[`./locales/${name}.js`]().then(x => x.default);
this.use(plugins.Locale, { path: words, storage: this.webix.storage.session });
Unfortunately, the problem starts when you try to use the _ (translation method) right after the call.
The method is set asynchronously, and the entire plugin initialization mechanism does not have a callback function or returns a Promise.
Therefore, calling the following method right after plugin initialization will result in an error (due to “_” is not set):
const locales = import.meta.glob("./locales/*.js");
const words = name => locales[`./locales/${name}.js`]().then(x => x.default);
this.use(plugins.Locale, { path: words, storage: this.webix.storage.session });
const { _ } = this.app.getService('locale'); // => null
webix.message(_('...some message...'), 'success'); // => error
Maybe it would be worth changing the plugin’s initialization in the “use” method so that it returns Promise.
And return promise in the setLang method.
something like:
[JetAppBase.ts]
use(plugin, config){
return plugin(this, null, config);
}
[Locale.ts]
export function Locale(app: IJetApp, _view: IJetView, config: any){
...
function setLang(name:string, silent? : boolean){
// ignore setLang if loading by path is disabled
if (config.path === false){
return Promise.resolve();
}
if (typeof config.path === "function"){
return config.path(name).then(data => setLangData(name, data, silent));
//return;
}
...
// ??
}
...
app.setService("locale", service);
return setLang(lang, true);
}
With such changes, we have full control the plugin’s initialization:
const locales = import.meta.glob("./locales/*.js");
const words = name => locales[`./locales/${name}.js`]().then(x => x.default);
this.use(plugins.Locale, { path: words, storage: this.webix.storage.session })
.then(()=> {
const { _ } = this.app.getService('locale');
webix.message(_('...some message...'), 'success');
});
Let me know if such changes are possible. Overriding the setLang method is definitely not a good solution.
BTW:
I’m new to Webix (few weeks) and I’m still study framework