09ef1f000f
- Theme: momentry (custom theme with REST API routes) - Plugins: code-snippets (contains all API proxies) - Languages: zh_TW translations - Excludes: cache, backups, uploads, logs
63 lines
2.1 KiB
TypeScript
63 lines
2.1 KiB
TypeScript
import { createInterpolateElement } from '@wordpress/element'
|
|
import React from 'react'
|
|
import { __ } from '@wordpress/i18n'
|
|
import { Modal } from '@wordpress/components'
|
|
import type { Dispatch, SetStateAction } from 'react'
|
|
|
|
export interface UpsellDialogProps {
|
|
isOpen: boolean
|
|
setIsOpen: Dispatch<SetStateAction<boolean>>
|
|
}
|
|
|
|
export const UpsellDialog: React.FC<UpsellDialogProps> = ({ isOpen, setIsOpen }) =>
|
|
isOpen
|
|
? <Modal
|
|
title=""
|
|
className="code-snippets-upsell-dialog"
|
|
onRequestClose={() => {
|
|
setIsOpen(false)
|
|
}}
|
|
>
|
|
<img
|
|
src={`${window.CODE_SNIPPETS?.urls.plugin}/assets/icon.svg`}
|
|
alt={__('Code Snippets logo', 'code-snippets')}
|
|
/>
|
|
|
|
<h1>
|
|
{createInterpolateElement(
|
|
__('Unlock all cloud sync features and many more, with <span>Code Snippets Pro</span>', 'code-snippets'),
|
|
{ span: <span /> }
|
|
)}
|
|
</h1>
|
|
|
|
<p>
|
|
{createInterpolateElement(
|
|
__('With Code Snippets Pro you can connect your WordPress sites to the code snippets cloud platform and be able to <strong>backup, synchronise, collaborate, and deploy</strong> your snippets from one central location.', 'code-snippets'),
|
|
{ strong: <strong /> }
|
|
)}
|
|
</p>
|
|
|
|
<a
|
|
href="https://codesnippets.pro/pricing/"
|
|
className="button button-primary button-large"
|
|
rel="noreferrer" target="_blank"
|
|
>
|
|
{__('Explore Code Snippets Pro', 'code-snippets')}
|
|
</a>
|
|
|
|
<h2>{__("Here's what else you get with Pro:", 'code-snippets')}</h2>
|
|
<ul>
|
|
<li>{__('Create, explain and verify snippets with AI', 'code-snippets')}</li>
|
|
<li>{__('Control when snippets run with Conditions', 'code-snippets')}</li>
|
|
<li>{__('CSS stylesheet snippets', 'code-snippets')}</li>
|
|
<li>{__('Minified JavaScript snippets', 'code-snippets')}</li>
|
|
<li>{__('Editor blocks and Elementor widgets', 'code-snippets')}</li>
|
|
<li>{__('Cloud sync and backup', 'code-snippets')}</li>
|
|
<li>{__('Cloud share and deploy', 'code-snippets')}</li>
|
|
<li>{__('Cloud bundles and teams', 'code-snippets')}</li>
|
|
<li>{__('WP-CLI commands', 'code-snippets')}</li>
|
|
<li>{__('And much more!', 'code-snippets')}</li>
|
|
</ul>
|
|
</Modal>
|
|
: null
|