@acorex/core 19.13.0-next.1 → 19.13.0-next.3

package/fesm2022/acorex-core-translation.mjs

@@ -1,9 +1,9 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, Injectable, Directive, Pipe, provideAppInitializer, NgModule } from '@angular/core';
-import { of, shareReplay, firstValueFrom, BehaviorSubject, switchMap, from } from 'rxjs';
-import { get } from 'lodash-es';
-import { AXLocaleService } from '@acorex/core/locale';
-import { waitFor } from '@acorex/core/utils';
+import { AXEventService } from '@acorex/core/events';
+import { set, get } from 'lodash-es';
+import { of, BehaviorSubject, forkJoin, tap, catchError, finalize, shareReplay, startWith, map, distinctUntilChanged, switchMap, firstValueFrom } from 'rxjs';
+import { AXLocaleEvents, AXLocaleService } from '@acorex/core/locale';
 
 const AX_TRANSLATION_CONFIG = new InjectionToken('AX_TRANSLATION_CONFIG', {
     providedIn: 'root',
@@ -12,17 +12,9 @@ const AX_TRANSLATION_CONFIG = new InjectionToken('AX_TRANSLATION_CONFIG', {
     },
 });
 const AXTranslationDefaultConfig = {
-    defaults: {
-        lang: 'en-US',
-        scope: 'common',
-    },
-    preload: {
-        langs: ['en-US'],
-        scopes: ['common'],
-    },
-    resolver: {
-        scopeKey: 'scope',
-    },
+    defaultLang: 'en-US',
+    defaultScope: 'common',
+    scopeResolverKey: 'scope',
 };
 function translationConfig(config = {}) {
     const result = {
@@ -33,7 +25,7 @@ function translationConfig(config = {}) {
 }
 
 class AXTranslationLoaderDefault {
-    load(options) {
+    getTranslation(options) {
         return of({});
     }
 }
@@ -44,256 +36,232 @@ const AX_TRANSLATION_LOADER = new InjectionToken('AX_TRANSLATION_LOADER', {
     },
 });
 
-class AXTranslationLoaderService {
-    constructor() {
-        this.loader = inject(AX_TRANSLATION_LOADER);
-        this.config = inject(AX_TRANSLATION_CONFIG);
-        this.cache = new Map();
-        this.inflight = new Map();
+let singletonInstance;
+function translateSync(key, options) {
+    return singletonInstance.translateSync(key, options);
+}
+class AXTranslationService {
+    getDefaultLang() {
+        return this.config.defaultLang;
     }
-    load(lang, scope) {
-        const key = `${lang}:${scope}`;
-        console.log('load', key);
-        if (this.cache.has(key)) {
-            return of(this.cache.get(key));
-        }
-        if (!this.inflight.has(key)) {
-            const obs = this.loader.load({ lang, scope }).pipe(shareReplay(1));
-            this.inflight.set(key, obs);
-            obs.subscribe({
-                next: (data) => {
-                    this.cache.set(key, data);
-                    this.inflight.delete(key);
-                },
-                error: () => {
-                    this.inflight.delete(key);
-                },
+    getActiveLang() {
+        return this.activeLang.getValue();
+    }
+    setActiveLang(lang) {
+        if (lang != this.getActiveLang()) {
+            this.activeLang.next(lang);
+            this.eventService.emitEvent({
+                type: AXLocaleEvents.AXLanguageChanged,
+                payload: lang,
             });
         }
-        return this.inflight.get(key);
     }
-    peek(lang, scope, key) {
-        const cacheKey = `${lang}:${scope}`;
-        const data = this.cache.get(cacheKey);
-        return get(data, key, null);
-    }
-    async preload(options) {
-        const langs = [...new Set(options?.langs ?? this.config.preload?.langs ?? [this.config.defaults.lang])];
-        const scopes = [...new Set(options?.scopes ?? this.config.preload?.scopes ?? [this.config.defaults.scope])];
-        const promises = [];
-        langs.forEach(lang => {
-            scopes.forEach(scope => {
-                const p = firstValueFrom(this.load(lang, scope));
-                promises.push(p);
-            });
+    /**
+     * @ignore
+     */
+    constructor() {
+        this.loader = inject(AX_TRANSLATION_LOADER);
+        this.config = inject(AX_TRANSLATION_CONFIG);
+        this.eventService = inject(AXEventService);
+        this.localeService = inject(AXLocaleService);
+        this.translationCache = {};
+        this.ongoingRequests = new Map();
+        this.activeLang = new BehaviorSubject(this.getDefaultLang());
+        this.langChanges$ = this.activeLang.asObservable();
+        this.expressionCache = new Map();
+        this.isExpression = (value) => value.includes('t(');
+        singletonInstance = this;
+        //
+        this.localeService.profileChanged$.subscribe((locale) => {
+            if (locale?.localeInfo?.code) {
+                this.setActiveLang(locale.localeInfo.code);
+            }
         });
-        await Promise.all(promises);
     }
-    clear() {
-        this.cache.clear();
-        this.inflight.clear();
+    loadLanguagesAndScopes(languages, scopes) {
+        const requests = languages.flatMap((lang) => scopes.map((scope) => {
+            // Check if translations are already cached
+            if (this.translationCache[lang]?.[scope]) {
+                return of(this.translationCache[lang][scope]);
+            }
+            // Use the new method to handle ongoing requests and loading
+            return this.fetchTranslationFiles(lang, scope);
+        }));
+        return forkJoin(requests);
     }
-    getFallbackLangs(lang) {
-        return this.config.fallbacks?.langs?.[lang] ?? [];
+    fetchTranslationFiles(lang, scope) {
+        const requestKey = `${lang}_${scope}`;
+        // Return existing observable if the request is already in progress
+        if (this.ongoingRequests.has(requestKey)) {
+            return this.ongoingRequests.get(requestKey);
+        }
+        // Load translations if not in cache or ongoing requests
+        const translationObservable = this.loader.getTranslation({ lang, scope }).pipe(tap((translations) => this.setTranslationCache(lang, scope, translations)), catchError((error) => {
+            this.handleError(`Error loading translations for lang: ${lang}, scope: ${scope}`, error);
+            return of(null);
+        }), finalize(() => {
+            this.eventService.emitEvent({
+                type: AXLocaleEvents.AXLanguageLoaded,
+                payload: lang,
+            });
+            this.ongoingRequests.delete(requestKey);
+        }), shareReplay(1));
+        this.ongoingRequests.set(requestKey, translationObservable);
+        return translationObservable;
     }
-    getFallbackScopes(scope) {
-        return this.config.fallbacks?.scopes?.[scope] ?? [];
+    //#region  Helpers Methods
+    /**
+     * Set translation data into cache
+     */
+    setTranslationCache(lang, scope, translations) {
+        set(this.translationCache, `${lang}.${scope}`, translations);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationLoaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationLoaderService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationLoaderService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
-class TranslationParserService {
-    constructor() {
-        this.legacyRegex = /t\(["']([^"']+)["']\s*(?:,\s*(\{.*?\}))?\)/g;
-        this.inlineRegex = /@([a-zA-Z\-]+:)?([a-zA-Z0-9_-]+):([a-zA-Z0-9_.:-]+)(?=[\\s.,;!?)]|$)/g;
+    /**
+     * Get the translation from the cache or fallback to loading
+     */
+    getTranslationFromCache(lang, scope, key) {
+        return get(this.translationCache, `${lang}.${scope}.${key}`, key);
     }
-    isExpression(value) {
-        return typeof value === 'string' && (value.includes('t(') || value.includes('@'));
+    isLangAvailable(lang, scope = null) {
+        return !this.translationCache[lang] && (!scope || !this.translationCache[lang][scope]);
     }
-    parse(expression, currentLang, currentScope) {
-        const tokens = [];
-        // Extract inline references like @lang:scope:key or @scope:key
-        let inlineMatch;
-        while ((inlineMatch = this.inlineRegex.exec(expression)) !== null) {
-            const langPart = inlineMatch[1]?.replace(':', '') ?? null;
-            const scope = inlineMatch[2] ?? currentScope;
-            const key = inlineMatch[3];
-            const fullMatch = inlineMatch[0];
-            tokens.push({ lang: langPart || currentLang, scope, key, fullMatch });
-        }
-        // Extract legacy expressions
-        let legacyMatch;
-        while ((legacyMatch = this.legacyRegex.exec(expression)) !== null) {
-            const key = legacyMatch[1];
-            const rawOptions = legacyMatch[2];
-            let scope = currentScope;
-            let lang = currentLang;
-            if (rawOptions) {
-                try {
-                    const jsonString = rawOptions
-                        .replace(/(['"])?([a-zA-Z0-9_]+)(['"])?\s*:/g, '"$2":')
-                        .replace(/'/g, '"');
-                    const options = JSON.parse(jsonString);
-                    scope = options.scope || scope;
-                    lang = options.lang || lang;
-                }
-                catch (err) {
-                    console.error('Invalid translation expression options:', err);
-                }
-            }
-            tokens.push({ key, scope, lang, fullMatch: legacyMatch[0] });
+    translateKey(key, lang, scope, params) {
+        // Trigger async preloading without blocking execution
+        this.loadLanguagesAndScopes([lang], [scope]).pipe(startWith()).subscribe({
+            error: (err) => {
+                this.handleError(`Error preloading translations for ${lang}, ${scope}`, err);
+            },
+        });
+        // Retrieve the translation from the cache or fallback to the key
+        let translation = this.getTranslationFromCache(lang, scope, key);
+        // Replace params like {{ name }}
+        if (params && typeof translation === 'string') {
+            Object.keys(params).forEach((paramKey) => {
+                translation = translation.replace(new RegExp(`{{\\s*${paramKey}\\s*}}`, 'g'), params[paramKey]);
+            });
         }
-        return tokens;
-    }
-}
-
-class TranslationResolverService {
-    constructor() {
-        this.loaderService = inject(AXTranslationLoaderService);
-        this.cache = new Map();
-        this.inflight = new Map();
-        this.parser = new TranslationParserService();
+        return translation || key;
     }
-    async resolve(lang, scope, key, params) {
-        const cacheKey = `${lang}:${scope}`;
-        // Load and cache if not present
-        if (!this.cache.has(cacheKey)) {
-            if (!this.inflight.has(cacheKey)) {
-                const fetchPromise = firstValueFrom(this.loaderService.load(lang, scope));
-                this.inflight.set(cacheKey, fetchPromise);
-                const data = await fetchPromise;
-                this.cache.set(cacheKey, data);
-                this.inflight.delete(cacheKey);
+    decodeExpression(expression) {
+        if (this.expressionCache.has(expression)) {
+            return this.expressionCache.get(expression);
+        }
+        const regex = /t\(["']([^"']+)["']\s*(?:,\s*(\{.*?\}))?\)/g;
+        const matches = [];
+        let match;
+        while ((match = regex.exec(expression)) !== null) {
+            const key = match[1];
+            const rawOptions = match[2];
+            if (!rawOptions) {
+                matches.push({ key, scope: null, lang: null, fullMatch: match[0] });
+                continue;
             }
-            else {
-                await this.inflight.get(cacheKey); // wait for the inflight fetch
+            try {
+                const jsonString = rawOptions
+                    .replace(/(['"])?([a-zA-Z0-9_]+)(['"])?\s*:/g, '"$2":') // Ensure keys are quoted
+                    .replace(/'/g, '"'); // Replace single quotes with double quotes
+                const options = JSON.parse(jsonString);
+                matches.push({
+                    key,
+                    scope: options.scope || null,
+                    lang: options.lang || null,
+                    fullMatch: match[0],
+                });
             }
-        }
-        const translations = this.cache.get(cacheKey);
-        let result = get(translations, key, key);
-        // Recursively resolve references
-        if (typeof result === 'string' && this.parser.isExpression(result)) {
-            const tokens = this.parser.parse(result, lang, scope);
-            if (tokens.length > 0) {
-                const first = tokens[0];
-                result = await this.resolve(first.lang || lang, first.scope || scope, first.key, params);
+            catch (error) {
+                this.handleError(`Failed to parse options for key "${key}":`, error);
+                matches.push({ key, scope: null, lang: null, fullMatch: match[0] });
             }
         }
-        return this.format(result, params);
-    }
-    format(text, params) {
-        if (!params || typeof text !== 'string')
-            return text;
-        return Object.keys(params).reduce((out, key) => {
-            const re = new RegExp(`{{\s*${key}\s*}}`, 'g');
-            return out.replace(re, params[key]);
-        }, text);
+        this.expressionCache.set(expression, matches);
+        return matches;
     }
-}
-
-let singletonInstance;
-function translateSync(key, options) {
-    return singletonInstance.translateSync(key, options);
-}
-class AXTranslationService {
-    constructor() {
-        this.localeService = inject(AXLocaleService);
-        this.config = inject(AX_TRANSLATION_CONFIG);
-        this.loader = inject(AXTranslationLoaderService);
-        this.parser = new TranslationParserService();
-        this.resolver = new TranslationResolverService();
-        this.activeLang = new BehaviorSubject('en-US');
-        this.langChanges$ = this.activeLang.asObservable();
-        singletonInstance = this;
-        this.localeService.profileChanged$.subscribe((locale) => {
-            if (locale?.localeInfo?.code) {
-                this.setActiveLang(locale.localeInfo.code);
-            }
+    handleError(message, error) {
+        console.error(message, error);
+        this.eventService.emitEvent({
+            type: 'error',
+            payload: { message, error },
         });
     }
-    setActiveLang(lang) {
-        if (lang && lang !== this.activeLang.getValue()) {
-            this.activeLang.next(lang);
+    //#endregion
+    //#region Async Translation Methods
+    translateText(text, contextLang, contextScope, params) {
+        if (!this.isExpression(text)) {
+            return this.loadLanguagesAndScopes([contextLang], [contextScope]).pipe(map(() => this.translateKey(text, contextLang, contextScope, params)), catchError((error) => {
+                this.handleError(`Error during translation:`, error);
+                return of(text); // Fallback to the original text
+            }));
         }
-    }
-    getActiveLang() {
-        return this.activeLang.getValue();
+        const matches = this.decodeExpression(text);
+        // Extract unique languages and scopes for batch loading
+        const langScopeSet = new Set(matches.map(({ lang, scope }) => `${lang || contextLang}_${scope || contextScope}`));
+        const langs = Array.from(new Set(Array.from(langScopeSet).map((pair) => pair.split('_')[0])));
+        const scopes = Array.from(new Set(Array.from(langScopeSet).map((pair) => pair.split('_')[1])));
+        // Load all required languages and scopes
+        return this.loadLanguagesAndScopes(langs, scopes).pipe(map(() => {
+            // Resolve translations after loading
+            const translations = matches.reduce((acc, { key, scope, lang, fullMatch }) => {
+                const resolvedScope = scope || contextScope;
+                const resolvedLang = lang || contextLang;
+                acc[fullMatch] = this.translateKey(key, resolvedLang, resolvedScope, params);
+                return acc;
+            }, {});
+            // Replace all matches in the text with their resolved translations
+            return matches.reduce((result, { fullMatch }) => result.replace(new RegExp(fullMatch.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g'), translations[fullMatch]), text);
+        }), catchError((error) => {
+            this.handleError(`Error during translation:`, error);
+            return of(text); // Fallback to the original text
+        }));
     }
     translate$(text, options) {
-        if (!text)
-            return of('');
-        const staticOptions = { ...options };
-        const staticScope = staticOptions.scope ?? this.config.defaults.scope;
-        return this.langChanges$.pipe(switchMap(lang => {
-            return from(this.translateAsync(text, {
-                ...staticOptions,
-                lang: staticOptions.lang ?? lang,
-                scope: staticScope
-            }));
+        if (options?.lang) {
+            return this.translateText(text, options.lang, options?.scope ?? this.config.defaultScope, options?.params);
+        }
+        return this.langChanges$.pipe(startWith(this.getActiveLang()), distinctUntilChanged(), switchMap((lang) => {
+            return this.translateText(text, lang, options?.scope ?? this.config.defaultScope, options?.params);
         }));
     }
     async translateAsync(text, options) {
-        const lang = options?.lang ?? this.getActiveLang() ?? this.config.defaults.lang;
-        const scope = options?.scope ?? this.config.defaults.scope;
-        const params = options?.params;
-        if (!this.parser.isExpression(text)) {
-            const resolved = await this.resolver.resolve(lang, scope, text, params);
-            return this.resolver.format(resolved, params);
-        }
-        const tokens = this.parser.parse(text, lang, scope);
-        const results = await Promise.all(tokens.map(token => this.resolver.resolve(token.lang ?? lang, token.scope ?? scope, token.key, params)
-            .then(translated => [token.fullMatch, this.resolver.format(translated, params)])));
-        return results.reduce((output, [match, translated]) => output.replace(match, translated), text);
+        return firstValueFrom(this.translate$(text, options));
     }
+    //#endregion
+    //#region Sync Translation Methods
     translateSync(text, options) {
-        const lang = options?.lang ?? this.getActiveLang() ?? this.config.defaults.lang;
-        const scope = options?.scope ?? this.config.defaults.scope;
-        const params = options?.params;
-        const waitForLoad = options?.waitForLoad ?? false;
-        const timeoutMs = options?.timeoutMs ?? 100;
-        if (!this.parser.isExpression(text)) {
-            let translated = this.loader.peek(lang, scope, text);
-            if (!translated && waitForLoad) {
-                translated = waitFor(() => this.loader.peek(lang, scope, text), () => this.loader.load(lang, scope).subscribe(), timeoutMs);
-            }
-            return this.resolver.format(translated ?? text, params);
+        if (this.isExpression(text)) {
+            return this.translateTextSync(text, options?.lang ?? this.getActiveLang(), options?.scope ?? this.config.defaultScope);
         }
-        const tokens = this.parser.parse(text, lang, scope);
-        let result = text;
-        for (const token of tokens) {
-            const targetLang = token.lang ?? lang;
-            const targetScope = token.scope ?? scope;
-            const key = token.key;
-            let translation = this.loader.peek(targetLang, targetScope, key);
-            if (!translation) {
-                translation = waitFor(() => this.loader.peek(targetLang, targetScope, key), () => this.loader.load(targetLang, targetScope).subscribe(), waitForLoad ? timeoutMs : 0) ?? key;
-            }
-            result = result.replace(token.fullMatch, this.resolver.format(translation, params));
+        else {
+            return this.translateKey(text, options?.lang ?? this.getActiveLang(), options?.scope ?? this.config.defaultScope);
         }
-        return result;
+    }
+    translateTextSync(text, contextLang, contextScope, params) {
+        const matches = this.decodeExpression(text);
+        const translations = matches.reduce((acc, { key, scope, lang, fullMatch }) => {
+            const resolvedScope = scope || contextScope;
+            const resolvedLang = lang || contextLang;
+            // Cache translation to avoid redundant processing
+            if (!acc[fullMatch]) {
+                acc[fullMatch] = this.translateKey(key, resolvedLang, resolvedScope, params);
+            }
+            return acc;
+        }, {});
+        // Replace all matches in one go
+        return matches.reduce((result, { fullMatch }) => result.replace(fullMatch, translations[fullMatch]), text);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationService, decorators: [{
             type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
+            args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
 
 const loadTranslationScope = (route, state) => {
-    const translationLoaderService = inject(AXTranslationLoaderService);
-    const translationService = inject(AXTranslationService);
+    const translatorService = inject(AXTranslationService);
     const config = inject(AX_TRANSLATION_CONFIG);
-    const scopeValue = route.data[config.resolver?.scopeKey];
+    const scopeValue = route.data[config.scopeResolverKey];
     const scopes = Array.isArray(scopeValue) ? scopeValue : [scopeValue];
-    return translationLoaderService.preload({ langs: [translationService.getActiveLang()], scopes });
+    return translatorService.loadLanguagesAndScopes([translatorService.getActiveLang()], scopes);
 };
 
 class AXTranslatorDirective {
@@ -319,8 +287,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
         }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: AXTranslationService }] });
 
 class AXTranslatorPipe {
-    constructor() {
-        this.service = inject(AXTranslationService);
+    constructor(service) {
+        this.service = service;
     }
     transform(key, options) {
         if (!key) {
@@ -328,7 +296,7 @@ class AXTranslatorPipe {
         }
         return this.service.translate$(key, options);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslatorPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslatorPipe, deps: [{ token: AXTranslationService }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: AXTranslatorPipe, isStandalone: true, name: "translate" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslatorPipe, decorators: [{
@@ -337,11 +305,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
                     name: 'translate',
                     pure: true,
                 }]
-        }] });
+        }], ctorParameters: () => [{ type: AXTranslationService }] });
 
-function initializeApp(translatorService) {
+function initializeApp(translatorService, config) {
     return () => {
-        return translatorService.preload();
+        return translatorService.loadLanguagesAndScopes(config.preloadLangs ?? [config.defaultLang], config.preloadScopes ?? [config.defaultScope]);
     };
 }
 class AXTranslationModule {
@@ -349,7 +317,7 @@ class AXTranslationModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationModule, imports: [AXTranslatorPipe, AXTranslatorDirective], exports: [AXTranslatorPipe, AXTranslatorDirective] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AXTranslationModule, providers: [
             provideAppInitializer(() => {
-                const initializerFn = initializeApp(inject(AXTranslationLoaderService));
+                const initializerFn = initializeApp(inject(AXTranslationService), inject(AX_TRANSLATION_CONFIG));
                 return initializerFn();
             }),
         ] }); }
@@ -361,7 +329,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
                     exports: [AXTranslatorPipe, AXTranslatorDirective],
                     providers: [
                         provideAppInitializer(() => {
-                            const initializerFn = initializeApp(inject(AXTranslationLoaderService));
+                            const initializerFn = initializeApp(inject(AXTranslationService), inject(AX_TRANSLATION_CONFIG));
                             return initializerFn();
                         }),
                     ],