@yomotech/view-toolkit 0.0.1 → 0.0.3

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

@@ -0,0 +1,128 @@
+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');
+      }
+      this.config = await this.couchdbService.getFileContentFromCouchDb(
+        `${tenantName}_${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');
+    }
+    const env = await this.couchdbService.getFileContentFromCouchDb(
+      `${tenantName}_${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
+    };
+  }
+}

package/src/lib/services/couchdb.ts

@@ -0,0 +1,224 @@
+import { Injectable } from '@angular/core';
+import { UtilityService } from './utility.service';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class Couchdb {
+  private readonly couchDbBaseUrl = 'https://couchdb.yomotech.de';
+
+  constructor(private utilityService: UtilityService) { }
+
+  async getTenantDatabases(tenantKey: any): Promise<any[]> {
+    if (!tenantKey || !tenantKey.trim()) {
+      throw new Error('Missing tenantKey');
+    }
+
+    const response = await fetch(`https://couchdb.yomotech.de/tenant-dbs`, {
+      method: 'GET',
+      headers: {
+        Accept: 'application/json',
+        'X-Tenant-Key': tenantKey.trim(),
+      },
+    });
+
+    const data = await this.parseJsonOrText(response);
+
+    if (!response.ok) {
+      throw new Error(
+        `GET /tenant-dbs -> ${response.status} ${this.stringifyErrorDetails(data)}`
+      );
+    }
+
+    return data;
+  }
+
+  private async parseJsonOrText(response: Response): Promise<any> {
+    const rawText = await response.text();
+
+    if (!rawText) return null;
+
+    try {
+      return JSON.parse(rawText);
+    } catch {
+      return rawText;
+    }
+  }
+
+  private stringifyErrorDetails(data: any): string {
+    if (typeof data === 'string') return data;
+
+    try {
+      return JSON.stringify(data);
+    } catch {
+      return 'Unknown error';
+    }
+  }
+
+  async getFileContentFromCouchDb(
+    couchDbName: string,
+    filePath: string
+  ): Promise<any | null> {
+    try {
+
+      const dbName = couchDbName;
+      console.log('dbName: ', dbName);
+      console.log('filePath: ', filePath);
+      const docId = filePath?.trim();
+      if (!docId) {
+        console.error('Missing file path');
+        return null;
+      }
+
+      const response = await fetch(this.getDocumentUrl(dbName, docId), {
+        method: 'GET',
+        headers: await this.getReadHeaders(),
+      });
+
+      const doc = await this.parseJsonOrText(response);
+
+      if (!response.ok) {
+        console.error(
+          `Failed to fetch file "${docId}" from "${dbName}": ${response.status}`,
+          doc
+        );
+        return null;
+      }
+
+      if (!doc?.data) {
+        console.error(`Document "${docId}" does not contain file data`);
+        return null;
+      }
+
+      // do not decode images as utf8 text
+      if (this.isImageFile(doc.name || doc.path || docId, doc.contentType)) {
+        return {
+          type: 'base64file',
+          mimeType: doc.contentType || this.getImageMimeType(docId),
+          base64: doc.data,
+        };
+      }
+
+      const decodedContent = this.fromBase64(doc.data);
+
+      if (this.isJsonFile(doc.name || doc.path || docId, doc.contentType)) {
+        try {
+          return JSON.parse(decodedContent);
+        } catch (jsonError) {
+          console.error(`Failed to parse JSON for file "${docId}"`, jsonError);
+          return decodedContent;
+        }
+      }
+
+      return decodedContent;
+    } catch (error) {
+      console.error(
+        `Unexpected error while fetching file "${filePath}" from "${couchDbName}"`,
+        error
+      );
+      return null;
+    }
+  }
+
+  private isImageFile(fileNameOrPath: string, contentType?: string): boolean {
+    const lower = (fileNameOrPath || '').toLowerCase();
+
+    return (
+      lower.endsWith('.png') ||
+      lower.endsWith('.jpg') ||
+      lower.endsWith('.jpeg') ||
+      lower.endsWith('.ico') ||
+      lower.endsWith('.svg') ||
+      (contentType || '').startsWith('image/')
+    );
+  }
+
+  private getImageMimeType(fileNameOrPath: string): string {
+    const lower = (fileNameOrPath || '').toLowerCase();
+
+    if (lower.endsWith('.png')) return 'image/png';
+    if (lower.endsWith('.jpg') || lower.endsWith('.jpeg')) return 'image/jpeg';
+    if (lower.endsWith('.ico')) return 'image/x-icon';
+    if (lower.endsWith('.svg')) return 'image/svg+xml';
+
+    return 'image/png';
+  }
+
+  private fromBase64(base64: string): string {
+    try {
+      return decodeURIComponent(escape(atob(base64)));
+    } catch {
+      return atob(base64);
+    }
+  }
+
+  private isJsonFile(fileNameOrPath: string, contentType?: string): boolean {
+    const lower = (fileNameOrPath || '').toLowerCase();
+    return lower.endsWith('.json') || contentType === 'application/json';
+  }
+
+  private getDocumentUrl(dbName: string, docId: string): string {
+    return `${this.getDbUrl(dbName)}/${encodeURIComponent(docId)}`;
+  }
+
+  private getDbUrl(dbName: string): string {
+    return `${this.couchDbBaseUrl}/${dbName}`;
+  }
+
+  private async getReadHeaders(): Promise<HeadersInit> {
+    return {
+      Accept: 'application/json',
+      ...(await this.buildTenantHeaders()),
+    };
+  }
+
+  private async buildTenantHeaders(): Promise<HeadersInit> {
+    let tenantKey: any = await this.utilityService.getStorage('tenantKey');
+    let tenantName: any = await this.utilityService.getStorage('tenantName');
+
+    if (typeof tenantKey !== 'string' || !tenantKey.trim()) {
+      return {
+        'X-Tenant-Key': tenantKey.trim(),
+      };
+    } else if (typeof tenantName !== 'string' || !tenantName.trim()) {
+      return {
+        'X-Tenant': tenantName.trim(),
+      };
+    }
+    throw new Error('Missing tenantKey');
+
+  }
+
+  async getImageSrcFromCouchDb(
+    couchDbName: string,
+    filePath: string
+  ): Promise<string> {
+    const dbName = couchDbName;
+    const docId = filePath?.trim();
+
+    if (!docId) {
+      throw new Error('Missing file path');
+    }
+
+    const response = await fetch(this.getDocumentUrl(dbName, docId), {
+      method: 'GET',
+      headers: await this.getReadHeaders(),
+    });
+
+    const doc = await this.parseJsonOrText(response);
+
+    if (!response.ok) {
+      throw new Error(
+        `Failed to fetch image "${docId}" from "${dbName}": ${response.status} ${this.stringifyErrorDetails(doc)}`
+      );
+    }
+
+    if (!doc?.data) {
+      throw new Error(`Document "${docId}" does not contain image data`);
+    }
+
+    const mimeType = doc.contentType || 'image/png';
+
+    return `data:${mimeType};base64,${doc.data}`;
+  }
+}

