Skip to content

[TASK-14942] feat(manteca-deposit): fix manteca deposit#1249

Merged
jjramirezn merged 3 commits intofeat/manteca-integrationfrom
feat/manteca-deposit
Sep 24, 2025
Merged

[TASK-14942] feat(manteca-deposit): fix manteca deposit#1249
jjramirezn merged 3 commits intofeat/manteca-integrationfrom
feat/manteca-deposit

Conversation

@jjramirezn
Copy link
Contributor

@jjramirezn jjramirezn commented Sep 24, 2025

Video Demo:

  • It took a little longer than previous tests hmmmm
  • Status is updated via webhook and manteca only supports one webhook (right now pointed at staging) so thats why the history doesn't update
WhatsApp.Video.2025-09-23.at.21.35.17.mp4

@vercel
Copy link

vercel bot commented Sep 24, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
peanut-wallet Ready Ready Preview Comment Sep 24, 2025 3:43pm

@notion-workspace
Copy link

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Sep 24, 2025

Walkthrough

Renames and replaces the MercadoPago onramp flow with a Manteca-based flow: UI components and pages updated to use MantecaAddMoney and MantecaDepositShareDetails, manteca response types expanded, bank-transfer enablement made direction-aware, transaction mappings/receipt rendering adjusted, and several deprecated MercadoPago components removed.

Changes

Cohort / File(s) Summary
Add Money pages
src/app/(mobile-ui)/add-money/[country]/[regional-method]/page.tsx, src/app/(mobile-ui)/add-money/[country]/bank/page.tsx
Swap MercadoPago -> Manteca usage (check method === 'manteca' and render MantecaAddMoney); remove AR-specific MercadoPago branch in bank flow.
AddMoney components (core)
src/components/AddMoney/components/InputAmountStep.tsx, src/components/AddMoney/components/MantecaAddMoney.tsx, src/components/AddMoney/components/MantecaDepositShareDetails.tsx
Stop passing certain TokenAmountInput props; rename MercadoPagoMantecaAddMoney; add MantecaDepositShareDetails component and adapt state/props/types to MantecaDepositResponseData.
Removed/Deprecated components
src/components/AddMoney/components/MantecaDepositCard.tsx, src/components/AddMoney/components/RegionalMethods/MercadoPago/MercadoPagoDepositDetails.tsx
Deleted legacy deposit card and MercadoPago-specific deposit details components.
AddMoney consts
src/components/AddMoney/consts/index.ts
Make bank-transfer enablement direction-aware (withdraw/deposit); add direction-specific enabled sets; restrict Mercado Pago to AR and Pix to BR; add new add-money paths for manteca.
Payment view
src/components/Payment/Views/MantecaFulfillment.view.tsx
Replace multiple detail cards/share UI with single MantecaDepositShareDetails; update data access to nested data.details.*; remove previous share text/logo logic.
Transaction details & mapping
src/components/TransactionDetails/TransactionDetailsReceipt.tsx, src/components/TransactionDetails/transactionTransformer.ts
Add MANTECA_ONRAMP mapping → bank_deposit; unify USD/value row rendering when exchange_rate exists and include bank_withdraw in visibility.
Hooks / Enums
src/hooks/useTransactionHistory.ts
Add MANTECA_ONRAMP enum member to history entry types.
Services & types
src/services/manteca.ts, src/types/manteca.types.ts
Replace MantecaDepositDetails with richer MantecaDepositResponseData; update mantecaApi.deposit return type and consumers to the new shape.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

Possibly related PRs

Suggested reviewers

  • Zishan-7

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (2 passed)
Check name Status Explanation
Title Check ✅ Passed The title "[TASK-14942] feat(manteca-deposit): fix manteca deposit" is concise, includes the task ID, and accurately summarizes the primary intent of the changeset — fixing the Manteca deposit flow across components, types, and services — so it is relevant and readable for reviewers scanning history.
Description Check ✅ Passed The PR description contains a demo link and brief notes about webhook behavior and test timing relevant to the Manteca deposit flow, so it is related to the changeset and not off-topic.
✨ Finishing touches
  • 📝 Generate Docstrings
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch feat/manteca-deposit

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 4

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (3)
src/services/manteca.ts (1)

