@progressive-development/pd-spa-helper 0.3.101 → 0.3.103

package/src/service-provider/service-provider-model.ts

@@ -1,162 +0,0 @@
-import { FirebaseOptions } from "firebase/app";
-import { TemplateResult } from "lit";
-
-
-/**
- * Implemeted service provider
- */
-export type ServiceProviderFirebase = "firebase";
-export type ServiceProviderMock = "mock";
-export type ServiceProviderConfiguration = ServiceProviderFirebase | ServiceProviderMock;
-
-
-export interface FunctionResult {
-  resultData: unknown,
-  statusCode: number,
-}
-
-/**
- * Function model.
- */
-
-export interface FunctionDefinition {
-  name: string,
-  successCodes: Array<Number>,    
-  // Fade window during function call (true) or show only background infos (false).
-  fadeWindow: boolean,
-  successTxt: string | TemplateResult,
-  pendingTxt: string | TemplateResult,
-  param?: any,
-  redirect?: string,
-  logoutOnFail?: boolean,
-}
-
-export interface FunctionParam {
-  func: FunctionDefinition,
-  inputData: any,
-}
-
-export interface FunctionsConfig {
-  region: string, // 'europe-west3'
-  functions: Array<FunctionDefinition>,
-  postLoginFunc?: FunctionDefinition,
-}
-
-
-/**
- * App data models.
- */
-
-export interface MenuElement {
-  key: string,
-  name: string,
-  sec?: string,
-  route?: string,
-  action?: Function,
-  topItem?: boolean,
-  ref?: any,
-  icon?: string,
-}
-
-export interface NavigationPage {
-  name: string,
-  mainClass?: string,
-  pattern: Array<string>,  
-  auth: boolean,
-  menu?: Array<MenuElement>,
-  topMenu?: Array<MenuElement>,
-  withTeaser?: boolean,
-  withFooter?: boolean
-  hideMenu?: boolean
-  hideTopMenu?: boolean
-  topMenuItems?: Array<MenuElement>,
-}
-
-export interface NavigationConfig {
-  pages: Array<NavigationPage>,
-  includeLogin: boolean
-}
-
-export interface LinkObj {
-  name: string,
-  key: string,
-  link?: string,
-  action?: Function
-}
-
-export interface Footer {
-  version: string,
-  links: Array<LinkObj>
-}
-
-
-export interface StoreConfig {
-  appName: string,
-  reducer: any,
-  effects: Array<any>
-}
-
-export interface FileStorage {
-  name: string,
-  references: string[]  
-}
-
-export interface FileStorageConfig {
-  storage: FileStorage[],
-}
-
-export interface MessagingConfig {
-  apidKey: string;  
-}
-
-export interface AppConfiguration {  
-  serviceProvider?: ServiceProviderConfiguration,
-  mock?: {
-    mockResponse?: Map<string, Function>,
-    mockWaitTime?: number,
-  }
-  navigationConfigParam: NavigationConfig;
-  storeConfigParam?: StoreConfig;
-  firebaseConfig?: FirebaseOptions;
-  storageConfig?: FileStorageConfig;
-  functionsConfig?: FunctionsConfig;
-  messagingConfig?: MessagingConfig;
-}
-
-export interface UploadFile {  
-  fileName: string,  
-  base64DataURL:string,
-  descriptionName:string,
-  description:string,
-  storageName: string
-  referenceKey: string
-  subFolderName?: string,
-  readonly?: boolean,
-}
-
-export interface StorageMetadata {
-
-}
-
-export interface StorageDocument {
-  storageName: string,  
-  refKey: string,  
-  fileName: string,  
-  filePath: string,
-  subFolderName?: string,
-  documentType?: string,  
-  description?:string,  
-  descriptionName?: string,
-  creation?:Date,
-  creator?:string,
-  size?: number,
-  readonly?: boolean,
-  metaData?: StorageMetadata
-}
-
-export interface CollectionContraint {
-  type: "where",
-  field: string,
-  operator: "<" | ">" | ">=" | "<=" | "==" | "!=" | "array-contains" | "array-contains-any" | "in" | "not-in",
-  value: any,
-}

package/src/store/indexDB.ts

