monkey-front-core 0.0.235 → 0.0.238

package/src/lib/core/services/config/monkeyecx-config.service.ts

@@ -0,0 +1,151 @@
+/* eslint-disable no-console */
+import { Injectable } from '@angular/core';
+import { HttpErrorResponse } from '@angular/common/http';
+import { throwError, BehaviorSubject, Observable } from 'rxjs';
+import { MonkeyStyleGuideSettingsService } from 'monkey-style-guide';
+import { MonkeyEcxi18nConfigService } from './monkeyecx-i18n-config.service';
+import { MonkeyEcxLogsConfigService } from './monkeyecx-logs-config.service';
+import { MonkeyEcxServiceWorkerConfigService } from './monkeyecx-service-worker-config.service';
+import { MonkeyEcxSecurityConsoleConfigService } from './monkeyecx-security-console-config.service';
+import { MonkeyEcxMaintenanceConfigService } from './monkeyecx-maintenance-config.service';
+import { MonkeyEcxCoreService } from '../../decorators/monkeyecx-decorators';
+import { MonkeyEcxCommonsService } from '../commons/monkeyecx-commons.service';
+import { MonkeyEcxConfig } from '../../interfaces/monkeyecx-config';
+import { MonkeyEcxConfigBoostrap } from '../../interfaces/monkeyecx-config-boostrap';
+import { MonkeyEcxService } from '../monkeyecx-service.service';
+import { MonkeyEcxErrorConfigService } from './monkeyecx-error-config.service';
+import { MonkeyEcxFeatureToggleService } from './monkeyecx-feature-toggle.service';
+import { MonkeyEcxGAConfigService } from './monkeyecx-ga-config.service';
+import { MonkeyEcxAlertsConfigService } from './monkeyecx-alerts-config.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxConfigService extends MonkeyEcxCommonsService {
+  private readonly configSubject$: BehaviorSubject<MonkeyEcxConfig>;
+
+  private readonly configBoostrapSubject$: BehaviorSubject<MonkeyEcxConfig>;
+
+  constructor(
+    monkeyecxService: MonkeyEcxService,
+    private monkeyecxi18nConfigService: MonkeyEcxi18nConfigService,
+    private monkeyecxLogsConfigService: MonkeyEcxLogsConfigService,
+    private monkeyStyleGuideSettingsService: MonkeyStyleGuideSettingsService,
+    private monkeyecxServiceWorkerConfigService: MonkeyEcxServiceWorkerConfigService,
+    private monkeyecxSecurityConsoleConfigService: MonkeyEcxSecurityConsoleConfigService,
+    private monkeyecxMaintenanceConfigService: MonkeyEcxMaintenanceConfigService,
+    private monkeyecxErrorConfigService: MonkeyEcxErrorConfigService,
+    private monkeyEcxFeatureToggleService: MonkeyEcxFeatureToggleService,
+    private monkeyGAConfigService: MonkeyEcxGAConfigService,
+    private monkeyEcxAlertsConfigService: MonkeyEcxAlertsConfigService
+  ) {
+    super(monkeyecxService);
+    this.configSubject$ = new BehaviorSubject({});
+    this.configBoostrapSubject$ = new BehaviorSubject({});
+  }
+
+  private internalValidations(...args: any[]) {
+    const {
+      monkeyecxServiceWorkerConfigService,
+      monkeyecxSecurityConsoleConfigService,
+      monkeyecxMaintenanceConfigService
+    } = this;
+
+    const configBoostrap = args[0];
+    const callback = args[1];
+    monkeyecxSecurityConsoleConfigService.apply();
+    monkeyecxServiceWorkerConfigService.apply(configBoostrap);
+    monkeyecxMaintenanceConfigService.apply(configBoostrap);
+    callback(configBoostrap);
+  }
+
+  private getWhiteLabelSettings(
+    monkeyecxCode: string,
+    configBoostrap: MonkeyEcxConfigBoostrap,
+    callback: Function,
+    environment: any,
+    identifyCode: string
+  ) {
+    const {
+      monkeyecxService,
+      monkeyecxi18nConfigService,
+      configSubject$,
+      monkeyStyleGuideSettingsService,
+      monkeyecxLogsConfigService,
+      monkeyecxErrorConfigService,
+      monkeyEcxFeatureToggleService,
+      monkeyGAConfigService,
+      monkeyEcxAlertsConfigService,
+      internalValidations
+    } = this;
+
+    const url = `${environment.urlAssets}/${monkeyecxCode.toLowerCase()}`;
+
+    monkeyecxService
+      ?.get<any>(
+        `${url}/white-label.json`
+      )
+      ?.subscribe(
+        (config: MonkeyEcxConfig) => {
+          monkeyecxi18nConfigService.apply(config, environment);
+          monkeyecxLogsConfigService.apply(config, configBoostrap, environment, identifyCode);
+          monkeyEcxFeatureToggleService.apply(configSubject$, environment);
+          monkeyGAConfigService.apply(config, environment);
+          monkeyEcxAlertsConfigService.apply(config);
+          monkeyStyleGuideSettingsService.boostrap(
+            `${url}/monkey-style-guide-settings.json`,
+            internalValidations.bind(this, configBoostrap, callback, environment)
+          );
+          configSubject$.next(config);
+        },
+        (err: HttpErrorResponse) => {
+          monkeyecxErrorConfigService.apply('theme');
+          console.error('Program Configuration not found!');
+          throwError(err);
+        }
+      );
+  }
+
+  @MonkeyEcxCoreService({
+    httpResponse: {
+      httpCodeIgnore: [404]
+    },
+    requestInProgress: {
+      showProgress: false
+    }
+  })
+  public init(callback: Function, environment: any, identifyCode: string, monkeyecxCode?: string) {
+    const { monkeyecxService, configBoostrapSubject$, monkeyecxErrorConfigService } = this;
+
+    monkeyecxService
+      ?.get(`${environment.boostrapAssets}`, {
+        observe: 'response'
+      })
+      ?.subscribe(
+        (resp: any) => {
+          const { headers, body } = resp;
+          const monkeyCode = headers.get('monkey-code') || monkeyecxCode;
+          if (monkeyCode) {
+            this.getWhiteLabelSettings(monkeyCode, body, callback, environment, identifyCode);
+            configBoostrapSubject$.next(body);
+          } else {
+            monkeyecxErrorConfigService.apply('theme');
+            console.error(`Boostrap ${monkeyCode} Configuration not found!`);
+          }
+        },
+        (err: HttpErrorResponse) => {
+          monkeyecxErrorConfigService.apply('theme');
+          console.error('Boostrap Configuration not found!');
+          throwError(err);
+        }
+      );
+  }
+
+  public config(): Observable<any> {
+    return this.configSubject$.asObservable();
+  }
+
+  public boostrapConfig(): Observable<any> {
+    return this.configBoostrapSubject$.asObservable();
+  }
+}

