diff --git a/README.md b/README.md index 36d33ee..1a002e4 100644 --- a/README.md +++ b/README.md @@ -37,18 +37,21 @@ i18next.init({ } }); -const i18n = createI18nStore(i18next); -export default i18n; +export const { i18n, t, isError, isLoading } = createI18nStore(i18next); ``` `App.svelte`: ```svelte
- {$i18n.t('key')} + {$i18n.t('key')} + {$t('key')} + {tKey}
``` @@ -93,11 +96,12 @@ export default () => createI18nStore(i18next);

{ $i18n.t("key") }

+

{ $t("key") }

``` diff --git a/src/i18n.test.ts b/src/i18n.test.ts index eeddcc1..884ab5e 100644 --- a/src/i18n.test.ts +++ b/src/i18n.test.ts @@ -1,4 +1,9 @@ -const storeMock = jest.fn(() => ({ i18n: "i18nWritableInstance" })); +const storeMock = jest.fn(() => ({ + i18n: "i18nWritableInstance", + t: "TFunctionWritableInstance", + isLoading: "BooleanWritableInstance", + isError: "BooleanWritableInstance", +})); jest.mock("./translation-store", () => { return { I18NextTranslationStore: storeMock }; }); @@ -13,9 +18,12 @@ describe("i18n module", () => { expect(storeMock).toBeCalled(); }); - it("should return Writable i18n instance", () => { - const store = createI18nStore(i18next); - expect(store).toEqual("i18nWritableInstance"); + it("should return Writable i18n/t/isLoading/isError instance", () => { + const { i18n, t, isLoading, isError } = createI18nStore(i18next); + expect(i18n).toEqual("i18nWritableInstance"); + expect(t).toEqual("TFunctionWritableInstance"); + expect(isLoading).toEqual("BooleanWritableInstance"); + expect(isError).toEqual("BooleanWritableInstance"); }); }); }); \ No newline at end of file diff --git a/src/i18n.ts b/src/i18n.ts index 135cc30..5585983 100644 --- a/src/i18n.ts +++ b/src/i18n.ts @@ -3,5 +3,10 @@ import { I18NextTranslationStore } from './translation-store'; export const createI18nStore = (i18n: i18n) => { const i18nStore = new I18NextTranslationStore(i18n); - return i18nStore.i18n; + return { + i18n: i18nStore.i18n, + t: i18nStore.t, + isLoading: i18nStore.isLoading, + isError: i18nStore.isError + }; } diff --git a/src/index.ts b/src/index.ts index bf3f951..ac55c11 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,2 +1 @@ -export * from "./i18n"; -export * from "./translation-store"; \ No newline at end of file +export * from "./i18n"; \ No newline at end of file diff --git a/src/translation-store.ts b/src/translation-store.ts index 556a005..51f981e 100644 --- a/src/translation-store.ts +++ b/src/translation-store.ts @@ -1,50 +1,41 @@ -import type { i18n } from "i18next"; -import { writable, type Readable, type Writable } from "svelte/store"; +import type { TFunction, i18n } from "i18next"; +import { writable, type Writable } from "svelte/store"; - -export interface TranslationService { - i18n: Readable; -} - -export const isLoading = writable(true); - -export class I18NextTranslationStore implements TranslationService { +export class I18NextTranslationStore { public i18n: Writable; - public isLoading: Writable; + public t: Writable; + public isLoading = writable(true); + public isError = writable(false); constructor(i18n: i18n) { - this.i18n = this.createInstance(i18n); - this.isLoading = this.createLoadingInstance(i18n); + this.i18n = writable(i18n); + this.t = writable(i18n.t); + this.bindOnChange(i18n); + this.bindOnLoad(i18n); } - private createInstance(i18n: i18n): Writable { - const i18nWritable = writable(i18n) + private bindOnChange(i18n: i18n) { + const setupI18n = () => { + this.i18n.set((i18n)); + this.t.set((i18n.t)); + }; - i18n.on('initialized', () => { - i18nWritable.set(i18n) - }) - i18n.on('loaded', () => { - i18nWritable.set(i18n) - }) - i18n.on('added', () => i18nWritable.set(i18n)) - i18n.on('languageChanged', () => { - i18nWritable.set(i18n) - }) - return i18nWritable; + i18n.on('initialized', setupI18n); + i18n.on('loaded', setupI18n); + i18n.on('added', setupI18n); + i18n.on('languageChanged', setupI18n); } - private createLoadingInstance(i18n: i18n): Writable { + private bindOnLoad(i18n: i18n) { // if loaded resources are empty || {}, set loading to true i18n.on('loaded', (resources) => { - Object.keys(resources).length !== 0 && isLoading.set(false) - }) + Object.keys(resources).length !== 0 && this.isLoading.set(false) + }); - // if resources failed loading, set loading to true + // if resources failed loading, set error to true i18n.on('failedLoading', () => { - isLoading.set(true) - }) - - return isLoading; + this.isError.set(true) + }); } }