diff --git a/blog/2023-12-3.13-3.21.md b/blog/2023-12-3.13-3.21.md new file mode 100644 index 000000000..c3047abf0 --- /dev/null +++ b/blog/2023-12-3.13-3.21.md @@ -0,0 +1,147 @@ +--- +title: + '🎄 Uppy 3.13 to 3.21: Typescript Saga: the beginning, Image Editor improvements, Dashboard auto-install' +date: 2023-12-23 +authors: [aduh95, murderlon, arturi, mifi] +image: 'https://uppy.io/img/blog/3.13-3.21/dog-coding-laptop-mars-christmas-tree.jpg"' +slug: '2023/07/3.13-3.21' +published: true +toc_max_heading_level: 2 +--- + +Screenshot of the new Uppy website homepage + +It’s this time of the year again! Make yourself cozy [by the fire](https://www.youtube.com/watch?v=ouqtX6WWL1U), and let us help you unwrap the gifts Uppy has prepared for you. + +We proud of all the improvements and amazing new features and bug fixes we were able to introduce this year. The highlights being: conditional S3 multipart and signing S3 uploads on the client, speedy handling of 10-50k file uploads, refresh tokens (useful when the token expires mid-upload for a large amount of files / slow connections), server-sent events and new `assemblyOptions` for the Transloadit plugin, Dashboard Single File mode (`singleFileFullScreen`), improved ETA in the Status Bar, a bunch of new languages, including Hindi, Mexican Spanish and Catalan. + +This one, however, is a recent Uppy updates post, covering releases from +[`3.13.0` to `3.21.0`](https://github.com/transloadit/uppy/compare/uppy%403.13.0...uppy%403.21.0): announcing the switch to Typescript, Dashboard can now auto-install plugins, support for Catalan language, a heap of bug fixes for Tus, Companion, AWS S3, and more. + + + +## Typescript + +We are excited to announce that we are working hard to add Typescript types to Uppy Core and all of the plugins. We have a build setup in place that temporarily supports both `.ts` and `.js` files in our monorepo. And a helper utility that takes a package name and does the initial renaming and Typescript config. Then we go through the list of plugins one by one. We begun with `@uppy/utils` and `@uppy/core`, since most other packages depend on those. Now we are moving to the rest, one by one. + +This work so far is only affecting Uppy internals. In published packages we are using the manually crafted `d.ts` files, as before. We are planning to flip the switch and introduce some breaking changes in the next Uppy major, due to be released in the first quater of 2024. + +## Core + +- Allow duplicate files with `onBeforeFileAdded` +- Fixed`onBeforeFileAdded` with Golden Retriever +- Simplify types with class generic and type more events +- Export `UIPlugin` and `BasePlugin` in Uppy CDN bundle + +## Image Editor + +We have a whole separate blog post about the recent rotation improvements in the Image Editor, so please read that, if you are interested. Other changes include: + +- Fixed labels on all buttons, centered the rotation slider label +- Limited cropbox movements +- Fixed to respect `cropperOptions.initialAspectRatio` +- Change the checkered background color, make it semi-transparent +- Fixed granular rotation: `[-45, 45]` instead of `[-45, 44]` +- Removed 1px black lines +- Made `file-editor:cancel` event fire when the Image Editor’s “cancel” button is pressed + + + + +Editor semi-transparant checkered background + +## Dashboard + +Dashboard can now automatically discover and install compatible plugins without `target` option. Here’s how it works: + +```js +const uppy = new Uppy() + .use(ImageEditor) + .use(Dashboard) + .use(Webcam) + .use(GoogleDrive) +``` + +:::tip +The old way via `.use(ImageEditor, { target: Dashboard })` and `.use(Dashboard, { plugins: ['Webcam', 'GoogleDrive'] })` still work, but might be deprecated in the next major. +::: + +Bug fixes: + +- Remove `.uppy-Dashboard-isFixed` CSS class when `uppy.close()` is invoked +- When `showAddFilesPanel: true`, `aria-hidden` should be the opposite +- Don’t cancel all files and Assemblies when clicking “done” +- Update Dashboard’s blue color to meet WCAG contrast requirements + +## AWS S3 + +- Fixed `TypeError`, fixed `uploadURL` when using `PUT` +- Pass `signal` as separate arg for backward compat; pass the `uploadURL` back to the caller +- Refresh file before calling user-defined functions +- Made sure we retry signature request +- Use uppercase HTTP method names +- Call `#setCompanionHeaders` in `setOptions` + +## Companion + +One of the most notable changes in Companion is on the client side, we’ve made authentication optional, allowing for more provider types, with publicly accessable links, for example. + +In Companion Client we were able to drop the now unnecessary preflight requests, improving upload speeds and latency yet again. + +Other notable changes and fixes: + +- Allow dynamic S3 bucket +- Companion+client stability fixes, error handling and retries +- Catch "invalid initialization vector" instead of crashing +- Added Onedrive refresh tokens +- Fixed `authProvider` property inconsistency +- Fixed accelerated endpoints for presigned POST +- Fixed double tus uploads +- Fixed onedrive pagination +- Fixed Redis key default TTL +- Fixed Uploader.js metadata normalisation +- Make CSRF protection helpers available to providers +- Refactor `getProtectedHttpAgent` to make TS happ +- Unify redis initialization +- Use deferred length for tus streams +- Fixed a refresh token race condition +- Fixed edge case for pagination on root +- Fixed instagram/facebook auth error regression; uploadRemoteFile undefined; ProviderView error on empty plugin.icon +- Added getBucket metadata argument +- Added missing credentialsURL for box +- Added test endpoint for dynamic oauth creds +- Added Companion OAuth Key type +- Aliased "removeListener" as "off" in Redis emitter +- Utilize user-defined `onSuccess`, `onError`, and `onProgress` callbacks in `@uppy/tus` +- Invoke headers function for remote uploads +- Send certain Onedrive errors to the user +- Upgraded Node.js docker version + +## Frameworks Integraions + +- Angular: upgraded to Angular 16.x +- Svelte: Fixed TS build command +- Vue: added export for FileInput + +## Locales + +- Added Catalan locale `ca_ES` +- Added missing translations to `de_DE` +- Update Farsi + +## Transloadit + +- Emit assembly progress events +- Removed Socket.io — it’s server-sent events with fallback to polling now + +## Misc + +- Added Prettier, migrated to Vitest for Uppy core and Uppy plugins +- Update `file.meta.name` after compression, becase format/extension might have changed +- use latest Node.js version for tests +- Migrate to AWS-SDK V3 syntax +- Move remote file upload logic into companion-client + +Happy holidays and see you in 2024! diff --git a/static/img/blog/3.13-3.21/crop.mov b/static/img/blog/3.13-3.21/crop.mov new file mode 100644 index 000000000..e75127e30 Binary files /dev/null and b/static/img/blog/3.13-3.21/crop.mov differ diff --git a/static/img/blog/3.13-3.21/dog-coding-laptop-mars-christmas-tree.jpg b/static/img/blog/3.13-3.21/dog-coding-laptop-mars-christmas-tree.jpg new file mode 100644 index 000000000..80d3cfbe6 Binary files /dev/null and b/static/img/blog/3.13-3.21/dog-coding-laptop-mars-christmas-tree.jpg differ diff --git a/static/img/blog/3.13-3.21/editor.jpg b/static/img/blog/3.13-3.21/editor.jpg new file mode 100644 index 000000000..08552e6c6 Binary files /dev/null and b/static/img/blog/3.13-3.21/editor.jpg differ