package/src/lib/core/services/config/monkeyecx-error-config.service.ts

@@ -0,0 +1,92 @@
+import { Injectable } from '@angular/core';
+
+let window: any;
+
+const text: any = {
+  i18n: {
+    title: 'We have an quick update for you',
+    message: 'Click anywhere here to reload your locale',
+  },
+  theme: {
+    title: 'We have an quick update for you',
+    message: 'Click anywhere here to reload your theme',
+  },
+};
+
+@Injectable({
+  providedIn: 'root',
+})
+export class MonkeyEcxErrorConfigService {
+  constructor() {
+    // not to do
+  }
+
+  private enableSupport() {
+    window.zE('webWidget', 'updateSettings', {
+      webWidget: {
+        color: {
+          theme: '#0273E8',
+          launcherText: '#fff',
+          header: '#0273E8',
+          button: '#0273E8',
+        },
+        zIndex: 99,
+        offset: {
+          horizontal: '1px',
+          vertical: '20px',
+        },
+        mobile: {
+          labelVisible: true,
+        },
+        launcher: {
+          mobile: {
+            labelVisible: true,
+          },
+        },
+      },
+    });
+    window.zE('webWidget', 'setLocale', 'en-US');
+    window.zE('webWidget', 'show');
+  }
+
+  public apply(type: string) {
+    const { title, message } = text?.[type];
+
+    const element = document.createElement('div');
+    element.id = 'monkeyecx-information';
+
+    const elementImg = document.createElement('img');
+    elementImg.width = 128;
+    elementImg.src = 'assets/images/monkey.svg';
+    elementImg.style.marginBottom = '50px';
+
+    const elementTitle = document.createElement('span');
+    elementTitle.id = 'title';
+    elementTitle.innerText = title;
+    elementTitle.style.marginBottom = '20px';
+
+    const elementMessage = document.createElement('span');
+    elementMessage.id = 'message';
+    elementMessage.innerText = message;
+    elementMessage.style.marginBottom = '20px';
+
+    const elementChat = document.createElement('span');
+    elementChat.id = 'message';
+    elementChat.innerText =
+      "If you're having trouble to update, please use the support icon bellow";
+
+    element.appendChild(elementImg);
+    element.appendChild(elementTitle);
+    element.appendChild(elementMessage);
+    element.appendChild(elementChat);
+
+    element.addEventListener('click', () => {
+      document.location.reload();
+    });
+
+    document.body.appendChild(element);
+
+    document.body.getElementsByTagName('app-root')[0].remove();
+    this.enableSupport();
+  }
+}