@@ -1,244 +0,0 @@
-// use version import to initialize modul
-
-import { pdStore } from "./mini-rx.store";
-import { initIndexDBSucess } from "./spa-app-actions.js";
-
-export const USER_COLLECTION = "dcInternalUser";
-
-const {indexedDB} = window;
-let db:any;
-
-/*
-Eine kurze Verzögerung eingebaut.
-
-Fehler im Chrome (einmal, sonst nicht) => Vorher logout durch USerSync (user nicht da).
-Upgrade needed IDBVersionChangeEvent {isTrusted: true, oldVersion: 0, newVersion: 2, dataLoss: "none", dataLossMessage: "",}
-indexDB2.js:190 Error during background initialize DOMException: Failed to execute 'transaction' on 'IDBDatabase': A version change transaction is running.
-    at http://localhost:8000/src/js/indexDB2.js:32:24
-    at new Promise (<anonymous>)
-    at add (http://localhost:8000/src/js/indexDB2.js:31:46)
-    at addBackground (http://localhost:8000/src/js/indexDB2.js:203:38)
-    at http://localhost:8000/src/js/indexDB2.js:143:26
-
-*/
-
-export const add = <T>(table: string, el: T, ignoreDuplicates: boolean) =>
-  new Promise((resolve, reject) => {
-    const request = db
-      .transaction([table], 'readwrite')
-      .objectStore(table)
-      .add(el);
-    request.onsuccess = () => resolve(request.result);
-    request.onerror = (event: any) => {
-      if (event.target.error.code === 0 && ignoreDuplicates) {
-        return resolve('duplicate');
-      }
-      console.warn('Unable to add data!', event, el);
-      return reject(event.target.error);
-    };
-  });
-
-export const update = <T>(table: string, el: T) =>
-  new Promise((resolve, reject) => {
-    const request = db
-      .transaction([table], 'readwrite')
-      .objectStore(table)
-      .put(el);
-    request.onsuccess = () => resolve(request.result);
-    request.onerror = (event: any) => {
-      console.warn('Unable to put data!', event, el);
-      return reject(event.target.error);
-    };
-  });  
-
-export const updateAll = <T>(table: string, elArray: T[]) =>
-  new Promise((resolve, reject) => {
-    const promises: unknown[] = [];
-    elArray.forEach(el => {
-      promises.push(update<T>(table, el));
-    });
-
-    return Promise.all(promises)
-      .then(resArr => resolve(resArr))
-      .catch(e => reject(e));
-  });
-
-
-export const addAll = <T>(table: string, elArray: T[], ignoreDuplicates: boolean) =>
-  new Promise((resolve, reject) => {
-    const promises: unknown[] = [];
-    elArray.forEach(el => {
-      promises.push(<T>add(table, el, ignoreDuplicates));
-    });
-
-    return Promise.all(promises)
-      .then(resArr => resolve(resArr))
-      .catch(e => reject(e));
-  });
-
-
-const deleteEl = (table: string, id: string) =>
-  new Promise((resolve, reject) => {
-    const request = db
-      .transaction([table], 'readwrite')
-      .objectStore(table)
-      .delete(id);
-
-    request.onsuccess = () => resolve(request.result);
-    request.onerror = (e: any) => reject(e);
-  });  
-
-
-export const deleteAllEl = (table: string, elIdArray: string[]) =>
-  new Promise((resolve, reject) => {
-    const promises: unknown[] = [];
-    elIdArray.forEach(elId => {
-      promises.push(deleteEl(table, elId));
-    });
-
-    return Promise.all(promises)
-      .then(resArr => resolve(resArr))
-      .catch(e => reject(e));
-  });  
-
-
-export const get = <T>(table: string, id: string): Promise<T> =>
-  new Promise((resolve, reject) => {
-    const request = db.transaction([table]).objectStore(table).get(id);
-    request.onsuccess = () => resolve(request.result);
-    request.onerror = (e: any) => reject(e);
-  });
-
-export const getAll = <T>(table: string, index?: string): Promise<T[]> =>
-  new Promise((resolve, reject) => {
-    const request = index
-      ? db
-          .transaction([table], 'readonly')
-          .objectStore(table)
-          .index(index)
-          .openCursor()
-      : db.transaction([table], 'readonly').objectStore(table).openCursor();
-    // CHECK: getAll => https://developer.mozilla.org/en-US/docs/Web/API/IDBObjectStore    
-    const res: T[] = [];
-    request.onsuccess = function (event: any) {
-      const cursor = event.target.result;
-      if (cursor) {
-        // cursor.value contains the current record being iterated through
-        // this is where you'd do something with the result
-        res.push(cursor.value);
-        cursor.continue();
-      } else {
-        // no more results
-        resolve(res);
-      }
-    };
-    request.onerror = (e: any) => reject(e);
-  });
-
-export const getAllIds = (table: string) => 
-  new Promise((resolve, reject) => {
-    const request = db.transaction([table], 'readonly').objectStore(table).openCursor();
-    // CHECK: getAll => https://developer.mozilla.org/en-US/docs/Web/API/IDBObjectStore    
-    const res: unknown[] = [];
-    request.onsuccess = function (event: any) {
-      const cursor = event.target.result;
-      if (cursor) {
-        // cursor.value contains the current record being iterated through
-        // this is where you'd do something with the result
-        res.push(cursor.value.id);
-        cursor.continue();
-      } else {
-        // no more results
-        resolve(res);
-      }
-    };
-    request.onerror = (e: any) => reject(e);
-  });
-
-
-export const deleteAll = (table: string) =>
-  new Promise((resolve, reject) => {
-    const request = db
-      .transaction([table], 'readwrite')
-      .objectStore(table)
-      .clear();
-
-    request.onsuccess = () => resolve(request.result);
-    request.onerror = (e: any) => reject(e);
-  });
-
-
-export const removeDatabase = (dbName:string) =>
-  new Promise((resolve, reject) => {
-    db.close();
-    const request = indexedDB.deleteDatabase(dbName);
-    request.onsuccess = () => resolve(request.result);
-    request.onerror = (e: any) => reject(e);
-});
-
-
-/**
- * Init indexDB for application.
- * 
- * @param config - config for index db 
- * @param successCallback - callback function after db is successfully initialized 
- */
-export const initDB = (
-  config: {
-    dbName:string,
-    dbVersion:number,
-    collections: {
-      name: string,
-      collectionConf: { 
-        keyPath?: string
-      }
-    }[]
-  }) => {
-  if (!indexedDB) {
-    window.alert("Your browser doesn't support a stable version of IndexedDB.");
-  } else {
-    const {dbName, dbVersion, collections} = config;
-    const request = indexedDB.open(dbName, dbVersion);
-    request.onerror = event => {
-      console.log('error during db init:', event);
-    };
-
-    request.onsuccess = () => {
-      db = request.result;
-      console.log(`db init success: ${db}`);
-      pdStore().dispatch(initIndexDBSucess());
-    };
-
-    request.onupgradeneeded = (event: any) => {
-      console.log('Upgrade needed', event);
-      db = event.target.result;
-      switch (event.oldVersion) {
-        // first call from client, init db
-        case 0:          
-          // create user DB
-          db.createObjectStore(USER_COLLECTION, { 
-            keyPath: "id",
-          });
-          collections.forEach(c => {
-            db.createObjectStore(c.name, c.collectionConf);
-          });
-          break;
-        // depending on our needs, add specific versions here to migrate existing db
-        // case X: ....
-        default:
-          console.log('Updating database structure for existing version');
-          // Ergänzt alle neuen Collections, wenn alte Versionen aktualisiert werden
-          if (!db.objectStoreNames.contains(USER_COLLECTION)) {
-            db.createObjectStore(USER_COLLECTION, { 
-              keyPath: "id",
-            });
-          }
-          collections.forEach(c => {
-            if (!db.objectStoreNames.contains(c.name)) {
-              db.createObjectStore(c.name, c.collectionConf);
-            }
-          });
-      }
-    };
-  }
-};

