Skip to content

Commit

Permalink
Add trials and fix subscription management links not being displayed
Browse files Browse the repository at this point in the history
  • Loading branch information
@255kb
255kb committed Jul 11, 2024
1 parent 6ef0ad7 commit 337c348
Show file tree
Hide file tree
Showing 7 changed files with 62 additions and 32 deletions.
14 changes: 13 additions & 1 deletion components/plans.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -311,6 +311,9 @@ const PlansView: FunctionComponent<{

<div className='text-center mb-6'>
{subscribeBtn(Plans.SOLO)}
<div className='fs-6 text-muted mt-1'>
{pricing.SOLO.trialDays} days free trial included
</div>
</div>

<div className='d-flex'>
Expand Down Expand Up @@ -408,6 +411,9 @@ const PlansView: FunctionComponent<{
</div>
<div className='text-center mb-6'>
{subscribeBtn(Plans.TEAM)}
<div className='fs-6 text-muted mt-1'>
{pricing.SOLO.trialDays} days free trial included
</div>
</div>
<div className='d-flex'>
<div className='badge badge-rounded-circle text-bg-success-subtle mt-1 me-4'>
Expand Down Expand Up @@ -516,6 +522,9 @@ const PlansView: FunctionComponent<{

<div className='text-center mb-6'>
{subscribeBtn(Plans.ENTERPRISE)}
<div className='fs-6 text-muted mt-1'>
{pricing.SOLO.trialDays} days free trial included
</div>
</div>

<div className='d-flex'>
Expand Down Expand Up @@ -677,7 +686,10 @@ const PlansView: FunctionComponent<{
Prices are in USD and exclude VAT where applicable. By proceeding
to payment you agree to our{' '}
<Link href={'/privacy/'}>privacy policy</Link> and{' '}
<Link href={'/terms/'}>terms of service</Link>.<br />
<Link href={'/terms/'}>terms of service</Link>.<br /> The free
trial is available once per user and requires a valid payment
method.
<br />
<sup>1</sup> To learn more about our Enterprise support, see the{' '}
<Link href={'/pro/#faq'}>FAQ of our Pro plans</Link> or our{' '}
<Link href={'/terms/'}>terms of service</Link>.
Expand Down
3 changes: 3 additions & 0 deletions data/pricing.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ export const pricing = {
price: 150,
priceId: process.env.NEXT_PUBLIC_PADDLE_PLAN_SOLO_YEARLY_PRICE_ID
},
trialDays: 7,
templatesQuota: 100,
syncQuota: 5,
deployQuota: 1,
Expand All @@ -24,6 +25,7 @@ export const pricing = {
price: 250,
priceId: process.env.NEXT_PUBLIC_PADDLE_PLAN_TEAM_YEARLY_PRICE_ID
},
trialDays: 7,
templatesQuota: 200,
syncQuota: 10,
deployQuota: 3,
Expand All @@ -42,6 +44,7 @@ export const pricing = {
price: 600,
priceId: process.env.NEXT_PUBLIC_PADDLE_PLAN_ENTERPRISE_YEARLY_PRICE_ID
},
trialDays: 7,
templatesQuota: 500,
syncQuota: 20,
deployQuota: 5,
Expand Down
14 changes: 7 additions & 7 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
"@codemirror/lang-xml": "^6.0.2",
"@codemirror/lang-yaml": "^6.0.0",
"@docsearch/react": "^3.5.2",
"@mockoon/cloud": "^8.3.0",
"@mockoon/cloud": "^8.3.1",
"@tanstack/react-query": "^5.8.3",
"@uiw/codemirror-theme-nord": "^4.21.21",
"@uiw/react-codemirror": "^4.21.21",
Expand Down
53 changes: 32 additions & 21 deletions pages/account/subscription.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -185,6 +185,12 @@ const AccountSubscription: FunctionComponent = function () {
Invoice past due
</span>
)}
{userData?.plan !== 'FREE' &&
userData.subscription?.trial && (
<span className='badge text-bg-primary-subtle ms-2'>
Trial period active
</span>
)}
</p>

{userData?.plan !== 'FREE' &&
Expand Down Expand Up @@ -316,29 +322,34 @@ const AccountSubscription: FunctionComponent = function () {
</div>
</div>
</div>
<div className='list-group-item'>
<div className='row align-items-center'>
<div className='col'>
<p className='mb-0'>
Cancel subscription
</p>
<p className='m-0'>
<small className='text-gray-700'>
Will be cancelled at the end of the
current billing period
</small>
</p>
</div>
<div className='col-auto'>
<Link
href={subscriptionLinksData?.cancel}
className='btn btn-xs btn-danger'
>
Cancel
</Link>
{!userData?.subscription
?.cancellationScheduled && (
<div className='list-group-item'>
<div className='row align-items-center'>
<div className='col'>
<p className='mb-0'>
Cancel subscription
</p>
<p className='m-0'>
<small className='text-gray-700'>
Will be cancelled at the end of the{' '}
{userData?.subscription?.trial
? 'trial period'
: 'current billing period'}
</small>
</p>
</div>
<div className='col-auto'>
<Link
href={subscriptionLinksData?.cancel}
className='btn btn-xs btn-danger'
>
Cancel
</Link>
</div>
</div>
</div>
</div>
)}
</>
)}
</div>
Expand Down
5 changes: 5 additions & 0 deletions pages/pro.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import EmailForm from '../components/email-form';
import Hero from '../components/hero';
import Meta from '../components/meta';
import Plans from '../components/plans';
import { pricing } from '../data/pricing';
import Layout from '../layout/layout';
import { AccordionData } from '../models/common.model';

Expand Down Expand Up @@ -53,6 +54,10 @@ const faq: AccordionData = [
{
title: 'Billing',
items: [
{
title: 'Do you offer a free trial?',
content: `We offer a ${pricing.SOLO.trialDays}-day free trial for all plans. You can cancel your subscription at any time during the trial period and you will not be charged.`
},
{
title: 'How does per-seat billing work?',
content:
Expand Down
3 changes: 1 addition & 2 deletions utils/queries.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ const useCurrentTeam = (teamId, teamRole) => {

const useCurrentSubscriptionLinks = (user: User) => {
const auth = useAuth();

console.log(user);
const { isLoading, error, data, isFetching } = useQuery<{
update_payment_method: string;
cancel: string;
Expand All @@ -145,7 +145,6 @@ const useCurrentSubscriptionLinks = (user: User) => {
!!user &&
user.plan !== Plans.FREE &&
user.subscription !== undefined &&
user.subscription.subscriptionId != null &&
user.subscription.provider != null &&
user.subscription.provider === 'paddle',
queryFn: async () => {
Expand Down

0 comments on commit 337c348

Please sign in to comment.