@nu-art/file-upload-frontend 0.400.7

package/ATS_FileUploader/ATS_FileUploader.d.ts

@@ -0,0 +1,13 @@
+import { AppToolsScreen, ComponentSync } from '@nu-art/thunderstorm-frontend/index';
+import { ResolvableContent } from '@nu-art/ts-common';
+type Props = {
+    pageTitle?: ResolvableContent<string>;
+};
+type State = {};
+export declare class ATS_FileUploader extends ComponentSync<Props, State> {
+    static screen: AppToolsScreen;
+    static defaultProps: Partial<Props>;
+    constructor(p: Props);
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+export {};

package/ATS_FileUploader/ATS_FileUploader.js

@@ -0,0 +1,35 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { FirebaseAnalyticsModule } from '@nu-art/firebase-frontend/index';
+// import {TS_Icons} from '@nu-art/ts-styles';
+import { ATS_Fullstack, ComponentSync, LL_H_C, LL_H_T, LL_V_L, openContent, TS_DragAndDrop } from '@nu-art/thunderstorm-frontend/index';
+import { ModuleFE_AssetUploader } from '../modules/ModuleFE_AssetUploader.js';
+import { ModuleFE_Assets } from '../modules/ModuleFE_Assets.js';
+import { resolveContent, sortArray } from '@nu-art/ts-common';
+export class ATS_FileUploader extends ComponentSync {
+    static screen = {
+        name: `File Uploader`,
+        renderer: this,
+        group: ATS_Fullstack,
+        modulesToAwait: [ModuleFE_Assets],
+    };
+    static defaultProps = {
+        pageTitle: () => this.screen.name
+    };
+    constructor(p) {
+        super(p);
+        // @ts-ignore
+        FirebaseAnalyticsModule.setCurrentScreen(resolveContent(this.props.pageTitle));
+    }
+    render() {
+        return _jsxs(LL_H_T, { children: ["\u00A7", _jsx(LL_V_L, { children: sortArray([...ModuleFE_Assets.cache.all()], asset => asset.__updated).map(asset => {
+                        const tooltip = openContent.tooltip.bottom(`${asset._id}-tooltip`, () => {
+                            return _jsxs(LL_V_L, { children: [asset.bucketName, "/", asset.path] });
+                        }, { offset: 10 });
+                        return _jsx(LL_H_C, { className: "clickable h-gap__n", ...tooltip, children: asset.name }, asset._id);
+                    }) }), _jsx("div", { style: { width: 400, height: 302 }, children: _jsx(TS_DragAndDrop, { validate: files => {
+                            return files.map(file => ({ file, accepted: true }));
+                        }, onChange: acceptedFiles => {
+                            return ModuleFE_AssetUploader.upload(acceptedFiles, 'test-upload');
+                        } }) })] });
+    }
+}

package/ATS_FileUploader/ATS_FileUploader.scss

@@ -0,0 +1,2 @@
+.ts-ats.ats-FileUploader {
+}

package/ATS_FileUploader/index.d.ts

@@ -0,0 +1 @@
+export * from './ATS_FileUploader.js';

package/ATS_FileUploader/index.js

@@ -0,0 +1 @@
+export * from './ATS_FileUploader.js';

package/core/module-pack.d.ts

@@ -0,0 +1 @@
+export declare const ModulePackFE_FileUploader: (import("@nu-art/push-pub-sub-frontend/index").ModuleFE_PushPubSub_Class | import("../modules/ModuleFE_AssetUploader.js").ModuleFE_AssetUploader_Class | import("@nu-art/firebase-frontend").ModuleFE_Firebase_Class | import("@nu-art/push-pub-sub-frontend/modules/ModuleFE_PushSubscription").ModuleFE_PushSubscription_Class | import("../modules/ModuleFE_Assets.js").ModuleFE_Assets_Class)[];

package/core/module-pack.js

@@ -0,0 +1,26 @@
+/*
+ * Permissions management system, define access level for each of
+ * your server apis, and restrict users by giving them access levels
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { ModuleFE_AssetUploader } from '../modules/ModuleFE_AssetUploader.js';
+import { ModulePackFE_PushPubSub } from '@nu-art/push-pub-sub-frontend/index';
+import { ModuleFE_Assets } from '../modules/ModuleFE_Assets.js';
+export const ModulePackFE_FileUploader = [
+    ...ModulePackFE_PushPubSub,
+    ModuleFE_Assets,
+    ModuleFE_AssetUploader,
+];

package/index.d.ts

@@ -0,0 +1,3 @@
+export * from './core/module-pack.js';
+export * from './modules/ModuleFE_Assets.js';
+export * from './modules/ModuleFE_AssetUploader.js';

package/index.js

@@ -0,0 +1,21 @@
+/*
+ * Permissions management system, define access level for each of
+ * your server apis, and restrict users by giving them access levels
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export * from './core/module-pack.js';
+export * from './modules/ModuleFE_Assets.js';
+export * from './modules/ModuleFE_AssetUploader.js';

package/modules/ModuleFE_AssetUploader.d.ts

@@ -0,0 +1,17 @@
+import { ThunderDispatcher } from '@nu-art/thunderstorm-frontend/index';
+import { ApiStruct_AssetUploader, OnFileStatusChanged, TempSignedUrl, UI_Asset } from '@nu-art/file-upload-shared';
+import { ModuleBase_AssetUploader } from '@nu-art/file-upload-shared/modules/ModuleBase_AssetUploader';
+import { PushMessage_Payload } from '@nu-art/push-pub-sub-shared';
+import { ApiDef, ApiDefCaller, BaseHttpRequest, TypedApi } from '@nu-art/thunderstorm-shared';
+import { PushMessage_FileUploaded } from '@nu-art/file-upload-shared/assets/messages';
+export declare class ModuleFE_AssetUploader_Class extends ModuleBase_AssetUploader {
+    protected readonly dispatch_fileStatusChange: ThunderDispatcher<OnFileStatusChanged, "__onFileStatusChanged", [id: string], void>;
+    readonly vv1: ApiDefCaller<ApiStruct_AssetUploader>['vv1'];
+    constructor();
+    upload(files: File[], key: string, _public?: boolean): UI_Asset[];
+    createRequest<API extends TypedApi<any, any, any, any>>(uploadFile: ApiDef<API>): BaseHttpRequest<API>;
+    protected dispatchFileStatusChange(id: string): void;
+    protected subscribeToPush(toSubscribe: TempSignedUrl[]): Promise<void>;
+    __onMessageReceived(notification: PushMessage_Payload<PushMessage_FileUploaded>): void;
+}
+export declare const ModuleFE_AssetUploader: ModuleFE_AssetUploader_Class;

package/modules/ModuleFE_AssetUploader.js

@@ -0,0 +1,62 @@
+/*
+ * Permissions management system, define access level for each of
+ * your server apis, and restrict users by giving them access levels
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { apiWithBody, apiWithQuery, ModuleFE_XHR, ThunderDispatcher } from '@nu-art/thunderstorm-frontend/index';
+import { ApiDef_AssetUploader, FileStatus, PushKey_FileUploaded } from '@nu-art/file-upload-shared';
+import { ModuleBase_AssetUploader } from '@nu-art/file-upload-shared/modules/ModuleBase_AssetUploader';
+import { ModuleFE_PushPubSub } from '@nu-art/push-pub-sub-frontend/modules/ModuleFE_PushPubSub';
+import { generateHex } from '@nu-art/ts-common';
+export class ModuleFE_AssetUploader_Class extends ModuleBase_AssetUploader {
+    dispatch_fileStatusChange = new ThunderDispatcher('__onFileStatusChanged');
+    vv1;
+    constructor() {
+        super();
+        this.vv1 = {
+            getUploadUrl: apiWithBody(ApiDef_AssetUploader.vv1.getUploadUrl),
+            processAssetManually: apiWithQuery(ApiDef_AssetUploader.vv1.processAssetManually),
+        };
+    }
+    upload(files, key, _public = false) {
+        return this.uploadImpl(files.map((file => {
+            return {
+                feId: generateHex(32),
+                name: file.name,
+                mimeType: file.type,
+                key,
+                file,
+                ext: ''
+            };
+        })));
+    }
+    createRequest(uploadFile) {
+        return ModuleFE_XHR.createRequest(uploadFile);
+    }
+    dispatchFileStatusChange(id) {
+        this.dispatch_fileStatusChange.dispatchUI(id);
+    }
+    async subscribeToPush(toSubscribe) {
+        const subscriptions = toSubscribe.map(r => ({ topic: PushKey_FileUploaded, props: { feId: r.asset.feId } }));
+        await ModuleFE_PushPubSub.v1.registerAll(subscriptions).executeSync();
+    }
+    __onMessageReceived(notification) {
+        super.__onMessageReceived(notification);
+        if (notification.message?.status === FileStatus.Completed || notification.message?.status?.startsWith('Error'))
+            ModuleFE_PushPubSub.v1.unregister({ topic: PushKey_FileUploaded, filter: notification.filter });
+    }
+}
+export const ModuleFE_AssetUploader = new ModuleFE_AssetUploader_Class();

package/modules/ModuleFE_Assets.d.ts

@@ -0,0 +1,14 @@
+import { ModuleFE_BaseApi, ThunderDispatcher } from '@nu-art/thunderstorm-frontend/index';
+import { ApiStruct_Assets, DBProto_Assets } from '@nu-art/file-upload-shared';
+import { ApiDefCaller } from '@nu-art/thunderstorm-shared';
+import { ApiCallerEventType } from '@nu-art/thunderstorm-frontend/core/db-api-gen/types';
+export interface OnAssetsUpdated {
+    __onAssetsUpdated: (...params: ApiCallerEventType<DBProto_Assets>) => void;
+}
+export declare const dispatch_onAssetsListChanged: ThunderDispatcher<OnAssetsUpdated, "__onAssetsUpdated", ApiCallerEventType<DBProto_Assets>, void>;
+export declare class ModuleFE_Assets_Class extends ModuleFE_BaseApi<DBProto_Assets> {
+    readonly vv1: ApiDefCaller<ApiStruct_Assets>['vv1'];
+    constructor();
+    resolveValidSignedUrl(assetId: string): Promise<string>;
+}
+export declare const ModuleFE_Assets: ModuleFE_Assets_Class;

package/modules/ModuleFE_Assets.js

@@ -0,0 +1,23 @@
+import { apiWithBody, ModuleFE_BaseApi, ThunderDispatcher } from '@nu-art/thunderstorm-frontend/index';
+import { currentTimeMillis } from '@nu-art/ts-common';
+import { ApiDef_Assets, DBDef_Assets } from '@nu-art/file-upload-shared';
+export const dispatch_onAssetsListChanged = new ThunderDispatcher('__onAssetsUpdated');
+export class ModuleFE_Assets_Class extends ModuleFE_BaseApi {
+    vv1;
+    constructor() {
+        super(DBDef_Assets, dispatch_onAssetsListChanged);
+        this.vv1 = {
+            getReadSignedUrl: apiWithBody(ApiDef_Assets.vv1.getReadSignedUrl),
+        };
+    }
+    async resolveValidSignedUrl(assetId) {
+        const asset = this.cache.unique(assetId);
+        const signedUrl = (asset?.signedUrl?.validUntil || 0) > currentTimeMillis() ? asset?.signedUrl : undefined;
+        if (signedUrl)
+            return signedUrl.url;
+        const request = this.vv1.getReadSignedUrl({ _id: assetId });
+        const response = await request.executeSync();
+        return response.signedUrl;
+    }
+}
+export const ModuleFE_Assets = new ModuleFE_Assets_Class();

package/package.json

@@ -0,0 +1,78 @@
+{
+  "name": "@nu-art/file-upload-frontend",
+  "version": "0.400.7",
+  "description": "File Uploader - Express & Typescript based backend framework Frontend",
+  "keywords": [
+    "TacB0sS",
+    "infra",
+    "nu-art",
+    "storm",
+    "thunderstorm",
+    "typescript"
+  ],
+  "homepage": "https://github.com/nu-art-js/file-upload",
+  "bugs": {
+    "url": "https://github.com/nu-art-js/file-upload/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com:nu-art-js/file-upload.git"
+  },
+  "publishConfig": {
+    "directory": "dist",
+    "linkDirectory": true
+  },
+  "license": "Apache-2.0",
+  "author": "TacB0sS",
+  "files": [
+    "**/*"
+  ],
+  "scripts": {
+    "build": "tsc"
+  },
+  "dependencies": {
+    "@nu-art/file-upload-shared": "0.400.7",
+    "@google-cloud/common": "^5.0.2",
+    "@google-cloud/firestore": "^7.11.0",
+    "@google-cloud/storage": "^7.15.0",
+    "@nu-art/firebase-frontend": "0.400.7",
+    "@nu-art/firebase-shared": "0.400.7",
+    "@nu-art/permissions-frontend": "0.400.7",
+    "@nu-art/permissions-shared": "0.400.7",
+    "@nu-art/push-pub-sub-frontend": "0.400.7",
+    "@nu-art/push-pub-sub-shared": "0.400.7",
+    "@nu-art/thunderstorm-frontend": "0.400.7",
+    "@nu-art/thunderstorm-shared": "0.400.7",
+    "@nu-art/ts-common": "0.400.7",
+    "@nu-art/ts-styles": "0.400.7",
+    "@nu-art/user-account-frontend": "0.400.7",
+    "@nu-art/user-account-shared": "0.400.7",
+    "express": "^4.18.2",
+    "file-type": "^21.0.0",
+    "firebase": "^11.9.0",
+    "firebase-admin": "13.4.0",
+    "firebase-functions": "6.3.2",
+    "google-auth-library": "^10.0.0",
+    "jszip": "^3.2.2",
+    "react": "^18.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.0.0",
+    "@types/compression": "^1.0.1",
+    "@types/express": "^4.17.17"
+  },
+  "unitConfig": {
+    "type": "typescript-lib"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.js"
+    },
+    "./*": {
+      "types": "./*.d.ts",
+      "import": "./*.js"
+    }
+  }
+}

package/shared.d.ts

@@ -0,0 +1 @@
+export * from '@nu-art/file-upload-shared';

package/shared.js

@@ -0,0 +1,19 @@
+/*
+ * Permissions management system, define access level for each of
+ * your server apis, and restrict users by giving them access levels
+ *
+ * Copyright (C) 2020 Adam van der Kruk aka TacB0sS
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export * from '@nu-art/file-upload-shared';