From e5a5e0c9f3b282cabd0df250331314e79d7ff1dd Mon Sep 17 00:00:00 2001 From: Lawrence Wagerfield Date: Mon, 18 Sep 2023 15:03:35 +0100 Subject: [PATCH] Add "pendingFiles" and "uploadedFiles" to OnUpdate callback --- MIGRATE.md | 5 +++-- README.md | 5 ++++- package-lock.json | 14 +++++++------- package.json | 2 +- .../package-lock.json | 18 +++++++++--------- .../package.json | 2 +- .../src/lib/upload-dropzone.component.ts | 3 ++- 7 files changed, 27 insertions(+), 22 deletions(-) diff --git a/MIGRATE.md b/MIGRATE.md index aed6f64..32b6f9f 100644 --- a/MIGRATE.md +++ b/MIGRATE.md @@ -8,8 +8,9 @@ Steps: 2. Uninstall `angular-uploader` and `uploader` 3. Replace `"angular-uploader"` with `"@bytescale/upload-widget-angular"` in your `import` statements. 4. Replace `uploader` with `upload-widget` in all CSS class name overrides (if you have any). -5. Remove `uploader` (from imports and props) -6. Add `apiKey` as a field to the object passed to the `options` prop (add it if you don't have one). +5. Replace `onUpdate: (files) => {}` with `onUpdate: ({uploadedFiles}) => {}`. +6. Remove `uploader` (from imports and props) +7. Add `apiKey` as a field to the object passed to the `options` prop (add it if you don't have one). ### Before diff --git a/README.md b/README.md index 1cd0f83..c7b0f1c 100644 --- a/README.md +++ b/README.md @@ -239,7 +239,10 @@ const options = { reset, // Resets the widget when called. updateConfig // Updates the widget's config by passing a new config }) => {}, // object to the method's first parameter. - onUpdate: files => {}, // Called each time the list of uploaded files change. + onUpdate: (event) => { // Called each time the Upload Widget's list of files change. + // event.pendingFiles // Array of files that are either uploading or queued. + // event.uploadedFiles // Array of files that have been uploaded and not removed. + }, onPreUpload: async file => ({ errorMessage: "Uh oh!", // Displays this validation error to the user (if set). transformedFile: file // Uploads 'transformedFile' instead of 'file' (if set). diff --git a/package-lock.json b/package-lock.json index c4ddaa3..eb88cad 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,7 +16,7 @@ "@angular/platform-browser": "~13.3.0", "@angular/platform-browser-dynamic": "~13.3.0", "@angular/router": "~13.3.0", - "@bytescale/upload-widget": "^4.9.0", + "@bytescale/upload-widget": "^4.11.0", "rxjs": "~7.5.0", "tslib": "^2.3.0", "zone.js": "~0.11.4" @@ -2393,9 +2393,9 @@ "integrity": "sha512-yV72GRP/UjVSn2Cwytn/i5a4GV+Y+sZxplCgyvKSucBKHSaafc2QaM6oZi/o7iZvzmNBNJztN837btn+hRCfrw==" }, "node_modules/@bytescale/upload-widget": { - "version": "4.9.0", - "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.9.0.tgz", - "integrity": "sha512-yMO93w5LJQaRGOGMFhph+4bq5TvKCvxdglsPgB/ejE4Vup9k71rrQvSG0G8+n+eQOYfbN2IJluazAAH6SfrGRA==", + "version": "4.11.0", + "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.11.0.tgz", + "integrity": "sha512-pc7BT2udT90ZqWCp+09zo8rfzpX2HQQGPza8WMHty4/ZZu8FFnpikptABRM/F4v+cLWwQXIWO1zsq9rweYBtZw==", "dependencies": { "@bytescale/sdk": "^3.2.0", "classnames": "^2.2.6", @@ -16701,9 +16701,9 @@ "integrity": "sha512-yV72GRP/UjVSn2Cwytn/i5a4GV+Y+sZxplCgyvKSucBKHSaafc2QaM6oZi/o7iZvzmNBNJztN837btn+hRCfrw==" }, "@bytescale/upload-widget": { - "version": "4.9.0", - "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.9.0.tgz", - "integrity": "sha512-yMO93w5LJQaRGOGMFhph+4bq5TvKCvxdglsPgB/ejE4Vup9k71rrQvSG0G8+n+eQOYfbN2IJluazAAH6SfrGRA==", + "version": "4.11.0", + "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.11.0.tgz", + "integrity": "sha512-pc7BT2udT90ZqWCp+09zo8rfzpX2HQQGPza8WMHty4/ZZu8FFnpikptABRM/F4v+cLWwQXIWO1zsq9rweYBtZw==", "requires": { "@bytescale/sdk": "^3.2.0", "classnames": "^2.2.6", diff --git a/package.json b/package.json index e789b71..37bf642 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "@angular/platform-browser": "~13.3.0", "@angular/platform-browser-dynamic": "~13.3.0", "@angular/router": "~13.3.0", - "@bytescale/upload-widget": "^4.9.0", + "@bytescale/upload-widget": "^4.11.0", "rxjs": "~7.5.0", "tslib": "^2.3.0", "zone.js": "~0.11.4" diff --git a/projects/bytescale-upload-widget-angular/package-lock.json b/projects/bytescale-upload-widget-angular/package-lock.json index d8cabda..57d433d 100644 --- a/projects/bytescale-upload-widget-angular/package-lock.json +++ b/projects/bytescale-upload-widget-angular/package-lock.json @@ -1,17 +1,17 @@ { "name": "@bytescale/upload-widget-angular", - "version": "9.2.2", + "version": "9.3.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@bytescale/upload-widget-angular", - "version": "9.2.2", + "version": "9.3.0", "license": "MIT", "peerDependencies": { "@angular/common": ">=13", "@angular/core": ">=13", - "@bytescale/upload-widget": "^4.9.0", + "@bytescale/upload-widget": "^4.10.0", "tslib": "^2.3.0" } }, @@ -54,9 +54,9 @@ "peer": true }, "node_modules/@bytescale/upload-widget": { - "version": "4.9.0", - "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.9.0.tgz", - "integrity": "sha512-yMO93w5LJQaRGOGMFhph+4bq5TvKCvxdglsPgB/ejE4Vup9k71rrQvSG0G8+n+eQOYfbN2IJluazAAH6SfrGRA==", + "version": "4.11.0", + "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.11.0.tgz", + "integrity": "sha512-pc7BT2udT90ZqWCp+09zo8rfzpX2HQQGPza8WMHty4/ZZu8FFnpikptABRM/F4v+cLWwQXIWO1zsq9rweYBtZw==", "peer": true, "dependencies": { "@bytescale/sdk": "^3.2.0", @@ -131,9 +131,9 @@ "peer": true }, "@bytescale/upload-widget": { - "version": "4.9.0", - "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.9.0.tgz", - "integrity": "sha512-yMO93w5LJQaRGOGMFhph+4bq5TvKCvxdglsPgB/ejE4Vup9k71rrQvSG0G8+n+eQOYfbN2IJluazAAH6SfrGRA==", + "version": "4.11.0", + "resolved": "https://registry.npmjs.org/@bytescale/upload-widget/-/upload-widget-4.11.0.tgz", + "integrity": "sha512-pc7BT2udT90ZqWCp+09zo8rfzpX2HQQGPza8WMHty4/ZZu8FFnpikptABRM/F4v+cLWwQXIWO1zsq9rweYBtZw==", "peer": true, "requires": { "@bytescale/sdk": "^3.2.0", diff --git a/projects/bytescale-upload-widget-angular/package.json b/projects/bytescale-upload-widget-angular/package.json index dbe3079..9d5510e 100644 --- a/projects/bytescale-upload-widget-angular/package.json +++ b/projects/bytescale-upload-widget-angular/package.json @@ -52,7 +52,7 @@ "peerDependencies": { "@angular/common": ">=13", "@angular/core": ">=13", - "@bytescale/upload-widget": "^4.9.0", + "@bytescale/upload-widget": "^4.10.0", "tslib": "^2.3.0" } } diff --git a/projects/bytescale-upload-widget-angular/src/lib/upload-dropzone.component.ts b/projects/bytescale-upload-widget-angular/src/lib/upload-dropzone.component.ts index f78cfc1..c563606 100644 --- a/projects/bytescale-upload-widget-angular/src/lib/upload-dropzone.component.ts +++ b/projects/bytescale-upload-widget-angular/src/lib/upload-dropzone.component.ts @@ -1,5 +1,6 @@ import { AfterViewInit, Component, ElementRef, Input, ViewChild } from "@angular/core"; import { UploadWidget, UploadWidgetConfig, UploadWidgetResult } from "@bytescale/upload-widget"; +import { UploadWidgetOnUpdateEvent } from "@bytescale/upload-widget/dist/config/UploadWidgetOnUpdateEvent"; @Component({ selector: "upload-dropzone", @@ -14,7 +15,7 @@ import { UploadWidget, UploadWidgetConfig, UploadWidgetResult } from "@bytescale export class UploadDropzoneComponent implements AfterViewInit { @Input("options") options?: UploadWidgetConfig; @Input("onComplete") onComplete?: (files: UploadWidgetResult[]) => void; - @Input("onUpdate") onUpdate?: (files: UploadWidgetResult[]) => void; + @Input("onUpdate") onUpdate?: (event: UploadWidgetOnUpdateEvent) => void; @Input("width") width: string = "600px"; @Input("height") height: string = "375px";