misc(new-analytics): add page and route structure

src/core/constants/tabsOptions.ts

@@ -17,3 +17,11 @@ export enum PlanDetailsTabsOptionsEnum {
   overview = 'overview',
   subscriptions = 'subscriptions',
 }
+
+export enum NewAnalyticsTabsOptionsEnum {
+  revenueStreams = 'revenue-streams',
+  mrr = 'mrr',
+  usage = 'usage',
+  prepaidCredits = 'prepaid-credits',
+  invoices = 'invoices',
+}

src/core/router/index.tsx

@@ -27,13 +27,16 @@ const Home = lazyLoad(() => import('~/pages/Home'))
 const Error404 = lazyLoad(() => import('~/pages/Error404'))
 const Forbidden = lazyLoad(() => import('~/pages/Forbidden'))
 const Analytic = lazyLoad(() => import('~/pages/Analytics'))
+const NewAnalytic = lazyLoad(() => import('~/pages/analytics/NewAnalytics'))
 
 // Route Available only on dev mode
 const DesignSystem = lazyLoad(() => import('~/pages/__devOnly/DesignSystem'))
 
 export const HOME_ROUTE = '/'
 export const FORBIDDEN_ROUTE = '/forbidden'
 export const ANALYTIC_ROUTE = '/analytics'
+export const NEW_ANALYTIC_ROUTE = '/new-analytics'
+export const NEW_ANALYTIC_TABS_ROUTE = '/new-analytics/:tab'
 export const ERROR_404_ROUTE = '/404'
 
 // Route Available only on dev mode
@@ -69,6 +72,12 @@ export const routes: CustomRouteObject[] = [
         element: <Analytic />,
         permissions: ['analyticsView'],
       },
+      {
+        path: [NEW_ANALYTIC_ROUTE, NEW_ANALYTIC_TABS_ROUTE],
+        private: true,
+        element: <NewAnalytic />,
+        permissions: ['analyticsView'],
+      },
       ...customerRoutes,
       ...developperRoutes,
       ...objectListRoutes,

src/generated/graphql.tsx

