diff --git a/docusaurus.config.js b/docusaurus.config.js index 69b3ae9..5e9c89b 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -60,17 +60,6 @@ const config = { return postcssOptions; }, }), - () => ({ - name: "lemonsqueezy-script", - injectHtmlTags() { - return { - postBodyTags: [ - ` -`, - ], - }; - }, - }), // [ // "@docusaurus/plugin-content-docs", // { diff --git a/src/pages/pricing.tsx b/src/pages/pricing.tsx index db0f773..835ea77 100644 --- a/src/pages/pricing.tsx +++ b/src/pages/pricing.tsx @@ -2,14 +2,34 @@ import Link from "@docusaurus/Link"; import Layout from "@theme/Layout"; import React, { ReactNode, useEffect, useState } from "react"; +// TODO: const PORTAL_URL = "https://my.easypanel.io"; +const PORTAL_URL = "http://localhost:3002"; + export default function Page(): JSX.Element { + const [licenseKey, setLicenseKey] = useState(null); + + useEffect(() => { + const handler = (event: MessageEvent) => { + if (event.data?.type === "ep_license_key" && event.data?.key) { + setLicenseKey(event.data.key); + (event.source as Window)?.close(); + } + }; + window.addEventListener("message", handler); + return () => window.removeEventListener("message", handler); + }, []); + return ( - - + {licenseKey ? : ( + <> + + + + )} ); } @@ -44,7 +64,7 @@ const Feature = ({ className={[ "tw-ml-2 tw-text-base tw-font-normal tw-text-white", underline && - "tw-border-0 tw-border-b-2 tw-border-solid tw-border-emerald-700", + "tw-border-0 tw-border-b-2 tw-border-solid tw-border-emerald-700", ] .filter(Boolean) .join(" ")} @@ -153,9 +173,6 @@ const Pricing = () => {
- -
-
-
- Buy Your License -
-
- +
@@ -210,9 +211,6 @@ const Pricing = () => {
    - {/* - 5 licenses - */} Unlimited projects Unlimited services Unlimited deployments @@ -226,19 +224,7 @@ const Pricing = () => {
- -
-
- Buy Your License -
-
- +
@@ -255,9 +241,6 @@ const Pricing = () => { / month

- {/*

- $65 billed anually -

*/}

Get dedicated support for your amazing company

@@ -265,9 +248,6 @@ const Pricing = () => {
    - {/* - 10 licenses - */} Unlimited projects Unlimited services Unlimited deployments @@ -284,23 +264,7 @@ const Pricing = () => {
- -
-
-
- Buy Your License -
-
- + @@ -308,6 +272,88 @@ const Pricing = () => { ); }; +function ThankYou({ licenseKey }: { licenseKey: string }) { + const [copied, setCopied] = useState(false); + + const handleCopy = () => { + navigator.clipboard.writeText(licenseKey); + setCopied(true); + setTimeout(() => setCopied(false), 2000); + }; + + return ( +
+
+
+ + + +
+ +

+ Thank you for your purchase! +

+

+ Your license key is ready. Copy it and paste it in your Easypanel settings. +

+ +
+

Your license key

+ + {licenseKey} + + +
+ +

+ Go to your Easypanel dashboard → Settings → License and paste the key to activate. +

+
+
+ ); +} + +function BuyButton({ plan, interval, popular }: { plan: string; interval: string; popular?: boolean }) { + const handleClick = () => { + const url = `${PORTAL_URL}/checkout/start?plan=${encodeURIComponent(plan)}&interval=${encodeURIComponent(interval)}`; + const popup = window.open(url, "easypanel_checkout"); + if (!popup) { + alert("Popup blocked. Please allow popups for this site and try again."); + return; + } + }; + + if (popular) { + return ( + + ); + } + + return ( + + ); +} + const faqItems = [ { question: "What is a license?", @@ -327,17 +373,12 @@ const faqItems = [ { question: "What payment options do you have?", answer: - "Our payments are processed by LemonSqueezy. They support cards (including Mastercard, Visa, Maestro, American Express, Discover, Diners Club, JCB, UnionPay, and Mada), PayPal, and others.", + "Our payments are processed by Creem. They support cards (including Mastercard, Visa, American Express), and others.", }, { question: "What happens if I cancel my subscription?", answer: "Don't worry, Easypanel will continue to work on the free plan.", }, - // { - // question: "I need more than 10 licenses. What do I do?", - // answer: - // "Send us an email at support@easypanel.io and we'll tailor a plan for you.", - // }, { question: "What kind of support do I get for the business plan?", answer: diff --git a/static/pricing-new.json b/static/pricing-new.json new file mode 100644 index 0000000..b2e0bcf --- /dev/null +++ b/static/pricing-new.json @@ -0,0 +1,71 @@ +{ + "plans": [ + { + "name": "Hobby", + "description": "Move to the next level with your one-person operation", + "monthly": { + "pricePerMonth": 14.9 + }, + "yearly": { + "pricePerMonth": 10.9 + }, + "features": [ + "Unlimited projects", + "Unlimited services", + "Unlimited deployments", + "Basic Monitoring", + "Advanced Monitoring", + "Notifications", + "Database Backups", + "Custom Service Domain" + ] + }, + { + "name": "Growth", + "description": "Bring your whole team on board and work together", + "monthly": { + "pricePerMonth": 23.9 + }, + "yearly": { + "pricePerMonth": 16.9 + }, + "features": [ + "Unlimited projects", + "Unlimited services", + "Unlimited deployments", + "Basic Monitoring", + "Advanced Monitoring", + "Notifications", + "Database Backups", + "Custom Service Domain", + "Multiple users", + "Access control" + ] + }, + { + "name": "Business", + "description": "Get dedicated support for your amazing company", + "monthly": { + "pricePerMonth": 37.9 + }, + "yearly": { + "pricePerMonth": 29.9 + }, + "features": [ + "Unlimited projects", + "Unlimited services", + "Unlimited deployments", + "Basic Monitoring", + "Advanced Monitoring", + "Notifications", + "Database backups", + "Custom Service Domain", + "Multiple users", + "Access control", + "Cluster support (alpha)", + "White-labeling", + "Priority support" + ] + } + ] +}