package/src/store/mini-rx.store.ts

@@ -1,48 +0,0 @@
-import { configureStore, Store, LoggerExtension, ReduxDevtoolsExtension, ImmutableStateExtension } from 'mini-rx-store';
-import { StoreConfig } from '../service-provider/service-provider-model.js';
-import { spaAppReducer } from '../store/spa-app-reducer.js';
-import { appRouteEffect, appToastEffect, registerNotificationTokenSuccessEffect } from '../store/spa-app-effects.js';
-
-let store: Store;
-
-const registerEffects = (effects: any[]) => {
-  if (store) {
-    // Register default app route effect
-    store.effect(appRouteEffect);
-    store.effect(appToastEffect);
-    store.effect(registerNotificationTokenSuccessEffect);
-    
-    // Register configured effects
-    effects.forEach(effect => store.effect(effect));
-  } else {
-    console.error("Store is not initialized. Cannot register effects.");
-  }
-};
-
-export const initializeStore = (param: StoreConfig) => {
-  console.log("Initialize Store:", param);
-
-  // create store
-  if (!store) {
-    store = configureStore({  
-      reducers: param.reducer ? {
-        spaApp: spaAppReducer,
-        ...param.reducer
-      } : {
-        spaApp: spaAppReducer        
-      },
-      extensions: [
-        new LoggerExtension(),
-        new ReduxDevtoolsExtension({
-          name: param.appName
-        }),
-        new ImmutableStateExtension()
-      ],
-    });
-
-    // register default effects after store is initialized
-    registerEffects(param.effects);
-  }
-};
-
-export const pdStore = (): Store => store;

