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.
This commit is contained in:
yusufipk
2026-08-05 19:40:36 +03:00
parent b8d68a9196
commit 39e81042bb
34 changed files with 1541 additions and 134 deletions
+8 -4
View File
@@ -1,16 +1,20 @@
import { Header } from '@/components/layout';
import { Header, TrialBanner } from '@/components/layout';
import { auth } from '@/lib/auth';
import { hasAppNavigationAccess } from '@/lib/route-access';
import { getTrialNotice } from '@/lib/billing';
export default async function DashboardLayout({ children }: { children: React.ReactNode }) {
const session = await auth();
const showAppNavigation = session?.user?.id
? await hasAppNavigationAccess(session.user.id)
: false;
const userId = session?.user?.id;
const [showAppNavigation, trialNotice] = await Promise.all([
userId ? hasAppNavigationAccess(userId) : false,
userId ? getTrialNotice(userId) : null,
]);
return (
<div className="relative flex min-h-screen flex-col">
<Header user={session?.user ?? null} showAppNavigation={showAppNavigation} />
{trialNotice ? <TrialBanner notice={trialNotice} /> : null}
<main className="flex-1">{children}</main>
</div>
);
@@ -56,7 +56,7 @@ interface BillingOverview {
hasRecoverableSubscription: boolean;
hasActiveTrial: boolean;
hasBillingAccess: boolean;
isTrialEligible: boolean;
isPaid: boolean;
priceId: string | null;
currentPeriodEnd: string | null;
cancelAtPeriodEnd: boolean;
@@ -365,14 +365,17 @@ export default function SettingsPage({ billingOnly = false }: { billingOnly?: bo
) : (
<>
{!billing.subscription.hasActiveSubscription &&
!billing.subscription.hasActiveTrial &&
billing.subscription.isTrialEligible &&
billing.checkoutAvailable ? (
billing.subscription.hasActiveTrial &&
billing.subscription.trialEndsAt ? (
<div className="rounded-md border border-primary/30 bg-primary/5 p-4 space-y-2">
<p className="text-sm font-semibold">Start your 7-day free trial</p>
<p className="text-sm font-semibold">
Your free trial runs until{' '}
{new Date(billing.subscription.trialEndsAt).toLocaleDateString()}
</p>
<p className="text-sm text-muted-foreground">
Get full access to all features no charge until the trial ends. Cancel
anytime.
Every feature is on and no card is on file. The trial covers one workspace and
one project. Subscribing starts your paid month straight away, so there is no
reason to do it before you are ready.
</p>
</div>
) : null}
@@ -388,10 +391,8 @@ export default function SettingsPage({ billingOnly = false }: { billingOnly?: bo
: 'Subscription canceled. Access remains active until the end of the current billing period.'
: 'Paid account with workspace creation unlocked.'
: billing.subscription.hasActiveTrial
? 'Trial access is active.'
: billing.subscription.isTrialEligible
? "You haven't started your free trial yet."
: 'Billing access has ended.'}
? 'Free trial, no card required.'
: 'Billing access has ended.'}
</p>
</div>
<Badge
@@ -433,13 +434,15 @@ export default function SettingsPage({ billingOnly = false }: { billingOnly?: bo
</p>
) : null}
{/* Deliberately not conditioned on `billingAccessEndedAt`: an account that
only ever had the cardless trial never gets one written, and it is exactly
that account which most needs to be told its work is still recoverable. */}
{!billing.subscription.hasBillingAccess &&
billing.subscription.billingAccessEndedAt &&
billing.subscription.storageCleanupEligibleAt ? (
<p className="text-sm text-amber-700 dark:text-amber-400">
Stored media cleanup is scheduled after{' '}
{new Date(billing.subscription.storageCleanupEligibleAt).toLocaleDateString()}{' '}
unless billing is restored first.
Nothing has been deleted. Your projects and media are kept until{' '}
{new Date(billing.subscription.storageCleanupEligibleAt).toLocaleDateString()};
subscribe before then and everything is where you left it.
</p>
) : null}
@@ -479,8 +482,6 @@ export default function SettingsPage({ billingOnly = false }: { billingOnly?: bo
<Loader2 className="h-4 w-4 mr-2 animate-spin" />
Redirecting...
</>
) : billing.subscription.isTrialEligible ? (
'Start Free Trial'
) : (
'Upgrade with Stripe'
)}
+61
View File
@@ -240,6 +240,67 @@ export default async function AdminGrowthPage() {
</CardContent>
</Card>
{scoreboard.cohorts ? (
<Card>
<CardHeader>
<CardTitle className="text-base">Card-first against cardless trial</CardTitle>
<p className="text-sm text-muted-foreground">
Accounts created in the {scoreboard.cohorts.windowDays} days either side of{' '}
{formatDate(scoreboard.cohorts.cutover)}, each given{' '}
{scoreboard.cohorts.observationDays} days from signup to convert. The rate to read is
signup to paid: dropping the card requirement multiplies trials, so trial to paid can
fall while more people pay.
</p>
</CardHeader>
<CardContent className="overflow-x-auto">
<table className="w-full text-sm">
<thead>
<tr className="border-b text-left text-muted-foreground">
<th className="py-2 pr-4 font-medium">Cohort</th>
<th className="py-2 pr-4 font-medium">Window</th>
<th className="py-2 pr-4 text-right font-medium">Signup</th>
<th className="py-2 pr-4 text-right font-medium">Trial</th>
<th className="py-2 pr-4 text-right font-medium">Paid</th>
<th className="py-2 pr-4 text-right font-medium">Signup to paid</th>
<th className="py-2 pr-4 text-right font-medium">Trial to paid</th>
</tr>
</thead>
<tbody>
{scoreboard.cohorts.rows.map((row) => (
<tr key={row.cohort} className="border-b last:border-0">
<td className="py-2 pr-4">
{row.cohort === 'CARDLESS' ? 'cardless' : 'card first'}
</td>
<td className="py-2 pr-4 font-mono text-xs text-muted-foreground">
{formatDate(row.windowStart)} to {formatDate(row.windowEnd)}
</td>
<td className="py-2 pr-4 text-right tabular-nums">{row.signups}</td>
<td className="py-2 pr-4 text-right tabular-nums">{row.trials}</td>
<td className="py-2 pr-4 text-right tabular-nums">{row.paid}</td>
<td className="py-2 pr-4 text-right tabular-nums">
<Rate
rate={row.signups > 0 ? row.paid / row.signups : null}
of={row.signups}
/>
</td>
<td className="py-2 pr-4 text-right tabular-nums">
<Rate rate={row.trials > 0 ? row.paid / row.trials : null} of={row.trials} />
</td>
</tr>
))}
</tbody>
</table>
{scoreboard.cohorts.windowDays === 0 ? (
<p className="mt-3 text-sm text-muted-foreground">
Nothing to compare yet. The first cardless signups reach the end of their{' '}
{scoreboard.cohorts.observationDays}-day window {scoreboard.cohorts.observationDays}{' '}
days after the switchover.
</p>
) : null}
</CardContent>
</Card>
) : null}
<Card>
<CardHeader>
<CardTitle className="text-base">By source</CardTitle>
+28 -1
View File
@@ -15,8 +15,14 @@ import {
createVerificationToken,
isEmailVerificationEnabled,
sendVerificationEmail,
warnIfTrialsSkipVerification,
} from '@/lib/email-verification';
import { isValidEmailAddress, normalizeEmail } from '@/lib/email-validation';
import {
isDisposableEmailDomain,
isValidEmailAddress,
normalizeEmail,
} from '@/lib/email-validation';
import { startCardlessTrial } from '@/lib/billing';
import { recordSignupCompleted } from '@/lib/analytics/signup';
import { readRequestVisitor } from '@/lib/analytics/visitor';
@@ -49,6 +55,12 @@ export async function POST(request: NextRequest) {
return apiErrors.validationError('Invalid email format');
}
// Checked before the invitation branch reads its token, but only applied to
// people signing themselves up: an invited collaborator was vouched for by a
// paying customer, and refusing their address breaks that customer's review
// rather than stopping anyone from farming trials.
const isDisposableAddress = isDisposableEmailDomain(normalizedEmail);
// Allow registration via a valid invitation token OR global invite code.
let invitationIsValid = false;
let validatedInvitationToken: string | null = null;
@@ -85,6 +97,12 @@ export async function POST(request: NextRequest) {
}
}
if (!invitationIsValid && isDisposableAddress) {
return apiErrors.badRequest(
'Please sign up with a permanent email address. Disposable mailboxes are not accepted.'
);
}
if (!password || typeof password !== 'string' || password.length < 8 || password.length > 128) {
return apiErrors.badRequest('Password must be between 8 and 128 characters');
}
@@ -142,6 +160,15 @@ export async function POST(request: NextRequest) {
visitor: await readRequestVisitor(request),
});
// With SMTP configured the trial starts when the address is proven, not here.
// Without it there is no verification step to hang the trial on and the
// account is already marked verified above, so withholding the trial would
// just lock the user out of an instance that has billing switched on.
if (!emailVerificationRequired) {
warnIfTrialsSkipVerification();
await startCardlessTrial(user.id);
}
// Send verification email if SMTP is configured
if (emailVerificationRequired) {
const verificationToken = await createVerificationToken(normalizedEmail);
+4 -6
View File
@@ -1,11 +1,7 @@
import { NextRequest } from 'next/server';
import { auth } from '@/lib/auth';
import { apiErrors, successResponse, withCacheControl } from '@/lib/api-response';
import {
DEFAULT_TRIAL_PERIOD_DAYS,
getOrCreateStripeCustomerId,
getStripeCheckoutState,
} from '@/lib/billing';
import { getOrCreateStripeCustomerId, getStripeCheckoutState } from '@/lib/billing';
import { rateLimit } from '@/lib/rate-limit';
import { isStripeFeatureEnabled } from '@/lib/feature-flags';
import { getStripe, getStripePriceId, isStripeConfigured } from '@/lib/stripe';
@@ -73,11 +69,13 @@ export async function POST(request: NextRequest) {
metadata: {
userId: session.user.id,
},
// No trial here. The free trial is granted in the product when the email
// address is verified, so by the time anyone reaches checkout they have
// already had it and this subscription bills immediately.
subscription_data: {
metadata: {
userId: session.user.id,
},
...(checkoutState.isTrialEligible ? { trial_period_days: DEFAULT_TRIAL_PERIOD_DAYS } : {}),
},
});
+1 -1
View File
@@ -28,7 +28,7 @@ export async function GET() {
hasRecoverableSubscription: billing.subscription.hasRecoverableSubscription,
hasActiveTrial: billing.subscription.hasActiveTrial,
hasBillingAccess: billing.subscription.hasBillingAccess,
isTrialEligible: billing.subscription.isTrialEligible,
isPaid: billing.subscription.isPaid,
priceId: billing.subscription.stripePriceId,
currentPeriodEnd: billing.subscription.currentPeriodEnd?.toISOString() ?? null,
cancelAtPeriodEnd: billing.subscription.cancelAtPeriodEnd ?? false,
+22 -1
View File
@@ -3,7 +3,8 @@ import { db } from '@/lib/db';
import { auth, checkWorkspaceAccess } from '@/lib/auth';
import { ProjectVisibility } from '@prisma/client';
import { rateLimit } from '@/lib/rate-limit';
import { buildBillingAccessWhereInput } from '@/lib/billing';
import { buildBillingAccessWhereInput, isPaidTier } from '@/lib/billing';
import { TRIAL_PROJECT_LIMIT } from '@/lib/trial-limits';
import { apiErrors, successResponse, withCacheControl } from '@/lib/api-response';
import { DEFAULT_COMMENT_TAGS } from '@/lib/comment-tags';
import { logError } from '@/lib/logger';
@@ -161,6 +162,26 @@ export async function POST(request: NextRequest) {
return apiErrors.forbidden('Only workspace owners and admins can create projects');
}
// Counted against the workspace owner rather than the caller, because that is
// the account being billed: `ownerId` on the project below is the workspace
// owner too. A workspace admin on somebody else's trial hits the same ceiling.
const owner = await db.user.findUnique({
where: { id: workspace.ownerId },
select: { subscriptionStatus: true, stripeCurrentPeriodEnd: true },
});
if (owner && !isPaidTier(owner)) {
const ownedProjectCount = await db.project.count({
where: { ownerId: workspace.ownerId },
});
if (ownedProjectCount >= TRIAL_PROJECT_LIMIT) {
return apiErrors.forbidden(
'Your free trial covers one project at a time. Delete the existing project or subscribe to run more in parallel.'
);
}
}
const project = await db.$transaction(async (tx) => {
const createdProject = await tx.project.create({
data: {
+5 -5
View File
@@ -47,13 +47,13 @@ export default function RefundPolicyPage() {
<p>
All new accounts are eligible for a{' '}
<strong className="text-foreground">7-day free trial</strong> with full access to paid
features. We strongly encourage you to evaluate the Service fully during this period
before subscribing.
features. The trial requires no credit card and collects no payment. We strongly
encourage you to evaluate the Service fully during this period before subscribing.
</p>
<p className="mt-3">
You may cancel at any time during your free trial without being charged. If you do not
cancel before the trial ends, your chosen plan will automatically activate and payment
will be collected.
The trial never activates a paid plan by itself. When it ends, paid features stop
until you choose to subscribe, and a subscription is charged as soon as you complete
checkout.
</p>
</section>
+7 -6
View File
@@ -58,7 +58,7 @@ export default function TermsOfServicePage() {
OpenFrame is a video review and approval platform that enables creative professionals
and their clients to collaborate on video projects through timestamped comments,
annotations, version management, and approval workflows. The Service is offered on a
subscription basis with a free trial period.
subscription basis with a free trial period that requires no payment details.
</p>
</section>
@@ -96,11 +96,12 @@ export default function TermsOfServicePage() {
5. Subscriptions and Free Trial
</h2>
<p>
Certain features of the Service require a paid subscription. We offer a{' '}
<strong className="text-foreground">7-day free trial</strong> for new accounts, during
which you may access paid features at no charge. At the end of the trial period, your
subscription will automatically convert to a paid plan unless you cancel before the
trial ends.
Certain features of the Service require a paid subscription. Every new account
receives a <strong className="text-foreground">7-day free trial</strong>, which starts
once the account&apos;s email address is verified and requires no credit card. The
trial does not convert into a paid plan on its own and nothing is charged while it
runs. When it ends, access to paid features stops until you choose to subscribe, and a
subscription is billed as soon as you complete checkout.
</p>
<p className="mt-3">
Subscription fees are billed in advance on a monthly or annual basis depending on the