package/src/lib/services/mobile-keycloak.service.ts

@@ -0,0 +1,116 @@
+import { Injectable } from '@angular/core';
+import { ConfigService } from './config.service';
+import { Capacitor } from '@capacitor/core';
+import { App } from '@capacitor/app';
+import { Browser } from '@capacitor/browser';
+import { OAuth2Client } from '@byteowls/capacitor-oauth2';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Platform } from '@angular/cdk/platform';
+import { UtilityService } from './utility.service';
+
+
+export interface MobileAuthTokens {
+  access_token: string;
+  refresh_token?: string;
+  id_token?: string;
+  expires_in?: number;
+  token_type?: string;
+}
+
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MobileKeycloakService {
+
+  private tokens: MobileAuthTokens | any = null;
+  constructor(private config: ConfigService, private http: HttpClient, private utilityService: UtilityService, private platform: Platform) {
+    if (Capacitor.isNativePlatform()) {
+      App.addListener('appUrlOpen', async (url: any) => {
+        // Nothing to do here; capacitor-oauth2 resolves internally.
+        // Keep listener to satisfy deep link expectations.
+      });
+    }
+  }
+
+  async login(): Promise<any> {
+    if (!Capacitor.isNativePlatform()) return null;
+    const cfg: any = this.config.getKeycloakMobileConfig();
+    const discoveryUrl = `${cfg.issuer}/.well-known/openid-configuration`;
+    const discovery: any = await (await fetch(discoveryUrl)).json();
+    const result = await OAuth2Client.authenticate({
+      appId: cfg.clientId, // <--- Keycloak clientId goes here
+      authorizationBaseUrl: discovery.authorization_endpoint,
+      accessTokenEndpoint: discovery.token_endpoint,
+      responseType: 'code',
+      redirectUrl: cfg.redirectUri,
+      scope: cfg.scope,
+      pkceEnabled: true,
+      logsEnabled: true
+    });
+    console.log('result-KEyClaok: ', result);
+    this.tokens = {
+      access_token: result?.access_token_response?.access_token ? result?.access_token_response?.access_token : result.access_token,
+      refresh_token: result?.access_token_response?.refresh_token,
+      id_token: result?.access_token_response?.id_token,
+      expires_in: result?.access_token_response?.expires_at ? result?.access_token_response?.expires_at : result?.access_token_response?.expires_in,
+      token_type: result?.access_token_response?.token_type
+    };
+    let keycloakLoginUser = "";
+    if (this.tokens.access_token) {
+      keycloakLoginUser = await this.getUserInfo(this.tokens.access_token, cfg.issuer);
+      console.log('keycloakLoginUser: ', keycloakLoginUser);
+      if (keycloakLoginUser) {
+        this.tokens['issuer'] = cfg.issuer;
+        this.utilityService.setLocalStorage("KeycloakInfo", this.tokens);
+        if (this.platform.ANDROID || this.platform.IOS) {
+          window.location.reload();
+        }
+      }
+    }
+    return keycloakLoginUser;
+  }
+
+  async getUserInfo(accessToken: any, issuer: any): Promise<any> {
+    try {
+      const headers = new HttpHeaders({
+        Authorization: `Bearer ${accessToken}`,
+      });
+      const url = `${issuer}/protocol/openid-connect/userinfo`;
+      return await this.http.get(url, { headers }).toPromise();
+    } catch (err) {
+      console.error('Error fetching user info:', err);
+      throw err;
+    }
+  }
+
+  getAccessToken(): string | null {
+    return this.tokens?.access_token ?? null;
+  }
+
+  getRefreshToken(): string | null {
+    return this.tokens?.refresh_token ?? null;
+  }
+
+  async logout(): Promise<void> {
+    const keycloakInfo: any = await this.utilityService.getLocalStorage('KeycloakInfo');
+    const cfg: any = this.config.getKeycloakMobileConfig();
+    const idToken = keycloakInfo?.keycloakInfo?.id_token;
+    const accessToken = keycloakInfo?.keycloakInfo?.access_token;
+    if (!idToken || !accessToken) {
+      console.warn('No tokens found for logout');
+      return;
+    }
+    const endSessionUrl =
+      `${cfg.issuer}/protocol/openid-connect/logout` +
+      `?id_token_hint=${encodeURIComponent(idToken)}` +
+      `&client_id=${encodeURIComponent(cfg.clientId)}` +
+      `&post_logout_redirect_uri=${encodeURIComponent(cfg.logoutRedirectUri)}`;
+    console.log('Logout URL:', endSessionUrl);
+    await Browser.open({ url: endSessionUrl });
+    this.tokens = null;
+    await this.utilityService.removeLocalStorage('KeycloakInfo');
+    window.location.reload();
+  }
+
+}

