From d0c86a05ad4b304bbb6c67a6e890be1a97119059 Mon Sep 17 00:00:00 2001
From: Christoph Reiter <reiter.christoph@gmail.com>
Date: Thu, 1 Jul 2021 17:14:31 +0200
Subject: [PATCH] organization-select: one i18next instance per element
---
.../src/dbp-organization-select-demo.js | 16 ++++++++--------
packages/organization-select/src/i18n.js | 6 ++++--
.../src/organization-select.js | 8 +++++---
3 files changed, 17 insertions(+), 13 deletions(-)
diff --git a/packages/organization-select/src/dbp-organization-select-demo.js b/packages/organization-select/src/dbp-organization-select-demo.js
index 1ece3ccb..6d4898bc 100644
--- a/packages/organization-select/src/dbp-organization-select-demo.js
+++ b/packages/organization-select/src/dbp-organization-select-demo.js
@@ -1,4 +1,4 @@
-import {i18n} from './i18n.js';
+import {createInstance} from './i18n.js';
import {css, html} from 'lit-element';
import {ScopedElementsMixin} from '@open-wc/scoped-elements';
import {OrganizationSelect} from './organization-select.js';
@@ -10,7 +10,8 @@ import DBPLitElement from "@dbp-toolkit/common/dbp-lit-element";
export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) {
constructor() {
super();
- this.lang = 'de';
+ this._i18n = createInstance();
+ this.lang = this._i18n.language;
this.entryPointUrl = '';
this.noAuth = false;
}
@@ -32,12 +33,11 @@ export class OrganizationSelectDemo extends ScopedElementsMixin(DBPLitElement) {
};
}
- connectedCallback() {
- super.connectedCallback();
- i18n.changeLanguage(this.lang);
-
- this.updateComplete.then(()=>{
- });
+ update(changedProperties) {
+ if (changedProperties.has("lang")) {
+ this._i18n.changeLanguage(this.lang);
+ }
+ super.update(changedProperties);
}
static get styles() {
diff --git a/packages/organization-select/src/i18n.js b/packages/organization-select/src/i18n.js
index 498d9f03..975c1993 100644
--- a/packages/organization-select/src/i18n.js
+++ b/packages/organization-select/src/i18n.js
@@ -1,6 +1,8 @@
-import {createInstance} from '@dbp-toolkit/common/i18next.js';
+import {createInstance as _createInstance} from '@dbp-toolkit/common/i18next.js';
import de from './i18n/de/translation.json';
import en from './i18n/en/translation.json';
-export const i18n = createInstance({en: en, de: de}, 'de', 'en');
\ No newline at end of file
+export function createInstance() {
+ return _createInstance({en: en, de: de}, 'de', 'en');
+}
\ No newline at end of file
diff --git a/packages/organization-select/src/organization-select.js b/packages/organization-select/src/organization-select.js
index 578fb010..d96c7937 100644
--- a/packages/organization-select/src/organization-select.js
+++ b/packages/organization-select/src/organization-select.js
@@ -1,7 +1,7 @@
import $ from 'jquery';
import select2 from 'select2';
import select2CSSPath from 'select2/dist/css/select2.min.css';
-import {i18n} from './i18n.js';
+import {createInstance} from './i18n.js';
import {css, html} from 'lit-element';
import * as commonUtils from '@dbp-toolkit/common/utils';
import * as commonStyles from '@dbp-toolkit/common/styles';
@@ -16,7 +16,8 @@ export class OrganizationSelect extends AdapterLitElement {
constructor() {
super();
this.auth = {};
- this.lang = i18n.language;
+ this._i18n = createInstance();
+ this.lang = this._i18n.language;
this.entryPointUrl = '';
this.jsonld = null;
this.organizations = [];
@@ -93,6 +94,7 @@ export class OrganizationSelect extends AdapterLitElement {
}
async updateSelect2() {
+ const i18n = this._i18n;
await this.updateComplete;
const $select = this.$('#' + this.selectId);
@@ -181,7 +183,7 @@ export class OrganizationSelect extends AdapterLitElement {
changedProperties.forEach((oldValue, propName) => {
switch (propName) {
case "lang":
- i18n.changeLanguage(this.lang);
+ this._i18n.changeLanguage(this.lang);
this.updateSelect2();
break;
case "value": {
--
GitLab