mirror of
https://github.com/transloadit/uppy.git
synced 2026-07-18 00:55:35 +00:00
9a213b59da
- `@uppy/aws/s3-multipart`: remove `client` getter and setter. - reason: internal usage only - migrate: use exposed options only - `@uppy/core`: remove `AggregateError` polyfill - reason: [should be polyfilled by the user](https://github.com/transloadit/uppy/pull/3532#discussion_r818602636) - migrate: install `AggregateError` polyfill or use `core-js` - `@uppy/core`: remove `reset()` method - reason: it's a duplicate of `cancelAll`, but with a less intention revealing name - migrate: use `cancelAll` - `@uppy/core`: remove backwards compatible exports (static properties on `Uppy`) - reason: transition to ESM - migrate: import the `Uppy` class by default and/or use named exports for everything else. - `@uppy/react`: don't expose `validProps` - reason: internal only - migrate: do not depend on this - `@uppy/store-redux`: remove backwards compatible exports (static properties on `ReduxStore`) - reason: transition to ESM - migrate: use named imports - `@uppy/thumbnail-generator`: remove `rotateImage`, `protect`, and `canvasToBlob` from prototype. - reason: internal only - migrate: don't depend on this
76 lines
1.8 KiB
JavaScript
76 lines
1.8 KiB
JavaScript
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 Component {
|
|
componentDidMount () {
|
|
this.installPlugin()
|
|
}
|
|
|
|
componentDidUpdate (prevProps) {
|
|
// eslint-disable-next-line react/destructuring-assignment
|
|
if (prevProps.uppy !== this.props.uppy) {
|
|
this.uninstallPlugin(prevProps)
|
|
this.installPlugin()
|
|
} else if (nonHtmlPropsHaveChanged(this.props, prevProps)) {
|
|
const options = { ...this.props, target: this.container }
|
|
delete options.uppy
|
|
this.plugin.setOptions(options)
|
|
}
|
|
}
|
|
|
|
componentWillUnmount () {
|
|
this.uninstallPlugin()
|
|
}
|
|
|
|
installPlugin () {
|
|
const { uppy, fixed, hideAfterFinish } = this.props
|
|
const options = {
|
|
id: 'react:ProgressBar',
|
|
fixed,
|
|
hideAfterFinish,
|
|
target: this.container,
|
|
}
|
|
delete options.uppy
|
|
|
|
uppy.use(ProgressBarPlugin, options)
|
|
|
|
this.plugin = uppy.getPlugin(options.id)
|
|
}
|
|
|
|
uninstallPlugin (props = this.props) {
|
|
const { uppy } = props
|
|
|
|
uppy.removePlugin(this.plugin)
|
|
}
|
|
|
|
render () {
|
|
return h('div', {
|
|
className: 'uppy-Container',
|
|
ref: (container) => {
|
|
this.container = container
|
|
},
|
|
...getHTMLProps(this.props),
|
|
})
|
|
}
|
|
}
|
|
|
|
ProgressBar.propTypes = {
|
|
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,
|
|
}
|
|
|
|
export default ProgressBar
|