@mezo-org/passport 0.4.0-dev.2 → 0.4.0-dev.20

package/src/hooks/useDropdownData.ts

@@ -0,0 +1,160 @@
+import { useBitcoinAccount } from "@mezo-org/orangekit"
+import { useGetCurrentAccount } from "."
+import {
+  CryptoAssetKey,
+  getCryptoAsset,
+  isBitcoinLikeCryptoAsset,
+  isUsdLikeCryptoAsset,
+} from "../utils/cryptoAssets"
+import {
+  formatNumberToCompactString,
+  fromFixedPoint,
+  fromFixedPointToString,
+} from "../utils/numbers"
+import { useAssetsUsdConversion } from "./useAssetsUSDConversion"
+import useWalletAccount from "./useWalletAccount"
+import { formatUsd } from "../utils/currency"
+
+/**
+ * Formats crypto asset to balance details (balance in USD and decimals)
+ * @param type The type of crypto asset
+ * @param balance The balance of crypto asset
+ * @param btcUsdConversionRate The USD conversion rate
+ * @returns The balance details
+ */
+function formatCryptoAsset(
+  type: CryptoAssetKey,
+  balance: bigint,
+  btcUsdConversionRate: number,
+) {
+  const { decimals } = getCryptoAsset(type)
+
+  const nativeBalance = fromFixedPoint(balance, decimals)
+  let balanceInUsd = 0
+  if (isBitcoinLikeCryptoAsset(type)) {
+    balanceInUsd = fromFixedPoint(
+      balance * BigInt(btcUsdConversionRate),
+      decimals,
+    )
+  }
+  if (isUsdLikeCryptoAsset(type)) {
+    balanceInUsd = nativeBalance
+  }
+
+  return {
+    type,
+    balance: fromFixedPointToString(
+      balance,
+      decimals,
+      isUsdLikeCryptoAsset(type) ? 2 : 4,
+    ),
+    balanceInUsd: formatUsd(balanceInUsd),
+  }
+}
+
+export type DropdownCryptoAsset<T = CryptoAssetKey> = {
+  type: T
+  balance: bigint
+}
+
+type DropdownDetailedCryptoAsset = ReturnType<typeof formatCryptoAsset>
+
+export type DropdownData = {
+  mezoId: string
+  accountAddress: string
+  walletAddress: string
+  walletType: "bitcoin" | "evm"
+  totalBalanceInUsd: string
+  formattedNativeAssets: DropdownDetailedCryptoAsset[]
+  matsnet: {
+    mats: string
+    formattedAssets: DropdownDetailedCryptoAsset[]
+  }
+}
+
+type UseDropdownDataOptions = {
+  // This is workaround. It should be read from contracts or fetched from API.
+  evmNativeAssets?: DropdownCryptoAsset[]
+  matsnetAssets?: DropdownCryptoAsset[]
+}
+
+/**
+ * Aggregates dropdown data for Dropdown component.
+ * @param options - Options for the dropdown data.
+ * @param options.evmNativeAssets - Native assets for EVM wallet.
+ * @param options.matsnetAssets - Matsnet tokens. Rendered as separate section.
+ * @returns Dropdown data.
+ * @dev This hook is for internal use only.
+ */
+export default function useDropdownData(
+  options?: UseDropdownDataOptions,
+): DropdownData | null {
+  const { evmNativeAssets = [], matsnetAssets = [] } = options || {}
+
+  const { btcBalance } = useBitcoinAccount()
+  const {
+    address: walletAddress,
+    networkFamily,
+    isConnected,
+  } = useWalletAccount()
+  const { data: passportAccount } = useGetCurrentAccount()
+  const { data: assetsUsdConversion } = useAssetsUsdConversion()
+
+  const accountAddress = passportAccount?.linkedAccounts?.find(
+    (account) => account.type === "wallet",
+  )?.evmAddress
+
+  if (!walletAddress || !isConnected || !passportAccount || !accountAddress) {
+    return null
+  }
+
+  const mezoId = passportAccount.mezoId!
+
+  const nativeAssets: DropdownCryptoAsset[] =
+    networkFamily === "bitcoin"
+      ? [
+          {
+            type: "btc",
+            balance: BigInt(btcBalance?.total ?? 0),
+          },
+        ]
+      : evmNativeAssets
+
+  const btcUsdConversionRate = Number(assetsUsdConversion?.btcUsd ?? 0)
+
+  const formattedNativeAssets = nativeAssets.map((asset) =>
+    formatCryptoAsset(asset.type, asset.balance, btcUsdConversionRate),
+  )
+
+  const totalBalanceInUsd = formatUsd(
+    nativeAssets.reduce((sum, value) => {
+      const { decimals } = getCryptoAsset(value.type)
+      return (
+        sum +
+        fromFixedPoint(value.balance * BigInt(btcUsdConversionRate), decimals)
+      )
+    }, 0),
+  )
+
+  const matsBalance = formatNumberToCompactString(
+    passportAccount.mats.totalMats,
+    2,
+  )
+
+  const matsnetFormattedAssets = matsnetAssets.map((asset) =>
+    formatCryptoAsset(asset.type, asset.balance, btcUsdConversionRate),
+  )
+
+  return {
+    mezoId,
+    accountAddress,
+    walletAddress,
+    walletType: networkFamily,
+    totalBalanceInUsd,
+    formattedNativeAssets,
+    matsnet: {
+      mats: matsBalance,
+      formattedAssets: matsnetFormattedAssets,
+    },
+  }
+}

