Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

@uppy/dashboard: add new autoOpen option #5001

Merged
merged 12 commits into from
Mar 25, 2024
Merged

@uppy/dashboard: add new autoOpen option #5001

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
89b98f4
Add autoOpenView option that defaults to meta
subvertallchris Mar 15, 2024
b474867
<Dashboard/> - deprecate `autoOpenFileEditor`, use `autoOpen` instead
lakesare Mar 18, 2024
7a4cf47
tests - account for the case where `opts` are undefined
lakesare Mar 18, 2024
2a28782
Update packages/@uppy/dashboard/src/Dashboard.jsx
lakesare Mar 19, 2024
900e018
types - properly deprecate option `autoOpenFileEditor`
lakesare Mar 19, 2024
b29f8e7
Merge branch 'auto-open-controls-and-event' of https://github.com/sub…
lakesare Mar 19, 2024
dfe388b
everywhere - rename "fileEditor" => "imageEditor"
lakesare Mar 20, 2024
c0bc1db
merge #2
lakesare Mar 20, 2024
a60ba7d
<DashboardModal/> - refactor `props` passing
lakesare Mar 20, 2024
5b3b19a
types - copypaste types
lakesare Mar 20, 2024
3c1c9b5
Dashboard.tsx - autoOpen: `false` => `null`
lakesare Mar 25, 2024
cffdf39
change the default value too
lakesare Mar 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 19 additions & 6 deletions packages/@uppy/dashboard/src/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -150,6 +150,8 @@ interface DashboardOptions<M extends Meta, B extends Body>
theme?: 'auto' | 'dark' | 'light'
trigger?: string
width?: string | number
autoOpen?: 'metaEditor' | 'imageEditor' | null
/** @deprecated use option autoOpen instead */
autoOpenFileEditor?: boolean
lakesare marked this conversation as resolved.
Show resolved Hide resolved
disabled?: boolean
disableLocalFiles?: boolean
Expand Down Expand Up @@ -195,6 +197,7 @@ const defaultOptions = {
showNativePhotoCameraButton: false,
showNativeVideoCameraButton: false,
theme: 'light',
autoOpen: null,
autoOpenFileEditor: false,
disabled: false,
disableLocalFiles: false,
Expand Down Expand Up @@ -243,7 +246,17 @@ export default class Dashboard<M extends Meta, B extends Body> extends UIPlugin<
private removeDragOverClassTimeout: ReturnType<typeof setTimeout>

constructor(uppy: Uppy<M, B>, opts?: DashboardOptions<M, B>) {
super(uppy, { ...defaultOptions, ...opts })
// support for the legacy `autoOpenFileEditor` option,
// TODO: we can remove this code when we update the Uppy major version
let autoOpen: DashboardOptions<M, B>['autoOpen']
if (!opts) {
autoOpen = null
} else if (opts.autoOpen === undefined) {
autoOpen = opts.autoOpenFileEditor ? 'imageEditor' : null
} else {
autoOpen = opts.autoOpen
}
super(uppy, { ...defaultOptions, ...opts, autoOpen })
this.id = this.opts.id || 'Dashboard'
this.title = 'Dashboard'
this.type = 'orchestrator'
Expand Down Expand Up @@ -939,11 +952,11 @@ export default class Dashboard<M extends Meta, B extends Body> extends UIPlugin<

const { metaFields } = this.getPluginState()
const isMetaEditorEnabled = metaFields && metaFields.length > 0
const isFileEditorEnabled = this.canEditFile(firstFile)
const isImageEditorEnabled = this.canEditFile(firstFile)

if (isMetaEditorEnabled) {
if (isMetaEditorEnabled && this.opts.autoOpen === 'metaEditor') {
this.toggleFileCard(true, firstFile.id)
} else if (isFileEditorEnabled) {
} else if (isImageEditorEnabled && this.opts.autoOpen === 'imageEditor') {
this.openFileEditor(firstFile)
}
}
Expand Down Expand Up @@ -985,7 +998,7 @@ export default class Dashboard<M extends Meta, B extends Body> extends UIPlugin<
this.el!.addEventListener('keydown', this.handleKeyDownInInline)
}

if (this.opts.autoOpenFileEditor) {
if (this.opts.autoOpen) {
this.uppy.on('files-added', this.#openFileEditorWhenFilesAdded)
}
}
Expand Down Expand Up @@ -1018,7 +1031,7 @@ export default class Dashboard<M extends Meta, B extends Body> extends UIPlugin<
this.el!.removeEventListener('keydown', this.handleKeyDownInInline)
}

if (this.opts.autoOpenFileEditor) {
if (this.opts.autoOpen) {
this.uppy.off('files-added', this.#openFileEditorWhenFilesAdded)
}
}
Expand Down
2 changes: 2 additions & 0 deletions packages/@uppy/dashboard/types/index.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,8 @@ export interface DashboardOptions extends Options {
theme?: 'auto' | 'dark' | 'light'
trigger?: string
width?: string | number
autoOpen?: 'metaEditor' | 'imageEditor' | null
/** @deprecated use option autoOpen instead */
autoOpenFileEditor?: boolean
lakesare marked this conversation as resolved.
Show resolved Hide resolved
disabled?: boolean
disableLocalFiles?: boolean
Expand Down
88 changes: 7 additions & 81 deletions packages/@uppy/react/src/DashboardModal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,90 +37,15 @@ class DashboardModal extends Component {
}

installPlugin () {
const {
id = 'react:DashboardModal',
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 { id='react:DashboardModal', target=this.container, open, onRequestClose, uppy } = this.props
Murderlon marked this conversation as resolved.
Show resolved Hide resolved
const options = {
...this.props,
id,
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) {
options.target = this.container
}

delete options.uppy

uppy.use(DashboardPlugin, options)

this.plugin = uppy.getPlugin(options.id)
Expand All @@ -146,6 +71,7 @@ class DashboardModal extends Component {
}
}

/* eslint-disable react/no-unused-prop-types */
DashboardModal.propTypes = {
uppy: uppyPropType.isRequired,
target: typeof window !== 'undefined' ? PropTypes.instanceOf(window.HTMLElement) : PropTypes.any,
Expand All @@ -161,7 +87,7 @@ DashboardModal.propTypes = {
note: PropTypes.string,
metaFields,
proudlyDisplayPoweredByUppy: PropTypes.bool,
autoOpenFileEditor: PropTypes.bool,
autoOpen: PropTypes.oneOf(['imageEditor', 'metaEditor', null]),
animateOpenClose: PropTypes.bool,
browserBackButtonClose: PropTypes.bool,
closeAfterFinish: PropTypes.bool,
Expand All @@ -186,7 +112,7 @@ DashboardModal.propTypes = {
thumbnailWidth: PropTypes.number,
locale,
}
// Must be kept in sync with @uppy/dashboard/src/Dashboard.jsx.
// Must be kept in sync with @uppy/dashboard/src/Dashboard.tsx.
DashboardModal.defaultProps = {
metaFields: [],
plugins: [],
Expand Down Expand Up @@ -217,7 +143,7 @@ DashboardModal.defaultProps = {
showRemoveButtonAfterComplete: false,
browserBackButtonClose: false,
theme: 'light',
autoOpenFileEditor: false,
autoOpen: false,
disabled: false,
disableLocalFiles: false,

Expand Down
Loading