Files
OpenFrame/components/layout/trial-banner.tsx
T
yusufipk 39e81042bb feat(billing): let people try the product before handing over a card
The trial now starts inside the product, at email verification, and Stripe
grants none at all: checkout creates a subscription that bills immediately.
Verifying an address is what buys the seven days, which is also the cheapest
abuse control there is.

An unexpired trial is treated as an entitlement the account already holds, so a
Stripe sync can add access but never retracts a trial that has not run out. That
matters most for the abandoned checkout: the resulting incomplete subscription
carries no trial_end, and writing it through would have erased the days the
account still had and locked it out.

Unpaid accounts are bounded by what they can cost us rather than by what they
can do: one workspace, one project, 3 GiB of direct uploads. YouTube imports,
share links, guests, comments and approvals stay unlimited, because those are
the parts worth trying and they cost nothing. isPaidTier() is the new seam;
hasBillingAccess() answers a different question now that access no longer
implies a card.

Signup CTAs, the pricing card, the comparison pages, the terms and the refund
policy all said the trial converts to a paid plan by itself. It no longer does,
so they say what happens instead. Settings and a banner name both dates that
matter: when the trial ends, and the fifteen days after that during which
nothing is deleted.

/admin/growth compares the two funnels on signup to paid within a fixed 30 day
window, not trial to paid. Dropping the card requirement multiplies trials, so
the old ratio can fall while more people actually pay, and reading it that way
would retire the change for the wrong reason.
2026-08-05 19:40:36 +03:00

46 lines
1.6 KiB
TypeScript

import Link from 'next/link';
import type { TrialNotice } from '@/lib/billing';
function formatDate(value: Date) {
return value.toLocaleDateString('en-US', { month: 'long', day: 'numeric' });
}
/**
* The trial deadline, said once at the top of the app.
*
* The `ended` case is the one that matters: access stops at the trial's end date
* but nothing is deleted for another fifteen days, and an account that is not
* told this reads a locked workspace as lost work. So the deletion date is
* stated as reassurance rather than as a threat.
*/
export function TrialBanner({ notice }: { notice: TrialNotice }) {
const isEnded = notice.kind === 'ended';
return (
<div
className={
isEnded
? 'border-b border-amber-500/30 bg-amber-500/10 px-4 py-2 text-sm text-amber-800 dark:text-amber-300'
: 'border-b border-primary/30 bg-primary/5 px-4 py-2 text-sm text-foreground'
}
>
<div className="mx-auto flex max-w-7xl flex-wrap items-center gap-x-2 gap-y-1">
<span>
{isEnded
? `Your free trial ended on ${formatDate(notice.endsAt)}.`
: `Your free trial ends on ${formatDate(notice.endsAt)}.`}
</span>
{notice.contentKeptUntil ? (
<span className="text-muted-foreground">
Nothing has been deleted. Your projects and media are kept until{' '}
{formatDate(notice.contentKeptUntil)}.
</span>
) : null}
<Link href="/settings" className="font-medium underline underline-offset-4">
{isEnded ? 'Subscribe to pick up where you left off' : 'See plan'}
</Link>
</div>
</div>
);
}