package/src/lib/services/network-log.service.ts

@@ -0,0 +1,27 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class NetworkLogService {
+
+  private logs: any[] = [];
+
+  addLog(log: any) {
+    this.logs.unshift(log); // latest first
+    localStorage.setItem('networkLogs', JSON.stringify(this.logs));
+  }
+
+  getLogsByDate(date: string): any[] {
+    return this.logs.filter(l => l.date === date);
+  }
+
+  getAll(): any[] {
+    return [...this.logs];
+  }
+
+  clear() {
+    this.logs = [];
+    localStorage.removeItem('networkLogs');
+  }
+}

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

@@ -0,0 +1,26 @@
+import { Injectable } from '@angular/core';
+import { ToastrService } from 'ngx-toastr';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class NotificationService {
+
+  constructor(public toastr: ToastrService) { }
+
+  success(message: string, time: number = 5000) {
+    this.toastr.success(message, "", { messageClass: 'toaster-font', titleClass: 'toaster-font', closeButton: true, timeOut: time });
+  }
+
+  info(message: string, time: number = 5000) {
+    this.toastr.info(message, "", { messageClass: 'toaster-font', titleClass: 'toaster-font', closeButton: true, timeOut: time });
+  }
+
+  warning(message: string, time: number = 20000) {
+    this.toastr.warning(message, "", { messageClass: 'toaster-font', titleClass: 'toaster-font', closeButton: true, timeOut: time });
+  }
+
+  error(error: string, time: number = 20000, message?: string,) {
+    this.toastr.error(error, message, { messageClass: 'toaster-font', titleClass: 'toaster-font', closeButton: true, timeOut: time });
+  }
+}

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