package/src/hooks/useEnsureNoSessionAndFetchNonce.ts

@@ -0,0 +1,46 @@
+import { useCallback } from "react"
+import { useGetSession } from "./useGetSession"
+import { useSignOut } from "./useSignOut"
+
+function useEnsureNoSessionAndFetchNonce() {
+  const { refetch: getSession } = useGetSession(undefined, {
+    enabled: false,
+    retry: false,
+  })
+  const { signOutAsync } = useSignOut()
+
+  const getAndValidateSession = useCallback(async () => {
+    const getSessionResult = await getSession()
+
+    // TODO: We should create a separate endpoint that will always return nonce
+    if (getSessionResult.error) {
+      throw new Error(
+        `Sign in error: Failed to fetch the current session: ${getSessionResult.error}`,
+      )
+    }
+    if (!getSessionResult.data) {
+      throw new Error(
+        "Sign in error: Failed to fetch the current session; no data returned.",
+      )
+    }
+
+    return getSessionResult.data
+  }, [getSession])
+
+  const ensureNoSessionAndFetchNonce = useCallback(async () => {
+    let getSessionResult = await getAndValidateSession()
+
+    if (!("nonce" in getSessionResult)) {
+      // If there is active session we are terminating it
+      await signOutAsync()
+      // Because we've signed out we can assume nonce will be returned here
+      getSessionResult = (await getAndValidateSession()) as { nonce: string }
+    }
+
+    return getSessionResult.nonce
+  }, [getAndValidateSession, signOutAsync])
+
+  return { ensureNoSessionAndFetchNonce }
+}
+
+export { useEnsureNoSessionAndFetchNonce }

package/src/hooks/useGetAccountByAddress.ts

@@ -1,19 +1,25 @@
-import { useQuery, skipToken } from "@tanstack/react-query"
+import { useQuery, skipToken, UseBaseQueryOptions } from "@tanstack/react-query"
 import { useAuthApiClient } from "./useAuthApiClient"
 import { QUERY_KEYS } from "./constants"
 import { ONE_MINUTE_MS } from "../utils/time"
+import type { GetAccountByMezoIdOrAddressResponse } from "../api"
 
