Merge pull request #738 from tone-row/dev

v1.57.3

app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "app",
-  "version": "1.57.2",
+  "version": "1.57.3",
   "main": "module/module.js",
   "license": "MIT",
   "scripts": {

app/src/components/ConvertToFlowchart.tsx

@@ -15,6 +15,7 @@ import { AppContext } from "./AppContextProvider";
 import { isError } from "../lib/helpers";
 import { useHasProAccess } from "../lib/hooks";
 import { showPaywall } from "../lib/usePaywallModalStore";
+import { getAIPaywallCopy } from "../lib/getAIPaywallCopy.experiment";
 
 export function ConvertToFlowchart() {
   const convertIsRunning = usePromptStore((s) => s.isRunning);
@@ -33,6 +34,7 @@ export function ConvertToFlowchart() {
           content: t`Uh oh, you're out of free requests! Upgrade to Flowchart Fun Pro for unlimited diagram conversions, and keep transforming text into clear, visual flowcharts as easily as copy and paste.`,
           imgUrl: "/images/ai-convert.png",
           toPricingCode: "ConvertToFlowchart",
+          buttonText: getAIPaywallCopy(),
         });
       } else {
         if (error.message === RATE_LIMIT_EXCEEDED) {

app/src/index.css

@@ -320,7 +320,7 @@ and --mouse-x
 }
 
 .feature:nth-child(1) {
-  --hover-accent: theme("colors.purple.400");
+  --hover-accent: theme("colors.purple.300");
 }
 .feature:nth-child(2) {
   --hover-accent: theme("colors.green.300");
@@ -414,16 +414,6 @@ and --mouse-x
   background-origin: padding-box, padding-box, padding-box, padding-box;
   background-clip: border-box, border-box, border-box, border-box;
   background-position: 0px 0px;
-  animation: move-background 3s linear infinite;
-}
-
-@keyframes move-background {
-  0% {
-    background-position: 0px 0px;
-  }
-  100% {
-    background-position: -33px -5px;
-  }
 }
 
 body.dark .pricing-highlights {

app/src/lib/getAIPaywallCopy.experiment.ts

@@ -0,0 +1,33 @@
+import { t } from "@lingui/macro";
+import { posthog } from "posthog-js";
+
+type Variant =
+  | "unlimited-yearly"
+  | "join-creators"
+  | "boost-productivity"
+  | "anytime-yearly"
+  | "users-love"
+  | "unlock-unlimited";
+
+/**
+ * Returns the copy for the button on the AI paywall modal
+ */
+export function getAIPaywallCopy(): string | undefined {
+  const variant = posthog.getFeatureFlag(
+    "ai-paywall-copy-conversion"
+  ) as Variant;
+  switch (variant) {
+    case "unlimited-yearly":
+      return t`Unlimited AI Flowcharts: $2/mo (billed yearly)`;
+    case "join-creators":
+      return t`Join 5,000+ AI Flowchart Creators. $4/mo`;
+    case "boost-productivity":
+      return t`Unlimited AI Flowcharts - Boost Productivity Now`;
+    case "anytime-yearly":
+      return t`AI Flowcharts Anytime - $2/mo (billed yearly)`;
+    case "users-love":
+      return t`5,000+ Users Love AI Flowcharts - Join Now`;
+    case "unlock-unlimited":
+      return t`Unlock Unlimited AI Flowcharts`;
+  }
+}

app/src/locales/de/messages.po

@@ -17,6 +17,10 @@ msgstr ""
 msgid "1 Temporary Flowchart"
 msgstr "1 Vorläufiger Flussdiagramm"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:29
+msgid "5,000+ Users Love AI Flowcharts - Join Now"
+msgstr "Über 5.000 Benutzer lieben AI-Flussdiagramme - Treten Sie jetzt bei"
+
 #: src/components/Tabs/ThemeTab.tsx:611
 msgid "<0>Custom CSS Only</0> is enabled. Only the Layout and Advanced settings will be applied."
 msgstr "<0>Nur benutzerdefiniertes CSS</0> ist aktiviert. Nur die Layout- und Erweiterten Einstellungen werden angewandt."
@@ -41,6 +45,10 @@ msgstr "Eine neue Version der App ist verfügbar. Bitte neu laden, um zu aktuali
 msgid "AI Creation & Editing"
 msgstr "KI-Erstellung & Bearbeitung"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:27
+msgid "AI Flowcharts Anytime - $2/mo (billed yearly)"
+msgstr "AI-Flussdiagramme jederzeit verfügbar - $2/Monat (jährlich abgerechnet)"
+
 #: src/pages/Pricing2.tsx:61
 msgid "AI-Powered Flowchart Creation"
 msgstr "KI-unterstützte Erstellung von Flussdiagrammen"
@@ -320,7 +328,7 @@ msgstr "Weiter im Sandbox-Modus (wird täglich zurückgesetzt, Arbeit wird nicht
 msgid "Convert"
 msgstr "Umwandeln"
 
-#: src/components/ConvertToFlowchart.tsx:78
+#: src/components/ConvertToFlowchart.tsx:80
 msgid "Convert to Flowchart"
 msgstr "In Flussdiagramm konvertieren"
 
@@ -650,7 +658,7 @@ msgstr "Exportieren Sie nach PNG & JPG"
 msgid "Export to PNG, JPG, and SVG"
 msgstr "Exportieren Sie nach PNG, JPG und SVG"
 
-#: src/pages/Pricing2.tsx:266
+#: src/pages/Pricing2.tsx:263
 msgid "Feature Breakdown"
 msgstr "Funktionsübersicht"
 
@@ -836,6 +844,10 @@ msgstr "JSON Canvas ist eine JSON-Repräsentation Ihres Diagramms, die von <0>Ob
 msgid "Join 2000+ professionals who've upgraded their workflow"
 msgstr "Werden Sie Teil von über 2000 Fachleuten, die ihren Arbeitsablauf verbessert haben"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:23
+msgid "Join 5,000+ AI Flowchart Creators. $4/mo"
+msgstr "Treten Sie 5.000+ AI-Flussdiagramm-Erstellern bei. $4/Monat"
+
 #: src/pages/Pricing.tsx:37
 msgid "Keep Things Private"
 msgstr "Halte Dinge privat"
@@ -1183,7 +1195,7 @@ msgstr "Schnelle Vorlagen"
 msgid "Raster Export (PNG, JPG)"
 msgstr "Raster-Export (PNG, JPG)"
 
-#: src/components/ConvertToFlowchart.tsx:39
+#: src/components/ConvertToFlowchart.tsx:41
 #: src/lib/usePromptStore.ts:107
 msgid "Rate limit exceeded. Please try again later."
 msgstr "Die Rate-Limit wurde überschritten. Bitte versuchen Sie es später erneut."
@@ -1431,7 +1443,7 @@ msgstr "Mit Klassen gestalten"
 msgid "Submit"
 msgstr "Einsenden"
 
-#: src/pages/Pricing2.tsx:341
+#: src/pages/Pricing2.tsx:338
 msgid "Subscribe to Pro and flowchart the fun way!"
 msgstr "Abonniere Pro und erstelle Flussdiagramme auf unterhaltsame Weise!"
 
@@ -1609,11 +1621,11 @@ msgstr "Von oben nach unten"
 msgid "Transform Your Ideas into Professional Diagrams in Seconds"
 msgstr "Transformieren Sie Ihre Ideen in professionelle Diagramme in Sekunden"
 
-#: src/components/ConvertToFlowchart.tsx:32
+#: src/components/ConvertToFlowchart.tsx:33
 msgid "Transform text into diagrams instantly"
 msgstr "Verwandeln Sie Texte sofort in Diagramme"
 
-#: src/pages/Pricing2.tsx:241
+#: src/pages/Pricing2.tsx:238
 msgid "Trusted by Professionals and Academics"
 msgstr "Vertrauenswürdig von Profis und Akademikern"
 
@@ -1637,7 +1649,7 @@ msgstr "Zwei Kanten haben die gleiche ID"
 msgid "Two nodes have the same ID"
 msgstr "Zwei Knoten haben die gleiche ID"
 
-#: src/components/ConvertToFlowchart.tsx:33
+#: src/components/ConvertToFlowchart.tsx:34
 msgid "Uh oh, you're out of free requests! Upgrade to Flowchart Fun Pro for unlimited diagram conversions, and keep transforming text into clear, visual flowcharts as easily as copy and paste."
 msgstr "Oh oh, du hast keine kostenlosen Anfragen mehr! Upgrade auf Flowchart Fun Pro für unbegrenzte Diagramm-Konvertierungen und verwandle Text weiterhin mühelos in klare, visuelle Flussdiagramme wie durch Kopieren und Einfügen."
 
@@ -1657,6 +1669,14 @@ msgstr "Unbekannt"
 msgid "Unknown Parsing Error"
 msgstr "Unbekannter Parser-Fehler"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:25
+msgid "Unlimited AI Flowcharts - Boost Productivity Now"
+msgstr "Unbegrenzte AI-Flussdiagramme - Steigern Sie die Produktivität jetzt"
+
+#: src/lib/getAIPaywallCopy.experiment.ts:21
+msgid "Unlimited AI Flowcharts: $2/mo (billed yearly)"
+msgstr "Unbegrenzte AI-Flussdiagramme: $2/Monat (jährlich abgerechnet)"
+
 #: src/pages/Pricing.tsx:16
 msgid "Unlimited Flowcharts"
 msgstr "Unbegrenzte Flowcharts"
@@ -1674,6 +1694,10 @@ msgstr "Unbegrenzte in der Cloud gespeicherte Flussdiagramme"
 msgid "Unlock AI Features and never lose your work with a Pro account."
 msgstr "Entsperren Sie KI-Funktionen und verlieren Sie nie wieder Ihre Arbeit mit einem Pro-Konto."
 
+#: src/lib/getAIPaywallCopy.experiment.ts:31
+msgid "Unlock Unlimited AI Flowcharts"
+msgstr "Entsperren Sie unbegrenzte AI-Flussdiagramme"
+
 #: src/lib/hooks.ts:86
 msgid "Unpaid"
 msgstr "Unbezahlt"
@@ -1702,7 +1726,7 @@ msgstr "Upgrade auf Flowchart Fun Pro, um SVG-Export freizuschalten und mehr for
 msgid "Upgrade to Pro"
 msgstr "Auf Pro upgraden"
 
-#: src/pages/Pricing2.tsx:209
+#: src/pages/Pricing2.tsx:233
 msgid "Upgrade to Pro for $2/month"
 msgstr "Upgrade auf Pro für $2/Monat"
 

app/src/locales/en/messages.po

@@ -17,6 +17,10 @@ msgstr ""
 msgid "1 Temporary Flowchart"
 msgstr "1 Temporary Flowchart"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:29
+msgid "5,000+ Users Love AI Flowcharts - Join Now"
+msgstr "5,000+ Users Love AI Flowcharts - Join Now"
+
 #: src/components/Tabs/ThemeTab.tsx:611
 msgid "<0>Custom CSS Only</0> is enabled. Only the Layout and Advanced settings will be applied."
 msgstr "<0>Custom CSS Only</0> is enabled. Only the Layout and Advanced settings will be applied."
@@ -41,6 +45,10 @@ msgstr "A new version of the app is available. Please reload to update."
 msgid "AI Creation & Editing"
 msgstr "AI Creation & Editing"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:27
+msgid "AI Flowcharts Anytime - $2/mo (billed yearly)"
+msgstr "AI Flowcharts Anytime - $2/mo (billed yearly)"
+
 #: src/pages/Pricing2.tsx:61
 msgid "AI-Powered Flowchart Creation"
 msgstr "AI-Powered Flowchart Creation"
@@ -320,7 +328,7 @@ msgstr "Continue in Sandbox (Resets daily, work not saved)"
 msgid "Convert"
 msgstr "Convert"
 
-#: src/components/ConvertToFlowchart.tsx:78
+#: src/components/ConvertToFlowchart.tsx:80
 msgid "Convert to Flowchart"
 msgstr "Convert to Flowchart"
 
@@ -650,7 +658,7 @@ msgstr "Export to PNG & JPG"
 msgid "Export to PNG, JPG, and SVG"
 msgstr "Export to PNG, JPG, and SVG"
 
-#: src/pages/Pricing2.tsx:266
+#: src/pages/Pricing2.tsx:263
 msgid "Feature Breakdown"
 msgstr "Feature Breakdown"
 
@@ -836,6 +844,10 @@ msgstr "JSON Canvas is a JSON representation of your diagram used by <0>Obsidian
 msgid "Join 2000+ professionals who've upgraded their workflow"
 msgstr "Join 2000+ professionals who've upgraded their workflow"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:23
+msgid "Join 5,000+ AI Flowchart Creators. $4/mo"
+msgstr "Join 5,000+ AI Flowchart Creators. $4/mo"
+
 #: src/pages/Pricing.tsx:37
 msgid "Keep Things Private"
 msgstr "Keep Things Private"
@@ -1183,7 +1195,7 @@ msgstr "Rapid Templates"
 msgid "Raster Export (PNG, JPG)"
 msgstr "Raster Export (PNG, JPG)"
 
-#: src/components/ConvertToFlowchart.tsx:39
+#: src/components/ConvertToFlowchart.tsx:41
 #: src/lib/usePromptStore.ts:107
 msgid "Rate limit exceeded. Please try again later."
 msgstr "Rate limit exceeded. Please try again later."
@@ -1431,7 +1443,7 @@ msgstr "Style with classes"
 msgid "Submit"
 msgstr "Submit"
 
-#: src/pages/Pricing2.tsx:341
+#: src/pages/Pricing2.tsx:338
 msgid "Subscribe to Pro and flowchart the fun way!"
 msgstr "Subscribe to Pro and flowchart the fun way!"
 
@@ -1609,11 +1621,11 @@ msgstr "Top to Bottom"
 msgid "Transform Your Ideas into Professional Diagrams in Seconds"
 msgstr "Transform Your Ideas into Professional Diagrams in Seconds"
 
-#: src/components/ConvertToFlowchart.tsx:32
+#: src/components/ConvertToFlowchart.tsx:33
 msgid "Transform text into diagrams instantly"
 msgstr "Transform text into diagrams instantly"
 
-#: src/pages/Pricing2.tsx:241
+#: src/pages/Pricing2.tsx:238
 msgid "Trusted by Professionals and Academics"
 msgstr "Trusted by Professionals and Academics"
 
@@ -1637,7 +1649,7 @@ msgstr "Two edges have the same ID"
 msgid "Two nodes have the same ID"
 msgstr "Two nodes have the same ID"
 
-#: src/components/ConvertToFlowchart.tsx:33
+#: src/components/ConvertToFlowchart.tsx:34
 msgid "Uh oh, you're out of free requests! Upgrade to Flowchart Fun Pro for unlimited diagram conversions, and keep transforming text into clear, visual flowcharts as easily as copy and paste."
 msgstr "Uh oh, you're out of free requests! Upgrade to Flowchart Fun Pro for unlimited diagram conversions, and keep transforming text into clear, visual flowcharts as easily as copy and paste."
 
@@ -1657,6 +1669,14 @@ msgstr "Unknown"
 msgid "Unknown Parsing Error"
 msgstr "Unknown Parsing Error"
 
+#: src/lib/getAIPaywallCopy.experiment.ts:25
+msgid "Unlimited AI Flowcharts - Boost Productivity Now"
+msgstr "Unlimited AI Flowcharts - Boost Productivity Now"
+
+#: src/lib/getAIPaywallCopy.experiment.ts:21
+msgid "Unlimited AI Flowcharts: $2/mo (billed yearly)"
+msgstr "Unlimited AI Flowcharts: $2/mo (billed yearly)"
+
 #: src/pages/Pricing.tsx:16
 msgid "Unlimited Flowcharts"
 msgstr "Unlimited Flowcharts"
@@ -1674,6 +1694,10 @@ msgstr "Unlimited cloud-saved flowcharts"
 msgid "Unlock AI Features and never lose your work with a Pro account."
 msgstr "Unlock AI Features and never lose your work with a Pro account."
 
+#: src/lib/getAIPaywallCopy.experiment.ts:31
+msgid "Unlock Unlimited AI Flowcharts"
+msgstr "Unlock Unlimited AI Flowcharts"
+
 #: src/lib/hooks.ts:86
 msgid "Unpaid"
 msgstr "Unpaid"
@@ -1702,7 +1726,7 @@ msgstr "Upgrade to Flowchart Fun Pro to unlock SVG exports and enjoy more advanc
 msgid "Upgrade to Pro"
 msgstr "Upgrade to Pro"
 
-#: src/pages/Pricing2.tsx:209
+#: src/pages/Pricing2.tsx:233
 msgid "Upgrade to Pro for $2/month"
 msgstr "Upgrade to Pro for $2/month"