← All changes | js/components/common/UpsellBanner.tsx +11 -6 3.9.6 → trunk View file →

		@@ -1,21 +1,26 @@
1	1	import { ExternalLink } from '@wordpress/components'
2	2	import { createInterpolateElement } from '@wordpress/element'
3	3	import { __ } from '@wordpress/i18n'
4	4	import React, { useState } from 'react'
5		-import { isLicensed } from '../../utils/screen'
	5	+import { shouldShowUpsell } from '../../utils/screen'
6	6	import { Button } from './Button'
7	7
8	8	export const UpsellBanner = () => {
9	9	const [isDismissed, setIsDismissed] = useState(false)
10	10
11		- return isDismissed || isLicensed() || window.CODE_SNIPPETS_EDIT?.hideUpsell
	11	+ return isDismissed || !shouldShowUpsell()
12	12	? null
13		- : <div className="code-snippets-upsell-banner">
	13	+ : <div
	14	+ className="code-snippets-upsell-banner"
	15	+ aria-label={__('Upgrade to Code Snippets Pro', 'code-snippets')}
	16	+ role="region"
	17	+ >
14	18	<img
15	19	src={`${window.CODE_SNIPPETS?.urls.plugin}/assets/icon.svg`}
16	20	alt={__('Code Snippets logo', 'code-snippets')}
17	21	height="34"
	22	+ aria-hidden="true"
18	23	/>
19	24	<p>
20	25	{createInterpolateElement(
21	26	__('Unlock <strong>cloud sync, snippet conditions, AI features</strong> and much more with Code Snippets Pro.', 'code-snippets'),
		@@ -23,15 +28,15 @@
23	28	)}
24	29	</p>
25	30
26	31	<ExternalLink
27		- className="button button-primary button-large"
	32	+ className="button button-primary"
28	33	href="https://codesnippets.pro/pricing/"
29	34	>
30	35	{__('Get Started', 'code-snippets')}
31	36	</ExternalLink>
32	37
33		- <Button small link onClick={() => setIsDismissed(true)}>
34		- <span className="dashicons dashicons-no-alt"></span>
	38	+ <Button small link onClick={() => setIsDismissed(true)} aria-label={__('Dismiss upsell banner', 'code-snippets')}>
	39	+ <span className="dashicons dashicons-no-alt" aria-hidden="true"></span>
35	40	</Button>
36	41	</div>
37	42	}