package/src/store/spa-app-actions.ts

@@ -1,36 +0,0 @@
-import { TemplateResult } from 'lit';
-import { action, payload } from 'ts-action';
-
-import { LoadingState, LoadingSubTask } from '../model/spa-model.js';
-
-
-export const initIndexDBSucess = action('SPA_INIT_INDEX_DB_SUCCESS');
-export const loginSucess = action('SPA_LOGIN_SUCCESS');
-export const nologin = action('SPA_NO_LOGIN');
-
-export const routeAction = action('SPA_APP_ROUTE', payload<string>());
-
-export const toastAction = action('SPA_APP_TOAST', payload<{
-  txt: string | TemplateResult,
-  isError: boolean,
-  isSuccess: boolean,
-  duration? : number,
-}>());
-
-export const updateInternetOffline = action('SPA_APP_UPDATE_INTERNET_OFFLINE', payload<boolean>());
-
-export const addLoadingState = action('SPA_APP_ADD_LOADING', payload<LoadingState>());
-export const changeSubTask = action('SPA_APP_CHANGE_SUB_LOADING', payload<{
-  loadingActionId: string,
-  newTaskState: LoadingSubTask
-}>());
-export const removeLoadingState = action('SPA_APP_REMOVE_LOADING', payload<string>());
-
-
-export const updateNewNotificationToken = action('UPDATE_NOTIFICATION_TOKEN', payload<{
-  messagingToken: string
-}>());
-export const updateNewNotificationTokenSuccess = action('UPDATE_NOTIFICATION_TOKEN_SUCCESS', payload<{
-  messagingToken: string
-}>());
-export const updateNewNotificationTokenFail = action('UPDATE_NOTIFICATION_TOKEN_FAIL', payload<Error>());

package/src/store/spa-app-effects.ts

@@ -1,73 +0,0 @@
-import { actions$, createEffect } from 'mini-rx-store';
-
-import { tap } from 'rxjs/operators';
-
-import { ofType } from 'ts-action-operators';
-
-import { routeAction, toastAction, updateNewNotificationTokenSuccess } from './spa-app-actions.js';
-import { NOTIFICATION_TOKEN } from '../service-provider/firebase/messagingFirebaseClient.js';
-
-
-let routeElement: HTMLElement;
-
-export const setRouteElement = (param: HTMLElement) => {
-  routeElement = param;
-}
-
-// remove loading task if all sub tasks done
-
-
-export const appRouteEffect = createEffect(
-  actions$.pipe(
-    ofType(routeAction),
-    tap((action) => {
-      if (!routeElement) {
-        console.error("No route element set for appRouteEffect");
-      } else {        
-        routeElement.dispatchEvent(new CustomEvent('route-event', {
-          detail: {route: action.payload},
-          bubbles: true,
-          composed: true
-        }));        
-      }
-    })
-  ), {
-    dispatch: false
-  }
-);
-
-
-export const appToastEffect = createEffect(
-  actions$.pipe(
-    ofType(toastAction),
-    tap((action) => {
-      if (!routeElement) {
-        console.error("No route element set for appToastEffect");
-      } else {        
-        routeElement.dispatchEvent(new CustomEvent('toast-event', {
-          detail: {
-            txt: action.payload.txt,
-            isSuccess: action.payload.isSuccess,
-            isError: action.payload.isError,
-            duration: action.payload.duration,
-          },
-          bubbles: true,
-          composed: true
-        }));        
-      }
-    })
-  ), {
-    dispatch: false
-  }
-);
-
-export const registerNotificationTokenSuccessEffect = createEffect(
-  actions$.pipe(
-    ofType(updateNewNotificationTokenSuccess),
-    tap((action) => {
-      localStorage.setItem(NOTIFICATION_TOKEN, action.payload.messagingToken);
-    })
-  ), {
-    dispatch: false
-  }
-);

