Skip to content

Commit acfda0a

Browse files
calvin-codecovcalvin-codecov
authored
feat: Remove option to change to yearly/annual plan (#3958)
1 parent 49e94b2 commit acfda0a

File tree

47 files changed

+1008
-2648
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

+1008
-2648
lines changed

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

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

177-
const yearlyPrice = await screen.findByText(/5/)
178-
expect(yearlyPrice).toBeInTheDocument()
179-
180177
const monthlyPrice = await screen.findByText(/6/)
181178
expect(monthlyPrice).toBeInTheDocument()
182179

183-
const auxiliaryText = await screen.findByText(/per user billing monthly/)
180+
const auxiliaryText = await screen.findByText(/billed monthly/)
184181
expect(auxiliaryText).toBeInTheDocument()
185182
})
186183

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

Lines changed: 5 additions & 8 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, teamPlanYear } = findTeamPlans({
15+
const { teamPlanMonth } = 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">{teamPlanYear?.marketingName} plan</h2>
22+
<h2 className="font-semibold">{teamPlanMonth?.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={teamPlanYear?.benefits}
42+
benefits={teamPlanMonth?.benefits}
4343
iconName="check"
4444
iconColor="text-ds-pink-default"
4545
/>
@@ -48,13 +48,10 @@ 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">${teamPlanYear?.baseUnitPrice}</span>{' '}
51+
<span className="text-2xl">${teamPlanMonth?.baseUnitPrice}</span>{' '}
5252
per user/month
5353
</p>
54-
<p className="text-ds-gray-senary">
55-
billed annually, or ${teamPlanMonth?.baseUnitPrice} per user
56-
billing monthly
57-
</p>
54+
<p className="text-ds-gray-senary">billed monthly</p>
5855
</div>
5956
</div>
6057
</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: 0,
121+
baseUnitPrice: 12,
122122
benefits: ['Includes 5 seats', 'Unlimited public repositories'],
123123
monthlyUploadLimit: null,
124124
isTeamPlan: false,
@@ -313,9 +313,11 @@ describe('FreePlanCard', () => {
313313
})
314314

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

321323
it('renders the help message', async () => {
@@ -362,15 +364,13 @@ describe('FreePlanCard', () => {
362364
wrapper,
363365
})
364366

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

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

371-
const monthlyBillingText = await screen.findByText(
372-
/billed annually, or \$12 per user billing monthly/
373-
)
373+
const monthlyBillingText = await screen.findByText(/billed monthly/)
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'
484+
'/plan/bb/critical-role/upgrade?plan=pro'
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 \$10 per user\/month, billed annually/
509+
/over 5 users is \$12 per user\/month, billed monthly/
510510
)
511511
expect(billingCycleInfo).toBeInTheDocument()
512512
})

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

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

1111
function PlanDetails({
1212
isSentryUpgrade,
13-
sentryAnnualUnitPrice,
13+
sentryMonthlyUnitPrice,
1414
proMonthlyUnitPrice,
15-
proYearlyUnitPrice,
1615
}) {
1716
if (isSentryUpgrade) {
1817
return (
@@ -22,8 +21,8 @@ function PlanDetails({
2221
/month
2322
</p>
2423
<p className="text-ds-gray-senary">
25-
over 5 users is ${sentryAnnualUnitPrice} per user/month, billed
26-
annually
24+
over 5 users is ${sentryMonthlyUnitPrice} per user/month, billed
25+
monthly
2726
</p>
2827
</div>
2928
)
@@ -32,27 +31,24 @@ function PlanDetails({
3231
return (
3332
<div className="text-xs">
3433
<p className="font-semibold">
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
34+
<span className="text-2xl">${proMonthlyUnitPrice}</span> per user/month
3935
</p>
36+
<p className="text-ds-gray-senary">billed monthly</p>
4037
</div>
4138
)
4239
}
4340

4441
PlanDetails.propTypes = {
4542
isSentryUpgrade: PropType.bool.isRequired,
46-
sentryAnnualUnitPrice: PropType.number,
43+
sentryMonthlyUnitPrice: PropType.number,
4744
proMonthlyUnitPrice: PropType.number,
48-
proYearlyUnitPrice: PropType.number,
4945
}
5046

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

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

5753
return (
5854
<div className="flex flex-col border">
@@ -61,7 +57,7 @@ function PlanUpgradePro({ isSentryUpgrade, plans }) {
6157
<h2 className="font-semibold">{upgradeToPlan?.marketingName} plan</h2>
6258
<ProPlanSubheading />
6359
</div>
64-
<ActionsBilling />
60+
<ActionsBilling buttonOptions={{ params: { plan: 'pro' } }} />
6561
</div>
6662
<hr />
6763
<div className="grid gap-4 p-4 sm:grid-cols-2 sm:gap-0">
@@ -79,9 +75,8 @@ function PlanUpgradePro({ isSentryUpgrade, plans }) {
7975
</p>
8076
<PlanDetails
8177
isSentryUpgrade={isSentryUpgrade}
82-
sentryAnnualUnitPrice={sentryPlanYear?.baseUnitPrice}
78+
sentryMonthlyUnitPrice={sentryPlanMonth?.baseUnitPrice}
8379
proMonthlyUnitPrice={proPlanMonth?.baseUnitPrice}
84-
proYearlyUnitPrice={proPlanYear?.baseUnitPrice}
8580
/>
8681
</div>
8782
</div>

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

Lines changed: 45 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,12 @@ 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')
1112
vi.mock('../../shared/ActionsBilling/ActionsBilling', () => ({
12-
default: () => 'Actions Billing',
13+
default: (props) => {
14+
mockActionsBilling(props)
15+
return 'Actions Billing'
16+
},
1317
}))
1418
vi.mock('shared/plan/BenefitList', () => ({ default: () => 'BenefitsList' }))
1519

@@ -97,7 +101,7 @@ const plansWithSentryOptions = [
97101
marketingName: 'Sentry',
98102
value: Plans.USERS_SENTRYM,
99103
billingRate: null,
100-
baseUnitPrice: 0,
104+
baseUnitPrice: 12,
101105
benefits: ['Includes 5 seats', 'Unlimited public repositories'],
102106
monthlyUploadLimit: null,
103107
},
@@ -168,7 +172,7 @@ describe('PlanUpgradePro', () => {
168172
expect(benefitsList).toBeInTheDocument()
169173
})
170174

171-
it('shows sentry price', async () => {
175+
it('shows sentry up to 5 users price', async () => {
172176
render(
173177
<PlanUpgradePro isSentryUpgrade plans={plansWithSentryOptions} />,
174178
{
@@ -180,15 +184,15 @@ describe('PlanUpgradePro', () => {
180184
expect(sentryPrice).toBeInTheDocument()
181185
})
182186

183-
it('shows sentry annual price', async () => {
187+
it('shows sentry above 5 users price', async () => {
184188
render(
185189
<PlanUpgradePro isSentryUpgrade plans={plansWithSentryOptions} />,
186190
{
187191
wrapper,
188192
}
189193
)
190194

191-
const annualSentryPrice = await screen.findByText(/123/)
195+
const annualSentryPrice = await screen.findByText(/12/)
192196
expect(annualSentryPrice).toBeInTheDocument()
193197
})
194198

@@ -203,6 +207,21 @@ describe('PlanUpgradePro', () => {
203207
const actionsBilling = await screen.findByText(/Actions Billing/)
204208
expect(actionsBilling).toBeInTheDocument()
205209
})
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+
})
206225
})
207226

208227
describe('when rendered with pro plan', () => {
@@ -266,7 +285,7 @@ describe('PlanUpgradePro', () => {
266285
expect(monthlyProPrice).toBeInTheDocument()
267286
})
268287

269-
it('shows pro yearly price', async () => {
288+
it('does not shows pro yearly price', async () => {
270289
render(
271290
<PlanUpgradePro
272291
isSentryUpgrade={false}
@@ -277,8 +296,8 @@ describe('PlanUpgradePro', () => {
277296
}
278297
)
279298

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

284303
it('shows the actions billing component', async () => {
@@ -295,5 +314,23 @@ describe('PlanUpgradePro', () => {
295314
const actionsBilling = await screen.findByText(/Actions Billing/)
296315
expect(actionsBilling).toBeInTheDocument()
297316
})
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+
})
298335
})
299336
})

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

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

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

2726
let buttonText = 'Manage plan'
2827
if (currentPlan?.isFreePlan || currentPlan?.isTrialPlan) {
@@ -65,12 +64,10 @@ function PlanUpgradeTeam() {
6564
<p className="text-xs font-semibold">Pricing</p>
6665
<div className="text-xs">
6766
<p className="font-semibold">
68-
<span className="text-2xl">${yearlyUnitPrice}</span> per
67+
<span className="text-2xl">${monthlyUnitPrice}</span> per
6968
user/month
7069
</p>
71-
<p className="text-ds-gray-senary">
72-
billed annually, or ${monthlyUnitPrice} per user billing monthly
73-
</p>
70+
<p className="text-ds-gray-senary">billed monthly</p>
7471
</div>
7572
</div>
7673
</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 = await screen.findByText(/5/)
287-
expect(yearlyPrice).toBeInTheDocument()
286+
const yearlyPrice = screen.queryByText(/5/)
287+
expect(yearlyPrice).not.toBeInTheDocument()
288288

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

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

0 commit comments

Comments
 (0)