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.

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

Internal: Replace Free to Pro Upsell Promotion - Heading Widget [ED-15838] #28929

Draft
wants to merge 60 commits into
base: main
Choose a base branch
from

Conversation

elchugreeva
Copy link
Contributor

No description provided.

heinvv and others added 9 commits October 9, 2024 11:18
…place-free-to-pro-upsell-promotion-heading-widget' into ED-15908-internal-replace-free-to-pro-upsell-promotion-create-react-component
…place-free-to-pro-upsell-promotion-heading-widget' into ED-15908-internal-replace-free-to-pro-upsell-promotion-create-react-component
@@ -1347,6 +1362,29 @@ private function promotion_switcher_control( $title, $id ): string {
</div>';
}

private function react_promotion_control( $title, $id ): string {
return '<div class="elementor-control-type-switcher elementor-label-inline e-control-motion-effects-promotion__wrapper">
Copy link
Contributor

@mike-elementor mike-elementor Oct 10, 2024

Choose a reason for hiding this comment

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

now this starts to look as lot of duplicated code. but to do some quick alignment of the infotip...
@hein-obox maybe, we should revert to the v1, when you tried to add an additional param to the promotion_control, to optionally render the "anchoring" element

Copy link
Member

Choose a reason for hiding this comment

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

@mike-elementor Feel free to update this code to suite your requirements.

Copy link
Member

Choose a reason for hiding this comment

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

@mike-elementor Let's try to avoid the duplication indeed.

mike-elementor and others added 9 commits October 10, 2024 10:39
…create-react-component' of https://github.com/elchugreeva/elementor into ED-15908-internal-replace-free-to-pro-upsell-promotion-create-react-component
…ree-to-pro-upsell-promotion-create-react-component' into ED-15908-internal-replace-free-to-pro-upsell-promotion-create-react-component
use Elementor\Modules\Home\Classes\Transformations_Manager;

class API {
Copy link
Member

Choose a reason for hiding this comment

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

I have extracted this code to a general class, in order make it reusable for other modules.

<App
colorScheme={ colorScheme }
isRTL={ isRTL }
promotionsData={ elementorPromotionsData }
Copy link
Member

Choose a reason for hiding this comment

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

The promotions data can be accessed from here.

}

private static function get_animated_headline_data( $assets_data ) {
$header_description = 'Get access to more features, widgets, and templates with Elementor Pro.';
Copy link
Member

Choose a reason for hiding this comment

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

This is just a placeholder for now.

]
);
}

private function promotion_switcher_control( $title, $id ): string {
return '<div class="elementor-control-type-switcher elementor-label-inline e-control-motion-effects-promotion__wrapper">
Copy link
Member

Choose a reason for hiding this comment

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

Maybe? Could you we replace this motion-effects reference with a more general reference?

PopperProps={ {
modifiers: [
{
name: 'offset',
Copy link
Member

Choose a reason for hiding this comment

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

I would love to study this aspect in a bit more detail.

return (
<Card sx={ { width: 296 } }>
<CardHeader title={
<Box sx={ { display: 'flex', alignItems: 'center', justifyContent: 'space-between' } }>
Copy link
Member

@hein-obox hein-obox Oct 13, 2024

Choose a reason for hiding this comment

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

Maybe;

``

Suggested change
<Box sx={ { display: 'flex', alignItems: 'center', justifyContent: 'space-between' } }>
<Box display="flex" alignItems="center" justifyContent="space-between">

I think this is the preferred approach for flexbox styling.

See e.g. https://github.com/elementor/elementor-pro/blob/fb6d487c86e83ac9506ae3845f83aa663794568f/modules/display-conditions/assets/js/editor/components/conditions.js#L10

<Card sx={ { width: 296 } }>
<CardHeader title={
<Box sx={ { display: 'flex', alignItems: 'center', justifyContent: 'space-between' } }>
<Box sx={ { display: 'flex', alignItems: 'center', gap: 1 } }>
Copy link
Member

Choose a reason for hiding this comment

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

See above.

elchugreeva and others added 3 commits October 13, 2024 21:11
…create-react-component' of https://github.com/elchugreeva/elementor into ED-15908-internal-replace-free-to-pro-upsell-promotion-create-react-component
return self::filter_data( 'heading', $data );
}

private static function filter_data( $filter_name, $asset_data ) {
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
private static function filter_data( $filter_name, $asset_data ) {
private static function filter_data( $widget_name, $promotion_name $asset_data ) {

}

private static function filter_data( $filter_name, $asset_data ) {
return Filtered_Promotions_Manager::get_filtered_promotion_data( $asset_data, "elementor/widgets/{ $filter_name }/custom_promotion", 'upgrade_url' );
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
return Filtered_Promotions_Manager::get_filtered_promotion_data( $asset_data, "elementor/widgets/{ $filter_name }/custom_promotion", 'upgrade_url' );
return Filtered_Promotions_Manager::get_filtered_promotion_data( $asset_data, "elementor/widgets/{ $widget_name }/{ $promotion_name }", 'upgrade_url' );

'upgrade_url' => 'https://go.elementor.com/go-pro-heading-widget/',
];

return self::filter_data( 'heading', $data );
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
return self::filter_data( 'heading', $data );
return self::filter_data( 'heading', 'animated_headline', $data );

elchugreeva and others added 11 commits October 15, 2024 10:22
…create-react-component' of https://github.com/elchugreeva/elementor into ED-15908-internal-replace-free-to-pro-upsell-promotion-create-react-component
 * fixed info-tip autoclose on click-away-listener (changed the child/parent relationships)
 * fixed close-button handler (on-click instead of on-close)
 * fixed into-tip positioning (right, tiny ux-improvement)
'upgrade_url' => 'https://go.elementor.com/go-pro-heading-widget/',
];

return self::filter_data( 'animated-headline', $data );
Copy link
Member

Choose a reason for hiding this comment

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

I am not sure if the widget name should be 'animated-headline' or 'heading'?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants