diff --git a/.changeset/bright-buses-listen.md b/.changeset/bright-buses-listen.md index 591b2fd3..f534ecb9 100644 --- a/.changeset/bright-buses-listen.md +++ b/.changeset/bright-buses-listen.md @@ -1,5 +1,5 @@ --- -'upup-react-file-uploader': major +"upup-react-file-uploader": major --- -This major release adds built-in image editing, full localization support, resumable multipart uploads with pause/resume, improved progress and retry behavior, and stronger Google Drive and OneDrive integrations. +This release moves the modern npm package line from 1.5.2 to 2.0.0 and adds optional image editing, bundled locale packs, resumable multipart uploads with pause/resume, richer progress and retry UX, Google Workspace export support, and stronger Google Drive, OneDrive, and Dropbox flows. Existing 1.5.2 integrations can adopt these capabilities incrementally; the locale to localePack rename only affects consumers who tested unpublished builds after 1.5.2. diff --git a/README.md b/README.md index b561954c..3a8450a2 100644 --- a/README.md +++ b/README.md @@ -43,25 +43,25 @@ Works with **Next.js**, **Vite**, **Remix**, **Gatsby**, and any React framework npm i upup-react-file-uploader # or yarn add / pnpm add / bun install ``` -> Note for local development: the package API had a breaking rename — the `locale` prop is now `localePack`. Update any examples or local usage accordingly; see [`packages/upup/CHANGELOG.md#unreleased`](packages/upup/CHANGELOG.md#unreleased) for details. +> Note for local development: current localization examples use `localePack` for full locale packs and `translations` for per-key overrides. If you tested unpublished builds that used `locale`, update those examples to `localePack`. See [`packages/upup/CHANGELOG.md#unreleased`](packages/upup/CHANGELOG.md#unreleased) for the current 2.x release notes. `pnpm dev` launches the landing page and documentation in watch mode via Turborepo while the package builds in watch mode for local consumption. All services use ports defined in `local-dev/.env.ports` to avoid conflicts with other projects. ### Frontend (React / Next.js / Vite / Remix) ```tsx -'use client' +"use client"; -import { UpupUploader, UpupProvider } from 'upup-react-file-uploader' -import 'upup-react-file-uploader/styles' +import { UpupUploader, UpupProvider } from "upup-react-file-uploader"; +import "upup-react-file-uploader/styles"; export default function Uploader() { - return ( - - ) + return ( + + ); } ``` @@ -132,12 +132,12 @@ pnpm dev # runs landing + docs + package watcher via Turborepo ### Commands -| Command | Description | -| --- | --- | -| `pnpm dev` | Run everything in watch mode | -| `pnpm dev:package` | Storybook + local mock server | -| `pnpm build` | Build all (package → docs → landing) | -| `pnpm lint` / `pnpm test` / `pnpm typecheck` | Workspace-wide pipelines | +| Command | Description | +| -------------------------------------------- | ------------------------------------ | +| `pnpm dev` | Run everything in watch mode | +| `pnpm dev:package` | Storybook + local mock server | +| `pnpm build` | Build all (package → docs → landing) | +| `pnpm lint` / `pnpm test` / `pnpm typecheck` | Workspace-wide pipelines | ### Publishing diff --git a/packages/upup/CHANGELOG.md b/packages/upup/CHANGELOG.md index e74ba0be..62c280e7 100644 --- a/packages/upup/CHANGELOG.md +++ b/packages/upup/CHANGELOG.md @@ -2,72 +2,89 @@ ## Unreleased +### Versioning Note + +- This release moves the modern npm package line from `1.5.2` to `2.0.0`. Older GitHub `v2.x` tags belong to a legacy code line and are not the baseline for this release. + ### Breaking Changes -- Renamed the `locale` prop to `localePack` to make it clear that a full `Translations` object is expected. This is a breaking change for callers: update any places that passed `locale={...}` to `localePack={...}`. The provider still accepts `translations` for partial overrides. +- No required migration was identified for consumers upgrading from the published npm package `1.5.2`. +- If you tested unpublished builds from `master` or `dev` after `1.5.2`, the full locale prop is now `localePack`, while `translations` remains the prop for partial overrides. -### Migration +### Features -- Replace occurrences of `locale={...}` with `localePack={...}` in your code and docs. Example: +- Added optional built-in image editing with inline and modal flows, configurable editor tabs and tools, and save/cancel hooks. +- Added first-class localization with bundled locale packs, `localePack`, `translations`, and a `upup-react-file-uploader/locales` export. +- Added resumable multipart uploads for S3-compatible providers, including pause/resume controls and persisted upload sessions. +- Added richer progress feedback, including retry controls, uploaded-byte tracking, speed, ETA, and pause/play actions. +- Added Google Workspace export support and native Google Drive export URLs to bypass the earlier 10 MB export limitation. +- Expanded and hardened Google Drive, OneDrive, and Dropbox integrations, including better fallback/auth flows. + +### Improvements + +- Improved mini-mode layout and responsive sizing. +- Improved upload cancellation handling to avoid orphaned multipart uploads. +- Expanded automated coverage with new Jest and Playwright tests around uploads, image editing, and multipart helpers. + +### Migration -```tsx -import { ja_JP } from 'upup-react-file-uploader/locales' -; -``` +- Existing `1.5.2` integrations can keep their current upload flow and adopt the new features incrementally. +- To enable localization on this release line, pass a full locale pack via `localePack` and use `translations` for per-key overrides. +- To enable image editing, install the optional editor peer dependencies before turning on `imageEditor`. ## 1.0.0 ### 1.0.0 Major changes -- Initial release +- Initial release ## 1.0.1 ### 1.0.1 Major changes -- Bug fixes +- Bug fixes ## 1.0.2 ### 1.0.2 Major changes -- Bug fixes +- Bug fixes ## 1.1.0 ### Features -- Added new `customProps` prop for passing custom provider-specific configurations -- Added `enableAutoCorsConfig` prop to control automatic CORS configuration for S3 providers +- Added new `customProps` prop for passing custom provider-specific configurations +- Added `enableAutoCorsConfig` prop to control automatic CORS configuration for S3 providers ### Fixes -- Resolved file preview rendering issues -- Fixed unmet peer dependencies warning -- Replaced problematic install command in CI/CD pipelines -- Improved file preview styling layout -- Enhanced default warning and error message styling -- Minor styling fixes and consistency improvements +- Resolved file preview rendering issues +- Fixed unmet peer dependencies warning +- Replaced problematic install command in CI/CD pipelines +- Improved file preview styling layout +- Enhanced default warning and error message styling +- Minor styling fixes and consistency improvements ### Maintenance -- Updated build scripts and documentation +- Updated build scripts and documentation ## 1.2.0 ### Features -- Extracted CSS to a separate file that can be imported explicitly to solve styling precedence issues -- Added new CSS export path via `upup-react-file-uploader/styles` +- Extracted CSS to a separate file that can be imported explicitly to solve styling precedence issues +- Added new CSS export path via `upup-react-file-uploader/styles` ### Fixes -- Fixed CSS precedence issues when host projects use SCSS that loads after package styles -- Improved component styling to better handle external style overrides -- Changed "cancel" button text to "remove all files" in files preview state -- Removed supported file type text from component UI for cleaner interface +- Fixed CSS precedence issues when host projects use SCSS that loads after package styles +- Improved component styling to better handle external style overrides +- Changed "cancel" button text to "remove all files" in files preview state +- Removed supported file type text from component UI for cleaner interface ### Maintenance -- Updated build configuration to extract CSS instead of injecting it -- Updated documentation to include instructions for proper CSS import ordering +- Updated build configuration to extract CSS instead of injecting it +- Updated documentation to include instructions for proper CSS import ordering diff --git a/packages/upup/README.md b/packages/upup/README.md index f77d5393..991c4fd1 100644 --- a/packages/upup/README.md +++ b/packages/upup/README.md @@ -1,4 +1,4 @@ -# Upup – React File Uploads Made Easy ☁️ +# Upup - React File Uploads Made Easy [![CI](https://github.com/DevinoSolutions/upup/actions/workflows/publish.yml/badge.svg?branch=master)](https://github.com/DevinoSolutions/upup/actions/workflows/publish.yml) [![npm version](https://img.shields.io/npm/v/upup-react-file-uploader)](https://www.npmjs.com/package/upup-react-file-uploader) @@ -6,9 +6,9 @@ [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE) [![Discord](https://img.shields.io/discord/1299099371647930502?label=discord&logo=discord&logoColor=white&color=5865F2)](https://discord.gg/ny5WUE9ayc) -Open-source, plug-and-play uploads to **S3, DigitalOcean Spaces, Backblaze B2, Azure Blob, Google Drive, OneDrive** and more – with a single React component and tiny server helpers. +Open-source, plug-and-play uploads to **S3, DigitalOcean Spaces, Backblaze B2, Azure Blob, Google Drive, OneDrive** and more with a single React component and tiny server helpers. -👉 Try out the live demo: https://useupup.com#demo +Try out the live demo: https://useupup.com#demo You can even play with the code without any setup: https://stackblitz.com/edit/stackblitz-starters-flxnhixb @@ -21,27 +21,27 @@ npm i upup-react-file-uploader # or yarn add / pnpm add / bun install ## Quick start (React / Next.js) ```tsx -// On your frontend (aka React, Next.JS Pages, etc). +// On your frontend (aka React, Next.js Pages, etc.) -'use client' +"use client"; -import { UpupUploader, UpupProvider } from 'upup-react-file-uploader' -import 'upup-react-file-uploader/styles' +import { UpupUploader, UpupProvider } from "upup-react-file-uploader"; +import "upup-react-file-uploader/styles"; export default function Uploader() { - return ( - - ) + return ( + + ); } ``` -> Note: Breaking change — the `locale` prop has been renamed to `localePack` in recent versions. Update examples and code to use `localePack={...}`. See [CHANGELOG.md#unreleased](CHANGELOG.md#unreleased) for migration details. +> Note: current localization examples use `localePack` for full locale packs and `translations` for per-key overrides. If you tested unpublished builds that used `locale`, update those examples to `localePack`. See [CHANGELOG.md#unreleased](CHANGELOG.md#unreleased) for the current 2.x release notes. ```tsx -// On your backend (aka, NextJS APIs, Express.JS server, NestJS, etc.) +// On your backend (aka Next.js APIs, Express.js, NestJS, etc.) import { s3GeneratePresignedUrl } from "upup-react-file-uploader/server"; @@ -82,16 +82,16 @@ export async function POST(req: Request) { } ``` -☞ **Full documentation & code examples → [https://useupup.com/documentation/docs/getting-started](https://useupup.com/documentation/docs/getting-started)** +Full documentation and code examples: [https://useupup.com/documentation/docs/getting-started](https://useupup.com/documentation/docs/getting-started) ## Contributing We love PRs! Please see [CONTRIBUTING](CONTRIBUTING.md) and adhere to our [Code of Conduct](CODE_OF_CONDUCT.md). -## Battle-tested in production: +## Battle-tested in production -- 📚 uNotes – AI doc uploads for past exams → https://unotes.net -- 🎙 Shorty – media uploads for transcripts → https://aishorty.com +- uNotes - AI doc uploads for past exams -> https://unotes.net +- Shorty - media uploads for transcripts -> https://aishorty.com ## Security @@ -105,4 +105,4 @@ Please join our Discord if you need any support: https://discord.com/invite/ny5W [MIT](LICENSE) -Made with ❤️ by [Devino](https://devino.ca/) +Made by [Devino](https://devino.ca/)