Skip to content
This repository has been archived by the owner on May 19, 2022. It is now read-only.

Commit

Permalink
Merge pull request #12 from panter/fixes/load-namespaces
Browse files Browse the repository at this point in the history 
Fixes/load namespaces
  • Loading branch information
@claudiocro
claudiocro authored Oct 24, 2017
2 parents a0d6f83 + 15d6490 commit 4efa0f1
Show file tree
Hide file tree
Showing 4 changed files with 185 additions and 49 deletions.
19 changes: 14 additions & 5 deletions src/i18n.js
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,25 @@
import { install, Vue } from './install';

export default class VueI18n {
constructor(i18next, options = { }) {
const { bindI18n = 'languageChanged loaded', bindStore = 'added removed' } = options;
constructor(i18next, opts = {}) {
const options = {
bindI18n: 'languageChanged loaded',
bindStore: 'added removed',
loadComponentNamespace: false,
...opts,
};

this._vm = null;
this.i18next = i18next;
this.options = options;

this.onI18nChanged = this.onI18nChanged.bind(this);

if (bindI18n) { this.i18next.on(bindI18n, this.onI18nChanged); }
if (bindStore && this.i18next.store) {
this.i18next.store.on(bindStore, this.onI18nChanged);
if (options.bindI18n) {
this.i18next.on(options.bindI18n, this.onI18nChanged);
}
if (options.bindStore && this.i18next.store) {
this.i18next.store.on(options.bindStore, this.onI18nChanged);
}

this.resetVM({ i18nLoadedAt: new Date() });
Expand Down
46 changes: 33 additions & 13 deletions src/install.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,9 @@ import component from './component';
export let Vue;

export function install(_Vue) {
if (install.installed) { return; }
if (install.installed) {
return;
}
install.installed = true;

Vue = _Vue;
Expand All @@ -17,6 +19,20 @@ export function install(_Vue) {
return key;
};

const getComponentNamespace = (vm) => {
const namespace = vm.$options.name || vm.$options._componentTag;
if (namespace) {
return {
namespace,
loadNamespace: true,
};
}

return {
namespace: `${Math.random()}`,
};
};

Vue.mixin({
computed: {
$t() {
Expand Down Expand Up @@ -44,45 +60,49 @@ export function install(_Vue) {
let inlineTranslations = {};

if (this.$i18n) {
const namespace = options.name || `${Math.random()}`;
let namespacesToLoad = [namespace];
const getNamespace = this.$i18n.options.getComponentNamespace || getComponentNamespace;
const { namespace, loadNamespace } = getNamespace(this);

if (options.__i18n) {
options.__i18n.forEach((resource) => {
inlineTranslations = deepmerge(inlineTranslations, JSON.parse(resource));
});
}

if (this.$options.i18nOptions) {
if (options.i18nOptions) {
const { lng = null, keyPrefix = null, messages } = this.$options.i18nOptions;
let { namespaces } = this.$options.i18nOptions;
namespaces = namespaces || this.$i18n.i18next.options.defaultNS;

if (typeof namespaces === 'string') namespaces = [namespaces];
namespacesToLoad = namespaces.concat(namespacesToLoad);
const namespacesToLoad = namespaces.concat([namespace]);

if (messages) {
inlineTranslations = deepmerge(inlineTranslations, messages);
}

this._i18nOptions = { lng, namespaces: namespacesToLoad, keyPrefix };
this.$i18n.i18next.loadNamespaces(namespaces);
} else if (options.parent && options.parent._i18nOptions) {
this._i18nOptions = options.parent._i18nOptions;
} else if (options.__i18n) {
this._i18nOptions = { namespaces: namespacesToLoad };
this._i18nOptions = { namespaces: [namespace] };
}

if (loadNamespace && this.$i18n.options.loadComponentNamespace) {
this.$i18n.i18next.loadNamespaces([namespace]);
}

const languages = Object.keys(inlineTranslations);
languages.forEach((lang) => {
this.$i18n.i18next.addResourceBundle(
lang,
namespace,
{ ...inlineTranslations[lang] },
true,
false);
lang,
namespace,
{ ...inlineTranslations[lang] },
true,
false,
);
});

this.$i18n.i18next.loadNamespaces(Array.from(new Set(namespacesToLoad)));
}
},
});
Expand Down
41 changes: 13 additions & 28 deletions test/unit/component.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,15 +35,13 @@ describe('Components namespaces', () => {
'sub-child1': {
i18nOptions: { lng: 'de' },
render(h) {
return h('div', { }, [
h('p', { ref: 'hello' }, [this.$t('hello')]),
]);
return h('div', {}, [h('p', { ref: 'hello' }, [this.$t('hello')])]);
},
},
'sub-child2': {
i18nOptions: { namespaces: 'common' },
render(h) {
return h('div', { }, [
return h('div', {}, [
h('p', { ref: 'key1' }, [this.$t('key1', { name: 'Waldo' })]),
]);
},
Expand All @@ -62,14 +60,12 @@ describe('Components namespaces', () => {
'sub-child1': {
i18nOptions: { lng: 'de' },
render(h) {
return h('div', { }, [
h('p', { ref: 'hello' }, [this.$t('hello')]),
]);
return h('div', {}, [h('p', { ref: 'hello' }, [this.$t('hello')])]);
},
},
'sub-child2': {
render(h) {
return h('div', { }, [
return h('div', {}, [
h('p', { ref: 'key1' }, [this.$t('key1', { name: 'Waldo' })]),
]);
},
Expand All @@ -93,7 +89,6 @@ describe('Components namespaces', () => {
},
}).$mount(el);


vm.$nextTick(done);
});

Expand All @@ -118,7 +113,6 @@ describe('Components namespaces', () => {
});
});


describe('Component inline translation', () => {
describe('only with the i18n tag', () => {
const i18next1 = i18next.createInstance();
Expand All @@ -142,7 +136,8 @@ describe('Component inline translation', () => {
}),
JSON.stringify({
en: { yesNo: { no: 'No', maybe: 'Maybe?' } },
})],
}),
],
render(h) {
return h('div', {}, [
h('p', { ref: 'yesNoYes' }, [this.$t('yesNo.yes')]),
Expand All @@ -152,7 +147,6 @@ describe('Component inline translation', () => {
},
}).$mount(el);


vm.$nextTick(done);
});

Expand Down Expand Up @@ -201,7 +195,8 @@ describe('Component inline translation', () => {
}),
JSON.stringify({
en: { yesNo: { no: 'No', maybe: 'Maybe?' } },
})],
}),
],
render(h) {
return h('div', {}, [
h('p', { ref: 'welcome' }, [this.$t('welcome')]),
Expand All @@ -213,7 +208,6 @@ describe('Component inline translation', () => {
},
}).$mount(el);


vm.$nextTick(done);
});

Expand Down Expand Up @@ -252,13 +246,10 @@ describe('Components with backend', () => {
i18nOptions: { namespaces: 'common' },

render(h) {
return h('div', {}, [
h('p', { ref: 'hello' }, [this.$t('key1')]),
]);
return h('div', {}, [h('p', { ref: 'hello' }, [this.$t('key1')])]);
},
}).$mount(el);


vm.$nextTick(done);
});

Expand Down Expand Up @@ -292,36 +283,30 @@ describe('Components with backend', () => {
'sub-child1': {
i18nOptions: { lng: 'de' },
render(h) {
return h('div', { }, [
h('p', { ref: 'key11' }, [this.$t('key1')]),
]);
return h('div', {}, [h('p', { ref: 'key11' }, [this.$t('key1')])]);
},
},
'sub-child2': {
i18nOptions: { namespaces: 'common' },
render(h) {
return h('div', { }, [
h('p', { ref: 'key12' }, [this.$t('key1')]),
]);
return h('div', {}, [h('p', { ref: 'key12' }, [this.$t('key1')])]);
},
},
},
render(h) {
return h('div', {}, [
h('sub-child1', { ref: 'sub-child1' }),
h('sub-child2', { ref: 'sub-child2' }),
h('sub-child2', { ref: 'sub-child3' }),
]);
},
},
},
render(h) {
return h('div', {}, [
h('child1', { ref: 'child1' }),
]);
return h('div', {}, [h('child1', { ref: 'child1' })]);
},
}).$mount(el);


vm.$nextTick(done);
});

Expand Down
Loading

0 comments on commit 4efa0f1

Please sign in to comment.