package/src/lib/core/services/config/monkeyecx-feature-toggle.service.ts

@@ -0,0 +1,71 @@
+import { Injectable } from '@angular/core';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { initialize, LDClient, LDFlagSet } from 'launchdarkly-js-client-sdk';
+import { MonkeyUtils } from 'monkey-style-guide';
+import { MonkeyEcxConfig } from '../../interfaces';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class MonkeyEcxFeatureToggleService {
+  private readonly flagSubject$: BehaviorSubject<any> = new BehaviorSubject(null);
+
+  private flags: LDFlagSet | undefined = undefined;
+
+  private ldClient: LDClient | undefined = undefined;
+
+  constructor() {
+    // not to do
+  }
+
+  private getAllFlags(): void {
+    if (!this) return;
+    this.flags = this.ldClient?.allFlags();
+
+    this.flagSubject$.next(true);
+  }
+
+  private identify(config: MonkeyEcxConfig, environment: any): void {
+    if (config) {
+      const email = 'monkey@monkey.exchange';
+      const user = {
+        email,
+        key: `${config.program?.token}#${email}`,
+      };
+
+      if (!this.ldClient) {
+        this.ldClient = initialize(environment.launchDarklyClientSideID, user, {
+          streaming: true,
+          disableSyncEventPost: true,
+          sendEvents: false,
+          diagnosticOptOut: true,
+        });
+
+        this.ldClient.on('change', this.getAllFlags.bind(this));
+        this.ldClient.on('ready', this.getAllFlags.bind(this));
+      } else {
+        this.ldClient.identify(user, undefined, this.getAllFlags);
+      }
+    }
+  }
+
+  public apply(configSubject$: BehaviorSubject<MonkeyEcxConfig>, environment: any) {
+    if (environment.launchDarklyClientSideID) {
+      configSubject$.subscribe((config) => {
+        this.identify(config, environment);
+      });
+    } else {
+      this.flagSubject$.next(true);
+    }
+  }
+
+  public get onFlags(): Observable<any> {
+    return this.flagSubject$.asObservable();
+  }
+
+  public getFlag(flag: string): boolean | null {
+    const flagValue = this.flags?.[flag];
+
+    return MonkeyUtils.persistNullEmptyUndefined(flagValue) ? flagValue : null;
+  }
+}

package/src/lib/core/services/config/monkeyecx-ga-config.service.ts

