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

Cleanup Image widget and pass down onSelectItem prop if any #6132

Merged
merged 3 commits into from
Jun 28, 2024
Merged

Cleanup Image widget and pass down onSelectItem prop if any #6132

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0555854
Cleanup Image widget and pass down `onSelectItem` prop if any
sneridagh Jun 28, 2024
e62d367
Changelog
sneridagh Jun 28, 2024
76fe1d5
Remove nonesense prop in Image edit component
sneridagh Jun 28, 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
1 change: 1 addition & 0 deletions packages/volto/news/6132.bugfix
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Cleanup Image widget and pass down onSelectItem prop if any @sneridagh
30 changes: 2 additions & 28 deletions packages/volto/src/components/manage/Blocks/Image/Edit.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,8 @@
*/

import React from 'react';
import { connect } from 'react-redux';
import { compose } from 'redux';

import { injectIntl } from 'react-intl';
import cx from 'classnames';
import { ImageSidebar, SidebarPortal } from '@plone/volto/components';
import { createContent } from '@plone/volto/actions';

import {
flattenToAppURL,
Expand All @@ -21,18 +16,6 @@ import config from '@plone/volto/registry';

import { ImageInput } from '@plone/volto/components/manage/Widgets/ImageWidget';

/**
* Edit image block function.
* @function Edit
*/

// const messages = defineMessages({
// notImage: {
// id: 'The provided link does not lead to an image.',
// defaultMessage: 'The provided link does not lead to an image.',
// },
// });

function Edit(props) {
const { data } = props;
const Image = config.getComponent({ name: 'Image' }).component;
Expand Down Expand Up @@ -110,6 +93,7 @@ function Edit(props) {
block={props.block}
id={props.block}
objectBrowserPickerType={'image'}
onSelectItem={props.onSelectItem}
Copy link
Sponsor Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@sneridagh I don't understand this passing of onSelectItem because at least in volto core there is no props.onSelectItem for Image block Edit.jsx. I do understand giving the ability to call this method if it's passed in the props of ImageWidget.jsx but in the case of Image block it's simply undefined and the fallback is called.

It's nice that you found more things to cleanup such as the extra compose actions!

Copy link
Contributor

@dobri1408 dobri1408 Jun 28, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I agree. I believe it can be removed. The intent of the onSelectItem function is to give developers more control over the ImageWidget, but in this case, it is undefined.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ichim-david @dobri1408 Agreed! yeah, I'll remove it.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

/>
)}
<SidebarPortal selected={props.selected}>
Expand All @@ -120,14 +104,4 @@ function Edit(props) {
);
}

export default compose(
injectIntl,
withBlockExtensions,
connect(
(state, ownProps) => ({
request: state.content.subrequests[ownProps.block] || {},
content: state.content.subrequests[ownProps.block]?.data,
}),
{ createContent },
),
)(Edit);
export default withBlockExtensions(Edit);
20 changes: 10 additions & 10 deletions packages/volto/src/components/manage/Widgets/ImageWidget.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ const UnconnectedImageInput = (props) => {
objectBrowserPickerType = 'image',
description,
placeholderLinkInput = '',
onSelectItem,
} = props;

const intl = useIntl();
Expand Down Expand Up @@ -204,16 +205,15 @@ const UnconnectedImageInput = (props) => {
e.preventDefault();
openObjectBrowser({
mode: objectBrowserPickerType,
onSelectItem: (
url,
{ title, image_field, image_scales },
) => {
onChange(props.id, flattenToAppURL(url), {
title,
image_field,
image_scales,
});
},
onSelectItem: onSelectItem
? onSelectItem
: (url, { title, image_field, image_scales }) => {
onChange(props.id, flattenToAppURL(url), {
title,
image_field,
image_scales,
});
},
currentPath: contextUrl,
});
}}
Expand Down
Loading