39 lines
933 B
TypeScript
39 lines
933 B
TypeScript
import { Button, Notice } from '@wordpress/components';
|
|
import { __ } from '@wordpress/i18n';
|
|
|
|
import './style.scss';
|
|
|
|
export const LightNudge = ( {
|
|
title,
|
|
description,
|
|
buttonText = null,
|
|
checkoutUrl = null,
|
|
goToCheckoutPage = null,
|
|
isRedirecting = false,
|
|
showButton = true,
|
|
target = '_top',
|
|
} ) => {
|
|
const redirectingText = __( 'Redirecting…', 'jetpack' );
|
|
|
|
return (
|
|
<div className="jetpack-upgrade-plan-banner-light">
|
|
<Notice status="error" isDismissible={ false }>
|
|
<p>
|
|
{ title && <strong>{ title }</strong> }
|
|
{ description }{ ' ' }
|
|
{ showButton && (
|
|
<Button
|
|
href={ isRedirecting ? null : checkoutUrl } // Only for server-side rendering, since onClick doesn't work there.
|
|
onClick={ goToCheckoutPage }
|
|
variant="link"
|
|
target={ target }
|
|
>
|
|
{ isRedirecting ? redirectingText : buttonText }
|
|
</Button>
|
|
) }
|
|
</p>
|
|
</Notice>
|
|
</div>
|
|
);
|
|
};
|