@@ -0,0 +1,56 @@
+/* eslint-disable prefer-rest-params */
+import { Injectable } from '@angular/core';
+import { NavigationEnd, Router } from '@angular/router';
+import { MonkeyEcxConfig } from '../../interfaces';
+
+declare const window: any;
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxGAConfigService {
+  constructor(private rt: Router) {
+    // not to do
+  }
+
+  public apply(params: MonkeyEcxConfig, environment: any) {
+    const { ga } = params;
+    const { enabled, key } = ga || { enabled: false, key: '' };
+    if (enabled && environment.environment !== 'dev') {
+      const action = () => {
+        window.dataLayer = window.dataLayer || [];
+        window.gtag =
+          window.gtag ||
+          function gtag() {
+            window.dataLayer.push(arguments);
+          };
+
+        window.gtag('js', new Date());
+        window.gtag('config', key);
+      };
+
+      const pageChangeAction = () => {
+        this.rt.events.subscribe((event: any) => {
+          if (event instanceof NavigationEnd) {
+            window.gtag('set', 'page_path', event.url);
+            window.gtag('event', 'page_view');
+          }
+        });
+      };
+
+      const head = document.querySelector('head');
+      const script = document.createElement('script');
+      script.async = true;
+      script.id = 'ga-settings';
+      script.src = `//www.googletagmanager.com/gtag/js?id=${key}`;
+      script.onload = () => {
+        action();
+        pageChangeAction();
+      };
+      script.onerror = () => {
+        head?.removeChild(script);
+      };
+      head?.appendChild(script);
+    }
+  }
+}

package/src/lib/core/services/config/monkeyecx-i18n-config.service.ts

@@ -0,0 +1,95 @@
+/* eslint-disable no-console */
+/* eslint-disable import/no-named-default */
+import { Injectable } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+import { throwError } from 'rxjs';
+import { take } from 'rxjs/operators';
+import { MonkeyEcxService } from '../monkeyecx-service.service';
+import { MonkeyEcxCookieStorageService } from '../storage/monkeyecx-cookie-storage.service';
+import { MonkeyEcxCoreService } from '../../decorators/monkeyecx-decorators';
+import { MonkeyEcxCommonsService } from '../commons';
+import { MonkeyEcxConfig } from '../../interfaces';
+import { MonkeyEcxErrorConfigService } from '../config/monkeyecx-error-config.service';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxi18nConfigService extends MonkeyEcxCommonsService {
+  constructor(
+    monkeyecxService: MonkeyEcxService,
+    private translateService: TranslateService,
+    private monkeyecxCookieStorageService: MonkeyEcxCookieStorageService,
+    private monkeyecxErrorConfigService: MonkeyEcxErrorConfigService
+  ) {
+    super(monkeyecxService);
+
+    this.translateService.addLangs(['pt-BR', 'en-US']);
+    this.translateService.setDefaultLang('pt-BR');
+    this.translateService.use('pt-BR');
+  }
+
+  @MonkeyEcxCoreService({
+    httpResponse: {
+      httpCodeIgnore: [404]
+    },
+    requestInProgress: {
+      showProgress: false
+    }
+  })
+  public async apply(params: MonkeyEcxConfig, environment: any, change = false) {
+    const { monkeyecxService, monkeyecxCookieStorageService, monkeyecxErrorConfigService } = this;
+    let { i18n } = params;
+    const currentExternali18n = params?.externali18n?.[`${i18n?.lang || 'pt-BR'}`];
+
+    const cookie = monkeyecxCookieStorageService.getCookie('monkey-app-locale');
+    if (cookie && !change) {
+      i18n = JSON.parse(atob(cookie));
+    } else {
+      monkeyecxCookieStorageService.setCookie('monkey-app-locale', btoa(JSON.stringify(i18n)), environment);
+    }
+
+    try {
+      const externali18nPaths: string[] = params?.i18n?.paths || [];
+
+      const services = externali18nPaths?.map((url: string) => {
+        return monkeyecxService?.get(
+          `${url}/${i18n?.lang}.json`
+        ).pipe(take(1)).toPromise();
+      });
+      if (!services?.length) return;
+
+      const externali18nData = await Promise.all(services);
+
+      externali18nData?.forEach((config: any) => {
+        const { lang } = config;
+        const { data } = config;
+        this.translateService.setTranslation('pt-BR', data, true);
+        this.translateService.setTranslation(lang, data, true);
+      });
+    } catch (err) {
+      // not to do
+    }
+
+    try {
+      const currenti18n: any = await monkeyecxService?.get(
+        `${environment.localAssets}/i18n/${i18n?.lang}.json`
+      ).pipe(take(1)).toPromise();
+
+      const { lang } = currenti18n;
+      let { data } = currenti18n;
+      if (currentExternali18n) {
+        data = {
+          ...data,
+          EXTERNAL: currentExternali18n
+        };
+      }
+      this.translateService.setTranslation('pt-BR', data, true);
+      this.translateService.setTranslation(lang, data, true);
+      this.translateService.use(lang);
+    } catch (err) {
+      console.error(`i18n ${i18n?.lang} not found!`);
+      monkeyecxErrorConfigService.apply('i18n');
+      throwError(err);
+    }
+  }
+}

