| 1 |
import { __ } from "@wordpress/i18n"; |
| 2 |
import React from "react"; |
| 3 |
import { I } from "./common/icons"; |
| 4 |
import { cn, ProBadge } from "./common/ui"; |
| 5 |
|
| 6 |
/* Pro upgrade target — falls back to the public pricing page; if the host site |
| 7 |
localises a different URL (e.g. an affiliate link) we honour that. */ |
| 8 |
export function upgradeUrl() { |
| 9 |
return ( window.betterdocs_admin && window.betterdocs_admin.upgrade_url ) |
| 10 |
|| "https://betterdocs.co/dashboard-upgrade-to-pro"; |
| 11 |
} |
| 12 |
|
| 13 |
/* Pro teaser card body. Used as the content of a full-tab teaser (default) or |
| 14 |
as a `compact` variant slotted inside an existing card (e.g. Search Trends). */ |
| 15 |
export default function ProTeaser( { title, subtitle, feature, icon, compact = false } ) { |
| 16 |
const Icon = icon || I.Sparkle; |
| 17 |
return ( |
| 18 |
<div className={ cn( "bda-teaser", compact && "compact" ) }> |
| 19 |
{ feature && <ProBadge /> } |
| 20 |
<span className="bda-teaser-ico"><Icon size={ compact ? 18 : 22 } /></span> |
| 21 |
<h3 className="bda-teaser-title">{ title || __( "Available in BetterDocs Pro", "betterdocs" ) }</h3> |
| 22 |
{ subtitle && <p className="bda-teaser-sub">{ subtitle }</p> } |
| 23 |
<a className="bda-btn primary sm" href={ upgradeUrl() } target="_blank" rel="noopener noreferrer"> |
| 24 |
{ __( "Upgrade Now", "betterdocs" ) } <I.ArrowRight size={ 12 } /> |
| 25 |
</a> |
| 26 |
</div> |
| 27 |
); |
| 28 |
} |
| 29 |
|