-export function useGetAccountByAddress(address?: string, useQueryOptions = {}) {
+export function useGetAccountByAddress(
+  address?: string,
+  queryOptions: Omit<
+    UseBaseQueryOptions<GetAccountByMezoIdOrAddressResponse | null>,
+    "queryKey" | "queryFn"
+  > = {},
+) {
   const authApiClient = useAuthApiClient()
 
   return useQuery({
-    queryKey: [QUERY_KEYS.ACCOUNT_BY_ADDRESS, address],
+    queryKey: [QUERY_KEYS.ACCOUNT, address],
     queryFn: address
       ? () => authApiClient.getAccountByMezoIdOrAddress(address)
       : skipToken,
     staleTime: ONE_MINUTE_MS,
     retry: 1,
-    enabled: !!address,
-    ...useQueryOptions,
+    ...queryOptions,
   })
 }

package/src/hooks/useGetAccountByMezoId.ts

@@ -1,19 +1,25 @@
-import { useQuery, skipToken } from "@tanstack/react-query"
+import { useQuery, skipToken, UseBaseQueryOptions } from "@tanstack/react-query"
 import { useAuthApiClient } from "./useAuthApiClient"
 import { QUERY_KEYS } from "./constants"
 import { ONE_MINUTE_MS } from "../utils/time"
+import type { GetAccountByMezoIdOrAddressResponse } from "../api"
 
-export function useGetAccountByMezoId(mezoId?: string, useQueryOptions = {}) {
+export function useGetAccountByMezoId(
+  mezoId?: string,
+  queryOptions: Omit<
+    UseBaseQueryOptions<GetAccountByMezoIdOrAddressResponse | null>,
+    "queryKey" | "queryFn"
+  > = {},
+) {
   const authApiClient = useAuthApiClient()
 
   return useQuery({
-    queryKey: [QUERY_KEYS.ACCOUNT_BY_MEZO_ID, mezoId],
+    queryKey: [QUERY_KEYS.ACCOUNT, mezoId],
     queryFn: mezoId
       ? () => authApiClient.getAccountByMezoIdOrAddress(mezoId)
       : skipToken,
     staleTime: ONE_MINUTE_MS,
     retry: 1,
-    enabled: !!mezoId,
-    ...useQueryOptions,
+    ...queryOptions,
   })
 }

package/src/hooks/useGetCurrentAccount.ts

@@ -1,16 +1,62 @@
-import { useQuery } from "@tanstack/react-query"
-import { useAuthApiClient } from "./useAuthApiClient"
-import { QUERY_KEYS } from "./constants"
+import { UseBaseQueryOptions, useQuery } from "@tanstack/react-query"
 import { ONE_MINUTE_MS } from "../utils/time"
+import { QUERY_KEYS } from "./constants"
+import { useAuthApiClient } from "./useAuthApiClient"
+import { usePortalApiClient } from "./usePortalApiClient"
+import type { GetCurrentAccountResponse } from "../api"
 
-export function useGetCurrentAccount(useQueryOptions = {}) {
+type GetCurrentAccountResponseWithMats = GetCurrentAccountResponse & {
+  mats: {
+    totalMats: number
+  }
+}
+
+export function useGetCurrentAccount(
+  queryOptions: Omit<
+    UseBaseQueryOptions<GetCurrentAccountResponseWithMats>,
+    "queryKey" | "queryFn"
+  > = {},
+) {
   const authApiClient = useAuthApiClient()
+  const portalApiClient = usePortalApiClient()
 
   return useQuery({
-    queryKey: [QUERY_KEYS.CURRENT_ACCOUNT],
-    queryFn: () => authApiClient.getCurrentAccount(),
+    queryKey: [QUERY_KEYS.ACCOUNT, QUERY_KEYS.CURRENT],
+    queryFn: async () => {
+      const currentAccount = await authApiClient.getCurrentAccount()
+      const linkedWallets = currentAccount?.linkedAccounts?.filter(
+        (account) => account.type === "wallet",
+      )
+      if (!linkedWallets || linkedWallets.length === 0) {
+        return {
+          ...currentAccount,
+          mats: {
+            totalMats: 0,
+          },
+        }
+      }
+
+      const addresses = linkedWallets.map(
+        (account) => account.btcAddress || account.evmAddress,
+      )
+      const mats = await Promise.all(
+        addresses.map((address) => portalApiClient.getPortalMats(address)),
+      )
+
+      const totalMats = mats.reduce(
+        (sumMats, currentMats) => sumMats + currentMats.totalMats,
+        0,
+      )
+
+      return {
+        ...currentAccount,
+        mats: {
+          totalMats,
+        },
+      }
+    },
     staleTime: ONE_MINUTE_MS,
     retry: 1,
-    ...useQueryOptions,
+    ...queryOptions,
   })
 }

package/src/hooks/useGetSession.ts

@@ -1,15 +1,22 @@
-import { useQuery } from "@tanstack/react-query"
+import { useQuery, UseBaseQueryOptions } from "@tanstack/react-query"
 import { useAuthApiClient } from "./useAuthApiClient"
 import { QUERY_KEYS } from "./constants"
 import { ONE_MINUTE_MS } from "../utils/time"
+import type { GetSessionResponse } from "../api"
 
-export function useGetSession(code?: string, useQueryOptions = {}) {
+export function useGetSession(
+  code?: string,
+  queryOptions: Omit<
+    UseBaseQueryOptions<GetSessionResponse>,
+    "queryKey" | "queryFn"
+  > = {},
+) {
   const authApiClient = useAuthApiClient()
   return useQuery({
     queryKey: [QUERY_KEYS.SESSION, code],
     queryFn: () => authApiClient.getSession(code),
     staleTime: ONE_MINUTE_MS,
     retry: 1,
-    ...useQueryOptions,
+    ...queryOptions,
   })
 }

package/src/hooks/useLinkAccount.ts

@@ -1,44 +1,32 @@
-import { useQueryClient, useMutation } from "@tanstack/react-query"
+import {
+  useQueryClient,
+  useMutation,
+  MutationOptions,
+  DefaultError,
+} from "@tanstack/react-query"
 import { useAuthApiClient } from "./useAuthApiClient"
-import { LinkAccountRequest } from "../api/auth"
+import type { LinkAccountRequest, LinkAccountResponse } from "../api"
 import { QUERY_KEYS } from "./constants"
 
-export function useLinkAccount(useMutationOptions = {}) {
+export function useLinkAccount(
+  mutationOptions: Omit<
+    MutationOptions<LinkAccountResponse, DefaultError, LinkAccountRequest>,
+    "mutationFn" | "mutationKey"
+  > = {},
+) {
   const queryClient = useQueryClient()
   const authApiClient = useAuthApiClient()
 
+  const { onSuccess: customOnSuccess, ...restMutationOptions } = mutationOptions
+
   const { mutate, mutateAsync, ...rest } = useMutation({
     mutationFn: (linkAccountRequest: LinkAccountRequest) =>
       authApiClient.linkAccount(linkAccountRequest),
-    onSuccess: (data) => {
-      if ("user_metadata" in data) {
-        if (data.user_metadata.mezoId) {
-          queryClient.setQueryData(
-            [QUERY_KEYS.ACCOUNT_BY_MEZO_ID, data.user_metadata.mezoId],
-            data,
-          )
-        }
-
-        queryClient.setQueryData(
-          [QUERY_KEYS.ACCOUNT_BY_ADDRESS, data.user_metadata.btcAddress],
-          data,
-        )
-        queryClient.setQueryData(
-          [QUERY_KEYS.ACCOUNT_BY_ADDRESS, data.user_metadata.evmAddress],
-          data,
-        )
-      } else {
-        queryClient.resetQueries({
-          queryKey: [QUERY_KEYS.ACCOUNT_BY_MEZO_ID],
-          exact: false,
-        })
-        queryClient.resetQueries({
-          queryKey: [QUERY_KEYS.ACCOUNT_BY_ADDRESS],
-          exact: false,
-        })
-      }
+    onSuccess: (data, variables, context) => {
+      queryClient.resetQueries({ queryKey: [QUERY_KEYS.ACCOUNT] })
+      if (customOnSuccess) customOnSuccess(data, variables, context)
     },
-    ...useMutationOptions,
+    ...restMutationOptions,
   })
 
   return { linkAccount: mutate, linkAccountAsync: mutateAsync, ...rest }

package/src/hooks/usePortalApiClient.ts

@@ -0,0 +1,6 @@
+import { usePassportContext } from "./usePassportContext"
+
+export function usePortalApiClient() {
+  const { portalApiClient } = usePassportContext()
+  return portalApiClient
+}

package/src/hooks/useRefreshPassport.ts

@@ -0,0 +1,40 @@
+import { useQueryClient } from "@tanstack/react-query"
+import { useCallback } from "react"
+import { QUERY_KEYS } from "./constants"
+
+/**
+ * Hook to refresh the passport using query invalidation mechanism.
+ * By calling the refresh function, the latest data will be refetched as soon as possible.
+ *
+ * @example
+ * const { refreshCurrentAccount, refreshUsdConversion } = useRefreshPassport()
+ *
+ * // Call this function to refresh the current account
+ * const handlerefreshCurrentAccount = async () => {
+ *   await refreshCurrentAccount()
+ * }
+ */
+export function useRefreshPassport() {
+  const queryClient = useQueryClient()
+
+  const refreshCurrentAccount = useCallback(
+    () =>
+      queryClient.invalidateQueries({
+        queryKey: [QUERY_KEYS.ACCOUNT, QUERY_KEYS.CURRENT],
+      }),
+    [queryClient],
+  )
+
+  const refreshUsdConversion = useCallback(
+    () =>
+      queryClient.invalidateQueries({
+        queryKey: [QUERY_KEYS.ASSETS_USD_CONVERSION],
+      }),
+    [queryClient],
+  )
+
+  return {
+    refreshCurrentAccount,
+    refreshUsdConversion,
+  }
+}

package/src/hooks/useSignInWithDiscord.ts

@@ -1,42 +1,33 @@
-import { useAccount } from "wagmi"
-import { useMutation } from "@tanstack/react-query"
-import { useGetSession } from "./useGetSession"
+import { MutationOptions, useMutation } from "@tanstack/react-query"
 import { useCreateSession } from "./useCreateSession"
+import { useEnsureNoSessionAndFetchNonce } from "./useEnsureNoSessionAndFetchNonce"
+import type { AuthenticationProviderRedirectResponse } from "../api"
 
-function useSignInWithDiscord() {
-  const { address } = useAccount()
-  const { refetch: getSession } = useGetSession(undefined, {
-    enabled: false,
-  })
+function useSignInWithDiscord(
+  mutationOptions: Omit<
+    MutationOptions<AuthenticationProviderRedirectResponse>,
+    "mutationFn" | "mutationKey"
+  > = {},
+) {
+  const { ensureNoSessionAndFetchNonce } = useEnsureNoSessionAndFetchNonce()
   const { createSessionAsync } = useCreateSession()
 
   const { mutate, mutateAsync, ...signInMutationRestParameters } = useMutation({
-    mutationFn: async () => {
-      if (!address) {
-        throw new Error("Sign in error: User not connected!")
-      }
-
-      const getSessionResult = await getSession()
-
-      // TODO: We should create a separate endpoint that will always return nonce
-      if (!getSessionResult.data || !("nonce" in getSessionResult.data)) {
-        if (getSessionResult.error) {
-          throw new Error(`Sign in error: ${getSessionResult.error}`)
-        }
-        throw new Error(
-          "Sign in error: Nonce not available! Remove the session first.",
-        )
-      }
+    mutationFn: async (): Promise<AuthenticationProviderRedirectResponse> => {
+      await ensureNoSessionAndFetchNonce()
 
-      return createSessionAsync({
+      return (await createSessionAsync({
         type: "discord",
-      })
+      })) as AuthenticationProviderRedirectResponse
+      // ^ By passing type: "discord" we know for sure the return type is
+      // AuthenticationProviderRedirectResponse
     },
+    ...mutationOptions,
   })
 
   return {
-    signIn: mutate,
-    signInAsync: mutateAsync,
+    signInWithDiscord: mutate,
+    signInWithDiscordAsync: mutateAsync,
     ...signInMutationRestParameters,
   }
 }

package/src/hooks/useSignInWithWallet.ts

@@ -1,61 +1,20 @@
-import { useAccount, useSignMessage } from "wagmi"
-import { useBitcoinAccount } from "@mezo-org/orangekit"
-import { useMutation } from "@tanstack/react-query"
-import { useGetSession } from "./useGetSession"
-import { useCreateSession } from "./useCreateSession"
-import { createSignInWithWalletMessage } from "../utils/siww"
+import { MutationOptions } from "@tanstack/react-query"
+import { useAuthenticateWithWallet } from "./useAuthenticateWithWallet"
+import type { Session } from "../api"
 
-function useSignInWithWallet() {
-  console.log("use sign int with wallet broooo")
-  const { chainId, address, connector } = useAccount()
-  const { btcAddress } = useBitcoinAccount()
-  const { refetch: getSession } = useGetSession(undefined, {
-    enabled: false,
-  })
-  const { createSessionAsync } = useCreateSession()
-  const { signMessageAsync } = useSignMessage()
-
-  const { mutate, mutateAsync, ...signInMutationRestParameters } = useMutation({
-    mutationFn: async () => {
-      if (!address) {
-        throw new Error("Sign in error: User not connected!")
-      }
-
-      const getSessionResult = await getSession()
-
-      // TODO: We should create a separate endpoint that will always return nonce
-      if (!getSessionResult.data || !("nonce" in getSessionResult.data)) {
-        if (getSessionResult.error) {
-          throw new Error(`Sign in error: ${getSessionResult.error}`)
-        }
-        throw new Error(
-          "Sign in error: Nonce not available! Remove the session first.",
-        )
-      }
-
-      const networkFamily = btcAddress ? "bitcoin" : "evm"
-      const messageResult = createSignInWithWalletMessage(
-        btcAddress ? btcAddress! : address!,
-        getSessionResult.data.nonce,
-        networkFamily,
-        chainId,
-      )
-      const signatureResult = await signMessageAsync({
-        message: messageResult,
-        connector,
-      })
-      return createSessionAsync({
-        type: "wallet",
-        message: messageResult,
-        signature: signatureResult,
-      })
-    },
-  })
+function useSignInWithWallet(
+  mutationOptions: Omit<
+    MutationOptions<Session>,
+    "mutationFn" | "mutationKey"
+  > = {},
+) {
+  const { authenticateWithWallet, authenticateWithWalletAsync, ...rest } =
+    useAuthenticateWithWallet(false, mutationOptions)
 
   return {
-    signIn: mutate,
-    signInAsync: mutateAsync,
-    ...signInMutationRestParameters,
+    signInWithWallet: authenticateWithWallet,
+    signInWithWalletAsync: authenticateWithWalletAsync,
+    ...rest,
   }
 }
 

package/src/hooks/useSignOut.ts

@@ -1,18 +1,34 @@
-import { useMutation, useQueryClient } from "@tanstack/react-query"
+import {
+  MutationOptions,
+  useMutation,
+  useQueryClient,
+} from "@tanstack/react-query"
 import { useAuthApiClient } from "./useAuthApiClient"
 import { QUERY_KEYS } from "./constants"
+import type { DeleteSessionResponse } from "../api"
 
-export function useSignOut(useMutationOptions = {}) {
+export function useSignOut(
+  mutationOptions: Omit<
+    MutationOptions<DeleteSessionResponse>,
+    "mutationFn" | "mutationKey"
+  > = {},
+) {
   const queryClient = useQueryClient()
   const authApiClient = useAuthApiClient()
 
+  const { onSuccess: customOnSuccess, ...restMutationOptions } = mutationOptions
+
   const { mutate, mutateAsync, ...rest } = useMutation({
     mutationFn: () => authApiClient.deleteSession(),
-    onSuccess: () => {
-      queryClient.resetQueries({ queryKey: [QUERY_KEYS.SESSION], exact: false })
-      queryClient.resetQueries({ queryKey: [QUERY_KEYS.CURRENT_ACCOUNT] })
+    onSuccess: (data, variables, context) => {
+      queryClient.resetQueries({ queryKey: [QUERY_KEYS.SESSION] })
+      queryClient.resetQueries({
+        queryKey: [QUERY_KEYS.ACCOUNT, QUERY_KEYS.CURRENT],
+      })
+
+      if (customOnSuccess) customOnSuccess(data, variables, context)
     },
-    ...useMutationOptions,
+    ...restMutationOptions,
   })
 
   return { signOut: mutate, signOutAsync: mutateAsync, ...rest }

package/src/hooks/useSignUpWithWallet.ts

@@ -0,0 +1,21 @@
+import { MutationOptions } from "@tanstack/react-query"
+import { useAuthenticateWithWallet } from "./useAuthenticateWithWallet"
+import type { Session } from "../api"
+
+function useSignUpWithWallet(
+  mutationOptions: Omit<
+    MutationOptions<Session>,
+    "mutationFn" | "mutationKey"
+  > = {},
+) {
+  const { authenticateWithWallet, authenticateWithWalletAsync, ...rest } =
+    useAuthenticateWithWallet(true, mutationOptions)
+
+  return {
+    signUpWithWallet: authenticateWithWallet,
+    signUpWithWalletAsync: authenticateWithWalletAsync,
+    ...rest,
+  }
+}
+
+export { useSignUpWithWallet }