package/src/lib/core/services/config/monkeyecx-logs-config.service.ts

@@ -0,0 +1,34 @@
+import { Injectable } from '@angular/core';
+import { datadogRum } from '@datadog/browser-rum';
+import { MonkeyEcxConfig, MonkeyEcxConfigBoostrap } from '../../interfaces';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxLogsConfigService {
+  public apply(
+    params: MonkeyEcxConfig,
+    configBoostrap: MonkeyEcxConfigBoostrap,
+    environment: any,
+    identifyCode: string
+  ) {
+    const { program, logs } = params;
+    if (logs?.enabled && environment.environment !== 'dev') {
+      datadogRum.init({
+        applicationId: environment?.dataDogApplicationId,
+        clientToken: environment?.dataDogClientToken,
+        service: program?.token,
+        site: 'datadoghq.com',
+        sampleRate: 100,
+        replaySampleRate: 100,
+        env: `monkey-front-${identifyCode}-${environment.environment}`,
+        version: configBoostrap?.version,
+        trackInteractions: true,
+        trackSessionAcrossSubdomains: true,
+        useSecureSessionCookie: true,
+        useCrossSiteSessionCookie: true
+      });
+      datadogRum.startSessionReplayRecording();
+    }
+  }
+}

package/src/lib/core/services/config/monkeyecx-maintenance-config.service.ts

@@ -0,0 +1,33 @@
+import { Injectable } from '@angular/core';
+import { Router } from '@angular/router';
+import { MonkeyStyleGuideModalService } from 'monkey-style-guide';
+import { ClosedToMaintenanceComponent } from '../../../components/closed-to-maintenance/closed-to-maintenance.component';
+import { MonkeyEcxConfigBoostrap } from '../../interfaces/monkeyecx-config-boostrap';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxMaintenanceConfigService {
+  constructor(private modalService: MonkeyStyleGuideModalService, private router: Router) {
+    // not to do
+  }
+
+  private handleValidation(config: MonkeyEcxConfigBoostrap) {
+    if (config.maintenance.closed) {
+      localStorage.clear();
+      this.router.navigate(['']);
+
+      setTimeout(() => {
+        this.modalService.open(ClosedToMaintenanceComponent, {
+          color: 'theme',
+          size: 'md',
+          data: config
+        });
+      }, 200);
+    }
+  }
+
+  public apply(config: MonkeyEcxConfigBoostrap) {
+    this.handleValidation(config);
+  }
+}

package/src/lib/core/services/config/monkeyecx-security-console-config.service.ts

