Skip to content

Commit 20b5921

Browse files
Revert "feat: Remove option to change to yearly/annual plan (#3958)"
This reverts commit acfda0a.
1 parent d458234 commit 20b5921

File tree

47 files changed

+2648
-1008
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+2648
-1008
lines changed

src/pages/PlanPage/subRoutes/CancelPlanPage/subRoutes/TeamPlanSpecialOffer/TeamPlanCard/TeamPlanCard.test.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -174,10 +174,13 @@ describe('TeamPlanCard', () => {
174174
wrapper,
175175
})
176176

177+
const yearlyPrice = await screen.findByText(/5/)
178+
expect(yearlyPrice).toBeInTheDocument()
179+
177180
const monthlyPrice = await screen.findByText(/6/)
178181
expect(monthlyPrice).toBeInTheDocument()
179182

180-
const auxiliaryText = await screen.findByText(/billed monthly/)
183+
const auxiliaryText = await screen.findByText(/per user billing monthly/)
181184
expect(auxiliaryText).toBeInTheDocument()
182185
})
183186

src/pages/PlanPage/subRoutes/CancelPlanPage/subRoutes/TeamPlanSpecialOffer/TeamPlanCard/TeamPlanCard.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,14 +12,14 @@ const TeamPlanCard: React.FC = () => {
1212
}>()
1313

