@yomotech/view-toolkit 0.0.32 → 0.0.33

package/src/lib/containers/side-menu/side-menu.component.ts

@@ -1,458 +0,0 @@
-import { Platform, PlatformModule } from '@angular/cdk/platform';
-import { AfterViewInit, Component, ElementRef, EventEmitter, HostListener, Inject, Input, Output, SimpleChanges, ViewChild } from '@angular/core';
-import { RequestService } from '../../services/request.service';
-import { UtilityService } from '../../services/utility.service';
-import { OKTA_AUTH, OktaAuthStateService } from '@okta/okta-angular';
-import OktaAuth from '@okta/okta-auth-js';
-import { jwtDecode } from 'jwt-decode';
-import { DialogService, DynamicDialogModule } from 'primeng/dynamicdialog';
-import { LogsComponent } from '../logs/logs.component';
-import { NotificationService } from '../../services/notification.service';
-import { Device } from '@capacitor/device';
-import { de_DE, en_US, NzI18nService } from 'ng-zorro-antd/i18n';
-import { MobileKeycloakService } from '../../services/mobile-keycloak.service';
-import { OAuthService } from 'angular-oauth2-oidc';
-import { CommonModule } from '@angular/common';
-import { NzMenuModule } from 'ng-zorro-antd/menu';
-import { NzIconModule } from 'ng-zorro-antd/icon';
-import { NzTooltipModule } from 'ng-zorro-antd/tooltip';
-import { NzButtonModule } from 'ng-zorro-antd/button';
-import { Couchdb } from '../../services/couchdb';
-
-
-@Component({
-  standalone: true,
-  selector: 'vl-side-menu',
-  templateUrl: './side-menu.component.html',
-  styleUrl: './side-menu.component.css',
-  imports: [
-    CommonModule,
-    PlatformModule,
-    // NG-ZORRO
-    NzMenuModule,
-    NzIconModule,
-    NzTooltipModule,
-    NzButtonModule,
-    // PrimeNG
-    DynamicDialogModule
-  ]
-})
-export class SideMenuComponent implements AfterViewInit {
-  isCollapsed: boolean = false;
-  isMobile: boolean = false;
-  projectsLayoutSchema: any;
-  loginUser: any = {};
-  isLogined: boolean = false;
-  loginedUserInfo: any = {};
-  menuItemsCopy: any = {};
-  settingMenu: any = {};
-  setLanguage: boolean = false;
-  tenantKey: any = '';
-  tenantName: any = '';
-  @Input() menuItems: any[] = [];
-  @Input() userInfo: any = {};
-  @Input() settings: any = {};
-  @Input() projects: any;
-  @Input() environment: any;
-  @Input() projectSeleted: any;
-  @Output() languageChange: EventEmitter<any> = new EventEmitter();
-  @Output() invokeMenu: EventEmitter<any> = new EventEmitter();
-  @Output() menuToggle: EventEmitter<any> = new EventEmitter();
-  @Output() invokeProject: EventEmitter<any> = new EventEmitter();
-  @Output() errorMessage: EventEmitter<any> = new EventEmitter();
-  @Output() deleteProject: EventEmitter<any> = new EventEmitter();
-
-  PRIME_DE = {
-    firstDayOfWeek: 1,
-    dayNames: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],
-    dayNamesShort: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'],
-    dayNamesMin: ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa'],
-    monthNames: [
-      'Januar', 'Februar', 'März', 'April', 'Mai', 'Juni',
-      'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'
-    ],
-    monthNamesShort: [
-      'Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun',
-      'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'
-    ],
-    today: 'Heute',
-    clear: 'Löschen',
-    dateFormat: 'yy-mm-dd',
-    weekHeader: 'KW'
-  };
-
-  PRIME_EN = {
-    firstDayOfWeek: 0,
-    dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
-    dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
-    dayNamesMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
-    monthNames: [
-      'January', 'February', 'March', 'April', 'May', 'June',
-      'July', 'August', 'September', 'October', 'November', 'December'
-    ],
-    monthNamesShort: [
-      'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
-      'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
-    ],
-    today: 'Today',
-    clear: 'Clear',
-    dateFormat: 'yy-mm-dd',
-    weekHeader: 'Wk'
-  };
-
-
-  @ViewChild('sideMenu', { static: true })
-  sideMenu!: ElementRef;
-
-  constructor(
-    private i18n: NzI18nService,
-    private mobileKeycloakService: MobileKeycloakService,
-    private couchdbService: Couchdb,
-    private oauthService: OAuthService,
-    private platform: Platform,
-    private requestService: RequestService,
-    private utilityService: UtilityService,
-    private dialogService: DialogService,
-    private oktaAuthService: OktaAuthStateService,
-    private notificationService: NotificationService,
-    @Inject(OKTA_AUTH) private oktaAuth: OktaAuth) { }
-
-  @HostListener('document:click', ['$event'])
-  onDocumentClick(event: MouseEvent) {
-    const path = event.composedPath() as HTMLElement[];
-    const clickedInsideMenu = path.some(
-      el => el === this.sideMenu?.nativeElement
-    );
-    const clickedToggle = path.some(
-      el =>
-        el instanceof HTMLElement &&
-        el.classList?.contains('side-toggle-handle')
-    );
-    if (!clickedInsideMenu && !clickedToggle && this.isMobile) {
-      console.log('OUTSIDE CLICK');
-      let btn = document.getElementById('toggle-id');
-      if (btn && !this.isCollapsed) {
-        btn.click();
-      }
-    }
-  }
-
-  toggleCollapsed(): void {
-    if (this.isMobile) {
-      this.isCollapsed = !this.isCollapsed;
-      const sideMenu = document.querySelector('.side-menu');
-      if (sideMenu) {
-        sideMenu.classList.toggle('open', !this.isCollapsed);
-      }
-    } else {
-      this.isCollapsed = !this.isCollapsed;
-    }
-  }
-
-  async ngOnInit() {
-    if (this.platform.ANDROID || this.platform.IOS) {
-      this.isCollapsed = true;
-      this.isMobile = true;
-      this.tenantKey = await this.utilityService.getLocalStorage('tenantKey');
-      this.tenantName = await this.utilityService.getLocalStorage('tenantName');
-    } else {
-      this.tenantKey = await this.utilityService.getStorage('tenantKey');
-      this.tenantName = await this.utilityService.getStorage('tenantName');
-    }
-  }
-
-  ngOnChanges(changes: SimpleChanges): void {
-    this.setLoginUser();
-    if (changes['menuItems'] && this.menuItems?.length) {
-      this.menuItemsCopy = JSON.parse(JSON.stringify(this.menuItems));
-      this.setProjectSetting();
-      this.setSettingImages();
-    }
-  }
-
-  async setProjectSetting() {
-    const tasks: Promise<void>[] = [];
-    this.menuItems.forEach((menuItem: any) => {
-      if (menuItem?.label?.caption === "Setting" && menuItem?.submenu?.length) {
-        menuItem?.submenu.forEach((subMenu: any) => {
-          if (subMenu?.label?.caption === "Languages" && subMenu?.submenu?.length) {
-            subMenu?.submenu.forEach((childMenu: any) => {
-              tasks.push((async () => {
-                try {
-                  let projectName = `${this.tenantName}_${this.projectSeleted}`
-                  const image = await this.couchdbService.getFileContentFromCouchDb(
-                    projectName,
-                    childMenu.icon
-                  );
-                  childMenu.icon = this.getMediaSrc(image);
-                } catch (err) {
-                  console.error("Failed to fetch icon:", err);
-                }
-              })());
-            })
-          }
-        })
-      }
-    })
-    await Promise.all(tasks);
-  }
-
-  async ngAfterViewInit(): Promise<void> {
-    let mobileLang = await this.getDeviceLanguage()
-    if (mobileLang) {
-      this.changeLanguage(mobileLang + '.json');
-    }
-    setTimeout(async () => {
-      this.initializeProjects();
-      await this.setLoginUser();
-    }, 1000);
-
-  }
-
-  async getDeviceLanguage(): Promise<string> {
-    const info = await Device.getLanguageCode();
-    return info.value; // e.g. 'en', 'ur', 'de'
-  }
-
-  async setLoginUser() {
-    try {
-      if (this.environment?.login?.type === 'oktaAuth') {
-        if (this.platform.ANDROID || this.platform.IOS) {
-          const logined: any = await this.utilityService.getLocalStorage('loginedUser');
-          if (logined?.token) {
-            this.requestService.getLoginUser(logined.token).subscribe({
-              next: (userInfo: any) => {
-                this.loginUser = { ...this.userInfo, ...logined };
-                this.setLoginedUser(this.loginUser);
-              },
-              error: (err) => {
-                console.error('Failed to fetch login user (mobile):', err);
-              }
-            });
-          }
-        } else {
-          this.oktaAuthService.authState$.subscribe({
-            next: async (result) => {
-              if (result.isAuthenticated) {
-                try {
-                  const oktaWebUser = await this.oktaAuth.getUser();
-                  const webLoginedUser = { ...this.userInfo, ...oktaWebUser };
-                  this.loginUser = webLoginedUser;
-                  this.setLoginedUser(this.loginUser);
-                } catch (err) {
-                  console.error('Failed to fetch Okta web user:', err);
-                }
-              }
-            },
-            error: (err) => {
-              console.error('Okta auth state subscription error:', err);
-            }
-          });
-        }
-      } else if (this.environment?.login?.type === 'jwtToken' && this.userInfo?.jwt) {
-        const userInfo = this.getUserInfoFromToken(this.userInfo.jwt);
-        this.loginUser = userInfo;
-        this.setLoginedUser(this.loginUser);
-      } else if (this.environment?.login?.type === 'keycloak' && this.userInfo?.name) {
-        this.loginUser = this.userInfo;
-        this.setLoginedUser(this.loginUser);
-      }
-    } catch (error) {
-      console.error('Error in setLoginUser:', error);
-    }
-  }
-
-
-
-  getUserInfoFromToken(token: string) {
-    try {
-      const decoded: any = jwtDecode(token);
-
-      return {
-        sub: decoded.sub,
-        name: decoded.name || 'User is undefined',
-        role: decoded.role || 'Role is undefined',
-        email: decoded.email || decoded.sub,
-        iat: decoded.iat,
-        exp: decoded.exp
-      };
-    } catch (err) {
-      return null;
-    }
-  }
-
-  async setSettingImages() {
-    if (this.settings && this.settings.length > 0) {
-
-
-      const tasks: Promise<void>[] = [];
-      console.log('this.settings: ', this.settings);
-
-      for (const menu of this.settings?.submenu) {
-        if (menu?.submenu?.length) {
-          for (const childMenu of menu.submenu) {
-            if (childMenu.options && childMenu.options.setImageUrl) {
-              tasks.push((async () => {
-                try {
-                  let projectName = `${this.tenantName}_${this.projectSeleted}`
-                  const image = await this.couchdbService.getFileContentFromCouchDb(
-                    projectName,
-                    childMenu.icon
-                  );
-                  childMenu.icon = this.getMediaSrc(image);
-                } catch (err) {
-                  console.error("Failed to fetch icon:", err);
-                }
-              })());
-            }
-          }
-        }
-      }
-      await Promise.all(tasks);
-    }
-    this.settingMenu = JSON.parse(JSON.stringify(this.settings));
-  }
-
-  getMediaSrc(file: any): string {
-    if (!file) return '';
-
-    // Best case: service already returns full data URL
-    if (file.src) {
-      return file.src;
-    }
-
-    // If service returns raw base64 + mimeType
-    if (file.base64) {
-      const mimeType = file.mimeType || 'image/png';
-      return `data:${mimeType};base64,${file.base64}`;
-    }
-
-    // If service returns old dataUrl format
-    if (file.dataUrl) {
-      return file.dataUrl;
-    }
-
-    return '';
-  }
-
-  isUrl(value: string): boolean {
-    return /^https?:\/\//.test(value) || value.startsWith('blob:');
-  }
-
-  async setLoginedUser(user: any) {
-    if (user?.name) {
-      user['image'] = "assets/user.png";
-      this.loginedUserInfo = user;
-      let matchMenu = this.menuItems.find((menu: any) => menu?.options?.action && menu?.options?.action === "logout");
-      if (matchMenu) {
-        this.loginedUserInfo.actions = [matchMenu]
-      }
-      this.isLogined = this.loginedUserInfo?.name ? true : false;
-    }
-  }
-
-  initializeProjects() {
-    this.projectsLayoutSchema = this.projects;
-  }
-
-  async invokeNavigate(menu: any, parentMenu?: any) {
-    if (menu.options.showAllProjects) {
-      this.utilityService.showAllProjects();
-    } else if (menu.options.changeLang) {
-      this.changeLanguage(menu.options.data_url);
-    } else if (menu.options.changeProject) {
-      this.navigateToProject(menu);
-    } else if (menu.options.logs) {
-      this.openLogsTable();
-    } else if (menu.options.terms) {
-      this.notificationService.info("Term Not Apply")
-    } else if (menu.options.projectPrivacy) {
-      this.notificationService.warning("Project Privacy Not Apply")
-    } else if (menu.options.projectVersion) {
-      this.notificationService.warning("Project Version Not Apply")
-    } else if (menu.options.action == 'login' && this.environment?.login?.type == "keycloak") {
-      if (this.platform.ANDROID || this.platform.IOS) {
-        let login = await this.mobileKeycloakService.login();
-      } else {
-        this.oauthService.initLoginFlow();
-      }
-    } else {
-      this.toggleCollapsed();
-      this.invokeMenu.emit(menu);
-    }
-  }
-
-  openLogsTable() {
-    let logsModal = this.dialogService.open(LogsComponent, {
-      width: '700px',
-      data: {}
-    });
-
-    // logsModal.onClose.subscribe((res: any) => {
-    //   if (res) {
-    //     console.log('res789: ', res);
-    //   }
-    // });
-  }
-
-  deleteMenuItem(subChild: any, index: any, event: any) {
-    event.stopPropagation();
-    this.settings.submenu[1].submenu.splice(index, 1);
-    this.deleteProject.emit(subChild);
-  }
-
-  navigateToProject(project: any) {
-    this.invokeProject.emit(project);
-  }
-
-  async changeLanguage(lang: any) {
-    if (lang) {
-      if (lang === 'de.json') {
-        // NG-Zorro
-        this.i18n.setLocale(de_DE);
-        // PrimeNG 🔥
-        // this.primengConfig.setTranslation(this.PRIME_DE);
-      } else {
-        this.i18n.setLocale(en_US);
-        // this.primengConfig.setTranslation(this.PRIME_EN);
-      }
-      const selectedLanguage = await this.couchdbService.getFileContentFromCouchDb(
-        `${this.tenantName}_${this.projectSeleted}`,
-        `languages/${lang}`
-      );
-      const errorMessages = await this.couchdbService.getFileContentFromCouchDb(
-        `${this.tenantName}_${this.projectSeleted}`,
-        `languages/errorMessage_${lang}`
-      );
-      this.languageChange.emit({ selectedLanguage: selectedLanguage, errorMessages: errorMessages });
-      this.setLanguage = true;
-      this.menuItemsCopy.forEach((menu: any, index: any) => {
-        if (menu.label && menu.label.caption && selectedLanguage[menu.label.caption]) {
-          this.menuItems[index].label.caption = selectedLanguage[menu.label.caption]
-        }
-        if (menu?.submenu?.length) {
-          menu?.submenu.forEach((subMenuInfo: any, subIndex: any) => {
-            if (subMenuInfo.label && subMenuInfo.label.caption && selectedLanguage[subMenuInfo.label.caption]) {
-              this.menuItems[index].submenu[subIndex].label.caption = selectedLanguage[subMenuInfo.label.caption];
-            }
-            if (subMenuInfo?.submenu?.length) {
-              subMenuInfo.submenu.forEach((childMenu: any, childIndex: any) => {
-                if (childMenu.label && childMenu.label.caption && selectedLanguage[childMenu.label.caption]) {
-                  this.menuItems[index].submenu[subIndex].submenu[childIndex].label.caption = selectedLanguage[childMenu.label.caption];
-                }
-              });
-            }
-          });
-        }
-      })
-      if (this.settingMenu?.label?.caption) {
-        this.settingMenu.label.caption = selectedLanguage[this.settings.label.caption]
-      }
-      this.settings?.submenu?.forEach((menu: any, index: any) => {
-        if (menu.label && menu.label.caption && selectedLanguage[menu.label.caption] && this.settingMenu?.submenu[index] && this.settingMenu.submenu[index]?.label) {
-          this.settingMenu.submenu[index].label.caption = selectedLanguage[menu.label.caption];
-        }
-      });
-    }
-  }
-}