@@ -0,0 +1,40 @@
+/* eslint-disable no-console */
+import { Injectable } from '@angular/core';
+import { TranslateService } from '@ngx-translate/core';
+import { MonkeyEcxCommonsService } from '../commons';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxSecurityConsoleConfigService extends MonkeyEcxCommonsService {
+  constructor(private translateService: TranslateService) {
+    super();
+
+    this.geti18n(this.translateService, 'SERVICES.WARNING.CONSOLE');
+  }
+
+  private handleValidation() {
+    this.__oni18nDataChanged$.subscribe(() => {
+      const { __i18n } = this;
+      const title = __i18n?.TITLE;
+      const message = __i18n?.MESSAGE;
+      if (title) {
+        console.log(`%c${title}`, 'background: #f2f061; color: #ff0000; font-size: x-large');
+        console.log(`%c${message}`, 'font-size: x-large');
+        console.log(
+          '%c  __  __             _             ______   \n ' +
+          '|  \\/  | ___  _ __ | | _____ _   _\\ \\ \\ \\  \n ' +
+          "| |\\/| |/ _ \\| '_ \\| |/ / _ \\ | | |\\ \\ \\ \\ \n " +
+          '| |  | | (_) | | | |   <  __/ |_| |/ / / / \n ' +
+          '|_|  |_|\\___/|_| |_|_|\\_\\___|\\__, /_/_/_/  \n ' +
+          '                             |___/         \n ' +
+          'Join us: https://monkeyecx.gupy.io', 'background: #1976d2; color: #fff'
+        );
+      }
+    });
+  }
+
+  public apply() {
+    this.handleValidation();
+  }
+}

package/src/lib/core/services/config/monkeyecx-service-worker-config.service.ts

@@ -0,0 +1,50 @@
+import { ApplicationRef, Injectable } from '@angular/core';
+import { SwUpdate } from '@angular/service-worker';
+import { MonkeyStyleGuideModalService } from 'monkey-style-guide';
+import { concat, interval } from 'rxjs';
+import { first } from 'rxjs/operators';
+import { VersionChangedComponent } from '../../../components/version-changed';
+import { MonkeyEcxConfigBoostrap } from '../../interfaces';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MonkeyEcxServiceWorkerConfigService {
+  constructor(
+    private appRef: ApplicationRef,
+    private updates: SwUpdate,
+    private modalService: MonkeyStyleGuideModalService) {
+    // not to do
+  }
+
+  private handleValidation(config: MonkeyEcxConfigBoostrap) {
+    const { updates, modalService } = this;
+    updates?.available?.subscribe(() => {
+      if (!config.showNewVersion || config.maintenance.closed) {
+        document.location.reload();
+      } else {
+        modalService.open(VersionChangedComponent, {
+          color: 'theme',
+          size: 'md'
+        });
+      }
+    });
+  }
+
+  private verify() {
+    const { appRef, updates } = this;
+    const appIsStable$ = appRef.isStable
+      .pipe(first((isStable: boolean) => { return isStable === true; }));
+    const everyHour$ = interval(1 * 60 * 60 * 1000);
+    const everyHourOnceAppIsStable$ = concat(appIsStable$, everyHour$);
+    everyHourOnceAppIsStable$.subscribe(() => {
+      updates.checkForUpdate();
+    });
+    updates.checkForUpdate();
+  }
+
+  public apply(config: MonkeyEcxConfigBoostrap) {
+    this.handleValidation(config);
+    this.verify();
+  }
+}

package/{lib/core/services/error/index.d.ts → src/lib/core/services/error/index.ts}

@@ -1,4 +1,4 @@
-export * from './monkeyecx-error-handling.module';
-export * from './monkeyecx-error-handling.service';
-export * from './monkeyecx-http-error-handling.service';
-export * from './monkeyecx-others-errors-handling.service';
+export * from './monkeyecx-error-handling.module';
+export * from './monkeyecx-error-handling.service';
+export * from './monkeyecx-http-error-handling.service';
+export * from './monkeyecx-others-errors-handling.service';

package/src/lib/core/services/error/monkeyecx-error-handling.module.ts

@@ -0,0 +1,20 @@
+import { ErrorHandler, ModuleWithProviders, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { MonkeyEcxErrorHandlingService } from './monkeyecx-error-handling.service';
+
+@NgModule({
+  imports: [CommonModule],
+})
+export class MonkeyEcxErrorHandlingModule {
+  public static forRoot(): ModuleWithProviders<MonkeyEcxErrorHandlingModule> {
+    return {
+      ngModule: MonkeyEcxErrorHandlingModule,
+      providers: [
+        {
+          provide: ErrorHandler,
+          useClass: MonkeyEcxErrorHandlingService,
+        },
+      ],
+    };
+  }
+}