Update the text based on the latest flow and show a different message when WUM is installed but not activated.

This commit is contained in:
Thilina Hasantha 2024-03-05 18:34:59 +01:00
parent a45216db34
commit 3e78a1d74b
1 changed files with 81 additions and 36 deletions

View File

@ -7,8 +7,12 @@ import { __, sprintf } from '@wordpress/i18n';
/** /**
* Internal dependencies * Internal dependencies
*/ */
import sanitizeHTML from '../../../lib/sanitize-html';
import { Subscription } from '../my-subscriptions/types'; import { Subscription } from '../my-subscriptions/types';
import { WOO_CONNECT_PLUGIN_DOWNLOAD_URL } from '../constants'; import {
WOO_CONNECT_PLUGIN_DOWNLOAD_URL,
WP_ADMIN_PLUGIN_LIST_URL,
} from '../constants';
import { getAdminSetting } from '../../../utils/admin-settings'; import { getAdminSetting } from '../../../utils/admin-settings';
interface ConnectProps { interface ConnectProps {
@ -18,39 +22,80 @@ interface ConnectProps {
export default function InstallWooConnectModal( props: ConnectProps ) { export default function InstallWooConnectModal( props: ConnectProps ) {
const wccomSettings = getAdminSetting( 'wccomHelper', {} ); const wccomSettings = getAdminSetting( 'wccomHelper', {} );
return ( if ( ! wccomSettings?.wooUpdateManagerInstalled ) {
<Modal return (
title={ __( 'Install Woo Update Manager', 'woocommerce' ) } <Modal
onRequestClose={ props.onClose } title={ __( 'Access your updates', 'woocommerce' ) }
focusOnMount={ true } onRequestClose={ props.onClose }
className="woocommerce-marketplace__header-account-modal" focusOnMount={ true }
style={ { borderRadius: 4 } } className="woocommerce-marketplace__header-account-modal"
overlayClassName="woocommerce-marketplace__header-account-modal-overlay" style={ { borderRadius: 4 } }
> overlayClassName="woocommerce-marketplace__header-account-modal-overlay"
<p className="woocommerce-marketplace__header-account-modal-text"> >
{ sprintf( <p className="woocommerce-marketplace__header-account-modal-text">
// translators: %s is the product version number (e.g. 1.0.2). <span
__( dangerouslySetInnerHTML={ sanitizeHTML(
'Version %s is available. To enable this update you need to install the Woo Update Manager plugin. You can also download and install it manually in your stores.', sprintf(
'woocommerce' // translators: %s is the product version number (e.g. 1.0.2).
), __(
props.subscription.version 'Version %s is available. To access this update, please first <b>install the Woo.com Update Manager</b> extension. Alternatively, you can download and install it manually.',
) } 'woocommerce'
</p> ),
<ButtonGroup className="woocommerce-marketplace__header-account-modal-button-group"> props.subscription.version
<Button )
href={ WOO_CONNECT_PLUGIN_DOWNLOAD_URL } ) }
variant="secondary" />
> </p>
{ __( 'Download', 'woocommerce' ) } <ButtonGroup className="woocommerce-marketplace__header-account-modal-button-group">
</Button> <Button
<Button href={ WOO_CONNECT_PLUGIN_DOWNLOAD_URL }
href={ wccomSettings?.wooUpdateManagerInstallUrl } variant="secondary"
variant="primary" >
> { __( 'Download', 'woocommerce' ) }
{ __( 'Install', 'woocommerce' ) } </Button>
</Button> <Button
</ButtonGroup> href={ wccomSettings?.wooUpdateManagerInstallUrl }
</Modal> variant="primary"
); >
{ __( 'Install', 'woocommerce' ) }
</Button>
</ButtonGroup>
</Modal>
);
}
if ( ! wccomSettings?.wooUpdateManagerActive ) {
return (
<Modal
title={ __( 'Access your updates', 'woocommerce' ) }
onRequestClose={ props.onClose }
focusOnMount={ true }
className="woocommerce-marketplace__header-account-modal"
style={ { borderRadius: 4 } }
overlayClassName="woocommerce-marketplace__header-account-modal-overlay"
>
<p className="woocommerce-marketplace__header-account-modal-text">
<span
dangerouslySetInnerHTML={ sanitizeHTML(
sprintf(
// translators: %s is the product version number (e.g. 1.0.2).
__(
'Version %s is available. To access this update, please <b>activate the Woo.com Update Manager</b> extension.',
'woocommerce'
),
props.subscription.version
)
) }
/>
</p>
<ButtonGroup className="woocommerce-marketplace__header-account-modal-button-group">
<Button href={ WP_ADMIN_PLUGIN_LIST_URL } variant="primary">
{ __( 'Activate', 'woocommerce' ) }
</Button>
</ButtonGroup>
</Modal>
);
}
return null;
} }