From c223a1f2047ea933df43b1109e351da1474d83b0 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Mon, 23 May 2022 17:15:15 +0200 Subject: [PATCH 01/59] @uppy/transloadit: remove IE 10 hack (#3777) --- packages/@uppy/transloadit/src/Assembly.js | 15 +------ private/dev/package.json | 2 - private/dev/vite.config.js | 52 ---------------------- yarn.lock | 2 - 4 files changed, 2 insertions(+), 69 deletions(-) diff --git a/packages/@uppy/transloadit/src/Assembly.js b/packages/@uppy/transloadit/src/Assembly.js index 8923ec321d..639acbcde8 100644 --- a/packages/@uppy/transloadit/src/Assembly.js +++ b/packages/@uppy/transloadit/src/Assembly.js @@ -1,21 +1,10 @@ import Emitter from 'component-emitter' +import { io } from 'socket.io-client' import has from '@uppy/utils/lib/hasProperty' import NetworkError from '@uppy/utils/lib/NetworkError' import fetchWithNetworkError from '@uppy/utils/lib/fetchWithNetworkError' import parseUrl from './parseUrl.js' -// We used to lazy load socket.io to avoid a console error -// in IE 10 when the Transloadit plugin is not used. -// (The console.error call comes from `buffer`. I -// think we actually don't use that part of socket.io -// at all…) -// TODO: remove this hack in the next release. -let socketIo -function requireSocketIo () { - // eslint-disable-next-line no-return-assign, no-restricted-globals, global-require, no-undef - return socketIo ??= require('socket.io-client') -} - const ASSEMBLY_UPLOADING = 'ASSEMBLY_UPLOADING' const ASSEMBLY_EXECUTING = 'ASSEMBLY_EXECUTING' const ASSEMBLY_COMPLETED = 'ASSEMBLY_COMPLETED' @@ -75,7 +64,7 @@ class TransloaditAssembly extends Emitter { #connectSocket () { const parsed = parseUrl(this.status.websocket_url) - const socket = requireSocketIo().connect(parsed.origin, { + const socket = io(parsed.origin, { transports: ['websocket'], path: parsed.pathname, }) diff --git a/private/dev/package.json b/private/dev/package.json index 89d9de7160..e777ccc2d7 100644 --- a/private/dev/package.json +++ b/private/dev/package.json @@ -10,8 +10,6 @@ "@uppy/companion": "workspace:^" }, "devDependencies": { - "@babel/core": "^7.4.4", - "@babel/types": "^7.17.0", "autoprefixer": "^10.2.6", "postcss-dir-pseudo-class": "^5.0.0", "postcss-logical": "^4.0.2", diff --git a/private/dev/vite.config.js b/private/dev/vite.config.js index 4ad6ed844e..847b7fef4c 100644 --- a/private/dev/vite.config.js +++ b/private/dev/vite.config.js @@ -1,6 +1,4 @@ import { fileURLToPath } from 'node:url' -import { transformAsync } from '@babel/core' -import t from '@babel/types' import autoprefixer from 'autoprefixer' import postcssLogical from 'postcss-logical' import postcssDirPseudoClass from 'postcss-dir-pseudo-class' @@ -46,56 +44,6 @@ const config = { // }, ], }, - plugins: [ - // TODO: remove plugin when we remove the socket.io require call in @uppy/transloadit/src/Assembly. - { - name: 'vite-plugin-rewrite-dynamic-socketIo-require', - // eslint-disable-next-line consistent-return - resolveId (id) { - if (id.startsWith(PACKAGES_ROOT) && id.endsWith('transloadit/src/Assembly.js')) { - return id - } - }, - transform (code, id) { - if (id.startsWith(PACKAGES_ROOT) && id.endsWith('transloadit/src/Assembly.js')) { - return transformAsync(code, { - plugins: [ - { - visitor: { - FunctionDeclaration (path) { - if (path.node.id.name === 'requireSocketIo') { - const prevSibling = path.getPrevSibling() - if (t.isImportDeclaration(prevSibling) && prevSibling.node.specifiers?.length === 1 - && t.isImportDefaultSpecifier(prevSibling.node.specifiers[0]) - && prevSibling.node.specifiers[0].local.name === 'socketIo') { - // The require call has already been rewritten to an import statement. - return - } - if (!t.isVariableDeclaration(prevSibling)) { - const { type, loc } = prevSibling.node - throw new Error(`Unexpected ${type} at line ${loc.start.line}, cannot apply requireSocketIo hack`) - } - - const { id:socketIoIdentifier } = prevSibling.node.declarations[0] - - prevSibling.replaceWith(t.importDeclaration( - [t.importDefaultSpecifier(socketIoIdentifier)], - t.stringLiteral('socket.io-client'), - )) - path.replaceWith(t.functionDeclaration(path.node.id, path.node.params, t.blockStatement([ - t.returnStatement(socketIoIdentifier), - ]))) - } - }, - }, - }, - ], - }) - } - return code - }, - }, - ], } export default config diff --git a/yarn.lock b/yarn.lock index e824f90593..2f9dac6ea5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9239,8 +9239,6 @@ __metadata: version: 0.0.0-use.local resolution: "@uppy-dev/dev@workspace:private/dev" dependencies: - "@babel/core": ^7.4.4 - "@babel/types": ^7.17.0 "@uppy/companion": "workspace:^" autoprefixer: ^10.2.6 postcss-dir-pseudo-class: ^5.0.0 From b4e5d863705fb8389792c83b2cbe22fa3f01f5ce Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 25 May 2022 12:20:49 +0200 Subject: [PATCH 02/59] @uppy/react: refactor to ESM (#3780) --- .eslintrc.js | 1 + packages/@uppy/dashboard/src/Dashboard.jsx | 2 +- packages/@uppy/drag-drop/src/DragDrop.jsx | 2 +- packages/@uppy/file-input/src/FileInput.jsx | 2 +- .../@uppy/progress-bar/src/ProgressBar.jsx | 2 +- packages/@uppy/react/index.js | 7 - packages/@uppy/react/index.mjs | 7 - packages/@uppy/react/package.json | 4 +- packages/@uppy/react/src/Dashboard.js | 17 +- packages/@uppy/react/src/DashboardModal.js | 181 ++++++++++++++++-- packages/@uppy/react/src/DragDrop.js | 45 +++-- packages/@uppy/react/src/FileInput.js | 27 +-- packages/@uppy/react/src/ProgressBar.js | 29 +-- packages/@uppy/react/src/StatusBar.js | 55 ++++-- packages/@uppy/react/src/Wrapper.js | 34 ++-- packages/@uppy/react/src/getHTMLProps.js | 2 +- packages/@uppy/react/src/index.js | 7 + .../react/src/nonHtmlPropsHaveChanged.js | 2 +- packages/@uppy/react/src/propTypes.js | 8 +- packages/@uppy/react/src/useUppy.js | 6 +- packages/@uppy/status-bar/src/_StatusBar.jsx | 2 +- 21 files changed, 317 insertions(+), 125 deletions(-) delete mode 100644 packages/@uppy/react/index.js delete mode 100644 packages/@uppy/react/index.mjs create mode 100644 packages/@uppy/react/src/index.js diff --git a/.eslintrc.js b/.eslintrc.js index f2a6c09586..b68a509b6d 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -220,6 +220,7 @@ module.exports = { 'packages/@uppy/onedrive/src/**/*.js', 'packages/@uppy/progress-bar/src/**/*.js', 'packages/@uppy/provider-views/src/**/*.js', + 'packages/@uppy/react/src/**/*.js', 'packages/@uppy/redux-dev-tools/src/**/*.js', 'packages/@uppy/screen-capture/src/**/*.js', 'packages/@uppy/status-bar/src/**/*.js', diff --git a/packages/@uppy/dashboard/src/Dashboard.jsx b/packages/@uppy/dashboard/src/Dashboard.jsx index df0fccbdc4..981e64669e 100644 --- a/packages/@uppy/dashboard/src/Dashboard.jsx +++ b/packages/@uppy/dashboard/src/Dashboard.jsx @@ -53,7 +53,7 @@ export default class Dashboard extends UIPlugin { this.defaultLocale = locale - // set default options + // set default options, must be kept in sync with packages/@uppy/react/src/DashboardModal.js const defaultOptions = { target: 'body', metaFields: [], diff --git a/packages/@uppy/drag-drop/src/DragDrop.jsx b/packages/@uppy/drag-drop/src/DragDrop.jsx index c26d885b13..a6909c425c 100644 --- a/packages/@uppy/drag-drop/src/DragDrop.jsx +++ b/packages/@uppy/drag-drop/src/DragDrop.jsx @@ -22,7 +22,7 @@ export default class DragDrop extends UIPlugin { this.defaultLocale = locale - // Default options + // Default options, must be kept in sync with @uppy/react/src/DragDrop.js. const defaultOpts = { target: null, inputName: 'files[]', diff --git a/packages/@uppy/file-input/src/FileInput.jsx b/packages/@uppy/file-input/src/FileInput.jsx index 03b5a21580..7b4cac8099 100644 --- a/packages/@uppy/file-input/src/FileInput.jsx +++ b/packages/@uppy/file-input/src/FileInput.jsx @@ -16,7 +16,7 @@ export default class FileInput extends UIPlugin { this.defaultLocale = locale - // Default options + // Default options, must be kept in sync with @uppy/react/src/FileInput.js. const defaultOptions = { target: null, pretty: true, diff --git a/packages/@uppy/progress-bar/src/ProgressBar.jsx b/packages/@uppy/progress-bar/src/ProgressBar.jsx index 9ce798bc21..b5f6d9adab 100644 --- a/packages/@uppy/progress-bar/src/ProgressBar.jsx +++ b/packages/@uppy/progress-bar/src/ProgressBar.jsx @@ -16,7 +16,7 @@ export default class ProgressBar extends UIPlugin { this.title = 'Progress Bar' this.type = 'progressindicator' - // set default options + // set default options, must kept in sync with @uppy/react/src/ProgressBar.js const defaultOptions = { target: 'body', fixed: false, diff --git a/packages/@uppy/react/index.js b/packages/@uppy/react/index.js deleted file mode 100644 index ff93ef891b..0000000000 --- a/packages/@uppy/react/index.js +++ /dev/null @@ -1,7 +0,0 @@ -exports.Dashboard = require('./lib/Dashboard') -exports.DashboardModal = require('./lib/DashboardModal') -exports.DragDrop = require('./lib/DragDrop') -exports.ProgressBar = require('./lib/ProgressBar') -exports.StatusBar = require('./lib/StatusBar') -exports.FileInput = require('./lib/FileInput') -exports.useUppy = require('./lib/useUppy') diff --git a/packages/@uppy/react/index.mjs b/packages/@uppy/react/index.mjs deleted file mode 100644 index 64496dc085..0000000000 --- a/packages/@uppy/react/index.mjs +++ /dev/null @@ -1,7 +0,0 @@ -export { default as Dashboard } from './lib/Dashboard.js' -export { default as DashboardModal } from './lib/DashboardModal.js' -export { default as DragDrop } from './lib/DragDrop.js' -export { default as ProgressBar } from './lib/ProgressBar.js' -export { default as StatusBar } from './lib/StatusBar.js' -export { default as FileInput } from './lib/FileInput.js' -export { default as useUppy } from './lib/useUppy.js' diff --git a/packages/@uppy/react/package.json b/packages/@uppy/react/package.json index 40d75bddea..52cff017c2 100644 --- a/packages/@uppy/react/package.json +++ b/packages/@uppy/react/package.json @@ -3,9 +3,9 @@ "description": "React component wrappers around Uppy's official UI plugins.", "version": "2.2.1", "license": "MIT", - "main": "index.js", - "module": "index.mjs", + "main": "lib/index.js", "types": "types/index.d.ts", + "type": "module", "keywords": [ "file uploader", "uppy", diff --git a/packages/@uppy/react/src/Dashboard.js b/packages/@uppy/react/src/Dashboard.js index 1f6cdefa6f..c49f8ccb65 100644 --- a/packages/@uppy/react/src/Dashboard.js +++ b/packages/@uppy/react/src/Dashboard.js @@ -1,22 +1,21 @@ -const React = require('react') -const DashboardPlugin = require('@uppy/dashboard') -const basePropTypes = require('./propTypes').dashboard -const getHTMLProps = require('./getHTMLProps') -const nonHtmlPropsHaveChanged = require('./nonHtmlPropsHaveChanged') - -const h = React.createElement +import { createElement as h, Component } from 'react' +import DashboardPlugin from '@uppy/dashboard' +import { dashboard as basePropTypes } from './propTypes.js' +import getHTMLProps from './getHTMLProps.js' +import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.js' /** * React Component that renders a Dashboard for an Uppy instance. This component * renders the Dashboard inline, so you can put it anywhere you want. */ -class Dashboard extends React.Component { +class Dashboard extends Component { componentDidMount () { this.installPlugin() } componentDidUpdate (prevProps) { + // eslint-disable-next-line react/destructuring-assignment if (prevProps.uppy !== this.props.uppy) { this.uninstallPlugin(prevProps) this.installPlugin() @@ -69,4 +68,4 @@ Dashboard.defaultProps = { inline: true, } -module.exports = Dashboard +export default Dashboard diff --git a/packages/@uppy/react/src/DashboardModal.js b/packages/@uppy/react/src/DashboardModal.js index 20befea51d..1a46535136 100644 --- a/packages/@uppy/react/src/DashboardModal.js +++ b/packages/@uppy/react/src/DashboardModal.js @@ -1,34 +1,33 @@ -const React = require('react') -const PropTypes = require('prop-types') -const DashboardPlugin = require('@uppy/dashboard') -const basePropTypes = require('./propTypes').dashboard -const getHTMLProps = require('./getHTMLProps') -const nonHtmlPropsHaveChanged = require('./nonHtmlPropsHaveChanged') - -const h = React.createElement +import { createElement as h, Component } from 'react' +import PropTypes from 'prop-types' +import DashboardPlugin from '@uppy/dashboard' +import { cssSize, locale, metaFields, plugins, uppy as uppyPropType } from './propTypes.js' +import getHTMLProps from './getHTMLProps.js' +import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.js' /** * React Component that renders a Dashboard for an Uppy instance in a Modal * dialog. Visibility of the Modal is toggled using the `open` prop. */ -class DashboardModal extends React.Component { +class DashboardModal extends Component { componentDidMount () { this.installPlugin() } componentDidUpdate (prevProps) { - if (prevProps.uppy !== this.props.uppy) { + const { uppy, open, onRequestClose } = this.props + if (prevProps.uppy !== uppy) { this.uninstallPlugin(prevProps) this.installPlugin() } else if (nonHtmlPropsHaveChanged(this, prevProps)) { - const options = { ...this.props, onRequestCloseModal: this.props.onRequestClose } + const options = { ...this.props, onRequestCloseModal: onRequestClose } delete options.uppy this.plugin.setOptions(options) } - if (prevProps.open && !this.props.open) { + if (prevProps.open && !open) { this.plugin.closeModal() - } else if (!prevProps.open && this.props.open) { + } else if (!prevProps.open && open) { this.plugin.openModal() } } @@ -38,11 +37,82 @@ class DashboardModal extends React.Component { } installPlugin () { - const { uppy } = this.props + const { + uppy, + target, + open, + onRequestClose, + closeModalOnClickOutside, + disablePageScrollWhenModalOpen, + inline, + plugins, // eslint-disable-line no-shadow + width, + height, + showProgressDetails, + note, + metaFields, // eslint-disable-line no-shadow + proudlyDisplayPoweredByUppy, + autoOpenFileEditor, + animateOpenClose, + browserBackButtonClose, + closeAfterFinish, + disableStatusBar, + disableInformer, + disableThumbnailGenerator, + disableLocalFiles, + disabled, + hideCancelButton, + hidePauseResumeButton, + hideProgressAfterFinish, + hideRetryButton, + hideUploadButton, + showLinkToFileUploadResult, + showRemoveButtonAfterComplete, + showSelectedFiles, + waitForThumbnailsBeforeUpload, + fileManagerSelectionType, + theme, + thumbnailType, + thumbnailWidth, + locale, // eslint-disable-line no-shadow + } = this.props const options = { id: 'react:DashboardModal', - ...this.props, - onRequestCloseModal: this.props.onRequestClose, + target, + closeModalOnClickOutside, + disablePageScrollWhenModalOpen, + inline, + plugins, + width, + height, + showProgressDetails, + note, + metaFields, + proudlyDisplayPoweredByUppy, + autoOpenFileEditor, + animateOpenClose, + browserBackButtonClose, + closeAfterFinish, + disableStatusBar, + disableInformer, + disableThumbnailGenerator, + disableLocalFiles, + disabled, + hideCancelButton, + hidePauseResumeButton, + hideProgressAfterFinish, + hideRetryButton, + hideUploadButton, + showLinkToFileUploadResult, + showRemoveButtonAfterComplete, + showSelectedFiles, + waitForThumbnailsBeforeUpload, + fileManagerSelectionType, + theme, + thumbnailType, + thumbnailWidth, + locale, + onRequestCloseModal: onRequestClose, } if (!options.target) { @@ -53,7 +123,7 @@ class DashboardModal extends React.Component { uppy.use(DashboardPlugin, options) this.plugin = uppy.getPlugin(options.id) - if (this.props.open) { + if (open) { this.plugin.openModal() } } @@ -78,12 +148,85 @@ class DashboardModal extends React.Component { } DashboardModal.propTypes = { + uppy: uppyPropType.isRequired, target: typeof window !== 'undefined' ? PropTypes.instanceOf(window.HTMLElement) : PropTypes.any, open: PropTypes.bool, onRequestClose: PropTypes.func, closeModalOnClickOutside: PropTypes.bool, disablePageScrollWhenModalOpen: PropTypes.bool, - ...basePropTypes, + inline: PropTypes.bool, + plugins, + width: cssSize, + height: cssSize, + showProgressDetails: PropTypes.bool, + note: PropTypes.string, + metaFields, + proudlyDisplayPoweredByUppy: PropTypes.bool, + autoOpenFileEditor: PropTypes.bool, + animateOpenClose: PropTypes.bool, + browserBackButtonClose: PropTypes.bool, + closeAfterFinish: PropTypes.bool, + disableStatusBar: PropTypes.bool, + disableInformer: PropTypes.bool, + disableThumbnailGenerator: PropTypes.bool, + disableLocalFiles: PropTypes.bool, + disabled: PropTypes.bool, + hideCancelButton: PropTypes.bool, + hidePauseResumeButton: PropTypes.bool, + hideProgressAfterFinish: PropTypes.bool, + hideRetryButton: PropTypes.bool, + hideUploadButton: PropTypes.bool, + showLinkToFileUploadResult: PropTypes.bool, + showRemoveButtonAfterComplete: PropTypes.bool, + showSelectedFiles: PropTypes.bool, + waitForThumbnailsBeforeUpload: PropTypes.bool, + fileManagerSelectionType: PropTypes.string, + theme: PropTypes.string, + // pass-through to ThumbnailGenerator + thumbnailType: PropTypes.string, + thumbnailWidth: PropTypes.number, + locale, +} +// Must be kept in sync with @uppy/dashboard/src/Dashboard.jsx. +DashboardModal.defaultProps = { + metaFields: [], + plugins: [], + inline: false, + width: 750, + height: 550, + thumbnailWidth: 280, + thumbnailType: 'image/jpeg', + waitForThumbnailsBeforeUpload: false, + showLinkToFileUploadResult: false, + showProgressDetails: false, + hideUploadButton: false, + hideCancelButton: false, + hideRetryButton: false, + hidePauseResumeButton: false, + hideProgressAfterFinish: false, + note: null, + closeModalOnClickOutside: false, + closeAfterFinish: false, + disableStatusBar: false, + disableInformer: false, + disableThumbnailGenerator: false, + disablePageScrollWhenModalOpen: true, + animateOpenClose: true, + fileManagerSelectionType: 'files', + proudlyDisplayPoweredByUppy: true, + showSelectedFiles: true, + showRemoveButtonAfterComplete: false, + browserBackButtonClose: false, + theme: 'light', + autoOpenFileEditor: false, + disabled: false, + disableLocalFiles: false, + + // extra + open: undefined, + target: undefined, + locale: null, + onRequestClose: undefined, } -module.exports = DashboardModal +export default DashboardModal diff --git a/packages/@uppy/react/src/DragDrop.js b/packages/@uppy/react/src/DragDrop.js index fcb9de6b8a..22d6b03e46 100644 --- a/packages/@uppy/react/src/DragDrop.js +++ b/packages/@uppy/react/src/DragDrop.js @@ -1,22 +1,22 @@ -const React = require('react') -const DragDropPlugin = require('@uppy/drag-drop') -const propTypes = require('./propTypes') -const getHTMLProps = require('./getHTMLProps') -const nonHtmlPropsHaveChanged = require('./nonHtmlPropsHaveChanged') - -const h = React.createElement +import { createElement as h, Component } from 'react' +import PropTypes from 'prop-types' +import DragDropPlugin from '@uppy/drag-drop' +import * as propTypes from './propTypes.js' +import getHTMLProps from './getHTMLProps.js' +import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.js' /** * React component that renders an area in which files can be dropped to be * uploaded. */ -class DragDrop extends React.Component { +class DragDrop extends Component { componentDidMount () { this.installPlugin() } componentDidUpdate (prevProps) { + // eslint-disable-next-line react/destructuring-assignment if (prevProps.uppy !== this.props.uppy) { this.uninstallPlugin(prevProps) this.installPlugin() @@ -32,10 +32,21 @@ class DragDrop extends React.Component { } installPlugin () { - const { uppy } = this.props + const { + uppy, + locale, + inputName, + width, + height, + note, + } = this.props const options = { id: 'react:DragDrop', - ...this.props, + locale, + inputName, + width, + height, + note, target: this.container, } delete options.uppy @@ -65,10 +76,20 @@ class DragDrop extends React.Component { } DragDrop.propTypes = { - uppy: propTypes.uppy, + uppy: propTypes.uppy.isRequired, locale: propTypes.locale, + inputName: PropTypes.string, + width: PropTypes.string, + height: PropTypes.string, + note: PropTypes.string, } +// Must be kept in sync with @uppy/drag-drop/src/DragDrop.jsx. DragDrop.defaultProps = { + locale: null, + inputName: 'files[]', + width: '100%', + height: '100%', + note: null, } -module.exports = DragDrop +export default DragDrop diff --git a/packages/@uppy/react/src/FileInput.js b/packages/@uppy/react/src/FileInput.js index c1a04de138..dd84137af2 100644 --- a/packages/@uppy/react/src/FileInput.js +++ b/packages/@uppy/react/src/FileInput.js @@ -1,21 +1,20 @@ -const PropTypes = require('prop-types') -const React = require('react') -const FileInputPlugin = require('@uppy/file-input') -const propTypes = require('./propTypes') - -const h = React.createElement +import { createElement as h, Component } from 'react' +import PropTypes from 'prop-types' +import FileInputPlugin from '@uppy/file-input' +import * as propTypes from './propTypes.js' /** * React component that renders an area in which files can be dropped to be * uploaded. */ -class FileInput extends React.Component { +class FileInput extends Component { componentDidMount () { this.installPlugin() } componentDidUpdate (prevProps) { + // eslint-disable-next-line react/destructuring-assignment if (prevProps.uppy !== this.props.uppy) { this.uninstallPlugin(prevProps) this.installPlugin() @@ -27,10 +26,12 @@ class FileInput extends React.Component { } installPlugin () { - const { uppy } = this.props + const { uppy, locale, pretty, inputName } = this.props const options = { id: 'react:FileInput', - ...this.props, + locale, + pretty, + inputName, target: this.container, } delete options.uppy @@ -57,12 +58,16 @@ class FileInput extends React.Component { } FileInput.propTypes = { - uppy: propTypes.uppy, + uppy: propTypes.uppy.isRequired, locale: propTypes.locale, pretty: PropTypes.bool, inputName: PropTypes.string, } +// Must be kept in sync with @uppy/file-input/src/FileInput.jsx FileInput.defaultProps = { + locale: undefined, + pretty: true, + inputName: 'files[]', } -module.exports = FileInput +export default FileInput diff --git a/packages/@uppy/react/src/ProgressBar.js b/packages/@uppy/react/src/ProgressBar.js index d1cdeb5f2e..601c82d07a 100644 --- a/packages/@uppy/react/src/ProgressBar.js +++ b/packages/@uppy/react/src/ProgressBar.js @@ -1,22 +1,21 @@ -const React = require('react') -const PropTypes = require('prop-types') -const ProgressBarPlugin = require('@uppy/progress-bar') -const uppyPropType = require('./propTypes').uppy -const getHTMLProps = require('./getHTMLProps') -const nonHtmlPropsHaveChanged = require('./nonHtmlPropsHaveChanged') - -const h = React.createElement +import { createElement as h, Component } from 'react' +import PropTypes from 'prop-types' +import ProgressBarPlugin from '@uppy/progress-bar' +import { uppy as uppyPropType } from './propTypes.js' +import getHTMLProps from './getHTMLProps.js' +import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.js' /** * React component that renders a progress bar at the top of the page. */ -class ProgressBar extends React.Component { +class ProgressBar extends Component { componentDidMount () { this.installPlugin() } componentDidUpdate (prevProps) { + // eslint-disable-next-line react/destructuring-assignment if (prevProps.uppy !== this.props.uppy) { this.uninstallPlugin(prevProps) this.installPlugin() @@ -32,10 +31,11 @@ class ProgressBar extends React.Component { } installPlugin () { - const { uppy } = this.props + const { uppy, fixed, hideAfterFinish } = this.props const options = { id: 'react:ProgressBar', - ...this.props, + fixed, + hideAfterFinish, target: this.container, } delete options.uppy @@ -65,11 +65,14 @@ class ProgressBar extends React.Component { } ProgressBar.propTypes = { - uppy: uppyPropType, + uppy: uppyPropType.isRequired, fixed: PropTypes.bool, hideAfterFinish: PropTypes.bool, } +// Must be kept in sync with @uppy/progress-bar/src/ProgressBar.jsx ProgressBar.defaultProps = { + fixed: false, + hideAfterFinish: true, } -module.exports = ProgressBar +export default ProgressBar diff --git a/packages/@uppy/react/src/StatusBar.js b/packages/@uppy/react/src/StatusBar.js index e777b9e5e8..1cca06c612 100644 --- a/packages/@uppy/react/src/StatusBar.js +++ b/packages/@uppy/react/src/StatusBar.js @@ -1,23 +1,22 @@ -const React = require('react') -const PropTypes = require('prop-types') -const StatusBarPlugin = require('@uppy/status-bar') -const uppyPropType = require('./propTypes').uppy -const getHTMLProps = require('./getHTMLProps') -const nonHtmlPropsHaveChanged = require('./nonHtmlPropsHaveChanged') - -const h = React.createElement +import { createElement as h, Component } from 'react' +import PropTypes from 'prop-types' +import StatusBarPlugin from '@uppy/status-bar' +import { uppy as uppyPropType } from './propTypes.js' +import getHTMLProps from './getHTMLProps.js' +import nonHtmlPropsHaveChanged from './nonHtmlPropsHaveChanged.js' /** * React component that renders a status bar containing upload progress and speed, * processing progress and pause/resume/cancel controls. */ -class StatusBar extends React.Component { +class StatusBar extends Component { componentDidMount () { this.installPlugin() } componentDidUpdate (prevProps) { + // eslint-disable-next-line react/destructuring-assignment if (prevProps.uppy !== this.props.uppy) { this.uninstallPlugin(prevProps) this.installPlugin() @@ -33,10 +32,25 @@ class StatusBar extends React.Component { } installPlugin () { - const { uppy } = this.props + const { + uppy, + hideUploadButton, + hideRetryButton, + hidePauseResumeButton, + hideCancelButton, + showProgressDetails, + hideAfterFinish, + doneButtonHandler, + } = this.props const options = { id: 'react:StatusBar', - ...this.props, + hideUploadButton, + hideRetryButton, + hidePauseResumeButton, + hideCancelButton, + showProgressDetails, + hideAfterFinish, + doneButtonHandler, target: this.container, } delete options.uppy @@ -66,11 +80,24 @@ class StatusBar extends React.Component { } StatusBar.propTypes = { - uppy: uppyPropType, - hideAfterFinish: PropTypes.bool, + uppy: uppyPropType.isRequired, + hideUploadButton: PropTypes.bool, + hideRetryButton: PropTypes.bool, + hidePauseResumeButton: PropTypes.bool, + hideCancelButton: PropTypes.bool, showProgressDetails: PropTypes.bool, + hideAfterFinish: PropTypes.bool, + doneButtonHandler: PropTypes.func, } +// Must be kept in sync with @uppy/status-bar/src/_StatusBar.jsx. StatusBar.defaultProps = { + hideUploadButton: false, + hideRetryButton: false, + hidePauseResumeButton: false, + hideCancelButton: false, + showProgressDetails: false, + hideAfterFinish: true, + doneButtonHandler: null, } -module.exports = StatusBar +export default StatusBar diff --git a/packages/@uppy/react/src/Wrapper.js b/packages/@uppy/react/src/Wrapper.js index f3f75e6318..438484a18d 100644 --- a/packages/@uppy/react/src/Wrapper.js +++ b/packages/@uppy/react/src/Wrapper.js @@ -1,10 +1,8 @@ -const React = require('react') -const PropTypes = require('prop-types') -const uppyPropType = require('./propTypes').uppy +import { createElement as h, Component } from 'react' +import PropTypes from 'prop-types' +import { uppy as uppyPropType } from './propTypes.js' -const h = React.createElement - -class UppyWrapper extends React.Component { +class UppyWrapper extends Component { constructor (props) { super(props) @@ -16,7 +14,8 @@ class UppyWrapper extends React.Component { } componentDidUpdate (prevProps) { - if (prevProps.uppy !== this.props.uppy) { + const { uppy } = this.props + if (prevProps.uppy !== uppy) { this.uninstallPlugin(prevProps) this.installPlugin() } @@ -27,17 +26,18 @@ class UppyWrapper extends React.Component { } installPlugin () { - const plugin = this.props.uppy - .getPlugin(this.props.plugin) + const { plugin, uppy } = this.props + const pluginObj = uppy + .getPlugin(plugin) - plugin.mount(this.container, plugin) + pluginObj.mount(this.container, pluginObj) } - uninstallPlugin (props = this.props) { - const plugin = props.uppy - .getPlugin(this.props.plugin) - - plugin.unmount() + uninstallPlugin ({ uppy } = this.props) { + const { plugin } = this.props + uppy + .getPlugin(plugin) + .unmount() } refContainer (container) { @@ -50,8 +50,8 @@ class UppyWrapper extends React.Component { } UppyWrapper.propTypes = { - uppy: uppyPropType, + uppy: uppyPropType.isRequired, plugin: PropTypes.string.isRequired, } -module.exports = UppyWrapper +export default UppyWrapper diff --git a/packages/@uppy/react/src/getHTMLProps.js b/packages/@uppy/react/src/getHTMLProps.js index b6ce49ec02..8ea159fb72 100644 --- a/packages/@uppy/react/src/getHTMLProps.js +++ b/packages/@uppy/react/src/getHTMLProps.js @@ -261,4 +261,4 @@ const getHTMLProps = (props) => { ) } -module.exports = getHTMLProps +export default getHTMLProps diff --git a/packages/@uppy/react/src/index.js b/packages/@uppy/react/src/index.js new file mode 100644 index 0000000000..f8c8213a20 --- /dev/null +++ b/packages/@uppy/react/src/index.js @@ -0,0 +1,7 @@ +export { default as Dashboard } from './Dashboard.js' +export { default as DashboardModal } from './DashboardModal.js' +export { default as DragDrop } from './DragDrop.js' +export { default as ProgressBar } from './ProgressBar.js' +export { default as StatusBar } from './StatusBar.js' +export { default as FileInput } from './FileInput.js' +export { default as useUppy } from './useUppy.js' diff --git a/packages/@uppy/react/src/nonHtmlPropsHaveChanged.js b/packages/@uppy/react/src/nonHtmlPropsHaveChanged.js index 350b73d204..2a7e23b582 100644 --- a/packages/@uppy/react/src/nonHtmlPropsHaveChanged.js +++ b/packages/@uppy/react/src/nonHtmlPropsHaveChanged.js @@ -3,7 +3,7 @@ // TODO: replace with `Object.hasOwn` when dropping support for older browsers. const hasOwn = (obj, key) => Object.prototype.hasOwnProperty.call(obj, key) -module.exports = function nonHtmlPropsHaveChanged (component, prevProps) { +export default function nonHtmlPropsHaveChanged (component, prevProps) { return Object.keys(component.props) // TODO: replace `validProps` with an exported `Symbol('htmlProps')`. .some(key => !hasOwn(component.validProps, key) && component.props[key] !== prevProps[key]) diff --git a/packages/@uppy/react/src/propTypes.js b/packages/@uppy/react/src/propTypes.js index b6385f3260..b06db10d20 100644 --- a/packages/@uppy/react/src/propTypes.js +++ b/packages/@uppy/react/src/propTypes.js @@ -1,8 +1,8 @@ -const PropTypes = require('prop-types') -const UppyCore = require('@uppy/core').Uppy +import PropTypes from 'prop-types' +import { Uppy as UppyCore } from '@uppy/core' // The `uppy` prop receives the Uppy core instance. -const uppy = PropTypes.instanceOf(UppyCore).isRequired +const uppy = PropTypes.instanceOf(UppyCore) // A list of plugins to mount inside this component. const plugins = PropTypes.arrayOf(PropTypes.string) @@ -51,7 +51,7 @@ const dashboard = { locale, } -module.exports = { +export { uppy, locale, dashboard, diff --git a/packages/@uppy/react/src/useUppy.js b/packages/@uppy/react/src/useUppy.js index cf5d428630..39e047360c 100644 --- a/packages/@uppy/react/src/useUppy.js +++ b/packages/@uppy/react/src/useUppy.js @@ -1,7 +1,7 @@ -const { useEffect, useRef } = require('react') -const UppyCore = require('@uppy/core').Uppy +import { useEffect, useRef } from 'react' +import { Uppy as UppyCore } from '@uppy/core' -module.exports = function useUppy (factory) { +export default function useUppy (factory) { if (typeof factory !== 'function') { throw new TypeError('useUppy: expected a function that returns a new Uppy instance') } diff --git a/packages/@uppy/status-bar/src/_StatusBar.jsx b/packages/@uppy/status-bar/src/_StatusBar.jsx index c977980763..7f45c8af16 100644 --- a/packages/@uppy/status-bar/src/_StatusBar.jsx +++ b/packages/@uppy/status-bar/src/_StatusBar.jsx @@ -85,7 +85,7 @@ export default class StatusBar extends UIPlugin { this.defaultLocale = locale - // set default options + // set default options, must be kept in sync with @uppy/react/src/StatusBar.js const defaultOptions = { target: 'body', hideUploadButton: false, From 3be8564b89c2ca0121f3d60e0a4080a0f088e281 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Wed, 25 May 2022 18:19:14 +0200 Subject: [PATCH 03/59] @uppy/companion: remove support for EOL versions of Node.js (#3784) Node.js 10.x is EOL since 2021-04-31. Node.js 11.x is EOL since 2019-06-01. Node.js 12.x is EOL since 2022-04-30. Node.js 13.x is EOL since 2020-06-01. Node.js 15.x is EOL since 2021-06-01. Node.js 17.x is EOL since 2022-06-01. --- .github/workflows/companion.yml | 38 --------------------------- packages/@uppy/companion/package.json | 2 +- 2 files changed, 1 insertion(+), 39 deletions(-) diff --git a/.github/workflows/companion.yml b/.github/workflows/companion.yml index 4da08f7f44..391ec96b5c 100644 --- a/.github/workflows/companion.yml +++ b/.github/workflows/companion.yml @@ -7,44 +7,6 @@ on: types: [ opened, synchronize, reopened ] jobs: - test-legacy: - name: Unit tests (legacy) - runs-on: ubuntu-latest - strategy: - matrix: - node-version: [10.20.1, 12.x, 17.x] - steps: - - name: Checkout sources - uses: actions/checkout@v3 - - name: Get yarn cache directory path - id: yarn-cache-dir-path - run: echo "::set-output name=dir::$(corepack yarn config get cacheFolder)" - - - uses: actions/cache@v3 - id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`) - with: - path: ${{ steps.yarn-cache-dir-path.outputs.dir }} - key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }} - restore-keys: | - ${{ runner.os }}-yarn- - - name: Install Node.js - uses: actions/setup-node@v3 - with: - node-version: ${{matrix.node-version}} - - name: Install Corepack if needed - run: corepack -v || npm install -g corepack - - name: Install dependencies - run: corepack yarn@3.1.1 install --no-immutable - env: - # Necessary for Node.js v10.x - NODE_OPTIONS: --experimental-worker - YARN_IGNORE_NODE: 1 - - name: Run tests - run: corepack yarn run test:companion - env: - # Necessary for Node.js v10.x - NODE_OPTIONS: --experimental-worker - YARN_IGNORE_NODE: 1 test: name: Unit tests runs-on: ubuntu-latest diff --git a/packages/@uppy/companion/package.json b/packages/@uppy/companion/package.json index 130d0d84e6..2f934b3ea7 100644 --- a/packages/@uppy/companion/package.json +++ b/packages/@uppy/companion/package.json @@ -114,7 +114,7 @@ "test": "jest" }, "engines": { - "node": ">=10.20.1" + "node": "^14.19.0 || ^16.15.0 || >=18.0.0" }, "installConfig": { "hoistingLimits": "workspaces" From 9d178a0ce7ddbf78e13b5385b02925b31db00262 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Mon, 30 May 2022 11:29:18 +0200 Subject: [PATCH 04/59] meta: do not test on EOL versions of Node.js (#3786) --- .github/workflows/ci.yml | 4 +--- package.json | 2 +- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 44fe96d5da..0bd8cf5c77 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -13,12 +13,10 @@ jobs: runs-on: ubuntu-latest strategy: matrix: - node-version: [12.x, 14.x, 16.x, 17.x] + node-version: [14.x, 16.x, 18.x] steps: - name: Checkout sources uses: actions/checkout@v3 - - name: Install Corepack if needed - run: corepack -v || npm install -g corepack - name: Get yarn cache directory path id: yarn-cache-dir-path run: echo "::set-output name=dir::$(corepack yarn config get cacheFolder)" diff --git a/package.json b/package.json index 55ee175ddd..64d22666bd 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,7 @@ "pre-commit": "lint:staged", "license": "MIT", "engines": { - "node": "^v14.17.0 || >=v16.0.0", + "node": "^16.15.0 || >=18.0.0", "yarn": "3.2.1" }, "packageManager": "yarn@3.2.1", From a46304023c10e2b2ce565116521ea24a71020793 Mon Sep 17 00:00:00 2001 From: Merlijn Vos Date: Mon, 30 May 2022 13:01:53 +0200 Subject: [PATCH 05/59] @uppy/companion: remove `searchProviders` wrapper & move `s3` options (#3781) --- packages/@uppy/companion/src/companion.js | 2 +- .../@uppy/companion/src/config/companion.js | 24 ++++---- .../@uppy/companion/src/server/Uploader.js | 2 +- .../@uppy/companion/src/server/middlewares.js | 6 +- .../companion/src/server/provider/index.js | 2 - .../@uppy/companion/src/server/s3-client.js | 22 +++---- .../@uppy/companion/src/standalone/helper.js | 37 +++++------- website/src/docs/companion.md | 58 +++++++++---------- 8 files changed, 71 insertions(+), 82 deletions(-) diff --git a/packages/@uppy/companion/src/companion.js b/packages/@uppy/companion/src/companion.js index e3fd60ca39..c2e9f7a852 100644 --- a/packages/@uppy/companion/src/companion.js +++ b/packages/@uppy/companion/src/companion.js @@ -117,7 +117,7 @@ module.exports.app = (optionsArg = {}) => { // add uppy options to the request object so it can be accessed by subsequent handlers. app.use('*', middlewares.getCompanionMiddleware(options)) - app.use('/s3', s3(options.providerOptions.s3)) + app.use('/s3', s3(options.s3)) app.use('/url', url()) app.post('/:providerName/preauth', middlewares.hasSessionAndProvider, controllers.preauth) diff --git a/packages/@uppy/companion/src/config/companion.js b/packages/@uppy/companion/src/config/companion.js index 5afbdeb788..64cbf4e793 100644 --- a/packages/@uppy/companion/src/config/companion.js +++ b/packages/@uppy/companion/src/config/companion.js @@ -8,15 +8,14 @@ const defaultOptions = { protocol: 'http', path: '', }, - providerOptions: { - s3: { - acl: 'public-read', // todo default to no ACL in next major - endpoint: 'https://{service}.{region}.amazonaws.com', - conditions: [], - useAccelerateEndpoint: false, - getKey: (req, filename) => filename, - expires: ms('5 minutes') / 1000, - }, + providerOptions: {}, + s3: { + acl: 'public-read', // todo default to no ACL in next major + endpoint: 'https://{service}.{region}.amazonaws.com', + conditions: [], + useAccelerateEndpoint: false, + getKey: (req, filename) => filename, + expires: ms('5 minutes') / 1000, }, allowLocalUrls: false, logClientVersion: true, @@ -30,7 +29,8 @@ const defaultOptions = { */ function getMaskableSecrets (companionOptions) { const secrets = [] - const { providerOptions, customProviders } = companionOptions + const { providerOptions, customProviders, s3 } = companionOptions + Object.keys(providerOptions).forEach((provider) => { if (providerOptions[provider].secret) { secrets.push(providerOptions[provider].secret) @@ -45,6 +45,10 @@ function getMaskableSecrets (companionOptions) { }) } + if (s3?.secret) { + secrets.push(s3.secret) + } + return secrets } diff --git a/packages/@uppy/companion/src/server/Uploader.js b/packages/@uppy/companion/src/server/Uploader.js index 8f3d21ef0d..d1099eb41c 100644 --- a/packages/@uppy/companion/src/server/Uploader.js +++ b/packages/@uppy/companion/src/server/Uploader.js @@ -345,7 +345,7 @@ class Uploader { storage: redis.client(), s3: req.companion.s3Client ? { client: req.companion.s3Client, - options: req.companion.options.providerOptions.s3, + options: req.companion.options.s3, } : null, chunkSize: req.companion.options.chunkSize, } diff --git a/packages/@uppy/companion/src/server/middlewares.js b/packages/@uppy/companion/src/server/middlewares.js index 9e48be859b..b8d16c1bcd 100644 --- a/packages/@uppy/companion/src/server/middlewares.js +++ b/packages/@uppy/companion/src/server/middlewares.js @@ -69,14 +69,14 @@ exports.cookieAuthToken = (req, res, next) => { } exports.loadSearchProviderToken = (req, res, next) => { - const { searchProviders } = req.companion.options.providerOptions + const { providerOptions } = req.companion.options const providerName = req.params.searchProviderName - if (!searchProviders || !searchProviders[providerName] || !searchProviders[providerName].key) { + if (!providerOptions[providerName] || !providerOptions[providerName].key) { logger.info(`unconfigured credentials for ${providerName}`, 'searchtoken.load.unset', req.id) return res.sendStatus(501) } - req.companion.providerToken = searchProviders[providerName].key + req.companion.providerToken = providerOptions[providerName].key next() } diff --git a/packages/@uppy/companion/src/server/provider/index.js b/packages/@uppy/companion/src/server/provider/index.js index 3c9221955b..b2f668c784 100644 --- a/packages/@uppy/companion/src/server/provider/index.js +++ b/packages/@uppy/companion/src/server/provider/index.js @@ -188,8 +188,6 @@ module.exports.addProviderOptions = (companionOptions, grantConfig) => { } else if (server.path) { grantConfig[authProvider].callback = `${server.path}${grantConfig[authProvider].callback}` } - } else if (!['s3', 'searchProviders'].includes(providerName)) { - logger.warn(`skipping one found unsupported provider "${providerName}".`, 'provider.options.skip') } }) } diff --git a/packages/@uppy/companion/src/server/s3-client.js b/packages/@uppy/companion/src/server/s3-client.js index cce3b41aac..d22e646499 100644 --- a/packages/@uppy/companion/src/server/s3-client.js +++ b/packages/@uppy/companion/src/server/s3-client.js @@ -8,35 +8,35 @@ const AWS = require('aws-sdk') */ module.exports = (companionOptions) => { let s3Client = null - if (companionOptions.providerOptions.s3) { - const s3ProviderOptions = companionOptions.providerOptions.s3 + if (companionOptions.s3) { + const { s3 } = companionOptions - if (s3ProviderOptions.accessKeyId || s3ProviderOptions.secretAccessKey) { + if (s3.accessKeyId || s3.secretAccessKey) { throw new Error('Found `providerOptions.s3.accessKeyId` or `providerOptions.s3.secretAccessKey` configuration, but Companion requires `key` and `secret` option names instead. Please use the `key` property instead of `accessKeyId` and the `secret` property instead of `secretAccessKey`.') } - const rawClientOptions = s3ProviderOptions.awsClientOptions + const rawClientOptions = s3.awsClientOptions if (rawClientOptions && (rawClientOptions.accessKeyId || rawClientOptions.secretAccessKey)) { throw new Error('Found unsupported `providerOptions.s3.awsClientOptions.accessKeyId` or `providerOptions.s3.awsClientOptions.secretAccessKey` configuration. Please use the `providerOptions.s3.key` and `providerOptions.s3.secret` options instead.') } const s3ClientOptions = { signatureVersion: 'v4', - endpoint: s3ProviderOptions.endpoint, - region: s3ProviderOptions.region, + endpoint: s3.endpoint, + region: s3.region, // backwards compat - useAccelerateEndpoint: s3ProviderOptions.useAccelerateEndpoint, + useAccelerateEndpoint: s3.useAccelerateEndpoint, ...rawClientOptions, } // Use credentials to allow assumed roles to pass STS sessions in. // If the user doesn't specify key and secret, the default credentials (process-env) // will be used by S3 in calls below. - if (s3ProviderOptions.key && s3ProviderOptions.secret && !s3ClientOptions.credentials) { + if (s3.key && s3.secret && !s3ClientOptions.credentials) { s3ClientOptions.credentials = new AWS.Credentials( - s3ProviderOptions.key, - s3ProviderOptions.secret, - s3ProviderOptions.sessionToken, + s3.key, + s3.secret, + s3.sessionToken, ) } s3Client = new S3(s3ClientOptions) diff --git a/packages/@uppy/companion/src/standalone/helper.js b/packages/@uppy/companion/src/standalone/helper.js index 260e4f7d3f..20f0748f9e 100644 --- a/packages/@uppy/companion/src/standalone/helper.js +++ b/packages/@uppy/companion/src/standalone/helper.js @@ -64,26 +64,22 @@ const getConfigFromEnv = () => { verificationToken: getSecret('COMPANION_ZOOM_VERIFICATION_TOKEN'), credentialsURL: process.env.COMPANION_ZOOM_KEYS_ENDPOINT, }, - // TODO: remove the redundant searchProviders warpper in next major version - searchProviders: { - unsplash: { - key: process.env.COMPANION_UNSPLASH_KEY, - secret: process.env.COMPANION_UNSPLASH_SECRET, - }, - }, - // TODO: move s3 out of providerOptions, it's a destination, not a source - s3: { - key: process.env.COMPANION_AWS_KEY, - secret: getSecret('COMPANION_AWS_SECRET'), - bucket: process.env.COMPANION_AWS_BUCKET, - endpoint: process.env.COMPANION_AWS_ENDPOINT, - region: process.env.COMPANION_AWS_REGION, - useAccelerateEndpoint: - process.env.COMPANION_AWS_USE_ACCELERATE_ENDPOINT === 'true', - expires: parseInt(process.env.COMPANION_AWS_EXPIRES || '300', 10), - acl: process.env.COMPANION_AWS_DISABLE_ACL === 'true' ? null : (process.env.COMPANION_AWS_ACL || 'public-read'), // todo default to no ACL in next major and remove COMPANION_AWS_DISABLE_ACL + unsplash: { + key: process.env.COMPANION_UNSPLASH_KEY, + secret: process.env.COMPANION_UNSPLASH_SECRET, }, }, + s3: { + key: process.env.COMPANION_AWS_KEY, + secret: getSecret('COMPANION_AWS_SECRET'), + bucket: process.env.COMPANION_AWS_BUCKET, + endpoint: process.env.COMPANION_AWS_ENDPOINT, + region: process.env.COMPANION_AWS_REGION, + useAccelerateEndpoint: + process.env.COMPANION_AWS_USE_ACCELERATE_ENDPOINT === 'true', + expires: parseInt(process.env.COMPANION_AWS_EXPIRES || '300', 10), + acl: process.env.COMPANION_AWS_DISABLE_ACL === 'true' ? null : (process.env.COMPANION_AWS_ACL || 'public-read'), // todo default to no ACL in next major and remove COMPANION_AWS_DISABLE_ACL + }, server: { host: process.env.COMPANION_DOMAIN, protocol: process.env.COMPANION_PROTOCOL, @@ -190,11 +186,6 @@ exports.buildHelpfulStartupMessage = (companionOptions) => { const buildURL = utils.getURLBuilder(companionOptions) const callbackURLs = [] Object.keys(companionOptions.providerOptions).forEach((providerName) => { - // s3 does not need redirect_uris - if (providerName === 's3') { - return - } - callbackURLs.push(buildURL(`/connect/${providerName}/redirect`, true)) }) diff --git a/website/src/docs/companion.md b/website/src/docs/companion.md index 7b7353af8b..fd403949c7 100644 --- a/website/src/docs/companion.md +++ b/website/src/docs/companion.md @@ -323,16 +323,16 @@ const options = { key: '***', secret: '***', }, - s3: { - getKey: (req, filename, metadata) => filename, - key: '***', - secret: '***', - bucket: 'bucket-name', - region: 'us-east-1', - useAccelerateEndpoint: false, // default: false, - expires: 3600, // default: 300 (5 minutes) - acl: 'private', // default: public-read - }, + }, + s3: { + getKey: (req, filename, metadata) => filename, + key: '***', + secret: '***', + bucket: 'bucket-name', + region: 'us-east-1', + useAccelerateEndpoint: false, // default: false, + expires: 3600, // default: 300 (5 minutes) + acl: 'private', // default: public-read }, server: { host: 'localhost:3020', // or yourdomain.com @@ -417,34 +417,34 @@ Please see [Supported Providers](https://uppy.io/docs/companion/#Supported-provi Companion comes with signature endpoints for AWS S3. These can be used by the Uppy client to sign requests to upload files directly to S3, without exposing secret S3 keys in the browser. Companion also supports uploading files from providers like Dropbox and Instagram directly into S3. -The S3 features can be configured using the `providerOptions.s3` property. +The S3 features can be configured using the `s3` property. -#### `providerOptions.s3.key` +#### `s3.key` The S3 access key ID. The standalone Companion server populates this with the value of the `COMPANION_AWS_KEY` environment variable by default. -#### `providerOptions.s3.secret` +#### `s3.secret` The S3 secret access key. The standalone Companion server populates this with the value of the `COMPANION_AWS_SECRET` environment variable by default. -#### `providerOptions.s3.bucket` +#### `s3.bucket` The name of the bucket to store uploaded files in. The standalone Companion server populates this with the value of the `COMPANION_AWS_BUCKET` environment variable by default. -#### `providerOptions.s3.region` +#### `s3.region` The datacenter region where the target bucket is located. The standalone Companion server populates this with the value of the `COMPANION_AWS_REGION` environment variable by default. -#### `providerOptions.s3.awsClientOptions` +#### `s3.awsClientOptions` -You can supply any [S3 option supported by the AWS SDK](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/S3.html#constructor-property) in the `providerOptions.s3.awsClientOptions` object, _except for_ the below: +You can supply any [S3 option supported by the AWS SDK](https://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/S3.html#constructor-property) in the `s3.awsClientOptions` object, _except for_ the below: -* `accessKeyId`. Instead, use the `providerOptions.s3.key` property. This is to make configuration names consistent between different Companion features. -* `secretAccessKey`. Instead, use the `providerOptions.s3.secret` property. This is to make configuration names consistent between different Companion features. +* `accessKeyId`. Instead, use the `s3.key` property. This is to make configuration names consistent between different Companion features. +* `secretAccessKey`. Instead, use the `s3.secret` property. This is to make configuration names consistent between different Companion features. Be aware that some options may cause wrong behaviour if they conflict with Companion’s assumptions. If you find that a particular option does not work as expected, please [open an issue on the Uppy repository](https://github.com/transloadit/uppy/issues/new) so we can document it here. -#### `providerOptions.s3.getKey(req, filename, metadata)` +#### `s3.getKey(req, filename, metadata)` Get the key name for a file. The key is the file path to which the file will be uploaded in your bucket. This option should be a function receiving three arguments: @@ -456,12 +456,10 @@ This function should return a string `key`. The `req` parameter can be used to u ```js app.use(authenticationMiddleware) -app.use(uppy.app({ - providerOptions: { - s3: { - getKey: (req, filename, metadata) => `${req.user.id}/${filename}`, - /* auth options */ - }, +app.use(companion.app({ + s3: { + getKey: (req, filename, metadata) => `${req.user.id}/${filename}`, + /* auth options */ }, })) ``` @@ -469,11 +467,9 @@ app.use(uppy.app({ The default implementation returns the `filename`, so all files will be uploaded to the root of the bucket as their original file name. ```js -app.use(uppy.app({ - providerOptions: { - s3: { - getKey: (req, filename, metadata) => filename, - }, +app.use(companion.app({ + s3: { + getKey: (req, filename, metadata) => filename, }, })) ``` From 6085477ed0199a8c5d233b7e3a52b46dab538c78 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Mon, 30 May 2022 17:12:45 +0200 Subject: [PATCH 06/59] meta: disable ESM to CJS transform in dist files (#3773) * meta: disable ESM to CJS transorm in dist files This commit removes all the hacks that needed to happen in order to ship working CJS code. Onwards, we plan to distribute Uppy packages as ESM. * No mocking with Jest and ESM --- __mocks__/nanoid/non-secure.js | 1 - bin/build-lib.js | 151 ++------------------------- packages/@uppy/core/src/Uppy.test.js | 7 +- 3 files changed, 14 insertions(+), 145 deletions(-) delete mode 100644 __mocks__/nanoid/non-secure.js diff --git a/__mocks__/nanoid/non-secure.js b/__mocks__/nanoid/non-secure.js deleted file mode 100644 index a5c69d9fdc..0000000000 --- a/__mocks__/nanoid/non-secure.js +++ /dev/null @@ -1 +0,0 @@ -module.exports = { nanoid: () => 'cjd09qwxb000dlql4tp4doz8h' } diff --git a/bin/build-lib.js b/bin/build-lib.js index a59e7b4aa4..cd39ee0872 100644 --- a/bin/build-lib.js +++ b/bin/build-lib.js @@ -21,13 +21,6 @@ const META_FILES = [ 'bin/build-lib.js', ] -// Rollup uses get-form-data's ES modules build, and rollup-plugin-commonjs automatically resolves `.default`. -// So, if we are being built using rollup, this require() won't have a `.default` property. -const esPackagesThatNeedSpecialTreatmentForRollupInterop = [ - 'get-form-data', - 'cropperjs', -] - function lastModified (file, createParentDir = false) { return stat(file).then((s) => s.mtime, async (err) => { if (err.code === 'ENOENT') { @@ -55,29 +48,18 @@ async function isTypeModule (file) { // in case it hasn't been done before. await mkdir(path.join(packageFolder, 'lib'), { recursive: true }) } - if (typeModule) { - await writeFile(path.join(packageFolder, 'lib', 'package.json'), '{"type":"commonjs"}') - } moduleTypeCache.set(packageFolder, typeModule) versionCache.set(packageFolder, version) return typeModule } // eslint-disable-next-line no-shadow -function ExportAllDeclaration (path) { +function transformJSXImportsToJS (path) { const { value } = path.node.source if (value.endsWith('.jsx') && (value.startsWith('./') || value.startsWith('../'))) { // Rewrite .jsx imports to .js: path.node.source.value = value.slice(0, -1) // eslint-disable-line no-param-reassign } - - path.replaceWith( - t.assignmentExpression( - '=', - t.memberExpression(t.identifier('module'), t.identifier('exports')), - t.callExpression(t.identifier('require'), [path.node.source]), - ), - ) } async function buildLib () { @@ -104,19 +86,12 @@ async function buildLib () { } } - let idCounter = 0 // counter to ensure uniqueness of identifiers created by the build script. - const plugins = await isTypeModule(file) ? [['@babel/plugin-transform-modules-commonjs', { - importInterop: 'none', - }], { + const plugins = await isTypeModule(file) ? [{ visitor: { // eslint-disable-next-line no-shadow ImportDeclaration (path) { - let { value } = path.node.source - if (value.endsWith('.jsx') && (value.startsWith('./') || value.startsWith('../'))) { - // Rewrite .jsx imports to .js: - value = path.node.source.value = value.slice(0, -1) // eslint-disable-line no-param-reassign,no-multi-assign - } - if (PACKAGE_JSON_IMPORT.test(value) + transformJSXImportsToJS(path) + if (PACKAGE_JSON_IMPORT.test(path.node.source.value) && path.node.specifiers.length === 1 && path.node.specifiers[0].type === 'ImportDefaultSpecifier') { // Vendor-in version number from package.json files: @@ -130,124 +105,14 @@ async function buildLib () { ]))]), ) } - } else if (path.node.specifiers[0].type === 'ImportDefaultSpecifier') { - const [{ local }, ...otherSpecifiers] = path.node.specifiers - if (otherSpecifiers.length === 1 && otherSpecifiers[0].type === 'ImportNamespaceSpecifier') { - // import defaultVal, * as namespaceImport from '@uppy/package' - // is transformed into: - // const defaultVal = require('@uppy/package'); const namespaceImport = defaultVal - path.insertAfter( - t.variableDeclaration('const', [ - t.variableDeclarator( - otherSpecifiers[0].local, - local, - ), - ]), - ) - } else if (otherSpecifiers.length !== 0) { - // import defaultVal, { exportedVal as importedName, other } from '@uppy/package' - // is transformed into: - // const defaultVal = require('@uppy/package'); const { exportedVal: importedName, other } = defaultVal - path.insertAfter(t.variableDeclaration('const', [t.variableDeclarator( - t.objectPattern( - otherSpecifiers.map(specifier => t.objectProperty( - t.identifier(specifier.imported.name), - specifier.local, - )), - ), - local, - )])) - } - - let requireCall = t.callExpression(t.identifier('require'), [ - t.stringLiteral(value), - ]) - if (esPackagesThatNeedSpecialTreatmentForRollupInterop.includes(value)) { - requireCall = t.logicalExpression('||', t.memberExpression(requireCall, t.identifier('default')), requireCall) - } - path.replaceWith( - t.variableDeclaration('const', [ - t.variableDeclarator( - local, - requireCall, - ), - ]), - ) } }, - ExportAllDeclaration, - // eslint-disable-next-line no-shadow,consistent-return - ExportNamedDeclaration (path) { - if (path.node.source != null) { - if (path.node.specifiers.length === 1 - && path.node.specifiers[0].local.name === 'default' - && path.node.specifiers[0].exported.name === 'default') return ExportAllDeclaration(path) - if (path.node.specifiers.some(spec => spec.exported.name === 'default')) { - throw new Error('unsupported mix of named and default re-exports') - } - - let { value } = path.node.source - if (value.endsWith('.jsx') && (value.startsWith('./') || value.startsWith('../'))) { - // Rewrite .jsx imports to .js: - value = path.node.source.value = value.slice(0, -1) // eslint-disable-line no-param-reassign,no-multi-assign - } - - // If there are no default export/import involved, Babel can handle it with no problem. - if (path.node.specifiers.every(spec => spec.local.name !== 'default' && spec.exported.name !== 'default')) return undefined - - let requireCall = t.callExpression(t.identifier('require'), [ - t.stringLiteral(value), - ]) - if (esPackagesThatNeedSpecialTreatmentForRollupInterop.includes(value)) { - requireCall = t.logicalExpression('||', t.memberExpression(requireCall, t.identifier('default')), requireCall) - } - - const requireCallIdentifier = t.identifier(`_${idCounter++}`) - const namedExportIdentifiers = path.node.specifiers - .filter(spec => spec.local.name !== 'default') - .map(spec => [ - t.identifier(requireCallIdentifier.name + spec.local.name), - t.memberExpression(requireCallIdentifier, spec.local), - spec, - ]) - path.insertBefore( - t.variableDeclaration('const', [ - t.variableDeclarator( - requireCallIdentifier, - requireCall, - ), - ...namedExportIdentifiers.map(([id, propertyAccessor]) => t.variableDeclarator(id, propertyAccessor)), - ]), - ) - path.replaceWith( - t.exportNamedDeclaration(null, path.node.specifiers.map(spec => t.exportSpecifier( - spec.local.name === 'default' ? requireCallIdentifier : namedExportIdentifiers.find(([,, s]) => s === spec)[0], - spec.exported, - ))), - ) - } - }, + ExportAllDeclaration: transformJSXImportsToJS, // eslint-disable-next-line no-shadow - ExportDefaultDeclaration (path) { - const moduleExports = t.memberExpression(t.identifier('module'), t.identifier('exports')) - if (!t.isDeclaration(path.node.declaration)) { - path.replaceWith( - t.assignmentExpression('=', moduleExports, path.node.declaration), - ) - } else if (path.node.declaration.id != null) { - const { id } = path.node.declaration - path.insertBefore(path.node.declaration) - path.replaceWith( - t.assignmentExpression('=', moduleExports, id), - ) - } else { - const id = t.identifier('_default') - path.node.declaration.id = id // eslint-disable-line no-param-reassign - path.insertBefore(path.node.declaration) - path.replaceWith( - t.assignmentExpression('=', moduleExports, id), - ) + ExportNamedDeclaration (path) { + if (path.node.source != null) { + transformJSXImportsToJS(path) } }, }, diff --git a/packages/@uppy/core/src/Uppy.test.js b/packages/@uppy/core/src/Uppy.test.js index f1b582dbf9..01196a635b 100644 --- a/packages/@uppy/core/src/Uppy.test.js +++ b/packages/@uppy/core/src/Uppy.test.js @@ -896,7 +896,12 @@ describe('src/Core', () => { core.addFile({ source: 'jest', name: 'bar.jpg', type: 'image/jpeg', data: new Uint8Array() }) core.addFile({ source: 'file3', name: 'file3.jpg', type: 'image/jpeg', data: new Uint8Array() }) - return expect(core.upload()).resolves.toMatchSnapshot() + // uploadID is random, we don't want randomness in the snapshot + const validateNanoID = r => ( + typeof r.uploadID === 'string' && r.uploadID.length === 21 ? ({ ...r, uploadID: 'cjd09qwxb000dlql4tp4doz8h' }) : r + ) + + return expect(core.upload().then(validateNanoID)).resolves.toMatchSnapshot() }) it('should not upload if onBeforeUpload returned false', () => { From 602f9731c32457e6beb0c8814145d8e4ba475f82 Mon Sep 17 00:00:00 2001 From: Antoine du Hamel Date: Mon, 30 May 2022 17:25:09 +0200 Subject: [PATCH 07/59] meta: temporary adjust release script for the beta --- .github/workflows/release-candidate.yml | 2 -- .github/workflows/release.yml | 4 ++-- private/release/choose-semverness.js | 4 ++-- private/release/commit-and-open-pr.js | 2 +- private/release/config.js | 2 +- 5 files changed, 6 insertions(+), 8 deletions(-) diff --git a/.github/workflows/release-candidate.yml b/.github/workflows/release-candidate.yml index d2e7fdb713..327a1522ff 100644 --- a/.github/workflows/release-candidate.yml +++ b/.github/workflows/release-candidate.yml @@ -39,8 +39,6 @@ jobs: run: corepack yarn version apply --all --json | jq -s > releases.json - name: Prepare changelog run: corepack yarn workspace @uppy-dev/release update-changelogs releases.json | xargs git add - - name: Update contributors table - run: corepack yarn contributors:save && corepack yarn remark -foq README.md && git add README.md - name: Update CDN URLs run: corepack yarn workspace @uppy-dev/release update-version-URLs | xargs git add - name: Stage changes and remove temp files diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index a036624b6b..049e00d396 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -41,7 +41,7 @@ jobs: - name: Login to NPM run: corepack yarn config set npmAuthToken ${{ toJSON(secrets.NPM_TOKEN) }} - name: Publish to NPM - run: corepack yarn workspaces foreach --no-private npm publish --access public --tolerate-republish + run: corepack yarn workspaces foreach --no-private npm publish --access public --tag next --tolerate-republish - name: Merge PR id: merge run: | @@ -62,7 +62,7 @@ jobs: id: uppyVersion run: jq -r '"##[set-output name=version;]"+.version' < packages/uppy/package.json - name: Create GitHub release - run: gh release create uppy@${{ steps.uppyVersion.outputs.version }} -t "Uppy ${{ steps.uppyVersion.outputs.version }}" -F CHANGELOG.diff.md + run: gh release create uppy@${{ steps.uppyVersion.outputs.version }} -t "Uppy ${{ steps.uppyVersion.outputs.version }}" -F CHANGELOG.diff.md --prerelease env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} - name: Upload `uppy` to CDN diff --git a/private/release/choose-semverness.js b/private/release/choose-semverness.js index ac257b90f1..3a7654c1f4 100755 --- a/private/release/choose-semverness.js +++ b/private/release/choose-semverness.js @@ -81,7 +81,7 @@ export default async function pickSemverness ( { title: 'Minor', value: 'minor' }, { title: 'Major', value: 'major' }, ], - initial: 2, + initial: 0, }) if (!response.value) { @@ -141,7 +141,7 @@ export default async function pickSemverness ( { title: 'Minor', value: 'minor', disabled: robodogSemverness === 'major' }, { title: 'Major', value: 'major' }, ], - initial: 2, + initial: 0, }) releaseFile.write(` "@uppy/robodog": ${response.value}\n`) diff --git a/private/release/commit-and-open-pr.js b/private/release/commit-and-open-pr.js index 44943a2ba3..7cf9de1414 100644 --- a/private/release/commit-and-open-pr.js +++ b/private/release/commit-and-open-pr.js @@ -21,7 +21,7 @@ export default async function commit (spawnOptions, ...files) { const remote = spawnSync('/bin/sh', ['-c', getRemoteCommamnd]).stdout.toString().trim() || `git@github.com:${REPO_OWNER}/${REPO_NAME}.git` - console.log(`Please run \`git push ${remote} ${sha}:refs/heads/release\`.`) + console.log(`Please run \`git push ${remote} ${sha}:refs/heads/release-beta\`.`) console.log(`An automation will kick off and open a release candidate PR on the GitHub repository. Do not merge it manually! Review the PR (you may need to close and re-open so the CI and test will run on it). If everything looks good, approve the PR — diff --git a/private/release/config.js b/private/release/config.js index 88ab626e50..b6a6c7ec50 100644 --- a/private/release/config.js +++ b/private/release/config.js @@ -1,3 +1,3 @@ export const REPO_OWNER = 'transloadit' export const REPO_NAME = 'uppy' -export const TARGET_BRANCH = 'main' +export const TARGET_BRANCH = '3.x' From 861f264e536f3d21ff90f24fcf0da7a0540cc54d Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Mon, 30 May 2022 17:50:06 +0100 Subject: [PATCH 08/59] Release: uppy@3.0.0-beta (#3798) | Package | Version | Package | Version | | ------------------------- | ---------- | ------------------------- | ---------- | | @uppy/audio | 3.0.0-beta | @uppy/progress-bar | 3.0.0-beta | | @uppy/aws-s3 | 3.0.0-beta | @uppy/provider-views | 3.0.0-beta | | @uppy/aws-s3-multipart | 3.0.0-beta | @uppy/react | 3.0.0-beta | | @uppy/box | 3.0.0-beta | @uppy/redux-dev-tools | 3.0.0-beta | | @uppy/companion | 4.0.0-beta | @uppy/robodog | 3.0.0-beta | | @uppy/companion-client | 3.0.0-beta | @uppy/screen-capture | 3.0.0-beta | | @uppy/compressor | 3.0.0-beta | @uppy/status-bar | 3.0.0-beta | | @uppy/core | 3.0.0-beta | @uppy/store-default | 3.0.0-beta | | @uppy/dashboard | 3.0.0-beta | @uppy/store-redux | 3.0.0-beta | | @uppy/drag-drop | 3.0.0-beta | @uppy/svelte | 3.0.0-beta | | @uppy/drop-target | 3.0.0-beta | @uppy/thumbnail-generator | 3.0.0-beta | | @uppy/dropbox | 3.0.0-beta | @uppy/transloadit | 3.0.0-beta | | @uppy/facebook | 3.0.0-beta | @uppy/tus | 3.0.0-beta | | @uppy/file-input | 3.0.0-beta | @uppy/unsplash | 3.0.0-beta | | @uppy/form | 3.0.0-beta | @uppy/url | 3.0.0-beta | | @uppy/golden-retriever | 3.0.0-beta | @uppy/utils | 5.0.0-beta | | @uppy/google-drive | 3.0.0-beta | @uppy/vue | 3.0.0-beta | | @uppy/image-editor | 3.0.0-beta | @uppy/webcam | 3.0.0-beta | | @uppy/informer | 3.0.0-beta | @uppy/xhr-upload | 3.0.0-beta | | @uppy/instagram | 3.0.0-beta | @uppy/zoom | 3.0.0-beta | | @uppy/locales | 3.0.0-beta | uppy | 3.0.0-beta | | @uppy/onedrive | 3.0.0-beta | | | - meta: temporary adjust release script for the beta (Antoine du Hamel) - meta: disable ESM to CJS transform in dist files (Antoine du Hamel / #3773) - @uppy/companion: remove `searchProviders` wrapper & move `s3` options (Merlijn Vos / #3781) - meta: do not test on EOL versions of Node.js (Antoine du Hamel / #3786) - @uppy/companion: remove support for EOL versions of Node.js (Antoine du Hamel / #3784) - @uppy/react: refactor to ESM (Antoine du Hamel / #3780) - @uppy/transloadit: remove IE 10 hack (Antoine du Hamel / #3777) --- BUNDLE-README.md | 2 +- CHANGELOG.md | 38 +++++++++++++++++++ README.md | 8 ++-- examples/cdn-example/index.html | 4 +- examples/transloadit-textarea/index.html | 2 +- .../uppy-with-companion/client/index.html | 4 +- packages/@uppy/audio/package.json | 5 ++- packages/@uppy/aws-s3-multipart/package.json | 5 ++- packages/@uppy/aws-s3/package.json | 5 ++- packages/@uppy/box/package.json | 5 ++- packages/@uppy/companion-client/package.json | 5 ++- packages/@uppy/companion/CHANGELOG.md | 8 ++++ packages/@uppy/companion/package.json | 5 ++- packages/@uppy/compressor/package.json | 5 ++- packages/@uppy/core/package.json | 5 ++- packages/@uppy/dashboard/package.json | 5 ++- packages/@uppy/drag-drop/package.json | 5 ++- packages/@uppy/drop-target/package.json | 5 ++- packages/@uppy/dropbox/package.json | 5 ++- packages/@uppy/facebook/package.json | 5 ++- packages/@uppy/file-input/package.json | 5 ++- packages/@uppy/form/package.json | 5 ++- packages/@uppy/golden-retriever/package.json | 5 ++- packages/@uppy/google-drive/package.json | 5 ++- packages/@uppy/image-editor/package.json | 5 ++- packages/@uppy/informer/package.json | 5 ++- packages/@uppy/instagram/package.json | 5 ++- packages/@uppy/locales/package.json | 5 ++- packages/@uppy/onedrive/package.json | 5 ++- packages/@uppy/progress-bar/package.json | 5 ++- packages/@uppy/provider-views/package.json | 5 ++- packages/@uppy/react/CHANGELOG.md | 7 ++++ packages/@uppy/react/package.json | 5 ++- packages/@uppy/redux-dev-tools/package.json | 5 ++- packages/@uppy/robodog/README.md | 4 +- packages/@uppy/robodog/package.json | 5 ++- packages/@uppy/screen-capture/package.json | 5 ++- packages/@uppy/status-bar/package.json | 5 ++- packages/@uppy/store-default/package.json | 5 ++- packages/@uppy/store-redux/package.json | 5 ++- packages/@uppy/svelte/package.json | 5 ++- .../@uppy/thumbnail-generator/package.json | 5 ++- packages/@uppy/transloadit/CHANGELOG.md | 7 ++++ packages/@uppy/transloadit/package.json | 5 ++- packages/@uppy/tus/package.json | 5 ++- packages/@uppy/unsplash/package.json | 5 ++- packages/@uppy/url/package.json | 5 ++- packages/@uppy/utils/package.json | 5 ++- packages/@uppy/vue/package.json | 5 ++- packages/@uppy/webcam/package.json | 5 ++- packages/@uppy/xhr-upload/package.json | 5 ++- packages/@uppy/zoom/package.json | 5 ++- packages/uppy/package.json | 5 ++- website/src/docs/index.md | 10 ++--- website/src/docs/locales.md | 4 +- website/src/docs/migration-guides.md | 6 +-- website/src/docs/robodog-form.md | 6 +-- website/src/docs/robodog.md | 4 +- website/src/examples/dashboard/app.es6 | 2 +- website/src/examples/i18n/app.html | 8 ++-- .../src/examples/markdown-snippets/app.es6 | 2 +- .../src/examples/markdown-snippets/app.html | 2 +- website/themes/uppy/layout/index.ejs | 6 +-- 63 files changed, 226 insertions(+), 123 deletions(-) diff --git a/BUNDLE-README.md b/BUNDLE-README.md index c38e9682a5..f11f0ad103 100644 --- a/BUNDLE-README.md +++ b/BUNDLE-README.md @@ -1,7 +1,7 @@ # Uppy Hi, thanks for trying out the bundled version of the Uppy File Uploader. You can use -this from a CDN (``) or bundle it with your webapp. +this from a CDN (``) or bundle it with your webapp. Note that the recommended way to use Uppy is to install it with yarn/npm and use a bundler like Webpack so that you can create a smaller custom build with only the diff --git a/CHANGELOG.md b/CHANGELOG.md index 0251ba5977..c597d1b62a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,44 @@ Please add your entries in this format: In the current stage we aim to release a new version at least every month. +## 3.0.0-beta + +Released: 2022-05-30 + +| Package | Version | Package | Version | +| ------------------------- | ---------- | ------------------------- | ---------- | +| @uppy/audio | 3.0.0-beta | @uppy/progress-bar | 3.0.0-beta | +| @uppy/aws-s3 | 3.0.0-beta | @uppy/provider-views | 3.0.0-beta | +| @uppy/aws-s3-multipart | 3.0.0-beta | @uppy/react | 3.0.0-beta | +| @uppy/box | 3.0.0-beta | @uppy/redux-dev-tools | 3.0.0-beta | +| @uppy/companion | 4.0.0-beta | @uppy/robodog | 3.0.0-beta | +| @uppy/companion-client | 3.0.0-beta | @uppy/screen-capture | 3.0.0-beta | +| @uppy/compressor | 3.0.0-beta | @uppy/status-bar | 3.0.0-beta | +| @uppy/core | 3.0.0-beta | @uppy/store-default | 3.0.0-beta | +| @uppy/dashboard | 3.0.0-beta | @uppy/store-redux | 3.0.0-beta | +| @uppy/drag-drop | 3.0.0-beta | @uppy/svelte | 3.0.0-beta | +| @uppy/drop-target | 3.0.0-beta | @uppy/thumbnail-generator | 3.0.0-beta | +| @uppy/dropbox | 3.0.0-beta | @uppy/transloadit | 3.0.0-beta | +| @uppy/facebook | 3.0.0-beta | @uppy/tus | 3.0.0-beta | +| @uppy/file-input | 3.0.0-beta | @uppy/unsplash | 3.0.0-beta | +| @uppy/form | 3.0.0-beta | @uppy/url | 3.0.0-beta | +| @uppy/golden-retriever | 3.0.0-beta | @uppy/utils | 5.0.0-beta | +| @uppy/google-drive | 3.0.0-beta | @uppy/vue | 3.0.0-beta | +| @uppy/image-editor | 3.0.0-beta | @uppy/webcam | 3.0.0-beta | +| @uppy/informer | 3.0.0-beta | @uppy/xhr-upload | 3.0.0-beta | +| @uppy/instagram | 3.0.0-beta | @uppy/zoom | 3.0.0-beta | +| @uppy/locales | 3.0.0-beta | uppy | 3.0.0-beta | +| @uppy/onedrive | 3.0.0-beta | | | + +- meta: temporary adjust release script for the beta (Antoine du Hamel) +- meta: disable ESM to CJS transform in dist files (Antoine du Hamel / #3773) +- @uppy/companion: remove `searchProviders` wrapper & move `s3` options (Merlijn Vos / #3781) +- meta: do not test on EOL versions of Node.js (Antoine du Hamel / #3786) +- @uppy/companion: remove support for EOL versions of Node.js (Antoine du Hamel / #3784) +- @uppy/react: refactor to ESM (Antoine du Hamel / #3780) +- @uppy/transloadit: remove IE 10 hack (Antoine du Hamel / #3777) + + ## 2.11.0 Released: 2022-05-30 diff --git a/README.md b/README.md index 86229771a6..1ffccec54e 100644 --- a/README.md +++ b/README.md @@ -67,7 +67,7 @@ const uppy = new Uppy({ autoProceed: false }) $ npm install @uppy/core @uppy/dashboard @uppy/tus ``` -Add CSS [uppy.min.css](https://releases.transloadit.com/uppy/v2.11.0/uppy.min.css), either to your HTML page’s `` or include in JS, if your bundler of choice supports it. +Add CSS [uppy.min.css](https://releases.transloadit.com/uppy/v3.0.0-beta/uppy.min.css), either to your HTML page’s `` or include in JS, if your bundler of choice supports it. Alternatively, you can also use a pre-built bundle from Transloadit’s CDN: Edgly. In that case `Uppy` will attach itself to the global `window.Uppy` object. @@ -75,10 +75,10 @@ Alternatively, you can also use a pre-built bundle from Transloadit’s CDN: Edg ```html - + - +
@@ -184,7 +184,7 @@ If you’re using Uppy from CDN, those polyfills are already included in the leg bundle, so no need to include anything additionally: ```html - + ``` ## FAQ diff --git a/examples/cdn-example/index.html b/examples/cdn-example/index.html index 5bb42963f6..dd1d71bc22 100644 --- a/examples/cdn-example/index.html +++ b/examples/cdn-example/index.html @@ -4,11 +4,11 @@ - + - + + + + ``` Then, a global `Robodog` variable will be available. For usage instructions, please see the [main Robodog documentation](https://uppy.io/docs/robodog). diff --git a/packages/@uppy/robodog/package.json b/packages/@uppy/robodog/package.json index 465d192f2b..f0f33c7e63 100644 --- a/packages/@uppy/robodog/package.json +++ b/packages/@uppy/robodog/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/robodog", "description": "Transloadit SDK for browsers based on Uppy", - "version": "2.7.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "jsnext:main": "src/index.js", @@ -52,5 +52,6 @@ "md-gum-polyfill": "^1.0.0", "resize-observer-polyfill": "^1.5.1", "whatwg-fetch": "^3.6.2" - } + }, + "stableVersion": "2.7.0" } diff --git a/packages/@uppy/screen-capture/package.json b/packages/@uppy/screen-capture/package.json index 119de971d4..742703790b 100644 --- a/packages/@uppy/screen-capture/package.json +++ b/packages/@uppy/screen-capture/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/screen-capture", "description": "Uppy plugin that captures video from display or application.", - "version": "2.1.1", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "style": "dist/style.min.css", @@ -33,5 +33,6 @@ }, "publishConfig": { "access": "public" - } + }, + "stableVersion": "2.1.1" } diff --git a/packages/@uppy/status-bar/package.json b/packages/@uppy/status-bar/package.json index dc300bd69b..c2c9d0b4c1 100644 --- a/packages/@uppy/status-bar/package.json +++ b/packages/@uppy/status-bar/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/status-bar", "description": "A progress bar for Uppy, with many bells and whistles.", - "version": "2.2.1", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "style": "dist/style.min.css", @@ -35,5 +35,6 @@ }, "peerDependencies": { "@uppy/core": "workspace:^" - } + }, + "stableVersion": "2.2.1" } diff --git a/packages/@uppy/store-default/package.json b/packages/@uppy/store-default/package.json index fbeeb5d269..77b7565ecc 100644 --- a/packages/@uppy/store-default/package.json +++ b/packages/@uppy/store-default/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/store-default", "description": "The default simple object-based store for Uppy.", - "version": "2.1.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -21,5 +21,6 @@ "repository": { "type": "git", "url": "git+https://github.com/transloadit/uppy.git" - } + }, + "stableVersion": "2.1.0" } diff --git a/packages/@uppy/store-redux/package.json b/packages/@uppy/store-redux/package.json index c94f4bee52..a60d394537 100644 --- a/packages/@uppy/store-redux/package.json +++ b/packages/@uppy/store-redux/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/store-redux", "description": "Make Uppy use your existing Redux store.", - "version": "2.1.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -26,5 +26,6 @@ "devDependencies": { "@jest/globals": "^27.4.2", "redux": "4.0.5" - } + }, + "stableVersion": "2.1.0" } diff --git a/packages/@uppy/svelte/package.json b/packages/@uppy/svelte/package.json index 26da7df632..31dd624979 100644 --- a/packages/@uppy/svelte/package.json +++ b/packages/@uppy/svelte/package.json @@ -3,7 +3,7 @@ "svelte": "src/index.js", "module": "dist/index.mjs", "main": "dist/index.js", - "version": "1.0.8", + "version": "3.0.0-beta", "scripts": { "build": "rollup -c", "prepublishOnly": "yarn run build", @@ -37,5 +37,6 @@ "files": [ "src", "dist" - ] + ], + "stableVersion": "1.0.8" } diff --git a/packages/@uppy/thumbnail-generator/package.json b/packages/@uppy/thumbnail-generator/package.json index bf93dc78c9..0a46318080 100644 --- a/packages/@uppy/thumbnail-generator/package.json +++ b/packages/@uppy/thumbnail-generator/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/thumbnail-generator", "description": "Uppy plugin that generates small previews of images to show on your upload UI.", - "version": "2.2.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -32,5 +32,6 @@ }, "peerDependencies": { "@uppy/core": "workspace:^" - } + }, + "stableVersion": "2.2.0" } diff --git a/packages/@uppy/transloadit/CHANGELOG.md b/packages/@uppy/transloadit/CHANGELOG.md index c984275a3b..6b3fb128c5 100644 --- a/packages/@uppy/transloadit/CHANGELOG.md +++ b/packages/@uppy/transloadit/CHANGELOG.md @@ -1,5 +1,12 @@ # @uppy/transloadit +## 3.0.0-beta + +Released: 2022-05-30 +Included in: Uppy v3.0.0-beta + +- @uppy/transloadit: remove IE 10 hack (Antoine du Hamel / #3777) + ## 2.3.0 Released: 2022-05-30 diff --git a/packages/@uppy/transloadit/package.json b/packages/@uppy/transloadit/package.json index e710cb160a..1f099d3aa2 100644 --- a/packages/@uppy/transloadit/package.json +++ b/packages/@uppy/transloadit/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/transloadit", "description": "The Transloadit plugin can be used to upload files to Transloadit for all kinds of processing, such as transcoding video, resizing images, zipping/unzipping, and more", - "version": "2.3.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -41,5 +41,6 @@ "devDependencies": { "@jest/globals": "^27.4.2", "whatwg-fetch": "^3.6.2" - } + }, + "stableVersion": "2.3.0" } diff --git a/packages/@uppy/tus/package.json b/packages/@uppy/tus/package.json index c2ca14f962..d490cc32c2 100644 --- a/packages/@uppy/tus/package.json +++ b/packages/@uppy/tus/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/tus", "description": "Resumable uploads for Uppy using Tus.io", - "version": "2.4.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -30,5 +30,6 @@ "peerDependencies": { "@jest/globals": "^27.4.2", "@uppy/core": "workspace:^" - } + }, + "stableVersion": "2.4.0" } diff --git a/packages/@uppy/unsplash/package.json b/packages/@uppy/unsplash/package.json index 56267b1305..7dbaafc0a8 100644 --- a/packages/@uppy/unsplash/package.json +++ b/packages/@uppy/unsplash/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/unsplash", "description": "Import files from Unsplash, the free stock photography resource, into Uppy", - "version": "2.1.0", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -31,5 +31,6 @@ }, "publishConfig": { "access": "public" - } + }, + "stableVersion": "2.1.0" } diff --git a/packages/@uppy/url/package.json b/packages/@uppy/url/package.json index 58aa350aa3..a735198688 100644 --- a/packages/@uppy/url/package.json +++ b/packages/@uppy/url/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/url", "description": "The Url plugin lets users import files from the Internet. Paste any URL and it’ll be added!", - "version": "2.1.1", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "style": "dist/style.min.css", @@ -29,5 +29,6 @@ }, "peerDependencies": { "@uppy/core": "workspace:^" - } + }, + "stableVersion": "2.1.1" } diff --git a/packages/@uppy/utils/package.json b/packages/@uppy/utils/package.json index 9fbfb26d0e..6fa0915067 100644 --- a/packages/@uppy/utils/package.json +++ b/packages/@uppy/utils/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/utils", "description": "Shared utility functions for Uppy Core and plugins maintained by the Uppy team.", - "version": "4.1.0", + "version": "5.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -23,5 +23,6 @@ }, "devDependencies": { "@jest/globals": "^27.4.2" - } + }, + "stableVersion": "4.1.0" } diff --git a/packages/@uppy/vue/package.json b/packages/@uppy/vue/package.json index 2fb8b382f4..1befc3e7e1 100644 --- a/packages/@uppy/vue/package.json +++ b/packages/@uppy/vue/package.json @@ -1,6 +1,6 @@ { "name": "@uppy/vue", - "version": "0.4.8", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -21,5 +21,6 @@ }, "publishConfig": { "access": "public" - } + }, + "stableVersion": "0.4.8" } diff --git a/packages/@uppy/webcam/package.json b/packages/@uppy/webcam/package.json index bf5f71289c..77bfeb0d8c 100644 --- a/packages/@uppy/webcam/package.json +++ b/packages/@uppy/webcam/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/webcam", "description": "Uppy plugin that takes photos or records videos using the device's camera.", - "version": "2.2.1", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "style": "dist/style.min.css", @@ -35,5 +35,6 @@ }, "peerDependencies": { "@uppy/core": "workspace:^" - } + }, + "stableVersion": "2.2.1" } diff --git a/packages/@uppy/xhr-upload/package.json b/packages/@uppy/xhr-upload/package.json index dad63a1ae0..9b86b3a193 100644 --- a/packages/@uppy/xhr-upload/package.json +++ b/packages/@uppy/xhr-upload/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/xhr-upload", "description": "Plain and simple classic HTML multipart form uploads with Uppy, as well as uploads using the HTTP PUT method.", - "version": "2.1.1", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -35,5 +35,6 @@ }, "peerDependencies": { "@uppy/core": "workspace:^" - } + }, + "stableVersion": "2.1.1" } diff --git a/packages/@uppy/zoom/package.json b/packages/@uppy/zoom/package.json index 0c5e9873df..5dbef188b9 100644 --- a/packages/@uppy/zoom/package.json +++ b/packages/@uppy/zoom/package.json @@ -1,7 +1,7 @@ { "name": "@uppy/zoom", "description": "Import files from zoom, into Uppy.", - "version": "1.1.1", + "version": "3.0.0-beta", "license": "MIT", "main": "lib/index.js", "types": "types/index.d.ts", @@ -31,5 +31,6 @@ }, "publishConfig": { "access": "public" - } + }, + "stableVersion": "1.1.1" } diff --git a/packages/uppy/package.json b/packages/uppy/package.json index 6ff609aaad..59eee28361 100644 --- a/packages/uppy/package.json +++ b/packages/uppy/package.json @@ -1,7 +1,7 @@ { "name": "uppy", "description": "Extensible JavaScript file upload widget with support for drag&drop, resumable uploads, previews, restrictions, file processing/encoding, remote providers like Instagram, Dropbox, Google Drive, S3 and more :dog:", - "version": "2.11.0", + "version": "3.0.0-beta", "license": "MIT", "main": "index.js", "module": "index.mjs", @@ -74,5 +74,6 @@ "regenerator-runtime": "0.13.9", "resize-observer-polyfill": "^1.5.1", "whatwg-fetch": "^3.6.2" - } + }, + "stableVersion": "2.11.0" } diff --git a/website/src/docs/index.md b/website/src/docs/index.md index f618cb66b6..d964be5e09 100644 --- a/website/src/docs/index.md +++ b/website/src/docs/index.md @@ -19,12 +19,12 @@ Here’s the simplest example html page with Uppy (it uses a CDN bundle, while w Uppy - +
- + + ``` 2\. Add CSS to ``: ```html - + ``` 3\. Initialize at the bottom of the closing `` tag: @@ -181,5 +181,5 @@ export * from '@uppy/core' If you’re using Uppy from CDN, those polyfills are already included in the bundle, no need to include anything additionally: ```html - + ``` diff --git a/website/src/docs/locales.md b/website/src/docs/locales.md index c8c891d96c..0e51331bf8 100644 --- a/website/src/docs/locales.md +++ b/website/src/docs/locales.md @@ -34,8 +34,8 @@ const uppy = new Uppy({ Add a ` - + + + - - + + ``` Please note that while you may be able to get 2.0 to work in IE11 this way, we do not officially support it anymore. diff --git a/website/src/docs/robodog-form.md b/website/src/docs/robodog-form.md index 3220fb6ffe..422fac8e36 100644 --- a/website/src/docs/robodog-form.md +++ b/website/src/docs/robodog-form.md @@ -150,7 +150,7 @@ Make sure to also include the Uppy css file in your `` tag in case you wan ```html - + ``` @@ -162,7 +162,7 @@ Notice how the form is submitted to the inexistant `/uploads` route once all tra Testing Robodog - +
@@ -172,7 +172,7 @@ Notice how the form is submitted to the inexistant `/uploads` route once all tra
- + + + ``` diff --git a/website/src/examples/dashboard/app.es6 b/website/src/examples/dashboard/app.es6 index 6b53281202..1f8d6b4aca 100644 --- a/website/src/examples/dashboard/app.es6 +++ b/website/src/examples/dashboard/app.es6 @@ -242,7 +242,7 @@ function loadLocaleFromCDN (localeName) { const head = document.getElementsByTagName('head')[0] const js = document.createElement('script') js.type = 'text/javascript' - js.src = `https://releases.transloadit.com/uppy/locales/v2.1.0/${localeName}.min.js` + js.src = `https://releases.transloadit.com/uppy/locales/v3.0.0-beta/${localeName}.min.js` head.appendChild(js) } diff --git a/website/src/examples/i18n/app.html b/website/src/examples/i18n/app.html index e2a880bdcd..d102e1200f 100644 --- a/website/src/examples/i18n/app.html +++ b/website/src/examples/i18n/app.html @@ -1,7 +1,7 @@ - +
@@ -12,9 +12,9 @@
Uploaded files:
- - - + + + +// const robodog = require('@uppy/robodog') const TRANSLOADIT_EXAMPLE_KEY = '35c1aed03f5011e982b6afe82599b6a0' diff --git a/website/src/examples/markdown-snippets/app.html b/website/src/examples/markdown-snippets/app.html index 280de1aadb..0903529379 100644 --- a/website/src/examples/markdown-snippets/app.html +++ b/website/src/examples/markdown-snippets/app.html @@ -1,6 +1,6 @@ + -->

Create a new snippet

diff --git a/website/themes/uppy/layout/index.ejs b/website/themes/uppy/layout/index.ejs index d0806a99a8..2562bff240 100644 --- a/website/themes/uppy/layout/index.ejs +++ b/website/themes/uppy/layout/index.ejs @@ -187,9 +187,9 @@

© <%- date(Date.now(), 'YYYY') %> Transloadit

- - - + + + + + diff --git a/examples/vue/package.json b/examples/vue/package.json index 3b72e83dea..afa5225fac 100644 --- a/examples/vue/package.json +++ b/examples/vue/package.json @@ -1,26 +1,24 @@ { - "name": "@uppy-example/vue-example", + "name": "@uppy-example/vue2", "version": "0.0.0", "private": true, "scripts": { - "start": "vue-cli-service serve", - "build": "vue-cli-service build", - "lint": "vue-cli-service lint" + "dev": "vite", + "build": "vite build", + "preview": "vite preview --port 5050" }, "dependencies": { + "@uppy/core": "workspace:*", + "@uppy/dashboard": "workspace:*", + "@uppy/drag-drop": "workspace:*", + "@uppy/progress-bar": "workspace:*", + "@uppy/transloadit": "workspace:*", "@uppy/vue": "workspace:*", - "core-js": "^3.6.5", - "shallow-equal": "^1.2.1", "vue": "^2.6.14" }, "devDependencies": { - "@vue/cli-plugin-babel": "~4.5.0", - "@vue/cli-service": "~4.5.0", - "vue-template-compiler": "^2.6.11" - }, - "browserslist": [ - "> 1%", - "last 2 versions", - "not dead" - ] + "vite": "^2.7.1", + "vite-plugin-vue2": "^2.0.1", + "vue-template-compiler": "^2.6.14" + } } diff --git a/examples/vue/src/App.vue b/examples/vue/src/App.vue index 2d23d45a1d..3401c94534 100644 --- a/examples/vue/src/App.vue +++ b/examples/vue/src/App.vue @@ -1,6 +1,5 @@