From 56fa9baac089e968bcdc95e90f5bf4cac98d4bb2 Mon Sep 17 00:00:00 2001 From: ComputelessComputer Date: Fri, 27 Mar 2026 20:03:22 -0700 Subject: [PATCH 1/3] fix: align pricing page tier messaging --- apps/web/src/routes/_view/pricing.tsx | 124 +++++++++++--------------- 1 file changed, 53 insertions(+), 71 deletions(-) diff --git a/apps/web/src/routes/_view/pricing.tsx b/apps/web/src/routes/_view/pricing.tsx index 1cdbea56ab..27f9bbe895 100644 --- a/apps/web/src/routes/_view/pricing.tsx +++ b/apps/web/src/routes/_view/pricing.tsx @@ -1,5 +1,5 @@ import { createFileRoute, Link } from "@tanstack/react-router"; -import { CheckCircle2, MinusCircle, XCircle } from "lucide-react"; +import { CheckCircle2, Construction, XCircle } from "lucide-react"; import { cn } from "@hypr/utils"; @@ -19,8 +19,6 @@ interface PricingPlan { label: string; included: boolean | "partial"; tooltip?: string; - comingSoon?: boolean; - partiallyImplemented?: boolean; }>; } @@ -33,27 +31,22 @@ const pricingPlans: PricingPlan[] = [ features: [ { label: "On-device Transcription", included: true }, { label: "Save Audio Recordings", included: true }, - { label: "Audio Player with Transcript Tracking", included: true }, - { label: "Bring Your Own Key (STT & LLM)", included: true }, - { label: "Export to PDF, TXT, Markdown", included: true }, + { label: "Audio Player", included: true }, + { label: "Bring Your Own Key", included: true }, + { label: "Export to various formats", included: true }, { - label: "Local-first Data Architecture", + label: "Custom Default Folder", included: true, - tooltip: - "Filesystem-based by default: notes and transcripts are stored on your device first.", - }, - { - label: "Custom Content Base Location", - included: true, - tooltip: "Move your default content folder to any location you prefer.", + tooltip: "Move your default folder location to anywhere you prefer.", }, - { label: "Templates", included: true }, - { label: "Shortcuts", included: true }, { label: "Chat", included: true }, - { label: "Integrations", included: false }, + { label: "Contacts view", included: true }, + { label: "Calendar view", included: true }, + { label: "Transcript Editor", included: "partial" }, + { label: "Templates", included: "partial" }, + { label: "Shortcuts", included: "partial" }, { label: "Cloud Services (STT & LLM)", included: false }, - { label: "Cloud Sync", included: false }, - { label: "Shareable Links", included: false }, + { label: "Speaker Identification", included: false }, ], }, { @@ -63,17 +56,15 @@ const pricingPlans: PricingPlan[] = [ yearly: null, }, description: - "Cloud AI without the complexity. No API keys needed — just sign in and go.", + "Unlimited cloud transcription and AI models without the complexity. No API keys needed — just sign in and go.", features: [ { label: "Everything in Free", included: true }, { label: "Cloud Services (STT & LLM)", included: true }, - { - label: "Integrations", - included: true, - tooltip: - "Google Calendar is available now. Additional integrations are in progress.", - }, + { label: "Speaker Identification", included: "partial" }, + { label: "Change Playback Rates", included: false }, + { label: "Integrations", included: false }, { label: "Advanced Templates", included: false }, + { label: "Folders view", included: false }, { label: "Cloud Sync", included: false }, { label: "Shareable Links", included: false }, ], @@ -85,35 +76,33 @@ const pricingPlans: PricingPlan[] = [ yearly: 250, }, description: - "No API keys needed. Get cloud services, advanced sharing, and team features out of the box.", + "Everything in Lite, plus advanced sharing and team features out of the box.", popular: true, features: [ - { label: "Everything in Free", included: true }, - { label: "Audio Player with Playback Rates", included: true }, - { - label: "Speaker Identification", - included: "partial", - partiallyImplemented: true, - }, - { label: "Advanced Templates", included: true }, + { label: "Everything in Lite", included: true }, + { label: "Change Playback Rates", included: true }, { label: "Integrations", included: true, tooltip: "Google Calendar is available now. Additional integrations are in progress.", }, - { label: "Cloud Services (STT & LLM)", included: true }, + { label: "Advanced Templates", included: "partial" }, + { label: "Folders view", included: "partial" }, + { + label: "Connect to OpenClaw", + included: "partial", + tooltip: "Select which notes to sync", + }, { label: "Cloud Sync", - included: true, + included: "partial", tooltip: "Select which notes to sync", - comingSoon: true, }, { label: "Shareable Links", - included: true, + included: "partial", tooltip: "DocSend-like: view tracking, expiration, revocation", - comingSoon: true, }, ], }, @@ -200,17 +189,18 @@ function PricingCard({ plan }: { plan: PricingPlan }) { ${plan.price.monthly} /month + {plan.price.yearly != null ? ( + + or ${plan.price.yearly}/year + + ) : null} - {plan.price.yearly != null ? ( -
- or ${plan.price.yearly}/year -
- ) : ( -
Monthly only
- )} ) : ( -
Free
+
+ $0 + per month +
)} @@ -221,11 +211,19 @@ function PricingCard({ plan }: { plan: PricingPlan }) { feature.included === true ? CheckCircle2 : feature.included === "partial" - ? MinusCircle + ? Construction : XCircle; + const hoverTitle = + feature.included === "partial" + ? "Currently in development" + : undefined; return ( -
+
@@ -241,29 +239,13 @@ function PricingCard({ plan }: { plan: PricingPlan }) { {feature.label} - {(feature.comingSoon || feature.partiallyImplemented) && ( - - {feature.partiallyImplemented - ? "Partially Implemented" - : "Coming Soon"} - - )}
{feature.tooltip && (
@@ -330,7 +312,7 @@ function FAQSection() { { question: "What value does an account unlock?", answer: - "An account unlocks Char's cloud layer: powerful AI models, sync across devices, personalization, and integrations that streamline your workflow.", + "A paid plan unlocks Char's cloud layer. Lite gives you hosted transcription, speaker identification, and language models, while Pro adds advanced templates, integrations, sync across devices, and shareable links.", }, { question: "What's included in shareable links?", From 5e9ef6b9691e3312450959873d97ae4ac173d4f2 Mon Sep 17 00:00:00 2001 From: ComputelessComputer Date: Fri, 27 Mar 2026 20:03:32 -0700 Subject: [PATCH 2/3] fix: sync shared tier pricing surfaces --- apps/desktop/src/settings/general/account.tsx | 78 ++++++++++++------- packages/pricing/src/plan-grid.tsx | 57 ++++++++++---- packages/pricing/src/tiers.ts | 55 +++++++++---- 3 files changed, 130 insertions(+), 60 deletions(-) diff --git a/apps/desktop/src/settings/general/account.tsx b/apps/desktop/src/settings/general/account.tsx index a8c8481bf7..ed969fef27 100644 --- a/apps/desktop/src/settings/general/account.tsx +++ b/apps/desktop/src/settings/general/account.tsx @@ -1,6 +1,7 @@ import { useMutation, useQuery } from "@tanstack/react-query"; import { CheckCircle2, + Construction, Puzzle, RefreshCw, Sparkle, @@ -41,10 +42,10 @@ import * as settings from "~/store/tinybase/store/settings"; const WEB_APP_BASE_URL = env.VITE_APP_URL ?? "http://localhost:3000"; const ACCOUNT_FEATURES = [ { - label: "Pro AI models", + label: "Cloud Services", icon: Sparkle, - comingSoon: false, - benefit: "Use premium hosted models without managing API keys.", + benefit: + "Get hosted transcription and language models without managing API keys.", accent: { icon: "text-blue-900", label: "text-blue-950", @@ -53,7 +54,6 @@ const ACCOUNT_FEATURES = [ { label: "Integrations", icon: Puzzle, - comingSoon: true, benefit: "Connect tools and pull context into Char with less busywork.", accent: { icon: "text-purple-700", @@ -151,8 +151,8 @@ export function SettingsAccount() {

Sign in to Char

- Sign in to unlock powerful AI models, sync across devices, - personalization, and workflow integrations. + Sign in to unlock cloud transcription and AI models, plus Pro + features like integrations and sharing.
- {tier.features.map((f) => ( -
- - {f} -
- ))} - {tier.notIncluded.map((f) => ( -
- - {f} -
- ))} + {tier.features.map((feature) => { + const Icon = + feature.included === true + ? CheckCircle2 + : feature.included === "partial" + ? Construction + : XCircle; + const hoverTitle = + feature.included === "partial" + ? "Currently in development" + : undefined; + + return ( +
+ + + {feature.label} + +
+ ); + })}
{renderAction(action, false)}
@@ -555,13 +584,7 @@ function FeatureSpotlight() { return () => window.clearInterval(interval); }, [isPaused]); - const { - label, - icon: Icon, - comingSoon, - benefit, - accent, - } = ACCOUNT_FEATURES[activeIndex]; + const { label, icon: Icon, benefit, accent } = ACCOUNT_FEATURES[activeIndex]; return (
@@ -632,9 +655,6 @@ function FeatureSpotlight() {

{label}

- {comingSoon ? ( - Soon - ) : null}

{benefit} diff --git a/packages/pricing/src/plan-grid.tsx b/packages/pricing/src/plan-grid.tsx index 6b353ace18..64ae8d769e 100644 --- a/packages/pricing/src/plan-grid.tsx +++ b/packages/pricing/src/plan-grid.tsx @@ -1,4 +1,4 @@ -import { CheckCircle2, XCircle } from "lucide-react"; +import { CheckCircle2, Construction, XCircle } from "lucide-react"; import type { ReactNode } from "react"; import { cn } from "@hypr/utils"; @@ -73,7 +73,7 @@ export function PlanGrid({ {tier.price} {tier.period && ( - + {tier.period} )} @@ -85,18 +85,47 @@ export function PlanGrid({

- {tier.features.map((f) => ( -
- - {f} -
- ))} - {tier.notIncluded.map((f) => ( -
- - {f} -
- ))} + {tier.features.map((feature) => { + const Icon = + feature.included === true + ? CheckCircle2 + : feature.included === "partial" + ? Construction + : XCircle; + const hoverTitle = + feature.included === "partial" + ? "Currently in development" + : undefined; + + return ( +
+ + + {feature.label} + +
+ ); + })}
{renderAction(tier, action)}
diff --git a/packages/pricing/src/tiers.ts b/packages/pricing/src/tiers.ts index d338c6e4ef..bbe1cfdf3a 100644 --- a/packages/pricing/src/tiers.ts +++ b/packages/pricing/src/tiers.ts @@ -15,8 +15,10 @@ export interface PlanTierData { price: string; period: string; subtitle: string | null; - features: string[]; - notIncluded: string[]; + features: Array<{ + label: string; + included: boolean | "partial"; + }>; } export const PLAN_TIERS: PlanTierData[] = [ @@ -24,35 +26,54 @@ export const PLAN_TIERS: PlanTierData[] = [ id: "free", name: "Free", price: "$0", - period: "", + period: "per month", subtitle: null, - features: ["On-device transcription", "Bring your own API keys", "Export"], - notIncluded: ["Cloud AI", "Integrations"], + features: [ + { label: "On-device Transcription", included: true }, + { label: "Save Audio Recordings", included: true }, + { label: "Audio Player", included: true }, + { label: "Bring Your Own Key", included: true }, + { label: "Export to various formats", included: true }, + { label: "Local-first", included: true }, + { label: "Custom Default Folder", included: true }, + { label: "Templates", included: true }, + { label: "Shortcuts", included: true }, + { label: "Chat", included: true }, + { label: "Integrations", included: false }, + { label: "Cloud Services (STT & LLM)", included: false }, + { label: "Cloud Sync", included: false }, + { label: "Shareable Links", included: false }, + ], }, { id: "lite", name: "Lite", price: "$8", - period: "/mo", - subtitle: "Monthly only", - features: ["Everything in Free", "Cloud AI (STT & LLM)", "Integrations"], - notIncluded: ["Advanced templates", "Cloud sync"], + period: "/month", + subtitle: null, + features: [ + { label: "Everything in Free", included: true }, + { label: "Cloud Services (STT & LLM)", included: true }, + { label: "Speaker Identification", included: "partial" }, + { label: "Advanced Templates", included: false }, + { label: "Cloud Sync", included: false }, + { label: "Shareable Links", included: false }, + ], }, { id: "pro", name: "Pro", price: "$25", - period: "/mo", + period: "/month", subtitle: "or $250/year", features: [ - "Everything in Free", - "Cloud AI (STT & LLM)", - "Advanced templates", - "Integrations", - "Cloud sync", - "Shareable links", + { label: "Everything in Lite", included: true }, + { label: "Change Playback Rates", included: true }, + { label: "Advanced Templates", included: true }, + { label: "Integrations", included: true }, + { label: "Cloud Sync", included: "partial" }, + { label: "Shareable Links", included: "partial" }, ], - notIncluded: [], }, ]; From 7bbdd03de739bede0c43bd9c1b29d8298da45138 Mon Sep 17 00:00:00 2001 From: ComputelessComputer Date: Fri, 27 Mar 2026 20:10:19 -0700 Subject: [PATCH 3/3] fix: capitalize feature names in pricing page --- apps/web/src/routes/_view/pricing.tsx | 10 +++++----- packages/pricing/src/tiers.ts | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/apps/web/src/routes/_view/pricing.tsx b/apps/web/src/routes/_view/pricing.tsx index 27f9bbe895..95f9056d8c 100644 --- a/apps/web/src/routes/_view/pricing.tsx +++ b/apps/web/src/routes/_view/pricing.tsx @@ -33,15 +33,15 @@ const pricingPlans: PricingPlan[] = [ { label: "Save Audio Recordings", included: true }, { label: "Audio Player", included: true }, { label: "Bring Your Own Key", included: true }, - { label: "Export to various formats", included: true }, + { label: "Export to Various Formats", included: true }, { label: "Custom Default Folder", included: true, tooltip: "Move your default folder location to anywhere you prefer.", }, { label: "Chat", included: true }, - { label: "Contacts view", included: true }, - { label: "Calendar view", included: true }, + { label: "Contacts View", included: true }, + { label: "Calendar View", included: true }, { label: "Transcript Editor", included: "partial" }, { label: "Templates", included: "partial" }, { label: "Shortcuts", included: "partial" }, @@ -64,7 +64,7 @@ const pricingPlans: PricingPlan[] = [ { label: "Change Playback Rates", included: false }, { label: "Integrations", included: false }, { label: "Advanced Templates", included: false }, - { label: "Folders view", included: false }, + { label: "Folders View", included: false }, { label: "Cloud Sync", included: false }, { label: "Shareable Links", included: false }, ], @@ -88,7 +88,7 @@ const pricingPlans: PricingPlan[] = [ "Google Calendar is available now. Additional integrations are in progress.", }, { label: "Advanced Templates", included: "partial" }, - { label: "Folders view", included: "partial" }, + { label: "Folders View", included: "partial" }, { label: "Connect to OpenClaw", included: "partial", diff --git a/packages/pricing/src/tiers.ts b/packages/pricing/src/tiers.ts index bbe1cfdf3a..54d654c3a4 100644 --- a/packages/pricing/src/tiers.ts +++ b/packages/pricing/src/tiers.ts @@ -33,7 +33,7 @@ export const PLAN_TIERS: PlanTierData[] = [ { label: "Save Audio Recordings", included: true }, { label: "Audio Player", included: true }, { label: "Bring Your Own Key", included: true }, - { label: "Export to various formats", included: true }, + { label: "Export to Various Formats", included: true }, { label: "Local-first", included: true }, { label: "Custom Default Folder", included: true }, { label: "Templates", included: true },