ref: Migrate off "Plan" object from accountDetails REST endpoint to GQL Plan (#3597)

Author: ajay-sentry

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

@@ -153,6 +153,7 @@ describe('CancelPlanPage', () => {
               hasPrivateRepos: true,
               plan: {
                 ...mockPlanData,
+                billingRate,
                 trialStatus,
                 value: planValue,
                 isEnterprisePlan: planValue === Plans.USERS_ENTERPRISEM,

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

@@ -49,15 +49,13 @@ function CancelPlanPage() {
     return <Redirect to={`/plan/${provider}/${owner}`} />
   }
 
-  const isMonthlyPlan =
-    accountDetailsData?.plan?.billingRate === BillingRate.MONTHLY
+  const isMonthlyPlan = planData?.plan?.billingRate === BillingRate.MONTHLY
 
   const discountNotApplied =
     !accountDetailsData?.subscriptionDetail?.customer?.discount
   const showSpecialOffer = discountNotApplied && isMonthlyPlan
   const showTeamSpecialOffer =
-    shouldDisplayTeamCard({ plans }) &&
-    isProPlan(accountDetailsData?.plan?.value)
+    shouldDisplayTeamCard({ plans }) && isProPlan(planData?.plan?.value)
   const showCancelPage = showSpecialOffer || showTeamSpecialOffer
 
   let redirectTo = `/plan/${provider}/${owner}/cancel/downgrade`

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentOrgPlan.test.tsx

@@ -12,7 +12,7 @@ import { MemoryRouter, Route } from 'react-router-dom'
 import { z } from 'zod'
 
 import { PlanUpdatedPlanNotificationContext } from 'pages/PlanPage/context'
-import { AccountDetailsSchema } from 'services/account'
+import { AccountDetailsSchema, TrialStatuses } from 'services/account'
 import { BillingRate, Plans } from 'shared/utils/billing'
 import { AlertOptions, type AlertOptionsType } from 'ui/Alert'
 
@@ -27,9 +27,6 @@ vi.mock('./AccountOrgs', () => ({ default: () => 'AccountOrgs' }))
 const mockedAccountDetails = {
   planProvider: 'github',
   rootOrganization: {},
-  plan: {
-    value: Plans.USERS_FREE,
-  },
   usesInvoice: false,
 } as z.infer<typeof AccountDetailsSchema>
 
@@ -39,6 +36,24 @@ const mockNoEnterpriseAccount = {
   },
 }
 
+const mockPlanDataResponse = {
+  baseUnitPrice: 10,
+  benefits: [],
+  billingRate: BillingRate.MONTHLY,
+  marketingName: 'some-name',
+  monthlyUploadLimit: 123,
+  value: Plans.USERS_PR_INAPPM,
+  trialStatus: TrialStatuses.NOT_STARTED,
+  trialStartDate: '',
+  trialEndDate: '',
+  trialTotalDays: 0,
+  pretrialUsersCount: 0,
+  planUserCount: 1,
+  hasSeatsLeft: true,
+  isEnterprisePlan: false,
+  isFreePlan: false,
+}
+
 const mockEnterpriseAccountDetailsNinetyPercent = {
   owner: {
     account: {
@@ -151,6 +166,13 @@ describe('CurrentOrgPlan', () => {
       graphql.query('EnterpriseAccountDetails', () => {
         return HttpResponse.json({ data: enterpriseAccountDetails })
       }),
+      graphql.query('GetPlanData', () => {
+        return HttpResponse.json({
+          data: {
+            owner: { hasPrivateRepos: true, plan: { ...mockPlanDataResponse } },
+          },
+        })
+      }),
       http.get('/internal/:provider/:owner/account-details', () => {
         return HttpResponse.json(accountDetails)
       })
@@ -184,15 +206,7 @@ describe('CurrentOrgPlan', () => {
   describe('when plan update success banner should be shown', () => {
     it('renders banner for plan successfully updated', async () => {
       setup({
-        accountDetails: {
-          plan: {
-            baseUnitPrice: 12,
-            billingRate: BillingRate.MONTHLY,
-            marketingName: 'Pro',
-            quantity: 39,
-            value: Plans.USERS_PR_INAPPM,
-          },
-        } as z.infer<typeof AccountDetailsSchema>,
+        accountDetails: {} as z.infer<typeof AccountDetailsSchema>,
       })
 
       render(<CurrentOrgPlan />, { wrapper })
@@ -203,13 +217,6 @@ describe('CurrentOrgPlan', () => {
     it('renders banner for plan successfully updated with scheduled details', async () => {
       setup({
         accountDetails: {
-          plan: {
-            baseUnitPrice: 12,
-            billingRate: BillingRate.MONTHLY,
-            marketingName: 'Pro',
-            quantity: 39,
-            value: Plans.USERS_PR_INAPPM,
-          },
           scheduleDetail: {
             scheduledPhase: {
               quantity: 34,
@@ -229,15 +236,7 @@ describe('CurrentOrgPlan', () => {
 
     it('does not render banner when no recent update made', async () => {
       setup({
-        accountDetails: {
-          plan: {
-            baseUnitPrice: 12,
-            billingRate: BillingRate.MONTHLY,
-            marketingName: 'Pro',
-            quantity: 39,
-            value: Plans.USERS_PR_INAPPM,
-          },
-        } as z.infer<typeof AccountDetailsSchema>,
+        accountDetails: {} as z.infer<typeof AccountDetailsSchema>,
       })
       render(<CurrentOrgPlan />, { wrapper: noUpdatedPlanWrapper })
       const currentPlanCard = await screen.findByText(/CurrentPlanCard/i)
@@ -253,13 +252,6 @@ describe('CurrentOrgPlan', () => {
     it('renders when subscription detail data is available', async () => {
       setup({
         accountDetails: {
-          plan: {
-            baseUnitPrice: 12,
-            billingRate: BillingRate.MONTHLY,
-            marketingName: 'Pro',
-            quantity: 39,
-            value: Plans.USERS_PR_INAPPM,
-          },
           subscriptionDetail: {
             cancelAtPeriodEnd: true,
             currentPeriodEnd: 1722631954,
@@ -282,13 +274,6 @@ describe('CurrentOrgPlan', () => {
           accountDetails: {
             planProvider: 'gitlab',
             rootOrganization: null,
-            plan: {
-              value: Plans.USERS_FREE,
-              baseUnitPrice: 12,
-              benefits: ['a', 'b'],
-              billingRate: null,
-              marketingName: 'bob',
-            },
             usesInvoice: false,
           } as z.infer<typeof AccountDetailsSchema>,
         })
@@ -318,13 +303,6 @@ describe('CurrentOrgPlan', () => {
           accountDetails: {
             planProvider: 'github',
             rootOrganization: {},
-            plan: {
-              value: Plans.USERS_FREE,
-              baseUnitPrice: 12,
-              benefits: ['a', 'b'],
-              billingRate: null,
-              marketingName: 'bob',
-            },
             usesInvoice: true,
           } as z.infer<typeof AccountDetailsSchema>,
         })
@@ -353,7 +331,7 @@ describe('CurrentOrgPlan', () => {
   describe('when plan value is not provided', () => {
     beforeEach(() => {
       setup({
-        accountDetails: { ...mockedAccountDetails, plan: null },
+        accountDetails: { ...mockedAccountDetails },
       })
     })
 

src/pages/PlanPage/subRoutes/CurrentOrgPlan/CurrentOrgPlan.tsx

@@ -2,7 +2,7 @@ import { useSuspenseQuery as useSuspenseQueryV5 } from '@tanstack/react-queryV5'
 import { useParams } from 'react-router-dom'
 
 import { usePlanUpdatedNotification } from 'pages/PlanPage/context'
-import { useAccountDetails } from 'services/account'
+import { useAccountDetails, usePlanData } from 'services/account'
 import { getScheduleStart } from 'shared/plan/ScheduledPlanDetails/ScheduledPlanDetails'
 import A from 'ui/A'
 import { Alert } from 'ui/Alert'
@@ -26,6 +26,12 @@ function CurrentOrgPlan() {
     provider,
     owner,
   })
+
+  const { data: planData } = usePlanData({
+    provider,
+    owner,
+  })
+
   const { data: enterpriseDetails } = useSuspenseQueryV5(
     EnterpriseAccountDetailsQueryOpts({
       provider,
@@ -57,7 +63,7 @@ function CurrentOrgPlan() {
       ) : null}
       <InfoMessageStripeCallback />
       {isDelinquent ? <DelinquentAlert /> : null}
-      {accountDetails?.plan ? (
+      {planData?.plan ? (
         <div className="flex flex-col gap-4 sm:mr-4 sm:flex-initial md:w-2/3 lg:w-3/4">
           {planUpdatedNotification.alertOption &&
           !planUpdatedNotification.isCancellation ? (

src/services/account/mocks.ts

@@ -1,4 +1,4 @@
-import { BillingRate, Plans } from 'shared/utils/billing'
+import { Plans } from 'shared/utils/billing'
 
 /* eslint-disable camelcase */
 export const invoiceObject = {
@@ -39,20 +39,6 @@ export const accountDetailsObject = {
   activated_user_count: 19,
   inactive_user_count: 5,
   plan_auto_activate: true,
-  plan: {
-    marketing_name: 'Pro Team',
-    value: Plans.USERS_PR_INAPPM,
-    billing_rate: 'monthly',
-    base_unit_price: 12,
-    benefits: [
-      'Configurable # of users',
-      'Unlimited public repositories',
-      'Unlimited private repositories',
-      'Priority Support',
-    ],
-    quantity: 20,
-    monthlyUploadLimit: null,
-  },
   subscription_detail: {
     latest_invoice: {
       id: 'in_1JnNyfGlVGuVgOrkkdkCYayW',
@@ -154,20 +140,6 @@ export const accountDetailsParsedObj = {
   activatedUserCount: 19,
   inactiveUserCount: 5,
   planAutoActivate: true,
-  plan: {
-    marketingName: 'Pro Team',
-    value: Plans.USERS_PR_INAPPM,
-    billingRate: BillingRate.MONTHLY,
-    baseUnitPrice: 12,
-    benefits: [
-      'Configurable # of users',
-      'Unlimited public repositories',
-      'Unlimited private repositories',
-      'Priority Support',
-    ],
-    quantity: 20,
-    monthlyUploadLimit: null,
-  },
   subscriptionDetail: {
     latestInvoice: {
       id: 'in_1JnNyfGlVGuVgOrkkdkCYayW',

src/services/account/useAccountDetails.ts

@@ -3,7 +3,6 @@ import { z } from 'zod'
 
 import Api from 'shared/api'
 import { NetworkErrorObject } from 'shared/api/helpers'
-import { BillingRate, Plans } from 'shared/utils/billing'
 
 const InvoiceSchema = z
   .object({
@@ -113,19 +112,6 @@ export const SubscriptionDetailSchema = z
   })
   .nullable()
 
-export const PlanSchema = z
-  .object({
-    baseUnitPrice: z.number(),
-    benefits: z.array(z.string()),
-    billingRate: z.nativeEnum(BillingRate).nullish(),
-    marketingName: z.string(),
-    monthlyUploadLimit: z.number().nullish(),
-    quantity: z.number().nullish(),
-    value: z.nativeEnum(Plans),
-    trialDays: z.number().nullish(),
-  })
-  .nullable()
-
 export const AccountDetailsSchema = z.object({
   activatedStudentCount: z.number(),
   activatedUserCount: z.number(),
@@ -136,13 +122,12 @@ export const AccountDetailsSchema = z.object({
   integrationId: z.number().nullable(),
   name: z.string().nullable(),
   nbActivePrivateRepos: z.number().nullable(),
-  plan: PlanSchema,
   planAutoActivate: z.boolean().nullable(),
   planProvider: z.string().nullable(),
   repoTotalCredits: z.number(),
   rootOrganization: z
     .object({
-      plan: PlanSchema,
+      username: z.string().nullish(),
     })
     .nullable(),
   scheduleDetail: z