136-143: API key exposure risk: client code sends PEANUT_API_KEY to the browser

This module is used by client code (uses js-cookie). Including PEANUT_API_KEY here leaks the secret to clients and network requests.

  • Move getPrices to a server‑only module (e.g., an API route or a “use server” action) and have the client call that.
  • Alternatively, keep this endpoint on your backend and remove the client‑side 'api-key' header.

Minimal client‑side mitigation now:

-        const response = await fetchWithSentry(`${PEANUT_API_URL}/manteca/prices?asset=${asset}&against=${against}`, {
-            headers: {
-                'Content-Type': 'application/json',
-                'api-key': PEANUT_API_KEY,
-            },
-        })
+        const response = await fetchWithSentry(`${PEANUT_API_URL}/manteca/prices?asset=${asset}&against=${against}`, {
+            headers: {
+                'Content-Type': 'application/json',
+            },
+        })

I can also extract getPrices to a server‑only module on request.

src/components/TransactionDetails/transactionTransformer.ts (2)

322-329: Include MANTECA_OFFRAMP/ONRAMP in special status mapping

Manteca flows likely use statuses like AWAITING_FUNDS, PAYMENT_SUBMITTED, etc. Without this, UI may show generic statuses.

-    if (
-        entry.type === EHistoryEntryType.BRIDGE_OFFRAMP ||
-        entry.type === EHistoryEntryType.BRIDGE_ONRAMP ||
-        entry.type === EHistoryEntryType.BANK_SEND_LINK_CLAIM ||
-        entry.extraData?.fulfillmentType === 'bridge'
-    ) {
+    if (
+        entry.type === EHistoryEntryType.BRIDGE_OFFRAMP ||
+        entry.type === EHistoryEntryType.BRIDGE_ONRAMP ||
+        entry.type === EHistoryEntryType.MANTECA_OFFRAMP ||
+        entry.type === EHistoryEntryType.MANTECA_ONRAMP ||
+        entry.type === EHistoryEntryType.BANK_SEND_LINK_CLAIM ||
+        entry.extraData?.fulfillmentType === 'bridge'
+    ) {

478-481: Show deposit instructions for MANTECA_ONRAMP too

Currently only shown for BRIDGE_ONRAMP/bridge fulfillment.

-            depositInstructions:
-                entry.type === EHistoryEntryType.BRIDGE_ONRAMP || entry.extraData?.fulfillmentType === 'bridge'
+            depositInstructions:
+                entry.type === EHistoryEntryType.BRIDGE_ONRAMP ||
+                entry.type === EHistoryEntryType.MANTECA_ONRAMP ||
+                entry.extraData?.fulfillmentType === 'bridge'
                     ? entry.extraData?.depositInstructions
                     : undefined,
🧹 Nitpick comments (13)
src/components/AddMoney/consts/index.ts (3)

193-199: New Pix method: potential icon type mismatch

SpecificPaymentMethod.icon is typed as IconName | string | undefined, but PIX is likely a StaticImageData. This can cause TS type errors depending on how assets are typed in @/assets.

  • If assets are StaticImageData, widen the type of SpecificPaymentMethod.icon to include StaticImageData.
  • Otherwise, confirm PIX is a string/IconName.

Update outside this hunk (interface change):

// In this file, update the interface
export interface SpecificPaymentMethod {
  id: string
  icon: IconName | string | StaticImageData | undefined
  title: string
  description: string
  isSoon?: boolean
  path?: string
}

2531-2534: Enabled country sets look fine; consider centralizing source

The withdraw/deposit enablement sets are clear. Consider centralizing these in a config or deriving from a single source to avoid drift over time.


2537-2547: Normalize country codes to uppercase in enablement check

Guard against lowercase inputs to avoid false negatives when checking sets and map keys (per prior learnings, keys are uppercase).

Apply this diff:

-const isCountryEnabledForBankTransfer = (countryCode: string, direction: 'withdraw' | 'deposit'): boolean => {
-    // Direct check for 2-letter codes
-    const enabledCountries = direction === 'withdraw' ? enabledBankWithdrawCountries : enabledBankDepositCountries
-    if (enabledCountries.has(countryCode)) {
-        return true
-    }
-
-    // Check if it's a 3-letter code that maps to an enabled 2-letter code
-    const mappedCode = countryCodeMap[countryCode]
-    return mappedCode ? enabledCountries.has(mappedCode) : false
-}
+const isCountryEnabledForBankTransfer = (countryCode: string, direction: 'withdraw' | 'deposit'): boolean => {
+    const enabledCountries = direction === 'withdraw' ? enabledBankWithdrawCountries : enabledBankDepositCountries
+    const code = countryCode.toUpperCase()
+    if (enabledCountries.has(code)) {
+        return true
+    }
+    // Check if it's a 3-letter code that maps to an enabled 2-letter code
+    const mappedCode = countryCodeMap[code]
+    return mappedCode ? enabledCountries.has(mappedCode) : false
+}
src/types/manteca.types.ts (2)

24-53: Standardize the stages object key typing (string '1' | '2' | '3' vs numeric 1 | 2 | 3)

Withdraw uses numeric keys (1, 2). Deposit uses string keys ('1','2','3'). Please align them to one convention to avoid brittle indexing.

Apply:

-    stages: {
-        '1': {
+    stages: {
+        1: {
             stageType: 'DEPOSIT'
             asset: string
             thresholdAmount: string
             useOverflow: boolean
             expireAt: string
         }
-        '2': {
+        2: {
             stageType: string
             side: string
             type: string
             asset: string
             against: string
             assetAmount: string
             price: string
             priceCode: string
         }
-        '3': {
+        3: {
             stageType: string
             network: string
             asset: string
             amount: string
             to: string
             destination: {
                 address: string
                 bankCode: string
             }
         }
     }

58-62: Consider renaming MercadoPagoStep for clarity

This enum name is now misleading after the Manteca migration. Recommend renaming to OnrampStep or MantecaStep and providing an alias for backwards‑compat.

src/services/manteca.ts (3)

3-7: Sync import with corrected type name (keep alias temporarily)

If you accept the type rename, update the import to the canonical name. The alias will keep things compiling meanwhile.

-import {
-    MantecaDeposiResponseData,
+import {
+    MantecaDepositResponseData,
     MantecaWithdrawData,
     MantecaWithdrawResponse,
     CreateMantecaOnrampParams,
 } from '@/types/manteca.types'

173-176: Align deposit return type with the corrected type

Update the return Promise type accordingly.

-    ): Promise<{ data?: MantecaDeposiResponseData; error?: string }> => {
+    ): Promise<{ data?: MantecaDepositResponseData; error?: string }> => {

192-201: Reduce noisy logs; prefer structured error reporting

Avoid logging raw Response and duplicate logs. Use a single structured log (Sentry) and return a user‑friendly message.

-            if (!response.ok) {
-                console.log('error', response)
-                return { error: data.error || 'Failed to create on-ramp transfer for guest.' }
-            }
+            if (!response.ok) {
+                return { error: data?.error || 'Failed to create on-ramp transfer.' }
+            }
src/hooks/useTransactionHistory.ts (1)

207-214: Handle MANTECA_ONRAMP in amount/token mapping for consistency

Group it with other bank/bridge flows so usdAmount/tokenSymbol are set consistently.

-                    case EHistoryEntryType.WITHDRAW:
-                    case EHistoryEntryType.BRIDGE_OFFRAMP:
-                    case EHistoryEntryType.BRIDGE_ONRAMP:
+                    case EHistoryEntryType.WITHDRAW:
+                    case EHistoryEntryType.BRIDGE_OFFRAMP:
+                    case EHistoryEntryType.BRIDGE_ONRAMP:
+                    case EHistoryEntryType.MANTECA_ONRAMP:
                     case EHistoryEntryType.BANK_SEND_LINK_CLAIM: {
                         tokenSymbol = entry.tokenSymbol
                         usdAmount = entry.amount.toString()
                         break
                     }
src/components/TransactionDetails/transactionTransformer.ts (1)

485-491: Include MANTECA_OFFRAMP in bankAccountDetails

To display bank details on Manteca offramps the same as bridge offramps.

-        bankAccountDetails:
-            entry.type === EHistoryEntryType.BRIDGE_OFFRAMP ||
+        bankAccountDetails:
+            entry.type === EHistoryEntryType.BRIDGE_OFFRAMP ||
+            entry.type === EHistoryEntryType.MANTECA_OFFRAMP ||
             (entry.type === EHistoryEntryType.BANK_SEND_LINK_CLAIM && entry.userRole === EHistoryUserRole.RECIPIENT)
                 ? {
                       identifier: entry.recipientAccount.identifier,
                       type: entry.recipientAccount.type,
                   }
                 : undefined,
src/components/TransactionDetails/TransactionDetailsReceipt.tsx (1)

461-465: USD value row: align formatting with the rest (“$ {amount}”) and avoid toString

Use a leading “$ ” for consistency and pass the amount directly to formatAmount.

-                                <PaymentInfoRow
-                                    label="Value in USD"
-                                    value={`${formatAmount(transaction.amount.toString())} USD`}
-                                />
+                                <PaymentInfoRow
+                                    label="Value in USD"
+                                    value={`$ ${formatAmount(transaction.amount)}`}
+                                />

Also verify for bank_withdraw/qr_payment that transaction.amount is already USD; if not, compute USD via the provided exchange_rate.

src/components/AddMoney/components/MantecaDepositShareDetails.tsx (2)

14-20: Rename component to match file/flow; silence unused prop

Keeps naming consistent and avoids an unused-prop lint warning by prefixing with underscore.

-const MercadoPagoDepositDetails = ({
-    depositDetails,
-    source,
+const MantecaDepositShareDetails = ({
+    depositDetails,
+    source: _source,
 }: {
     depositDetails: MantecaDeposiResponseData
     source: 'bank' | 'regionalMethod'
 }) => {
...
-export default MercadoPagoDepositDetails
+export default MantecaDepositShareDetails

Also applies to: 115-116


88-91: Format amounts consistently via formatAmount

Improves readability and consistency throughout the app.

-                            <p className="text-2xl font-bold">
-                                {currencySymbol} {depositAmount}
-                            </p>
-                            <div className="text-lg font-bold">≈ {usdAmount} USD</div>
+                            <p className="text-2xl font-bold">
+                                {currencySymbol} {formatAmount(depositAmount)}
+                            </p>
+                            <div className="text-lg font-bold">≈ {formatAmount(usdAmount)} USD</div>
...
-                    <PaymentInfoRow label="Exchange Rate" value={`1 USD = ${exchangeRate} ${currencySymbol}`} />
+                    <PaymentInfoRow label="Exchange Rate" value={`1 USD = ${formatAmount(exchangeRate)} ${currencySymbol}`} />

Add missing import:

import { formatAmount } from '@/utils'

Also applies to: 96-99

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9539994 and 07f2796.

📒 Files selected for processing (14)
  • src/app/(mobile-ui)/add-money/[country]/[regional-method]/page.tsx (2 hunks)
  • src/app/(mobile-ui)/add-money/[country]/bank/page.tsx (0 hunks)
  • src/components/AddMoney/components/InputAmountStep.tsx (0 hunks)
  • src/components/AddMoney/components/MantecaAddMoney.tsx (2 hunks)
  • src/components/AddMoney/components/MantecaDepositCard.tsx (0 hunks)
  • src/components/AddMoney/components/MantecaDepositShareDetails.tsx (1 hunks)
  • src/components/AddMoney/components/RegionalMethods/MercadoPago/MercadoPagoDepositDetails.tsx (0 hunks)
  • src/components/AddMoney/consts/index.ts (4 hunks)
  • src/components/Payment/Views/MantecaFulfillment.view.tsx (2 hunks)
  • src/components/TransactionDetails/TransactionDetailsReceipt.tsx (2 hunks)
  • src/components/TransactionDetails/transactionTransformer.ts (1 hunks)
  • src/hooks/useTransactionHistory.ts (1 hunks)
  • src/services/manteca.ts (2 hunks)
  • src/types/manteca.types.ts (1 hunks)
💤 Files with no reviewable changes (4)
  • src/app/(mobile-ui)/add-money/[country]/bank/page.tsx
  • src/components/AddMoney/components/MantecaDepositCard.tsx
  • src/components/AddMoney/components/RegionalMethods/MercadoPago/MercadoPagoDepositDetails.tsx
  • src/components/AddMoney/components/InputAmountStep.tsx
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2025-09-15T16:22:58.382Z
Learnt from: Hugo0
PR: peanutprotocol/peanut-ui#1190
File: src/services/manteca.ts:1-1
Timestamp: 2025-09-15T16:22:58.382Z
Learning: In the manteca service, PEANUT_API_KEY should not be imported in a module that's used by client-side components. The getPrices function that requires the API key should be moved to a server-only module to prevent exposing secrets in the client bundle.

Applied to files:

  • src/services/manteca.ts
📚 Learning: 2024-10-07T15:25:45.170Z
Learnt from: jjramirezn
PR: peanutprotocol/peanut-ui#422
File: src/components/Request/Pay/Views/Initial.view.tsx:76-78
Timestamp: 2024-10-07T15:25:45.170Z
Learning: In `src/components/Request/Pay/Views/Initial.view.tsx`, both `txFee` and `utils.formatTokenAmount(...)` return strings, ensuring that `calculatedFee` consistently returns a string without the need for additional type conversion.

Applied to files:

  • src/components/TransactionDetails/TransactionDetailsReceipt.tsx
📚 Learning: 2025-05-22T15:38:48.586Z
Learnt from: kushagrasarathe
PR: peanutprotocol/peanut-ui#869
File: src/app/(mobile-ui)/withdraw/page.tsx:82-88
Timestamp: 2025-05-22T15:38:48.586Z
Learning: The country-specific withdrawal route exists at src/app/(mobile-ui)/withdraw/[...country]/page.tsx and renders the AddWithdrawCountriesList component with flow="withdraw".

Applied to files:

  • src/app/(mobile-ui)/add-money/[country]/[regional-method]/page.tsx
  • src/components/AddMoney/consts/index.ts
📚 Learning: 2025-08-14T14:42:54.411Z
Learnt from: Zishan-7
PR: peanutprotocol/peanut-ui#1094
File: src/utils/withdraw.utils.ts:181-191
Timestamp: 2025-08-14T14:42:54.411Z
Learning: The countryCodeMap in src/components/AddMoney/consts/index.ts uses uppercase 3-letter country codes as keys (like 'AUT', 'BEL', 'CZE') that map to 2-letter country codes, requiring input normalization to uppercase for proper lookups.

Applied to files:

  • src/components/AddMoney/consts/index.ts
🧬 Code graph analysis (4)
src/services/manteca.ts (1)
src/types/manteca.types.ts (2)
  • CreateMantecaOnrampParams (125-129)
  • MantecaDeposiResponseData (3-56)
src/components/TransactionDetails/TransactionDetailsReceipt.tsx (2)
src/components/Payment/PaymentInfoRow.tsx (1)
  • PaymentInfoRow (17-83)
src/utils/general.utils.ts (1)
  • formatAmount (391-431)
src/components/AddMoney/components/MantecaDepositShareDetails.tsx (4)
src/types/manteca.types.ts (1)
  • MantecaDeposiResponseData (3-56)
src/components/AddMoney/consts/index.ts (1)
  • countryData (288-2456)
src/components/Global/Icons/Icon.tsx (1)
  • Icon (196-205)
src/components/Payment/PaymentInfoRow.tsx (1)
  • PaymentInfoRow (17-83)
src/components/AddMoney/components/MantecaAddMoney.tsx (1)
src/types/manteca.types.ts (1)
  • MantecaDeposiResponseData (3-56)
🔇 Additional comments (11)
src/components/AddMoney/consts/index.ts (5)

179-179: Add-crypto route wired; verify destination exists

Looks good. Please confirm the target route/component for /add-money/crypto exists and is linked in navigation.


186-191: Mercado Pago deposit restricted to AR via Manteca

Path and copy look consistent. Please confirm /add-money/argentina/manteca is implemented and that the AR-only visibility aligns with product intent.


2634-2634: Withdraw isSoon gating uses direction-aware helper correctly

Good use of the new isCountryEnabledForBankTransfer(..., 'withdraw').


2649-2653: Country filtering for Mercado Pago (AR) and Pix (BR) is correct

Filters align with product constraints.


2658-2664: Deposit bank path selection via Manteca support

Logic is sound: route to Manteca where supported, else fall back to bank. Please verify /add-money/{country}/manteca pages exist for all countries in MantecaSupportedExchanges.

src/hooks/useTransactionHistory.ts (1)

24-25: Enum addition LGTM

Adding MANTECA_ONRAMP makes sense alongside existing onramp/offramp entries.

src/components/TransactionDetails/transactionTransformer.ts (1)

290-295: LGTM: Adds MANTECA_ONRAMP mapping

Mirrors BRIDGE_ONRAMP with expected direction and card type.

src/components/Payment/Views/MantecaFulfillment.view.tsx (2)

112-118: LGTM: CBU now sourced from nested details

Looks correct with the updated Manteca response shape.


122-128: LGTM: Alias now sourced from nested details

Consistent with the new data model.

src/components/AddMoney/components/MantecaAddMoney.tsx (1)

134-135: LGTM: deposit details handoff

The switch to render MantecaDepositShareDetails with the new MantecaDeposiResponseData is correct.

src/components/AddMoney/components/MantecaDepositShareDetails.tsx (1)

48-62: Guard share text against missing details

Prevents “undefined” lines in the shared content.

     const generateShareText = () => {
         const textParts = []
         const currencySymbol = currentCountryDetails?.currency || 'ARS'
 
         textParts.push(`Amount: ${currencySymbol} ${depositAmount}`)
 
-        if (depositAddress) {
-            textParts.push(`CBU: ${depositAddress}`)
-        }
-        if (depositAlias) {
-            textParts.push(`Alias: ${depositAlias}`)
-        }
+        if (depositAddress) textParts.push(`CBU: ${depositAddress}`)
+        if (depositAlias) textParts.push(`Alias: ${depositAlias}`)
 
         return textParts.join('\n')
     }

Likely an incorrect or invalid review comment.

Copy link
Contributor

@Hugo0 Hugo0 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approved but pls answer Qs by tagging on dc & resolve comments

also thx for video! helpful

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (9)
src/components/Payment/Views/MantecaFulfillment.view.tsx (3)

63-69: Fix duplicate headers and align titles

Both this view and MantecaDepositShareDetails render a NavHeader; users will see two headers with different titles (“Send” vs “Add Money”). Hide the child header and align the parent title.

Apply:

-            <NavHeader
-                title="Send"
+            <NavHeader
+                title="Add Money"
                 onPrev={() => {
                     setSelectedCountry(null)
                     setFulfillUsingManteca(false)
                 }}
             />

And pass a flag to hide the child header:

-{depositData?.data && <MantecaDepositShareDetails source={'bank'} depositDetails={depositData.data} />}
+{depositData?.data && (
+    <MantecaDepositShareDetails
+        showHeader={false}
+        source="bank"
+        depositDetails={depositData.data}
+    />
+)}

Also applies to: 71-71


22-33: Add an error state for deposit query failures

Currently failures render a blank screen (no details, no error). Show a lightweight error fallback.

Apply:

-    const { data: depositData, isLoading: isLoadingDeposit } = useQuery({
+    const { data: depositData, isLoading: isLoadingDeposit, isError } = useQuery({
         queryKey: ['manteca-deposit', chargeDetails?.uuid, currency],
     if (isLoadingDeposit) {
         return <PeanutLoading coverFullScreen />
     }
+
+    if (isError) {
+        return <div className="p-4 text-sm text-red-600">Failed to load deposit details. Please go back and try again.</div>
+    }

Also applies to: 57-60


31-33: Reconsider infinite staleness for price-sensitive data

staleTime = Infinity risks showing expired exchange rates (priceExpireAt exists in the payload). Consider a finite staleTime or invalidation tied to priceExpireAt.

src/components/AddMoney/components/MantecaDepositShareDetails.tsx (4)

52-58: Fallback to BANK_TRANSFER address if depositAddress is empty

Manteca often provides both. Prefer the explicit address, then fallback.

Apply:

-    const depositAddress = depositDetails.details.depositAddress
+    const depositAddress =
+        depositDetails.details.depositAddress ||
+        depositDetails.details.depositAddresses?.BANK_TRANSFER

83-86: Improve image alt text for accessibility

Use the country name in alt text.

Apply:

-                                alt={`flag`}
+                                alt={`${currentCountryDetails?.title ?? 'Country'} flag`}

61-64: Use a single currency source in share text

Avoid shadowing currencySymbol; reuse the computed symbol/code for consistency with the UI.

Apply:

-        const currencySymbol = currentCountryDetails?.currency || 'ARS'
-
-        textParts.push(`Amount: ${currencySymbol} ${depositAmount}`)
+        textParts.push(`Amount: ${currencySymbol} ${depositAmount}`)

115-117: Optional: expose price expiry or validity

Consider showing “Valid until” using details.priceExpireAt (and/or include it in share text) to set user expectations.

src/types/manteca.types.ts (2)

56-56: Add a backward‑compat alias for the old misspelled type

To prevent breakages if any call‑sites still import MantecaDeposiResponseData, export an alias.

Apply:

 }
 
+// Backward‑compat alias (old misspelling)
+export type MantecaDeposiResponseData = MantecaDepositResponseData

24-53: Normalize ‘stages’ key typing across deposit/withdraw types

Deposit uses string keys ('1' | '2' | '3') while withdraw uses numeric keys (1 | 2). This inconsistency causes friction at call‑sites. Consider standardizing on string keys or exposing typed accessors.

Also applies to: 94-114

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 07f2796 and a641e15.

📒 Files selected for processing (7)
  • src/app/(mobile-ui)/add-money/[country]/[regional-method]/page.tsx (2 hunks)
  • src/components/AddMoney/components/InputAmountStep.tsx (1 hunks)
  • src/components/AddMoney/components/MantecaAddMoney.tsx (3 hunks)
  • src/components/AddMoney/components/MantecaDepositShareDetails.tsx (1 hunks)
  • src/components/Payment/Views/MantecaFulfillment.view.tsx (3 hunks)
  • src/services/manteca.ts (2 hunks)
  • src/types/manteca.types.ts (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (4)
  • src/components/AddMoney/components/MantecaAddMoney.tsx
  • src/services/manteca.ts
  • src/components/AddMoney/components/InputAmountStep.tsx
  • src/app/(mobile-ui)/add-money/[country]/[regional-method]/page.tsx
🧰 Additional context used
🧠 Learnings (3)
📚 Learning: 2024-12-11T10:13:22.806Z
Learnt from: jjramirezn
PR: peanutprotocol/peanut-ui#564
File: src/components/Request/Pay/Views/Initial.view.tsx:430-430
Timestamp: 2024-12-11T10:13:22.806Z
Learning: In the React TypeScript file `src/components/Request/Pay/Views/Initial.view.tsx`, when reviewing the `InitialView` component, do not flag potential issues with using non-null assertion `!` on the `slippagePercentage` variable, as handling undefined values in this context is considered out of scope.

Applied to files:

  • src/components/Payment/Views/MantecaFulfillment.view.tsx
📚 Learning: 2024-10-07T15:25:45.170Z
Learnt from: jjramirezn
PR: peanutprotocol/peanut-ui#422
File: src/components/Request/Pay/Views/Initial.view.tsx:76-78
Timestamp: 2024-10-07T15:25:45.170Z
Learning: In `src/components/Request/Pay/Views/Initial.view.tsx`, both `txFee` and `utils.formatTokenAmount(...)` return strings, ensuring that `calculatedFee` consistently returns a string without the need for additional type conversion.

Applied to files:

  • src/components/Payment/Views/MantecaFulfillment.view.tsx
📚 Learning: 2024-10-07T15:28:25.280Z
Learnt from: jjramirezn
PR: peanutprotocol/peanut-ui#422
File: src/components/Request/Pay/Views/Initial.view.tsx:76-78
Timestamp: 2024-10-07T15:28:25.280Z
Learning: In `src/components/Request/Pay/Views/Initial.view.tsx`, both `txFee` and `utils.formatTokenAmount(estimatedGasCost, 3)` return strings, ensuring consistent return types for `calculatedFee`.

Applied to files:

  • src/components/Payment/Views/MantecaFulfillment.view.tsx
🧬 Code graph analysis (2)
src/components/AddMoney/components/MantecaDepositShareDetails.tsx (4)
src/types/manteca.types.ts (1)
  • MantecaDepositResponseData (3-56)
src/components/AddMoney/consts/index.ts (1)
  • countryData (288-2456)
src/components/Global/Icons/Icon.tsx (1)
  • Icon (196-205)
src/components/Payment/PaymentInfoRow.tsx (1)
  • PaymentInfoRow (17-83)
src/components/Payment/Views/MantecaFulfillment.view.tsx (1)
src/context/RequestFulfillmentFlowContext.tsx (1)
  • useRequestFulfillmentFlow (116-122)
🔇 Additional comments (2)
src/components/AddMoney/components/MantecaDepositShareDetails.tsx (1)

16-20: Remove unused prop ‘source’ (or make it purposeful)

Prop is unused and was already flagged. Remove it (and its usages) or wire it into behavior.

Apply:

-const MantecaDepositShareDetails = ({
-    depositDetails,
-    source,
-}: {
-    depositDetails: MantecaDepositResponseData
-    source: 'bank' | 'regionalMethod'
-}) => {
+const MantecaDepositShareDetails = ({
+    depositDetails,
+    showHeader = true,
+}: {
+    depositDetails: MantecaDepositResponseData
+    showHeader?: boolean
+}) => {
src/types/manteca.types.ts (1)

3-56: mantecaApi.deposit returns the expected { data?: MantecaDepositResponseData; error?: string } wrapper — no change required

mantecaApi.deposit is declared/implemented as Promise<{ data?: MantecaDepositResponseData; error?: string }> and returns { data } on success (src/services/manteca.ts), so using depositData?.data is correct.

@jjramirezn jjramirezn merged commit 0bbb40f into feat/manteca-integration Sep 24, 2025
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants