feat: add redirect logic on landing page

src/app/(mobile-ui)/profile/exchange-rate/page.tsx

@@ -3,9 +3,9 @@
 import PageContainer from '@/components/0_Bruddle/PageContainer'
 import ExchangeRateWidget from '@/components/Global/ExchangeRateWidget'
 import NavHeader from '@/components/Global/NavHeader'
-import countryCurrencyMappings from '@/constants/countryCurrencyMapping'
 import { useWallet } from '@/hooks/wallet/useWallet'
 import { printableUsdc } from '@/utils'
+import { getExchangeRateWidgetRedirectRoute } from '@/utils/exchangeRateWidget.utils'
 import { useRouter } from 'next/navigation'
 import { useEffect } from 'react'
 
@@ -14,52 +14,10 @@ export default function ExchangeRatePage() {
     const { fetchBalance, balance } = useWallet()
 
     const handleCtaAction = (sourceCurrency: string, destinationCurrency: string) => {
-        let route = '/add-money'
-        let countryPath: string | undefined = ''
+        const formattedBalance = parseFloat(printableUsdc(balance ?? 0n))
 
-        // Case 1: source currency is not usd and destination currency is usd -> redirect to add-money/sourceCurrencyCountry page
-        if (sourceCurrency !== 'USD' && destinationCurrency === 'USD') {
-            countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.path
-            route = '/add-money'
-        }
-
-        // Case 2: source currency is usd and destination currency is not usd -> redirect to withdraw/destinationCurrencyCountry page
-        if (sourceCurrency === 'USD' && destinationCurrency !== 'USD') {
-            const formattedBalance = printableUsdc(balance ?? 0n)
-
-            // if there is no balance, redirect to add-money
-            if (parseFloat(formattedBalance) <= 0) {
-                countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.path
-                route = '/add-money'
-            } else {
-                countryPath = countryCurrencyMappings.find(
-                    (currency) => currency.currencyCode === destinationCurrency
-                )?.path
-                route = '/withdraw'
-            }
-        }
-
-        // Case 3: source currency is not usd and destination currency is not usd -> redirect to add-money/sourceCurrencyCountry page
-        if (sourceCurrency !== 'USD' && destinationCurrency !== 'USD') {
-            countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.path
-            route = '/add-money'
-        }
-
-        if (sourceCurrency === 'USD' && destinationCurrency === 'USD') {
-            const formattedBalance = parseFloat(printableUsdc(balance ?? 0n))
-            // Either redirect to a relevant page or show an error
-            // For now, routing to USA add-money page as an example
-            countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === 'USD')?.path
-            route = formattedBalance <= 0 ? '/add-money' : '/withdraw'
-        }
-
-        if (!countryPath) {
-            const redirectRoute = `${route}?currencyCode=EUR`
-            router.push(redirectRoute)
-        } else {
-            const redirectRoute = `${route}/${countryPath}`
-            router.push(redirectRoute)
-        }
+        const redirectRoute = getExchangeRateWidgetRedirectRoute(sourceCurrency, destinationCurrency, formattedBalance)
+        router.push(redirectRoute)
     }
 
     useEffect(() => {

src/components/LandingPage/noFees.tsx

@@ -8,10 +8,27 @@ import { Star } from '@/assets'
 import Image from 'next/image'
 import ExchangeRateWidget from '../Global/ExchangeRateWidget'
 import { useRouter } from 'next/navigation'
+import { printableUsdc } from '@/utils'
+import { getExchangeRateWidgetRedirectRoute } from '@/utils/exchangeRateWidget.utils'
+import { useWallet } from '@/hooks/wallet/useWallet'
+import { useAuth } from '@/context/authContext'
 
 export function NoFees() {
     const [screenWidth, setScreenWidth] = useState(typeof window !== 'undefined' ? window.innerWidth : 1200)
     const router = useRouter()
+    const { fetchBalance, balance } = useWallet()
+    const { user } = useAuth()
+
+    const handleCtaAction = (sourceCurrency: string, destinationCurrency: string) => {
+        if (!user) {
+            router.push('/setup')
+            return
+        }
+        const formattedBalance = parseFloat(printableUsdc(balance ?? 0n))
+
+        const redirectRoute = getExchangeRateWidgetRedirectRoute(sourceCurrency, destinationCurrency, formattedBalance)
+        router.push(redirectRoute)
+    }
 
     useEffect(() => {
         const handleResize = () => {
@@ -23,6 +40,12 @@ export function NoFees() {
         return () => window.removeEventListener('resize', handleResize)
     }, [])
 
+    useEffect(() => {
+        if (user) {
+            fetchBalance()
+        }
+    }, [user])
+
     const createCloudAnimation = (side: 'left' | 'right', top: string, width: number, speed: number) => {
         const vpWidth = screenWidth || 1080
         const totalDistance = vpWidth + width
@@ -124,11 +147,7 @@ export function NoFees() {
                     />
                 </div>
 
-                <ExchangeRateWidget
-                    ctaIcon="arrow-up-right"
-                    ctaLabel="Send Money"
-                    ctaAction={() => router.push('/setup')}
-                />
+                <ExchangeRateWidget ctaIcon="arrow-up-right" ctaLabel="Send Money" ctaAction={handleCtaAction} />
             </div>
         </section>
     )

src/utils/exchangeRateWidget.utils.ts

@@ -0,0 +1,50 @@
+import countryCurrencyMappings from '@/constants/countryCurrencyMapping'
+
+export const getExchangeRateWidgetRedirectRoute = (
+    sourceCurrency: string,
+    destinationCurrency: string,
+    userBalance: number
+): string => {
+    let route = '/add-money'
+    let countryPath: string | undefined = ''
+
+    // Case 1: source currency is not usd and destination currency is usd -> redirect to add-money/sourceCurrencyCountry page
+    if (sourceCurrency !== 'USD' && destinationCurrency === 'USD') {
+        countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.path
+        route = '/add-money'
+    }
+
+    // Case 2: source currency is usd and destination currency is not usd -> redirect to withdraw/destinationCurrencyCountry page
+    if (sourceCurrency === 'USD' && destinationCurrency !== 'USD') {
+        // if there is no balance, redirect to add-money
+        if (userBalance <= 0) {
+            countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.path
+            route = '/add-money'
+        } else {
+            countryPath = countryCurrencyMappings.find(
+                (currency) => currency.currencyCode === destinationCurrency
+            )?.path
+            route = '/withdraw'
+        }
+    }
+
+    // Case 3: source currency is not usd and destination currency is not usd -> redirect to add-money/sourceCurrencyCountry page
+    if (sourceCurrency !== 'USD' && destinationCurrency !== 'USD') {
+        countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === sourceCurrency)?.path
+        route = '/add-money'
+    }
+
+    // Case 4: source currency is usd and destination currency is usd
+    if (sourceCurrency === 'USD' && destinationCurrency === 'USD') {
+        countryPath = countryCurrencyMappings.find((currency) => currency.currencyCode === 'USD')?.path
+        route = userBalance <= 0 ? '/add-money' : '/withdraw'
+    }
+
+    if (!countryPath) {
+        const redirectRoute = `${route}?currencyCode=EUR`
+        return redirectRoute
+    } else {
+        const redirectRoute = `${route}/${countryPath}`
+        return redirectRoute
+    }
+}