@@ -0,0 +1,183 @@
+import { Injectable } from '@angular/core';
+import PouchDB from 'pouchdb';
+import JSZip from 'jszip';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class PouchdbService {
+  private db = new PouchDB("");
+
+  async uploadAndStoreZip(zipFile: File, couchDbURl?: any): Promise<void> {
+    const zip = await JSZip.loadAsync(zipFile);
+    const fileName = zipFile?.name?.replace('.zip', '');
+    const envFilePath = `${fileName}/environments/environment.json`;
+    const envFile = zip.file(envFilePath);
+    if (envFile && !couchDbURl) {
+      const envFileContent = await envFile.async('string');
+      try {
+        const jsonData = JSON.parse(envFileContent);
+        if (jsonData?.environment?.couchdbUrl) {
+          this.db = new PouchDB(jsonData.environment.couchdbUrl);
+        }
+      } catch (e) {
+        console.error('Invalid JSON in environment.json:', e);
+      }
+    } else {
+      this.db = new PouchDB(couchDbURl);
+    }
+
+    // Proceed to upload all files
+    const savePromises: Promise<any>[] = [];
+    zip.forEach((relativePath: any, file: any) => {
+      if (!file.dir) {
+        savePromises.push(
+          file.async('base64').then((content: any) => {
+            const docId = relativePath.toString();
+            console.log('docId: ', docId);
+            return this.db.put({
+              _id: docId,
+              data: content,
+              type: 'file',
+              contentType: this.getMimeType(file.name)
+            }).catch((err: any) => {
+              if (err.status === 409) {
+                return this.db.get(docId).then((existing: any) => {
+                  return this.db.put({
+                    ...existing,
+                    data: content,
+                    contentType: this.getMimeType(file.name)
+                  });
+                });
+              }
+              throw err;
+            });
+          })
+        );
+      }
+    });
+    await Promise.all(savePromises);
+  }
+
+  async getFile(path: string, remoteDB: any): Promise<Blob> {
+    try {
+      if (remoteDB) {
+        this.db = new PouchDB(remoteDB);
+      }
+      const doc: any = await this.db.get(path);
+      return this.decodeBlob(doc);
+    } catch (err: any) {
+      if (err.status === 404 && remoteDB) {
+        try {
+          const remoteDoc: any = await this.db.get(path);
+          return this.decodeBlob(remoteDoc);
+        } catch (remoteErr) {
+          throw remoteErr;
+        }
+      } else {
+        throw err;
+      }
+    }
+  }
+
+  private decodeBlob(doc: any): Blob {
+    const byteCharacters = atob(doc.data);
+    const byteNumbers = new Array(byteCharacters.length).fill(0).map((_, i) => byteCharacters.charCodeAt(i));
+    const byteArray = new Uint8Array(byteNumbers);
+    return new Blob([byteArray], { type: doc.contentType });
+  }
+
+  async getTextFile(path: string, remotedbUrl: any): Promise<any> {
+    const blob = await this.getFile(path, remotedbUrl);
+    if (blob?.type && blob?.type === 'application/x-x509-ca-cert') {
+      const base64Der = await this.blobToBase64(blob);
+      return base64Der;
+    }
+    if (blob?.type && blob?.type.startsWith('image/')) {
+      return URL.createObjectURL(blob);
+    } else if (blob?.type && blob?.type === 'application/json') {
+      const text = await blob.text();
+      return JSON.parse(text);
+    } else {
+      return await blob.text();
+    }
+  }
+
+  blobToBase64(blob: Blob): Promise<string> {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onloadend = () => {
+        const base64 = (reader.result as string).split(',')[1];
+        resolve(base64);
+      };
+      reader.onerror = reject;
+      reader.readAsDataURL(blob);
+    });
+  }
+
+  getMimeType(fileName: string): string {
+    const extension = fileName.split('.').pop()?.toLowerCase();
+    const mimeMap: any = {
+      'json': 'application/json',
+      'css': 'text/css',
+      'scss': 'text/x-scss',
+      'jpg': 'image/jpeg',
+      'jpeg': 'image/jpeg',
+      'png': 'image/png',
+      'ico': 'image/x-icon',
+      'svg': 'image/svg+xml',
+      'html': 'text/html',
+      'js': 'application/javascript',
+      'ts': 'application/typescript',
+      'txt': 'text/plain',
+      'der': 'application/x-x509-ca-cert'
+    };
+    return mimeMap[extension || ''] || 'application/octet-stream';
+  }
+
+  async getAllDatabasesWithContent(couchdbBaseUrl: any): Promise<{ databaseName: string; content: boolean }[]> {
+    const connStr = couchdbBaseUrl;
+    const urlObj = new URL(connStr);
+    const credentials = `${urlObj.username}:${urlObj.password}`;
+    const originalPortMatch = connStr.match(/:(\d+)(?=\/|$)/);
+    const port = originalPortMatch ? originalPortMatch[1] : "";
+    const baseUrl = `${urlObj.protocol}//${urlObj.hostname}${port ? `:${port}` : ""}`;
+    const authHeader = {
+      'Authorization': 'Basic ' + btoa(`${credentials}`)
+    };
+    const response = await fetch(`${baseUrl}/_all_dbs`, {
+      headers: authHeader
+    });
+
+    if (!response.ok) {
+      throw new Error(`Error fetching databases: ${response.statusText}`);
+    }
+
+    const dbNames: string[] = await response.json();
+    const results: { databaseName: string; content: boolean }[] = [];
+    for (const dbName of dbNames) {
+      try {
+        const docsResponse = await fetch(`${baseUrl}/${dbName}/_all_docs?limit=1`, {
+          headers: authHeader
+        });
+
+        if (!docsResponse.ok) {
+          results.push({ databaseName: dbName, content: false });
+          continue;
+        }
+
+        const docsData = await docsResponse.json();
+        results.push({
+          databaseName: dbName,
+          content: docsData.total_rows > 0
+        });
+
+      } catch (err) {
+        console.log('err: ', err);
+        results.push({ databaseName: dbName, content: false });
+      }
+    }
+    return results;
+  }
+
+}