package/src/lib/services/app-version-reset.service.ts

@@ -1,59 +0,0 @@
-import { Injectable } from '@angular/core';
-import { Preferences } from '@capacitor/preferences';
-import { APP_VERSION } from '../app-version';
-import { Platform } from '@angular/cdk/platform';
-
-const VERSION_KEY = 'APP_VERSION';
-
-
-@Injectable({
-  providedIn: 'root'
-})
-export class AppVersionResetService {
-
-  constructor(
-    private platform: Platform) {
-  }
-
-
-  async run(): Promise<void> {
-    if (this.platform.ANDROID || this.platform.IOS) {
-      await this.clearNativeIfChanged();
-      // this.clearWebIfChanged();
-      // return;
-    }
-  }
-
-  private async clearNativeIfChanged(): Promise<void> {
-    const { value: savedVersion } = await Preferences.get({ key: VERSION_KEY });
-    if (savedVersion === APP_VERSION) return;
-    console.log(`🧹 Clearing Capacitor Preferences (new build ${APP_VERSION})`);
-    await Preferences.clear();
-    this.clearWebStores();
-    await Preferences.set({ key: VERSION_KEY, value: APP_VERSION });
-  }
-
-  // private clearWebIfChanged(): void {
-  //   const savedVersion = sessionStorage.getItem(VERSION_KEY) || localStorage.getItem(VERSION_KEY);
-  //   if (savedVersion === APP_VERSION) return;
-  //   this.clearWebStores();
-  //   localStorage.setItem(VERSION_KEY, APP_VERSION);
-  //   sessionStorage.setItem(VERSION_KEY, APP_VERSION);
-  // }
-
-  private clearWebStores(): void {
-    try { localStorage.clear(); } catch { }
-    try { sessionStorage.clear(); } catch { }
-    try {
-      if (typeof document !== 'undefined' && document.cookie) {
-        document.cookie.split(';').forEach((c) => {
-          const eqPos = c.indexOf('=');
-          const name = eqPos > -1 ? c.substring(0, eqPos).trim() : c.trim();
-          if (name) {
-            document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/`;
-          }
-        });
-      }
-    } catch { }
-  }
-}

package/src/lib/services/config.service.ts

@@ -1,144 +0,0 @@
-import { Injectable } from '@angular/core';
-import { UtilityService } from './utility.service';
-import { Platform } from '@angular/cdk/platform';
-import { Couchdb } from './couchdb';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class ConfigService {
-  private config: any;
-  private skipOkta = false;
-  private keycloakConfig: any;
-
-  constructor(private couchdbService: Couchdb, private utilityService: UtilityService, private platform: Platform) { }
-
-  async loadOktaConfig(projectName: string): Promise<void> {
-    try {
-      let tenantKey: any = "";
-      let tenantName: any = "";
-      if (this.platform.ANDROID || this.platform.IOS) {
-        tenantKey = await this.utilityService.getLocalStorage('tenantKey');
-        tenantName = await this.utilityService.getLocalStorage('tenantName');
-      } else {
-        tenantKey = await this.utilityService.getStorage('tenantKey');
-        tenantName = await this.utilityService.getStorage('tenantName');
-      }
-      if (tenantName) {
-        this.config = await this.couchdbService.getFileContentFromCouchDb(
-          `${tenantName}_${projectName}`,
-          'environments/environment.json'
-        );
-      } else {
-        this.config = await this.couchdbService.getFileContentFromCouchDb(
-          `${projectName}`,
-          'environments/environment.json'
-        );
-      }
-
-      if (this.platform.ANDROID || this.platform.IOS) {
-        if (this.config.environment.login.mobile) {
-          this.setConfiguration(this.config.environment.login.mobile);
-        } else {
-          this.setConfiguration(null);
-        }
-      } else {
-        if (this.config.environment.login.web) {
-          this.setConfiguration(this.config.environment.login.web);
-        } else {
-          this.setConfiguration(null);
-        }
-      }
-
-    } catch (err) {
-      console.error('Error loading config:', err);
-    }
-  }
-
-  setConfiguration(config: any) {
-    if (config) {
-      this.config = config;
-    } else {
-      this.config = {
-        issuer: 'http://dummy',
-        clientId: 'dummy',
-        redirectUri: 'http://dummy',
-        pkce: true,
-      };
-    }
-  }
-
-  skipOktaConfig() {
-    this.skipOkta = true;
-  }
-
-  get oktaConfig() {
-    if (this.skipOkta) {
-      return null;
-    }
-    return this.config;
-  }
-
-  async loadKeycloakConfig(projectName: string): Promise<void> {
-    let tenantKey: any = "";
-    let tenantName: any = "";
-    if (this.platform.ANDROID || this.platform.IOS) {
-      tenantKey = await this.utilityService.getLocalStorage('tenantKey');
-      tenantName = await this.utilityService.getLocalStorage('tenantName');
-    } else {
-      tenantKey = await this.utilityService.getStorage('tenantKey');
-      tenantName = await this.utilityService.getStorage('tenantName');
-    }
-    let env: any = {};
-    if (tenantName) {
-      env = await this.couchdbService.getFileContentFromCouchDb(
-        `${tenantName}_${projectName}`,
-        'environments/environment.json'
-      );
-    } else {
-      env = await this.couchdbService.getFileContentFromCouchDb(
-        `${projectName}`,
-        'environments/environment.json'
-      );
-    }
-    if (env?.environment?.login.type === "keycloak") {
-      if (this.platform.ANDROID || this.platform.IOS) {
-        this.keycloakConfig = {
-          issuer: "https://keycloak-poc.wilken.de/realms/p5",
-          clientId: "mobile",
-          redirectUri: "de.yomotech:/login/callback",
-          logoutRedirectUri: "de.yomotech:/login/callback",
-          scope: "openid profile email",
-          responseType: "code"
-        }
-      } else {
-        this.keycloakConfig = {
-          issuer: env?.environment?.login?.web?.issuer ?? 'http://dummy',
-          clientId: env?.environment?.login?.web?.clientId ?? 'dummy',
-          redirectUri: window.location.origin,
-          responseType: 'code',
-          scope: 'openid profile email',
-          showDebugInformation: true
-        };
-      }
-    } else {
-      this.keycloakConfig = {};
-    }
-  }
-
-  getKeycloakConfig() {
-    return this.keycloakConfig;
-  }
-
-  getKeycloakMobileConfig() {
-    if (!this.keycloakConfig) return null;
-    return {
-      issuer: this.keycloakConfig?.issuer,
-      clientId: this.keycloakConfig?.clientId,
-      redirectUri: this.keycloakConfig.redirectUri,
-      logoutRedirectUri: this.keycloakConfig.logoutRedirectUri,
-      scope: this.keycloakConfig.scope,
-      responseType: this.keycloakConfig.responseType
-    };
-  }
-}