@progressive-development/pd-spa-helper 0.2.7 → 0.2.9

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent pd-spa-helper following open-wc recommendations",
   "license": "MIT",
   "author": "pd-spa-helper",
-  "version": "0.2.7",
+  "version": "0.2.9",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "exports": {

package/src/index.ts

@@ -34,6 +34,7 @@ export {
   isAuthenticatedImpl,
   callFunctionImpl,
   uploadFile,
+  downloadFile,
   getStorageFileList
 } from './service-provider/service-provider-impl.js'
 

package/src/service-provider/firebase/firestorage-client.ts

@@ -1,5 +1,5 @@
 import { FirebaseApp } from 'firebase/app';
-import { FirebaseStorage, FullMetadata, StorageReference, UploadResult, getMetadata, getStorage, listAll, ref, uploadString } from "firebase/storage";
+import { FirebaseStorage, FullMetadata, StorageReference, UploadResult, getDownloadURL, getMetadata, getStorage, listAll, ref, uploadString } from "firebase/storage";
 
 import { FileStorageConfig, StorageDocument, UploadFile } from '../service-provider-model.js';
 import { getUser } from '../service-provider-impl.js';
@@ -131,6 +131,7 @@ export const getFirestorageFileList = (
         itemRefs.push({
           fileName: itemRef.name,
           filePath: itemRef.fullPath,
+          storageName, refKey
         });
 
         // MetaData for each item with own promise
@@ -163,6 +164,30 @@ export const getFirestorageFileList = (
 
 };
 
+export const downloadFileFirestorage = (file: StorageDocument) => {
+
+  if (!storageMap || storageMap.size === 0) {
+    throw new Error("No storage is configured");
+  }
+
+  // get storage  
+  const storageConf = storageMap.get(file.storageName);
+  if (!storageConf ) {
+    throw new Error(`Invalid storage name: ${file.storageName}`);
+  }  
+  if (!storageConf.references || storageConf.references.length === 0) {
+    throw new Error(`No references configured for storage: ${file.storageName}`);
+  }
+
+  // get refrence
+  const storageRef = storageConf.references.filter(refIt => refIt.key === file.refKey)[0];
+  if (!storageRef) {
+    throw new Error(`No reference available for storage: ${file.storageName} and ref: ${file.refKey}`);
+  }
+  const usedRef = ref(storageRef.storageRef, file.filePath);
+  return getDownloadURL(usedRef);
+}
+
 
 /* Firestorage Error List: https://firebase.google.com/docs/storage/web/handle-errors */
 /* 

package/src/service-provider/mock/storage-client.ts

@@ -124,17 +124,23 @@ export const uploadStorageFileMock = (file: UploadFile):Promise<any> => {
   return storageConf.storage.uploadFile(fileRef, file);
 };
 
+export const downloadFileMock = (file: StorageDocument) => {
+  alert("Not implemented for mock");
+  return Promise.resolve("");
+}
+
 export const getMockFileList = (
   storageName: string, 
-  keyRef: string,
+  refKey: string,
   subFolder?: string,
   includeMetadata?: boolean
 ):Promise<StorageDocument[]> => {
-  console.log("Searching for Documents in ", storageName, keyRef, subFolder, includeMetadata);
+  console.log("Searching for Documents in ", storageName, refKey, subFolder, includeMetadata);
   return Promise.resolve([{
     fileName: "workReport.png",
     filePath: "workReports/1234234f2fswf/workReport.png",
     documentType: "ToDo",
+    storageName, refKey
   }]);
 };
 

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

@@ -2,13 +2,16 @@ import { FirebaseApp, FirebaseOptions, initializeApp } from "firebase/app";
 
 import { authStateChanged, getAuthUser, initAuth, isAuthenticated, login, logout } from "./firebase/auth.js";
 import { authStateChangedMock, getAuthUserMock, isAuthenticatedMock, loginMock, logoutMock } from "./mock/auth.js";
-import { AppConfiguration, FileStorageConfig, FunctionDefinition, FunctionResult, FunctionsConfig, ServiceProviderConfiguration, StorageDocument, UploadFile } from "./service-provider-model.js";
+import { 
+  AppConfiguration, FileStorageConfig, FunctionDefinition, FunctionResult, 
+  FunctionsConfig, ServiceProviderConfiguration, StorageDocument, UploadFile 
+} from "./service-provider-model.js";
 import { callFunction, initFunctions } from "./firebase/functions-client.js";
 import { initFirestore } from "./firebase/firestore-client.js";
 import { callFunctionMock, initMockResponse } from "./mock/function-client.js";
 import { ServiceCallController } from "../service-call-controller2.js";
-import { getFirestorageFileList, initFirestorage, uploadFirestorageFile } from "./firebase/firestorage-client.js";
-import { getMockFileList, initStorageMock, uploadStorageFileMock } from "./mock/storage-client.js";
+import { downloadFileFirestorage, getFirestorageFileList, initFirestorage, uploadFirestorageFile } from "./firebase/firestorage-client.js";
+import { downloadFileMock, getMockFileList, initStorageMock, uploadStorageFileMock } from "./mock/storage-client.js";
 
 let provider: ServiceProviderConfiguration | undefined;
 let controller: ServiceCallController;
@@ -181,4 +184,14 @@ export const getStorageFileList = (
     return getMockFileList(storageName, keyRef, subFolder, includeMetadata);
   }
   return throwUndefinedProviderError();  
+}
+
+export const downloadFile = (file: StorageDocument): Promise<unknown> => {  
+  if (provider === "firebase") {
+    return downloadFileFirestorage(file);
+  } 
+  if (provider === "mock") {
+    return downloadFileMock(file)
+  }
+  return throwUndefinedProviderError();  
 }

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

@@ -133,6 +133,8 @@ export interface StorageMetadata {
 }
 
 export interface StorageDocument {
+  storageName: string,  
+  refKey: string,  
   fileName: string,  
   filePath: string,
   documentType?: string,  

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

@@ -7,7 +7,7 @@ const getSpaAppFeatureState = createFeatureStateSelector<SpaAppState>('spaApp');
 export const getLoadingSelector = createSelector(
   getSpaAppFeatureState,
   state => {
-    // filter add only the oldest for each typ
+    // 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)
     );

package/src/stories/pd-loading-state.stories.ts

@@ -138,3 +138,31 @@ export const ModalStateWithSubTasks: Story = {
   },
 };
 
+export const BackgroundWithSubTasks: Story = {
+  args: {
+    loadingState: {
+      isLoading: true,
+      modal: false,
+      smallBackground: true,
+      loadingTxt: "Sammelaufgabe wird erledigt",
+      subTask: [
+        {
+          actionKey: "",
+          completed: true,
+          loadingTxt: "SubTask 1"
+        },
+        {
+          actionKey: "",
+          completed: false,
+          loadingTxt: "SubTask 2"
+        },
+        {
+          actionKey: "",
+          completed: false,
+          loadingTxt: "SubTask 3"
+        },
+      ]
+    }
+  },
+};
+