feat(widget-file): allow adding file from url (#4700)
This commit is contained in:
@ -157,11 +157,17 @@ const en = {
|
|||||||
},
|
},
|
||||||
image: {
|
image: {
|
||||||
choose: 'Choose an image',
|
choose: 'Choose an image',
|
||||||
|
chooseUrl: 'Insert from URL',
|
||||||
|
replaceUrl: 'Replace with URL',
|
||||||
|
promptUrl: 'Enter the URL of the image',
|
||||||
chooseDifferent: 'Choose different image',
|
chooseDifferent: 'Choose different image',
|
||||||
remove: 'Remove image',
|
remove: 'Remove image',
|
||||||
},
|
},
|
||||||
file: {
|
file: {
|
||||||
choose: 'Choose a file',
|
choose: 'Choose a file',
|
||||||
|
chooseUrl: 'Insert from URL',
|
||||||
|
replaceUrl: 'Replace with URL',
|
||||||
|
promptUrl: 'Enter the URL of the file',
|
||||||
chooseDifferent: 'Choose different file',
|
chooseDifferent: 'Choose different file',
|
||||||
remove: 'Remove file',
|
remove: 'Remove file',
|
||||||
},
|
},
|
||||||
|
@ -60,12 +60,12 @@ const FileLinkList = styled.ul`
|
|||||||
const FileWidgetButton = styled.button`
|
const FileWidgetButton = styled.button`
|
||||||
${buttons.button};
|
${buttons.button};
|
||||||
${components.badge};
|
${components.badge};
|
||||||
|
margin-bottom: 12px;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const FileWidgetButtonRemove = styled.button`
|
const FileWidgetButtonRemove = styled.button`
|
||||||
${buttons.button};
|
${buttons.button};
|
||||||
${components.badgeDanger};
|
${components.badgeDanger};
|
||||||
margin-top: 12px;
|
|
||||||
`;
|
`;
|
||||||
|
|
||||||
function isMultiple(value) {
|
function isMultiple(value) {
|
||||||
@ -174,6 +174,14 @@ export default function withFileControl({ forImage } = {}) {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
handleUrl = subject => e => {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
const url = window.prompt(this.props.t(`editor.editorWidgets.${subject}.promptUrl`));
|
||||||
|
|
||||||
|
return this.props.onChange(url);
|
||||||
|
};
|
||||||
|
|
||||||
handleRemove = e => {
|
handleRemove = e => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.props.onClearMediaControl(this.controlID);
|
this.props.onClearMediaControl(this.controlID);
|
||||||
@ -255,6 +263,9 @@ export default function withFileControl({ forImage } = {}) {
|
|||||||
<FileWidgetButton onClick={this.handleChange}>
|
<FileWidgetButton onClick={this.handleChange}>
|
||||||
{t(`editor.editorWidgets.${subject}.chooseDifferent`)}
|
{t(`editor.editorWidgets.${subject}.chooseDifferent`)}
|
||||||
</FileWidgetButton>
|
</FileWidgetButton>
|
||||||
|
<FileWidgetButton onClick={this.handleUrl(subject)}>
|
||||||
|
{t(`editor.editorWidgets.${subject}.replaceUrl`)}
|
||||||
|
</FileWidgetButton>
|
||||||
<FileWidgetButtonRemove onClick={this.handleRemove}>
|
<FileWidgetButtonRemove onClick={this.handleRemove}>
|
||||||
{t(`editor.editorWidgets.${subject}.remove`)}
|
{t(`editor.editorWidgets.${subject}.remove`)}
|
||||||
</FileWidgetButtonRemove>
|
</FileWidgetButtonRemove>
|
||||||
@ -266,9 +277,14 @@ export default function withFileControl({ forImage } = {}) {
|
|||||||
renderNoSelection = subject => {
|
renderNoSelection = subject => {
|
||||||
const { t } = this.props;
|
const { t } = this.props;
|
||||||
return (
|
return (
|
||||||
<FileWidgetButton onClick={this.handleChange}>
|
<>
|
||||||
{t(`editor.editorWidgets.${subject}.choose`)}
|
<FileWidgetButton onClick={this.handleChange}>
|
||||||
</FileWidgetButton>
|
{t(`editor.editorWidgets.${subject}.choose`)}
|
||||||
|
</FileWidgetButton>
|
||||||
|
<FileWidgetButton onClick={this.handleUrl(subject)}>
|
||||||
|
{t(`editor.editorWidgets.${subject}.chooseUrl`)}
|
||||||
|
</FileWidgetButton>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user