Up page (#107)

Author: artf

src/app/_components/Header/index.tsx

@@ -49,16 +49,16 @@ const Header: React.FC<HeaderProps> = ({ isHome, className, ...rest }) => {
       <div className="w-full border-b border-white/15 bg-gradient-to-r from-[#7b2d8e] via-[#973aa8] to-[#7b2d8e] text-white">
         <div className="mx-auto flex w-full max-w-[1150px] items-center justify-center gap-2 px-4 py-2.5 text-[12px] font-medium leading-5 sm:px-5 sm:text-sm">
           <span className="truncate">
-            ✨ <b>AI Chat Plugin is here!</b> Build AI agents that edit your
-            projects.
+            ✨ <b>New:</b> Open Studio directly inside ChatGPT and keep editing
+            without leaving the conversation.
           </span>
           <a
-            href="https://app.grapesjs.com/docs-sdk/plugins/ai/overview"
+            href={urls.getChatGptAppUrl()}
             target="_blank"
             rel="noopener noreferrer"
             className="shrink-0 font-semibold text-purple-200 transition-colors hover:text-white"
           >
-            View Docs -&gt;
+            Open App -&gt;
           </a>
         </div>
       </div>

src/app/sdk/SdkPage.tsx

@@ -79,9 +79,6 @@ export default function SDKPage() {
             Embed an AI-powered visual editor in your app.
           </h1>
           <p className={cn(styles.p)}>
-            White-label, no-code editor that integrates seamlessly into your
-            stack.
-            <br />
             Build with AI, drag & drop, or code.
             <br />
             For <b className="text-white">Newsletters</b>,{" "}
@@ -95,7 +92,7 @@ export default function SDKPage() {
               href={urls.getSdkLicensesUrl({ ref: "heroAccount" })}
               variant="tertiary"
             >
-              Get License
+              Get a License
             </CTALink>
           </div>
 
@@ -207,7 +204,7 @@ export default function SDKPage() {
             href={urls.getSdkLicensesUrl({ ref: "featuresCta" })}
             className="my-10"
           >
-            Start Now<span className="font-[400]"> - It's free</span>
+            Get a License
           </CTALink>
 
           <section className={styles.card}>
@@ -468,7 +465,7 @@ export default function SDKPage() {
             Join the thousands of companies & developers using our editor today
           </p>
           <CTALink href={urls.getSdkLicensesUrl({ ref: "preSponsorCta" })}>
-            Get Started for Free
+            Get a License
           </CTALink>
         </section>
 

src/app/sdk/email/page.tsx

@@ -115,7 +115,7 @@ export default function EmailSDKPage() {
                 href={urls.getSdkLicensesUrl({ ref: "emailHeroCta" })}
                 className="inline-block px-8 py-4 bg-violet-600 text-white font-semibold rounded-lg hover:bg-violet-700 transition-colors duration-200 text-lg"
               >
-                Get Started for Free
+                Get a License
               </a>
               <a
                 href={urls.getGettingStartedDocsUrl()}
@@ -362,7 +362,7 @@ export default function EmailSDKPage() {
                 href={urls.getSdkLicensesUrl({ ref: "emailCta" })}
                 className="inline-block px-8 py-4 bg-violet-600 text-white font-semibold rounded-lg hover:bg-violet-700 transition-colors duration-200 text-lg"
               >
-                Get Started for Free
+                Get a License
               </a>
               <a
                 href={urls.getContactUsUrl()}
@@ -381,4 +381,3 @@ export default function EmailSDKPage() {
     </div>
   );
 }
-

src/app/sdk/pricing/sdkPricingData.tsx

@@ -135,7 +135,7 @@ export const sdkPricingPlans: SdkPricingPlan[] = [
     description: "Free access. Forever",
     preList: "All basic features",
     cta: {
-      label: "Try Now",
+      label: "Get a License",
       href: urls.getSdkLicensesUrl({ plan: "free" }),
     },
     cardFeatures: [
@@ -175,7 +175,7 @@ export const sdkPricingPlans: SdkPricingPlan[] = [
     priceSuffix: { monthly: "/month", annual: "/year" },
     includes: "free",
     cta: {
-      label: "Get This Plan",
+      label: "Get a License",
       href: urls.getSdkLicensesUrl({ plan: "startup" }),
     },
     cardFeatures: [
@@ -215,7 +215,7 @@ export const sdkPricingPlans: SdkPricingPlan[] = [
     priceSuffix: { monthly: "/month", annual: "/year" },
     includes: "startup",
     cta: {
-      label: "Get This Plan",
+      label: "Get a License",
       href: urls.getSdkLicensesUrl({ plan: "business" }),
     },
     cardFeatures: [

src/lib/urls.ts

@@ -14,12 +14,14 @@ const getRef = ({ ref, plan }: UrlProps = {}) =>
   ref
     ? `&utm_medium=${ref}`
     : plan
-    ? `&utm_medium=ctaSdkPlan${toCapitalCase(plan)}`
-    : "";
+      ? `&utm_medium=ctaSdkPlan${toCapitalCase(plan)}`
+      : "";
 
 const urls = {
   getGettingStartedDocsUrl: () =>
     `${APP_URL}/docs-sdk/overview/getting-started?${UTM_PARAMS}&utm_medium=docsHeader`,
+  getChatGptAppUrl: () =>
+    "https://chatgpt.com/apps/grapes-studio/asdk_app_69dd38930d64819196c02d0f9db061b5",
   getGrapesJsDocs: () => `${SITE_URL}/docs/?${UTM_PARAMS}`,
   getStudioEditorUrl: () =>
     `${APP_URL}/playground?${UTM_PARAMS}&utm_medium=tryEditor`,