@@ -4663,6 +4663,8 @@ export type Query = {
   plan?: Maybe<Plan>;
   /** Query plans of an organization */
   plans: PlanCollection;
+  /** Query revenue streams of an organization */
+  revenueStreams: RevenueStreamsCollection;
   /** Query a single subscription of an organization */
   subscription?: Maybe<Subscription>;
   /** Query subscriptions of an organization */
@@ -5039,6 +5041,18 @@ export type QueryPlansArgs = {
 };
 
 
+export type QueryRevenueStreamsArgs = {
+  country?: InputMaybe<CountryCode>;
+  currency?: InputMaybe<CurrencyEnum>;
+  customerType?: InputMaybe<CustomerTypeEnum>;
+  externalCustomerId?: InputMaybe<Scalars['String']['input']>;
+  externalSubscriptionId?: InputMaybe<Scalars['String']['input']>;
+  fromDate?: InputMaybe<Scalars['ISO8601Date']['input']>;
+  planCode?: InputMaybe<Scalars['String']['input']>;
+  toDate?: InputMaybe<Scalars['ISO8601Date']['input']>;
+};
+
+
 export type QuerySubscriptionArgs = {
   id: Scalars['ID']['input'];
 };
@@ -5234,6 +5248,30 @@ export type RetryWebhookInput = {
   id: Scalars['ID']['input'];
 };
 
+export type RevenueStreams = {
+  __typename?: 'RevenueStreams';
+  commitmentFeeAmountCents: Scalars['BigInt']['output'];
+  couponsAmountCents: Scalars['BigInt']['output'];
+  currency?: Maybe<CurrencyEnum>;
+  fromDate: Scalars['ISO8601Date']['output'];
+  grossRevenueAmountCents: Scalars['BigInt']['output'];
+  inAdvanceFeeAmountCents: Scalars['BigInt']['output'];
+  netRevenueAmountCents: Scalars['BigInt']['output'];
+  oneOffFeeAmountCents: Scalars['BigInt']['output'];
+  subscriptionFeeAmountCents: Scalars['BigInt']['output'];
+  toDate: Scalars['ISO8601Date']['output'];
+  usageBasedFeeAmountCents: Scalars['BigInt']['output'];
+};
+
+/** RevenueStreamsCollection type */
+export type RevenueStreamsCollection = {
+  __typename?: 'RevenueStreamsCollection';
+  /** A collection of paginated RevenueStreamsCollection */
+  collection: Array<RevenueStreams>;
+  /** Pagination Metadata for navigating the Pagination */
+  metadata: CollectionMetadata;
+};
+
 /** Autogenerated input type of RevokeInvite */
 export type RevokeInviteInput = {
   /** A unique identifier for the client performing the mutation. */

src/pages/analytics/Invoices.tsx

@@ -0,0 +1,5 @@
+const Invoices = () => {
+  return <>Invoices content</>
+}
+
+export default Invoices

src/pages/analytics/Mrr.tsx

@@ -0,0 +1,5 @@
+const Mrr = () => {
+  return <>MRR content</>
+}
+
+export default Mrr

src/pages/analytics/NewAnalytics.tsx

@@ -0,0 +1,76 @@
+import { generatePath, Outlet } from 'react-router-dom'
+
+import { NavigationTab, Typography } from '~/components/designSystem'
+import { NewAnalyticsTabsOptionsEnum } from '~/core/constants/tabsOptions'
+import { NEW_ANALYTIC_ROUTE, NEW_ANALYTIC_TABS_ROUTE } from '~/core/router'
+import { useInternationalization } from '~/hooks/core/useInternationalization'
+import Invoices from '~/pages/analytics/Invoices'
+import Mrr from '~/pages/analytics/Mrr'
+import PrepaidCredits from '~/pages/analytics/PrepaidCredits'
+import RevenueStreams from '~/pages/analytics/RevenueStreams'
+import Usage from '~/pages/analytics/Usage'
+import { PageHeader } from '~/styles'
+
+const NewAnalytics = () => {
+  const { translate } = useInternationalization()
+
+  return (
+    <>
+      <PageHeader.Wrapper withSide>
+        <Typography variant="bodyHl" color="grey700" noWrap>
+          {translate('text_6553885df387fd0097fd7384')}
+        </Typography>
+      </PageHeader.Wrapper>
+
+      <NavigationTab
+        tabs={[
+          {
+            title: translate('text_62d175066d2dbf1d50bc937c'),
+            link: generatePath(NEW_ANALYTIC_TABS_ROUTE, {
+              tab: NewAnalyticsTabsOptionsEnum.revenueStreams,
+            }),
+            match: [
+              generatePath(NEW_ANALYTIC_ROUTE),
+              generatePath(NEW_ANALYTIC_TABS_ROUTE, {
+                tab: NewAnalyticsTabsOptionsEnum.revenueStreams,
+              }),
+            ],
+            component: <RevenueStreams />,
+          },
+          {
+            title: translate('text_6553885df387fd0097fd738c'),
+            link: generatePath(NEW_ANALYTIC_TABS_ROUTE, {
+              tab: NewAnalyticsTabsOptionsEnum.mrr,
+            }),
+            component: <Mrr />,
+          },
+          {
+            title: translate('text_17391997655892qv3sstq46n'),
+            link: generatePath(NEW_ANALYTIC_TABS_ROUTE, {
+              tab: NewAnalyticsTabsOptionsEnum.usage,
+            }),
+            component: <Usage />,
+          },
+          {
+            title: translate('text_637ccf8133d2c9a7d11ce6e1'),
+            link: generatePath(NEW_ANALYTIC_TABS_ROUTE, {
+              tab: NewAnalyticsTabsOptionsEnum.prepaidCredits,
+            }),
+            component: <PrepaidCredits />,
+          },
+          {
+            title: translate('text_63ac86d797f728a87b2f9f85'),
+            link: generatePath(NEW_ANALYTIC_TABS_ROUTE, {
+              tab: NewAnalyticsTabsOptionsEnum.invoices,
+            }),
+            component: <Invoices />,
+          },
+        ]}
+      />
+
+      <Outlet />
+    </>
+  )
+}
+
+export default NewAnalytics

src/pages/analytics/PrepaidCredits.tsx

@@ -0,0 +1,5 @@
+const PrepaidCredits = () => {
+  return <>Prepaid Credits content</>
+}
+
+export default PrepaidCredits

src/pages/analytics/RevenueStreams.tsx

@@ -0,0 +1,5 @@
+const RevenueStreams = () => {
+  return <>Revenue Streams content</>
+}
+
+export default RevenueStreams

src/pages/analytics/Usage.tsx

@@ -0,0 +1,5 @@
+const Usage = () => {
+  return <>Usage revenues content</>
+}
+
+export default Usage

translations/base.json

@@ -2822,6 +2822,6 @@
   "text_17385950520558ttf6sv58s0": "Partner name",
   "text_1738595318403vcyh77pwiew": "Partner billing",
   "text_1738605383523lme9aweoipp": "This invoice has been generated on behalf of this partner.",
-  "text_1738748043939zqoqzz350yj": "Refresh"
+  "text_1738748043939zqoqzz350yj": "Refresh",
+  "text_17391997655892qv3sstq46n": "Usage revenue"
 }
-