@tolgee/core 3.1.3 → 3.3.0-prerelease-a220912.0

package/dist/tolgee.cjs.js

@@ -398,6 +398,9 @@ var TranslationService = /** @class */ (function () {
         this.eventService = eventService;
         this.translationsCache = new Map();
         this.fetchPromises = {};
+        // we need to distinguish which languages are in cache initially
+        // because we need to refetch them in dev mode
+        this.fetchedDev = {};
         this.updateTranslationInCache = function (data) { return __awaiter(_this, void 0, void 0, function () {
             var result;
             var _this = this;
@@ -490,8 +493,7 @@ var TranslationService = /** @class */ (function () {
     TranslationService.prototype.initStatic = function () {
         var _this = this;
         var _a;
-        if (this.properties.config.mode === 'production' &&
-            typeof ((_a = this.properties.config) === null || _a === void 0 ? void 0 : _a.staticData) === 'object') {
+        if (typeof ((_a = this.properties.config) === null || _a === void 0 ? void 0 : _a.staticData) === 'object') {
             Object.entries(this.properties.config.staticData).forEach(function (_a) {
                 var _b = __read(_a, 2), language = _b[0], data = _b[1];
                 //if not provider or promise then it is raw data
@@ -510,7 +512,7 @@ var TranslationService = /** @class */ (function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        if (!(this.translationsCache.get(lang) == undefined)) return [3 /*break*/, 2];
+                        if (!this.isFetchNeeded(lang)) return [3 /*break*/, 2];
                         if (!(this.fetchPromises[lang] instanceof Promise)) {
                             this.fetchPromises[lang] = this.fetchTranslations(lang);
                         }
@@ -529,25 +531,28 @@ var TranslationService = /** @class */ (function () {
     TranslationService.prototype.getTranslation = function (key, lang, defaultValue) {
         if (lang === void 0) { lang = this.properties.currentLanguage; }
         return __awaiter(this, void 0, void 0, function () {
-            var message;
+            var message, fallbackLang;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        message = this.getFromCache(key, lang);
-                        if (!!message) return [3 /*break*/, 3];
+                        if (!this.isFetchNeeded(lang)) return [3 /*break*/, 2];
                         return [4 /*yield*/, this.loadTranslations(lang)];
                     case 1:
                         _a.sent();
+                        _a.label = 2;
+                    case 2:
                         message = this.getFromCache(key, lang);
-                        if (!!message) return [3 /*break*/, 3];
-                        message = this.getFromCache(key, this.properties.config.fallbackLanguage);
-                        if (!!message) return [3 /*break*/, 3];
+                        if (!!message) return [3 /*break*/, 5];
+                        fallbackLang = this.properties.config.fallbackLanguage;
+                        if (!this.isFetchNeeded(fallbackLang)) return [3 /*break*/, 4];
                         return [4 /*yield*/, this.loadTranslations(this.properties.config.fallbackLanguage)];
-                    case 2:
+                    case 3:
                         _a.sent();
+                        _a.label = 4;
+                    case 4:
                         message = this.getFromCache(key, this.properties.config.fallbackLanguage);
-                        _a.label = 3;
-                    case 3: return [2 /*return*/, TranslationService.translationByValue(message, defaultValue)];
+                        _a.label = 5;
+                    case 5: return [2 /*return*/, TranslationService.translationByValue(message, defaultValue)];
                 }
             });
         });
@@ -682,12 +687,20 @@ var TranslationService = /** @class */ (function () {
             this.getFromCache(key, this.properties.config.fallbackLanguage);
         return TranslationService.translationByValue(message, defaultValue);
     };
+    TranslationService.prototype.isFetchNeeded = function (lang) {
+        var isDevMode = this.properties.config.mode === 'development';
+        var dataPresent = this.translationsCache.get(lang) !== undefined;
+        var devFetched = Boolean(this.fetchedDev[lang]);
+        return (isDevMode && !devFetched) || !dataPresent;
+    };
     TranslationService.prototype.fetchTranslations = function (lang) {
         return __awaiter(this, void 0, void 0, function () {
+            var isDevMode;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        if (!(this.properties.config.mode === 'development')) return [3 /*break*/, 2];
+                        isDevMode = this.properties.config.mode === 'development';
+                        if (!isDevMode) return [3 /*break*/, 2];
                         return [4 /*yield*/, this.fetchTranslationsDevelopment(lang)];
                     case 1: return [2 /*return*/, _a.sent()];
                     case 2: return [4 /*yield*/, this.fetchTranslationsProduction(lang)];
@@ -772,6 +785,7 @@ var TranslationService = /** @class */ (function () {
                         return [4 /*yield*/, this.apiHttpService.fetchJson("v2/projects/translations/".concat(language))];
                     case 3:
                         data = _a.sent();
+                        this.fetchedDev[language] = true;
                         this.setLanguageData(language, data[language] || {});
                         return [3 /*break*/, 5];
                     case 4:
@@ -1074,37 +1088,38 @@ var TranslationHighlighter = /** @class */ (function () {
         }); }); });
     };
     TranslationHighlighter.prototype.getRenderer = function () {
+        var _a;
         return __awaiter(this, void 0, void 0, function () {
             var possibleProviders, possibleProviders_1, possibleProviders_1_1, possibleProvider, constructorProvider, constructor, constructor, e_2_1;
-            var e_2, _a;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
+            var e_2, _b;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
                     case 0:
                         if (!(this._renderer === undefined)) return [3 /*break*/, 11];
                         possibleProviders = [
                             this.dependencies.properties.config.ui,
-                            window['@tolgee/ui'],
+                            (_a = window['@tolgee/ui']) === null || _a === void 0 ? void 0 : _a.UI,
                         ];
-                        _b.label = 1;
+                        _c.label = 1;
                     case 1:
-                        _b.trys.push([1, 8, 9, 10]);
+                        _c.trys.push([1, 8, 9, 10]);
                         possibleProviders_1 = __values(possibleProviders), possibleProviders_1_1 = possibleProviders_1.next();
-                        _b.label = 2;
+                        _c.label = 2;
                     case 2:
                         if (!!possibleProviders_1_1.done) return [3 /*break*/, 7];
                         possibleProvider = possibleProviders_1_1.value;
                         if (!(typeof possibleProvider === 'function')) return [3 /*break*/, 6];
-                        _b.label = 3;
+                        _c.label = 3;
                     case 3:
-                        _b.trys.push([3, 5, , 6]);
+                        _c.trys.push([3, 5, , 6]);
                         constructorProvider = possibleProvider;
                         return [4 /*yield*/, constructorProvider()];
                     case 4:
-                        constructor = _b.sent();
+                        constructor = _c.sent();
                         this._renderer = new constructor(this.dependencies);
                         return [3 /*break*/, 6];
                     case 5:
-                        _b.sent();
+                        _c.sent();
                         constructor = possibleProvider;
                         this._renderer = new constructor(this.dependencies);
                         return [3 /*break*/, 6];
@@ -1113,12 +1128,12 @@ var TranslationHighlighter = /** @class */ (function () {
                         return [3 /*break*/, 2];
                     case 7: return [3 /*break*/, 10];
                     case 8:
-                        e_2_1 = _b.sent();
+                        e_2_1 = _c.sent();
                         e_2 = { error: e_2_1 };
                         return [3 /*break*/, 10];
                     case 9:
                         try {
-                            if (possibleProviders_1_1 && !possibleProviders_1_1.done && (_a = possibleProviders_1.return)) _a.call(possibleProviders_1);
+                            if (possibleProviders_1_1 && !possibleProviders_1_1.done && (_b = possibleProviders_1.return)) _b.call(possibleProviders_1);
                         }
                         finally { if (e_2) throw e_2.error; }
                         return [7 /*endfinally*/];
@@ -1128,7 +1143,7 @@ var TranslationHighlighter = /** @class */ (function () {
                             console.warn('Tolgee UI is not provided. To translate interactively provide tolgee ui constructor to "ui" configuration property. ' +
                                 'To disable highlighting use production mode.');
                         }
-                        _b.label = 11;
+                        _c.label = 11;
                     case 11: return [2 /*return*/, this._renderer];
                 }
             });
@@ -1598,6 +1613,8 @@ var CoreService = /** @class */ (function () {
     return CoreService;
 }());
 
+var API_KEY_LOCAL_STORAGE = '__tolgee_apiKey';
+var API_URL_LOCAL_STORAGE = '__tolgee_apiUrl';
 var DEFAULT_TARGET_ELEMENT_SUPPLIER = function () {
     if (typeof document !== 'undefined') {
         return document.body;
@@ -1605,7 +1622,6 @@ var DEFAULT_TARGET_ELEMENT_SUPPLIER = function () {
 };
 var TolgeeConfig = /** @class */ (function () {
     function TolgeeConfig(config) {
-        this.apiUrl = 'https://app.tolgee.io';
         this.inputPrefix = '%-%tolgee:';
         this.inputSuffix = '%-%';
         this.defaultLanguage = 'en';
@@ -1647,6 +1663,12 @@ var TolgeeConfig = /** @class */ (function () {
             },
         });
         Object.assign(this, config || {});
+        if (typeof sessionStorage !== 'undefined') {
+            this.apiUrl =
+                sessionStorage.getItem(API_URL_LOCAL_STORAGE) || this.apiUrl;
+            this.apiKey =
+                sessionStorage.getItem(API_KEY_LOCAL_STORAGE) || this.apiKey;
+        }
         if (this._targetElement === undefined) {
             this._targetElement = DEFAULT_TARGET_ELEMENT_SUPPLIER();
         }
@@ -1712,7 +1734,7 @@ var PluginManager = /** @class */ (function () {
         this.handshake = function () {
             var sharedConfiguration = __assign(__assign({}, _this.properties), { config: __assign(__assign({}, _this.properties.config), { 
                     //remove properties, which cannot be sent by window.postMessage
-                    staticData: undefined, targetElement: undefined, _targetElement: undefined, ui: undefined }) });
+                    staticData: undefined, targetElement: undefined, _targetElement: undefined, ui: undefined }), uiPresent: Boolean(_this.properties.config.ui), uiVersion: "3.3.0-prerelease-a220912.0" });
             var timer = null;
             var ping = function () {
                 _this.messages.send('TOLGEE_READY', sharedConfiguration);
@@ -2968,19 +2990,16 @@ var Tolgee = /** @class */ (function () {
          * fetching so initial loading is not needed at all.
          */
         get: function () {
-            var _a, _b, _c, _d;
-            if (((_b = (_a = this.properties) === null || _a === void 0 ? void 0 : _a.config) === null || _b === void 0 ? void 0 : _b.mode) !== 'production') {
-                return true;
-            }
+            var _a, _b;
             var currentLang = this.properties.currentLanguage;
             var fallbackLang = this.properties.config.fallbackLanguage;
             var fallbackPreloading = this.properties.config.preloadFallback;
             var isStaticDataProvided = function (data) {
                 return data !== undefined && typeof data !== 'function';
             };
-            return (!isStaticDataProvided((_c = this.properties.config.staticData) === null || _c === void 0 ? void 0 : _c[currentLang]) ||
+            return (!isStaticDataProvided((_a = this.properties.config.staticData) === null || _a === void 0 ? void 0 : _a[currentLang]) ||
                 (!!fallbackPreloading &&
-                    !isStaticDataProvided((_d = this.properties.config.staticData) === null || _d === void 0 ? void 0 : _d[fallbackLang])));
+                    !isStaticDataProvided((_b = this.properties.config.staticData) === null || _b === void 0 ? void 0 : _b[fallbackLang])));
         },
         enumerable: false,
         configurable: true
@@ -3030,28 +3049,40 @@ var Tolgee = /** @class */ (function () {
     };
     Tolgee.prototype.run = function () {
         return __awaiter(this, void 0, void 0, function () {
+            var e_1;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         this.dependencyService.run();
-                        if (!(this.properties.config.mode === 'development')) return [3 /*break*/, 2];
-                        return [4 /*yield*/, this.coreService.loadApiKeyDetails()];
+                        if (!(this.properties.config.mode === 'development')) return [3 /*break*/, 4];
+                        _a.label = 1;
                     case 1:
+                        _a.trys.push([1, 3, , 4]);
+                        return [4 /*yield*/, this.coreService.loadApiKeyDetails()];
+                    case 2:
                         _a.sent();
-                        _a.label = 2;
-                    case 2: return [4 /*yield*/, this.dependencyService.translationService.loadTranslations()];
+                        return [3 /*break*/, 4];
                     case 3:
+                        e_1 = _a.sent();
+                        // eslint-disable-next-line no-console
+                        console.error("Couldn't connect to tolgee");
+                        // eslint-disable-next-line no-console
+                        console.error(e_1);
+                        this.properties.config.mode = 'production';
+                        return [3 /*break*/, 4];
+                    case 4: return [4 /*yield*/, this.dependencyService.translationService.loadTranslations()];
+                    case 5:
                         _a.sent();
                         return [4 /*yield*/, this.dependencyService.pluginManager.run()];
-                    case 4:
+                    case 6:
                         _a.sent();
-                        if (!this.properties.config.preloadFallback) return [3 /*break*/, 6];
+                        if (!this.properties.config.preloadFallback) return [3 /*break*/, 8];
                         return [4 /*yield*/, this.dependencyService.translationService.loadTranslations(this.properties.config.fallbackLanguage)];
-                    case 5:
-                        _a.sent();
-                        _a.label = 6;
-                    case 6: return [4 /*yield*/, this.refresh()];
                     case 7:
+                        _a.sent();
+                        _a.label = 8;
+                    case 8: return [4 /*yield*/, this.refresh()];
+                    case 9:
                         _a.sent();
                         if (this.properties.config.watch) {
                             this.dependencyService.observer.observe();