mirror of
https://github.com/strapi/strapi.git
synced 2025-11-02 02:44:55 +00:00
Init request edit file
Signed-off-by: soupette <cyril.lpz@gmail.com>
This commit is contained in:
parent
b2ee121c20
commit
70a05b036b
@ -30,7 +30,7 @@ const EditForm = ({
|
||||
fileToEdit,
|
||||
onChange,
|
||||
onClickDeleteFileToUpload,
|
||||
onSubmitEditNewFile,
|
||||
onSubmitEdit,
|
||||
setCropResult,
|
||||
}) => {
|
||||
const { formatMessage } = useGlobalContext();
|
||||
@ -154,7 +154,7 @@ const EditForm = ({
|
||||
const handleSubmit = e => {
|
||||
e.preventDefault();
|
||||
|
||||
onSubmitEditNewFile(e);
|
||||
onSubmitEdit(e);
|
||||
};
|
||||
|
||||
return (
|
||||
@ -276,7 +276,7 @@ EditForm.defaultProps = {
|
||||
fileToEdit: null,
|
||||
onChange: () => {},
|
||||
onClickDeleteFileToUpload: () => {},
|
||||
onSubmitEditNewFile: e => e.preventDefault(),
|
||||
onSubmitEdit: e => e.preventDefault(),
|
||||
setCropResult: () => {},
|
||||
};
|
||||
|
||||
@ -284,7 +284,7 @@ EditForm.propTypes = {
|
||||
fileToEdit: PropTypes.object,
|
||||
onChange: PropTypes.func,
|
||||
onClickDeleteFileToUpload: PropTypes.func,
|
||||
onSubmitEditNewFile: PropTypes.func,
|
||||
onSubmitEdit: PropTypes.func,
|
||||
setCropResult: PropTypes.func,
|
||||
};
|
||||
|
||||
|
||||
@ -129,6 +129,58 @@ const ModalStepper = ({ initialFileToEdit, initialStep, isOpen, onClosed, onTogg
|
||||
goNext();
|
||||
};
|
||||
|
||||
const handleSubmitEditExistingFile = async (e, shouldDuplicateMedia = false) => {
|
||||
e.preventDefault();
|
||||
|
||||
dispatch({
|
||||
type: 'ON_SUBMIT_EDIT_EXISTING_FILE',
|
||||
});
|
||||
|
||||
const headers = {};
|
||||
const formData = new FormData();
|
||||
|
||||
// The endpoints are different when we want to just update the file infos
|
||||
const didCropFile = fileToEdit.file instanceof File;
|
||||
const { abortController, id, file, fileInfo } = fileToEdit;
|
||||
let requestURL = shouldDuplicateMedia ? `/${pluginId}` : `/${pluginId}?id=${id}`;
|
||||
|
||||
if (didCropFile) {
|
||||
formData.append('files', file);
|
||||
formData.append('fileInfo', JSON.stringify(fileInfo));
|
||||
|
||||
try {
|
||||
await request(
|
||||
requestURL,
|
||||
{
|
||||
method: 'POST',
|
||||
headers,
|
||||
body: formData,
|
||||
signal: abortController.signal,
|
||||
},
|
||||
false,
|
||||
false
|
||||
);
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
}
|
||||
} else {
|
||||
requestURL = `/${pluginId}/files/${id}`;
|
||||
|
||||
// The following will not work waiting for the back-end to be ready
|
||||
try {
|
||||
await request(requestURL, { method: 'PUT', body: fileInfo });
|
||||
// Do something
|
||||
} catch (err) {
|
||||
// Do something with error
|
||||
|
||||
console.log('err');
|
||||
}
|
||||
}
|
||||
|
||||
console.log('submit', shouldDuplicateMedia);
|
||||
console.log({ fileToEdit });
|
||||
};
|
||||
|
||||
const handleToggle = () => {
|
||||
if (filesToUploadLength > 0) {
|
||||
// eslint-disable-next-line no-alert
|
||||
@ -235,7 +287,9 @@ const ModalStepper = ({ initialFileToEdit, initialStep, isOpen, onClosed, onTogg
|
||||
onClickDeleteFileToUpload={handleClickDeleteFileToUpload}
|
||||
onClickEditNewFile={handleGoToEditNewFile}
|
||||
onGoToAddBrowseFiles={handleGoToAddBrowseFiles}
|
||||
onSubmitEditNewFile={handleSubmitEditNewFile}
|
||||
onSubmitEdit={
|
||||
currentStep === 'edit-new' ? handleSubmitEditNewFile : handleSubmitEditExistingFile
|
||||
}
|
||||
onToggle={handleToggle}
|
||||
setCropResult={handleSetCropResult}
|
||||
withBackButton={withBackButton}
|
||||
@ -266,6 +320,11 @@ const ModalStepper = ({ initialFileToEdit, initialStep, isOpen, onClosed, onTogg
|
||||
{formatMessage({ id: 'form.button.finish' })}
|
||||
</Button>
|
||||
)}
|
||||
{currentStep === 'edit' && (
|
||||
<Button color="success" type="button" onClick={handleSubmitEditExistingFile}>
|
||||
{formatMessage({ id: 'form.button.finish' })}
|
||||
</Button>
|
||||
)}
|
||||
</section>
|
||||
</ModalFooter>
|
||||
</Modal>
|
||||
|
||||
@ -36,6 +36,8 @@ const reducer = (state, action) => {
|
||||
.updateIn(['filesToUpload', originalIndex], () => state.get('fileToEdit'))
|
||||
.update('fileToEdit', () => null);
|
||||
}
|
||||
case 'ON_SUBMIT_EDIT_EXISTING_FILE':
|
||||
return state.updateIn(['fileToEdit', 'isUploading'], () => true);
|
||||
case 'REMOVE_FILE_TO_UPLOAD':
|
||||
return state.update('filesToUpload', list => {
|
||||
return list.filter(data => data.get('originalIndex') !== action.fileIndex);
|
||||
|
||||
@ -1,12 +1,19 @@
|
||||
import { pick } from 'lodash';
|
||||
|
||||
const formatFileForEditing = file => {
|
||||
const abortController = new AbortController();
|
||||
|
||||
return {
|
||||
abortController,
|
||||
id: file.id,
|
||||
file: {
|
||||
...pick(file, ['size', 'ext', 'width', 'height', 'url', 'mime']),
|
||||
...pick(file, ['size', 'ext', 'width', 'height', 'url', 'mime', 'name']),
|
||||
created_at: file.created_at || file.createdAt,
|
||||
},
|
||||
fileInfo: pick(file, ['alternativeText', 'caption', 'name']),
|
||||
hasError: false,
|
||||
errorMessage: null,
|
||||
isUploading: false,
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
@ -22,10 +22,14 @@ describe('UPLOAD | utils | formatFileForEditing', () => {
|
||||
formats: null,
|
||||
provider_metadata: null,
|
||||
};
|
||||
const abortController = new AbortController();
|
||||
|
||||
const expected = {
|
||||
abortController,
|
||||
id: 12,
|
||||
file: {
|
||||
size: 22.8,
|
||||
name: 'test',
|
||||
ext: '.png',
|
||||
width: 110,
|
||||
height: 110,
|
||||
@ -38,6 +42,9 @@ describe('UPLOAD | utils | formatFileForEditing', () => {
|
||||
alternativeText: 'test',
|
||||
name: 'test',
|
||||
},
|
||||
hasError: false,
|
||||
errorMessage: null,
|
||||
isUploading: false,
|
||||
};
|
||||
|
||||
expect(formatFileForEditing(data)).toEqual(expected);
|
||||
@ -64,11 +71,14 @@ describe('UPLOAD | utils | formatFileForEditing', () => {
|
||||
formats: null,
|
||||
provider_metadata: null,
|
||||
};
|
||||
|
||||
const abortController = new AbortController();
|
||||
const expected = {
|
||||
abortController,
|
||||
id: 12,
|
||||
file: {
|
||||
size: 22.8,
|
||||
ext: '.png',
|
||||
name: 'test',
|
||||
width: 110,
|
||||
height: 110,
|
||||
created_at: '2020-03-23T11:43:46.729Z',
|
||||
@ -80,6 +90,9 @@ describe('UPLOAD | utils | formatFileForEditing', () => {
|
||||
caption: 'test',
|
||||
name: 'test',
|
||||
},
|
||||
hasError: false,
|
||||
errorMessage: null,
|
||||
isUploading: false,
|
||||
};
|
||||
|
||||
expect(formatFileForEditing(data)).toEqual(expected);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user