package/src/store/spa-app-reducer.ts

@@ -1,86 +0,0 @@
-import { on, reducer } from 'ts-action';
-
-import { initIndexDBSucess, addLoadingState, loginSucess, routeAction, updateInternetOffline, removeLoadingState, changeSubTask } from './spa-app-actions.js';
-import { LoadingState } from '../model/spa-model.js';
-
-export interface SpaAppState {
-  offline?: boolean,
-  loadingState: LoadingState[];
-  lastRoutes?: any[];
-  initIndexDB?: boolean;
-  userLogin?: boolean;
-}
-
-const initialState: SpaAppState = {  
-  loadingState: [],
-};
-
-export const spaAppReducer = reducer(
-  initialState,
-
-  on (updateInternetOffline, (state, {payload}) =>  (
-    {
-      ...state,
-      offline: payload
-    }
-  )),  
-    
-  on(addLoadingState, (state, {payload}) => (
-    {
-      ...state,
-      loadingState: [
-        ...(state.loadingState),
-        payload
-      ]
-    }
-  )),
-
-  on(changeSubTask, (state, {payload}) => (
-    {
-      ...state,
-      loadingState: state.loadingState.map(ls => {
-        if (ls.actionKey === payload.loadingActionId) {
-          // change new sub task in sub task list
-          return {
-            ...ls,
-            subTask: ls.subTask?.map(subLs => subLs.actionKey 
-              === payload.newTaskState.actionKey ? payload.newTaskState : subLs),
-          }
-        }
-        return ls;
-      })
-    }
-  )),
-
-  on(removeLoadingState, (state, {payload}) => (
-    {
-      ...state,
-      loadingState: state.loadingState?.filter(a => a.actionKey !== payload)
-    }
-  )),
-
-  on(routeAction, (state, {payload}) => (
-    {
-      ...state,
-      lastRoutes: [
-        ...(state.lastRoutes || []),
-        payload
-      ]
-    }
-  )),
-
-  on(initIndexDBSucess, (state) => (
-    {
-      ...state,
-      initIndexDB: true,
-    }
-  )),
-
-  on(loginSucess, (state) => (
-    {
-      ...state,
-      userLogin: true,
-    }
-  )),
-
-);

package/src/store/spa-app-selector.ts

@@ -1,41 +0,0 @@
-import { createFeatureStateSelector, createSelector } from "mini-rx-store";
-
-import { SpaAppState } from "./spa-app-reducer.js";
-
-const getSpaAppFeatureState = createFeatureStateSelector<SpaAppState>('spaApp');
-
-export const getLoadingSelector = createSelector(
-  getSpaAppFeatureState,
-  state => {
-    // filter add only the oldest for each typ (avoid overlapping loading boxes with different size)
-    const orderByCreation = [...state.loadingState].sort(
-      (a, b) => (a.creation?.getMilliseconds() || 0) - (b.creation?.getMilliseconds() || 0)
-    );
-
-    // filter modal
-    const loadings = [];
-    const mainLoading = orderByCreation.filter(a => !a.smallBackground);
-    if (mainLoading.length > 0) {
-      loadings.push(mainLoading[0]);
-    }
-    const smallLoading = orderByCreation.filter(a => a.smallBackground);
-    if (smallLoading.length > 0) {
-      loadings.push(smallLoading[0]);
-    }
-
-    return loadings;
-  }
-);
-
-export const getOfflineSelector = createSelector(
-  getSpaAppFeatureState,
-  state => state.offline === true
-);
-
-export const getInitStatusSelector = createSelector(
-  getSpaAppFeatureState,
-  state => ({
-    login: state.userLogin,
-    indexedDB: state.initIndexDB
-  })
-);