Allow only images in modal image uploader. #7672
Conversation
| return; | ||
| } | ||
| const file = new File([result.buffer], result.name); | ||
| this.props.onFileChosen(file); |
There was a problem hiding this comment.
I'm concerned that changing this from { path } to file will break publishing. Did you try?
It may be good to send { file: file , path: path } and adjust all the functions assigned to onFileChosen to take that.
There was a problem hiding this comment.
Sounds good @jessopb, nice catch. Perhaps as a small note for the future, we should avoid using these union types. Notice how I'm still respecting the interface (by sending a File type) but still, it manages to break parts of the app...
There was a problem hiding this comment.
You're probably right. The union types were originally added when the codebase was supporting both web and app.
Maybe the type should be ChosenFile = { file: WebFile, path: string }
There was a problem hiding this comment.
@jessopb I have updated the code so the File now contains a path and a mime type. With this, the file upload for posts works fine. Please let me know what you think. Thanks.
| this.props.onFileChosen({ path }); | ||
| } | ||
| }); | ||
| Object.defineProperty(file, 'path', { |
There was a problem hiding this comment.
This was an elegant solution, but I think WebFile is a well defined builtin type and probably shouldn't be polluted with extra params. I think we'd prefer { file: FILE, path: path }
ui/component/publishFile/view.jsx
Outdated
| @@ -19,7 +19,7 @@ type Props = { | |||
| mode: ?string, | |||
| name: ?string, | |||
| title: ?string, | |||
| filePath: string | WebFile, | |||
| filePath: ?File, | |||
There was a problem hiding this comment.
Did you try publishing? Publish is trying to send an empty {}. (What happens when { thing: undefined })
ui/component/fileDrop/view.jsx
Outdated
| @@ -11,10 +11,10 @@ import Icon from 'component/common/icon'; | |||
|
|
|||
| type Props = { | |||
| modal: { id: string, modalProps: {} }, | |||
| filePath: string | WebFile, | |||
| filePath: File, | |||
There was a problem hiding this comment.
Also breaks here on file drop. This should be a path.
ui/modal/modalImageUpload/view.jsx
Outdated
| @@ -14,10 +14,13 @@ type Props = { | |||
|
|
|||
| function ModalImageUpload(props: Props) { | |||
| const { closeModal, currentValue, title, assetName, helpText, onUpdate } = props; | |||
| const filters = React.useMemo(() => [{ name: 'Images', extensions: ['jpg', 'png', 'gif'] }]); | |||
There was a problem hiding this comment.
this blocks jpeg - possibly some other valid types. svg has been possible and allowed so far.
jessopb
deleted the
7646-in-the-cover-upload-modal-trying-to-upload-anything-other-than-an-image-doesnt-reset-the-form
branch
Fixes
Issue Number: #7646
What is the current behavior?
Even though a file filter is being used, the "All Files"
option allows users to select any file when uploading
an image.
What is the new behavior?
The electron filter is being used so the "All Files"
option is no longer displayed.
Other information
PR Checklist
Toggle...
What kind of change does this PR introduce?
Please check all that apply to this PR using "x":