From 740bca01a5cabc93ae9d7abecffeb6b390b196f8 Mon Sep 17 00:00:00 2001
From: siddharth <siddharthtiwarikreplind@gmail.com>
Date: Tue, 23 Apr 2024 23:26:08 +0530
Subject: [PATCH] feat(dashboard): adding button for callbackPortalUrl

---
 apps/dashboard/app/callback/page.tsx          |  3 +-
 .../components/callback/callback-input.tsx    | 32 +++++++++++++++----
 apps/dashboard/services/graphql/generated.ts  |  3 +-
 .../services/graphql/queries/me-data.ts       |  1 +
 4 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/apps/dashboard/app/callback/page.tsx b/apps/dashboard/app/callback/page.tsx
index 8fbc679029..efc088ae35 100644
--- a/apps/dashboard/app/callback/page.tsx
+++ b/apps/dashboard/app/callback/page.tsx
@@ -26,6 +26,7 @@ export default async function page() {
   }
 
   const endpoints = response.data.me?.defaultAccount.callbackEndpoints || []
+  const callbackPortalUrl = session?.userData?.data?.me?.defaultAccount.callbackPortalUrl
 
   return (
     <ContentContainer>
@@ -36,7 +37,7 @@ export default async function page() {
           width: "100%",
         }}
       >
-        <CreateCallBack />
+        <CreateCallBack callbackPortalUrl={callbackPortalUrl} />
         <Box
           sx={{
             display: {
diff --git a/apps/dashboard/components/callback/callback-input.tsx b/apps/dashboard/components/callback/callback-input.tsx
index 3c9c454ce5..90a83fba03 100644
--- a/apps/dashboard/components/callback/callback-input.tsx
+++ b/apps/dashboard/components/callback/callback-input.tsx
@@ -12,12 +12,18 @@ import InfoOutlined from "@mui/icons-material/InfoOutlined"
 
 import { useFormStatus, useFormState } from "react-dom"
 
+import Link from "next/link"
+
 import FormSubmitButton from "../form-submit-button"
 
 import { createCallbackAction } from "@/app/callback/server-actions"
 import { CallBackAdditionResponse } from "@/app/callback/callback.types"
 
-function CreateCallBack() {
+type Props = {
+  callbackPortalUrl: string | undefined
+}
+
+function CreateCallBack({ callbackPortalUrl }: Props) {
   const [open, setOpen] = useState<boolean>(false)
   const { pending } = useFormStatus()
   const [state, formAction] = useFormState<CallBackAdditionResponse, FormData>(
@@ -118,13 +124,25 @@ function CreateCallBack() {
         <Typography id="modal-desc" textColor="text.tertiary" textAlign="left">
           Attach Callback Endpoints
         </Typography>
-        <Button
-          data-testid="add-callback-btn"
-          loading={pending}
-          onClick={() => setOpen(true)}
+        <Box
+          sx={{
+            display: "flex",
+            gap: 2,
+          }}
         >
-          <AddIcon />
-        </Button>
+          {callbackPortalUrl && (
+            <Link href={callbackPortalUrl} passHref target="_blank">
+              <Button>Callback Portal</Button>
+            </Link>
+          )}
+          <Button
+            data-testid="add-callback-btn"
+            loading={pending}
+            onClick={() => setOpen(true)}
+          >
+            <AddIcon />
+          </Button>
+        </Box>
       </Box>
     </>
   )
diff --git a/apps/dashboard/services/graphql/generated.ts b/apps/dashboard/services/graphql/generated.ts
index cede833f7f..fc9de21e88 100644
--- a/apps/dashboard/services/graphql/generated.ts
+++ b/apps/dashboard/services/graphql/generated.ts
@@ -2420,7 +2420,7 @@ export type GetDefaultWalletByUsernameQuery = { readonly __typename: 'Query', re
 export type MeQueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type MeQuery = { readonly __typename: 'Query', readonly me?: { readonly __typename: 'User', readonly createdAt: number, readonly id: string, readonly language: string, readonly phone?: string | null, readonly totpEnabled: boolean, readonly username?: string | null, readonly defaultAccount: { readonly __typename: 'ConsumerAccount', readonly defaultWalletId: string, readonly displayCurrency: string, readonly id: string, readonly level: AccountLevel, readonly wallets: ReadonlyArray<{ readonly __typename: 'BTCWallet', readonly accountId: string, readonly balance: number, readonly id: string, readonly pendingIncomingBalance: number, readonly walletCurrency: WalletCurrency } | { readonly __typename: 'UsdWallet', readonly accountId: string, readonly balance: number, readonly id: string, readonly pendingIncomingBalance: number, readonly walletCurrency: WalletCurrency }> }, readonly email?: { readonly __typename: 'Email', readonly address?: string | null, readonly verified?: boolean | null } | null } | null };
+export type MeQuery = { readonly __typename: 'Query', readonly me?: { readonly __typename: 'User', readonly createdAt: number, readonly id: string, readonly language: string, readonly phone?: string | null, readonly totpEnabled: boolean, readonly username?: string | null, readonly defaultAccount: { readonly __typename: 'ConsumerAccount', readonly defaultWalletId: string, readonly displayCurrency: string, readonly id: string, readonly level: AccountLevel, readonly callbackPortalUrl: string, readonly wallets: ReadonlyArray<{ readonly __typename: 'BTCWallet', readonly accountId: string, readonly balance: number, readonly id: string, readonly pendingIncomingBalance: number, readonly walletCurrency: WalletCurrency } | { readonly __typename: 'UsdWallet', readonly accountId: string, readonly balance: number, readonly id: string, readonly pendingIncomingBalance: number, readonly walletCurrency: WalletCurrency }> }, readonly email?: { readonly __typename: 'Email', readonly address?: string | null, readonly verified?: boolean | null } | null } | null };
 
 export type RealtimePriceQueryVariables = Exact<{
   currency?: InputMaybe<Scalars['DisplayCurrency']['input']>;
@@ -3236,6 +3236,7 @@ export const MeDocument = gql`
         pendingIncomingBalance
         walletCurrency
       }
+      callbackPortalUrl
     }
     totpEnabled
     username
diff --git a/apps/dashboard/services/graphql/queries/me-data.ts b/apps/dashboard/services/graphql/queries/me-data.ts
index 02453b3e05..eef63d7874 100644
--- a/apps/dashboard/services/graphql/queries/me-data.ts
+++ b/apps/dashboard/services/graphql/queries/me-data.ts
@@ -22,6 +22,7 @@ gql`
           pendingIncomingBalance
           walletCurrency
         }
+        callbackPortalUrl
       }
       totpEnabled
       username