1414
const { data: plans } = useAvailablePlans({ provider, owner })
15-
const { teamPlanMonth } = findTeamPlans({
15+
const { teamPlanMonth, teamPlanYear } = findTeamPlans({
1616
plans,
1717
})
1818

1919
return (
2020
<div className="flex flex-col border">
2121
<div className="flex justify-between p-4">
22-
<h2 className="font-semibold">{teamPlanMonth?.marketingName} plan</h2>
22+
<h2 className="font-semibold">{teamPlanYear?.marketingName} plan</h2>
2323
<div className="flex self-start">
2424
<Button
2525
to={{
@@ -39,7 +39,7 @@ const TeamPlanCard: React.FC = () => {
3939
<div className="flex flex-col gap-2">
4040
<p className="text-xs font-semibold">Includes</p>
4141
<BenefitList
42-
benefits={teamPlanMonth?.benefits}
42+
benefits={teamPlanYear?.benefits}
4343
iconName="check"
4444
iconColor="text-ds-pink-default"
4545
/>
@@ -48,10 +48,13 @@ const TeamPlanCard: React.FC = () => {
4848
<p className="text-xs font-semibold">Pricing</p>
4949
<div>
5050
<p className="font-semibold">
51-
<span className="text-2xl">${teamPlanMonth?.baseUnitPrice}</span>{' '}
51+
<span className="text-2xl">${teamPlanYear?.baseUnitPrice}</span>{' '}
5252
per user/month
5353
</p>
54-
<p className="text-ds-gray-senary">billed monthly</p>
54+
<p className="text-ds-gray-senary">
55+
billed annually, or ${teamPlanMonth?.baseUnitPrice} per user
56+
billing monthly
57+
</p>
5558
</div>
5659
</div>
5760
</div>

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentPlanCard/FreePlanCard/FreePlanCard.test.jsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -118,7 +118,7 @@ const sentryPlans = [
118118
marketingName: 'Sentry',
119119
value: Plans.USERS_SENTRYM,
120120
billingRate: null,
121-
baseUnitPrice: 12,
121+
baseUnitPrice: 0,
122122
benefits: ['Includes 5 seats', 'Unlimited public repositories'],
123123
monthlyUploadLimit: null,
124124
isTeamPlan: false,
@@ -313,11 +313,9 @@ describe('FreePlanCard', () => {
313313
})
314314

315315
const link = await screen.findByRole('link', { name: /Upgrade/ })
316+
316317
expect(link).toBeInTheDocument()
317-
expect(link).toHaveAttribute(
318-
'href',
319-
'/plan/bb/critical-role/upgrade?plan=pro'
320-
)
318+
expect(link).toHaveAttribute('href', '/plan/bb/critical-role/upgrade')
321319
})
322320

323321
it('renders the help message', async () => {
@@ -364,13 +362,15 @@ describe('FreePlanCard', () => {
364362
wrapper,
365363
})
366364

367-
const cost = await screen.findByText(/\$12/)
365+
const cost = await screen.findByText(/\$10/)
368366
expect(cost).toBeInTheDocument()
369367

370-
const billingText = await screen.findByText(/per user\/month/)
371-
expect(billingText).toBeInTheDocument()
368+
const annualBillingText = await screen.findByText(/per user\/month/)
369+
expect(annualBillingText).toBeInTheDocument()
372370

373-
const monthlyBillingText = await screen.findByText(/billed monthly/)
371+
const monthlyBillingText = await screen.findByText(
372+
/billed annually, or \$12 per user billing monthly/
373+
)
374374
expect(monthlyBillingText).toBeInTheDocument()
375375
})
376376

@@ -481,7 +481,7 @@ describe('FreePlanCard', () => {
481481
expect(upgradeLink).toBeInTheDocument()
482482
expect(upgradeLink).toHaveAttribute(
483483
'href',
484-
'/plan/bb/critical-role/upgrade?plan=pro'
484+
'/plan/bb/critical-role/upgrade'
485485
)
486486
})
487487

@@ -506,7 +506,7 @@ describe('FreePlanCard', () => {
506506
expect(perMonth).toBeInTheDocument()
507507

508508
const billingCycleInfo = await screen.findByText(
509-
/over 5 users is \$12 per user\/month, billed monthly/
509+
/over 5 users is \$10 per user\/month, billed annually/
510510
)
511511
expect(billingCycleInfo).toBeInTheDocument()
512512
})

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentPlanCard/FreePlanCard/PlanUpgradePro/PlanUpgradePro.jsx

Lines changed: 16 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,9 @@ import ProPlanSubheading from '../ProPlanSubheading'
1010

1111
function PlanDetails({
1212
isSentryUpgrade,
13-
sentryMonthlyUnitPrice,
13+
sentryAnnualUnitPrice,
1414
proMonthlyUnitPrice,
15+
proYearlyUnitPrice,
1516
}) {
1617
if (isSentryUpgrade) {
1718
return (
@@ -21,8 +22,8 @@ function PlanDetails({
2122
/month
2223
</p>
2324
<p className="text-ds-gray-senary">
24-
over 5 users is ${sentryMonthlyUnitPrice} per user/month, billed
25-
monthly
25+
over 5 users is ${sentryAnnualUnitPrice} per user/month, billed
26+
annually
2627
</p>
2728
</div>
2829
)
@@ -31,24 +32,27 @@ function PlanDetails({
3132
return (
3233
<div className="text-xs">
3334
<p className="font-semibold">
34-
<span className="text-2xl">${proMonthlyUnitPrice}</span> per user/month
35+
<span className="text-2xl">${proYearlyUnitPrice}</span> per user/month
36+
</p>
37+
<p className="text-ds-gray-senary">
38+
billed annually, or ${proMonthlyUnitPrice} per user billing monthly
3539
</p>
36-
<p className="text-ds-gray-senary">billed monthly</p>
3740
</div>
3841
)
3942
}
4043

4144
PlanDetails.propTypes = {
4245
isSentryUpgrade: PropType.bool.isRequired,
43-
sentryMonthlyUnitPrice: PropType.number,
46+
sentryAnnualUnitPrice: PropType.number,
4447
proMonthlyUnitPrice: PropType.number,
48+
proYearlyUnitPrice: PropType.number,
4549
}
4650

4751
function PlanUpgradePro({ isSentryUpgrade, plans }) {
48-
const { proPlanMonth } = findProPlans({ plans })
49-
const { sentryPlanMonth } = findSentryPlans({ plans })
52+
const { proPlanMonth, proPlanYear } = findProPlans({ plans })
53+
const { sentryPlanYear } = findSentryPlans({ plans })
5054

51-
const upgradeToPlan = isSentryUpgrade ? sentryPlanMonth : proPlanMonth
55+
const upgradeToPlan = isSentryUpgrade ? sentryPlanYear : proPlanMonth
5256

5357
return (
5458
<div className="flex flex-col border">
@@ -57,7 +61,7 @@ function PlanUpgradePro({ isSentryUpgrade, plans }) {
5761
<h2 className="font-semibold">{upgradeToPlan?.marketingName} plan</h2>
5862
<ProPlanSubheading />
5963
</div>
60-
<ActionsBilling buttonOptions={{ params: { plan: 'pro' } }} />
64+
<ActionsBilling />
6165
</div>
6266
<hr />
6367
<div className="grid gap-4 p-4 sm:grid-cols-2 sm:gap-0">
@@ -75,8 +79,9 @@ function PlanUpgradePro({ isSentryUpgrade, plans }) {
7579
</p>
7680
<PlanDetails
7781
isSentryUpgrade={isSentryUpgrade}
78-
sentryMonthlyUnitPrice={sentryPlanMonth?.baseUnitPrice}
82+
sentryAnnualUnitPrice={sentryPlanYear?.baseUnitPrice}
7983
proMonthlyUnitPrice={proPlanMonth?.baseUnitPrice}
84+
proYearlyUnitPrice={proPlanYear?.baseUnitPrice}
8085
/>
8186
</div>
8287
</div>

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentPlanCard/FreePlanCard/PlanUpgradePro/PlanUpgradePro.test.jsx

Lines changed: 8 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,8 @@ import { BillingRate, Plans } from 'shared/utils/billing'
88
import PlanUpgradePro from './PlanUpgradePro'
99

1010
vi.mock('../ProPlanSubheading', () => ({ default: () => 'Pro Subheading' }))
11-
const mockActionsBilling = vi.fn(() => 'Actions Billing')
1211
vi.mock('../../shared/ActionsBilling/ActionsBilling', () => ({
13-
default: (props) => {
14-
mockActionsBilling(props)
15-
return 'Actions Billing'
16-
},
12+
default: () => 'Actions Billing',
1713
}))
1814
vi.mock('shared/plan/BenefitList', () => ({ default: () => 'BenefitsList' }))
1915

@@ -101,7 +97,7 @@ const plansWithSentryOptions = [
10197
marketingName: 'Sentry',
10298
value: Plans.USERS_SENTRYM,
10399
billingRate: null,
104-
baseUnitPrice: 12,
100+
baseUnitPrice: 0,
105101
benefits: ['Includes 5 seats', 'Unlimited public repositories'],
106102
monthlyUploadLimit: null,
107103
},
@@ -172,7 +168,7 @@ describe('PlanUpgradePro', () => {
172168
expect(benefitsList).toBeInTheDocument()
173169
})
174170

175-
it('shows sentry up to 5 users price', async () => {
171+
it('shows sentry price', async () => {
176172
render(
177173
<PlanUpgradePro isSentryUpgrade plans={plansWithSentryOptions} />,
178174
{
@@ -184,15 +180,15 @@ describe('PlanUpgradePro', () => {
184180
expect(sentryPrice).toBeInTheDocument()
185181
})
186182

187-
it('shows sentry above 5 users price', async () => {
183+
it('shows sentry annual price', async () => {
188184
render(
189185
<PlanUpgradePro isSentryUpgrade plans={plansWithSentryOptions} />,
190186
{
191187
wrapper,
192188
}
193189
)
194190

195-
const annualSentryPrice = await screen.findByText(/12/)
191+
const annualSentryPrice = await screen.findByText(/123/)
196192
expect(annualSentryPrice).toBeInTheDocument()
197193
})
198194

@@ -207,21 +203,6 @@ describe('PlanUpgradePro', () => {
207203
const actionsBilling = await screen.findByText(/Actions Billing/)
208204
expect(actionsBilling).toBeInTheDocument()
209205
})
210-
211-
it('passes buttonOptions prop to ActionsBilling', async () => {
212-
render(
213-
<PlanUpgradePro isSentryUpgrade plans={plansWithSentryOptions} />,
214-
{
215-
wrapper,
216-
}
217-
)
218-
219-
const actionsBilling = await screen.findByText(/Actions Billing/)
220-
expect(actionsBilling).toBeInTheDocument()
221-
expect(mockActionsBilling).toHaveBeenCalledWith({
222-
buttonOptions: { params: { plan: 'pro' } },
223-
})
224-
})
225206
})
226207

227208
describe('when rendered with pro plan', () => {
@@ -285,7 +266,7 @@ describe('PlanUpgradePro', () => {
285266
expect(monthlyProPrice).toBeInTheDocument()
286267
})
287268

288-
it('does not shows pro yearly price', async () => {
269+
it('shows pro yearly price', async () => {
289270
render(
290271
<PlanUpgradePro
291272
isSentryUpgrade={false}
@@ -296,8 +277,8 @@ describe('PlanUpgradePro', () => {
296277
}
297278
)
298279

299-
const yearlyProPrice = screen.queryByText(/456/)
300-
expect(yearlyProPrice).not.toBeInTheDocument()
280+
const yearlyProPrice = await screen.findByText(/456/)
281+
expect(yearlyProPrice).toBeInTheDocument()
301282
})
302283

303284
it('shows the actions billing component', async () => {
@@ -314,23 +295,5 @@ describe('PlanUpgradePro', () => {
314295
const actionsBilling = await screen.findByText(/Actions Billing/)
315296
expect(actionsBilling).toBeInTheDocument()
316297
})
317-
318-
it('passes buttonOptions prop to ActionsBilling', async () => {
319-
render(
320-
<PlanUpgradePro
321-
isSentryUpgrade={false}
322-
plans={plansWithoutSentryOptions}
323-
/>,
324-
{
325-
wrapper,
326-
}
327-
)
328-
329-
const actionsBilling = await screen.findByText(/Actions Billing/)
330-
expect(actionsBilling).toBeInTheDocument()
331-
expect(mockActionsBilling).toHaveBeenCalledWith({
332-
buttonOptions: { params: { plan: 'pro' } },
333-
})
334-
})
335298
})
336299
})

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentPlanCard/FreePlanCard/PlanUpgradeTeam/PlanUpgradeTeam.jsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,13 @@ function PlanUpgradeTeam() {
1616
const currentPlan = planData?.plan
1717
const { data: plans } = useAvailablePlans({ provider, owner })
1818

19-
const { teamPlanMonth } = findTeamPlans({
19+
const { teamPlanMonth, teamPlanYear } = findTeamPlans({
2020
plans,
2121
})
2222
const monthlyTeamBenefits = teamPlanMonth?.benefits
2323
const monthlyMarketingName = teamPlanMonth?.marketingName
2424
const monthlyUnitPrice = teamPlanMonth?.baseUnitPrice
25+
const yearlyUnitPrice = teamPlanYear?.baseUnitPrice
2526

2627
let buttonText = 'Manage plan'
2728
if (currentPlan?.isFreePlan || currentPlan?.isTrialPlan) {
@@ -64,10 +65,12 @@ function PlanUpgradeTeam() {
6465
<p className="text-xs font-semibold">Pricing</p>
6566
<div className="text-xs">
6667
<p className="font-semibold">
67-
<span className="text-2xl">${monthlyUnitPrice}</span> per
68+
<span className="text-2xl">${yearlyUnitPrice}</span> per
6869
user/month
6970
</p>
70-
<p className="text-ds-gray-senary">billed monthly</p>
71+
<p className="text-ds-gray-senary">
72+
billed annually, or ${monthlyUnitPrice} per user billing monthly
73+
</p>
7174
</div>
7275
</div>
7376
</div>

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentPlanCard/FreePlanCard/PlanUpgradeTeam/PlanUpgradeTeam.test.jsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -283,13 +283,13 @@ describe('PlanUpgradeTeam', () => {
283283
wrapper,
284284
})
285285

286-
const yearlyPrice = screen.queryByText(/5/)
287-
expect(yearlyPrice).not.toBeInTheDocument()
286+
const yearlyPrice = await screen.findByText(/5/)
287+
expect(yearlyPrice).toBeInTheDocument()
288288

289289
const monthlyPrice = await screen.findByText(/6/)
290290
expect(monthlyPrice).toBeInTheDocument()
291291

292-
const auxiliaryText = await screen.findByText(/billed monthly/)
292+
const auxiliaryText = await screen.findByText(/per user billing monthly/)
293293
expect(auxiliaryText).toBeInTheDocument()
294294
})
295295

0 commit comments

Comments
 (0)