feat: getting subscription endpoint

packages/webapp/src/containers/Subscriptions/BillingPage.tsx

@@ -2,6 +2,7 @@
 import * as R from 'ramda';
 import { Button } from '@blueprintjs/core';
 import withAlertActions from '../Alert/withAlertActions';
+import { BillingPageBoot } from './BillingPageBoot';
 
 function BillingPageRoot({ openAlert }) {
   const handleCancelSubBtnClick = () => {
@@ -13,11 +14,13 @@ function BillingPageRoot({ openAlert }) {
   const handleUpdatePaymentMethod = () => {};
 
   return (
-    <h1>
-      <Button onClick={handleCancelSubBtnClick}>Cancel Subscription</Button>
-      <Button onClick={handleResumeSubBtnClick}>Resume Subscription</Button>
-      <Button>Update Payment Method</Button>
-    </h1>
+    <BillingPageBoot>
+      <h1>
+        <Button onClick={handleCancelSubBtnClick}>Cancel Subscription</Button>
+        <Button onClick={handleResumeSubBtnClick}>Resume Subscription</Button>
+        <Button>Update Payment Method</Button>
+      </h1>
+    </BillingPageBoot>
   );
 }
 

packages/webapp/src/containers/Subscriptions/BillingPageBoot.tsx

@@ -1,3 +1,28 @@
-export function BillingPageBoot() {
-  return null;
+import React, { createContext } from 'react';
+import { useGetSubscriptions } from '@/hooks/query/subscription';
+
+interface BillingBootContextValues {
+  isSubscriptionsLoading: boolean;
+  subscriptions: any;
 }
+
+const BillingBoot = createContext<BillingBootContextValues>(
+  {} as BillingBootContextValues,
+);
+
+interface BillingPageBootProps {
+  children: React.ReactNode;
+}
+
+export function BillingPageBoot({ children }: BillingPageBootProps) {
+  const { isLoading: isSubscriptionsLoading, data: subscriptions } =
+    useGetSubscriptions();
+
+  const value = {
+    isSubscriptionsLoading,
+    subscriptions,
+  };
+  return <BillingBoot.Provider value={value}>{children}</BillingBoot.Provider>;
+}
+
+export const useBillingPageBoot = () => React.useContext(BillingBoot);