(undefined)
+
+export function QrCodeProvider({ children }: { children: ReactNode }) {
+ const [isQRScannerOpen, setIsQRScannerOpen] = useState(false)
+ return {children}
+}
+
+export function useQrCodeContext() {
+ const context = useContext(QrCodeContext)
+ if (context === undefined) {
+ throw new Error('useQrCodeContext must be used within a QrCodeProvider')
+ }
+ return context
+}
diff --git a/src/context/contextProvider.tsx b/src/context/contextProvider.tsx
index 01dcb29c7..d285c51e7 100644
--- a/src/context/contextProvider.tsx
+++ b/src/context/contextProvider.tsx
@@ -9,6 +9,7 @@ import { WithdrawFlowContextProvider } from './WithdrawFlowContext'
import { ClaimBankFlowContextProvider } from './ClaimBankFlowContext'
import { RequestFulfilmentFlowContextProvider } from './RequestFulfillmentFlowContext'
import { SupportModalProvider } from './SupportModalContext'
+import { QrCodeProvider } from './QrCodeContext'
export const ContextProvider = ({ children }: { children: React.ReactNode }) => {
return (
@@ -22,7 +23,9 @@ export const ContextProvider = ({ children }: { children: React.ReactNode }) =>
- {children}
+
+ {children}
+
diff --git a/src/hooks/useHomeCarouselCTAs.tsx b/src/hooks/useHomeCarouselCTAs.tsx
index 6103e5653..bdea5d4e7 100644
--- a/src/hooks/useHomeCarouselCTAs.tsx
+++ b/src/hooks/useHomeCarouselCTAs.tsx
@@ -7,7 +7,7 @@ import { useNotifications } from './useNotifications'
import { useRouter } from 'next/navigation'
import useKycStatus from './useKycStatus'
import type { StaticImageData } from 'next/image'
-import { PIX } from '@/assets'
+import { useQrCodeContext } from '@/context/QrCodeContext'
export type CarouselCTA = {
id: string
@@ -21,6 +21,7 @@ export type CarouselCTA = {
isPermissionDenied?: boolean
iconContainerClassName?: string
secondaryIcon?: StaticImageData | string
+ iconSize?: number
}
export const useHomeCarouselCTAs = () => {
@@ -29,27 +30,35 @@ export const useHomeCarouselCTAs = () => {
const { showReminderBanner, requestPermission, snoozeReminderBanner, afterPermissionAttempt, isPermissionDenied } =
useNotifications()
const router = useRouter()
- const { isUserKycApproved, isUserBridgeKycUnderReview } = useKycStatus()
+ const { isUserKycApproved, isUserBridgeKycUnderReview, isUserMantecaKycApproved } = useKycStatus()
+
+ const { setIsQRScannerOpen } = useQrCodeContext()
const generateCarouselCTAs = useCallback(() => {
const _carouselCTAs: CarouselCTA[] = []
- _carouselCTAs.push({
- id: 'merchant-map-pix',
- title: 'Up to 10% cashback for Tier 2 users with PIX Payments',
- description: 'Click to explore participating merchants. Pay with PIX QR, save instantly, earn points.',
- iconContainerClassName: 'bg-secondary-1',
- icon: 'shield',
- onClick: () => {
- window.open(
- 'https://peanutprotocol.notion.site/Peanut-Foodie-Guide-29a83811757980e79896f2a610d6591a',
- '_blank',
- 'noopener,noreferrer'
- )
- },
- logo: PIX,
- secondaryIcon: 'https://flagcdn.com/w320/br.png',
- })
+ // Show QR code payment prompt if user's Bridge or Manteca KYC is approved.
+ if (isUserKycApproved || isUserMantecaKycApproved) {
+ _carouselCTAs.push({
+ id: 'qr-payment',
+ title: (
+
+ Pay with QR code payments
+
+ ),
+ description: (
+
+ Get the best exchange rate, pay like a local and earn points.
+
+ ),
+ iconContainerClassName: 'bg-secondary-1',
+ icon: 'qr-code',
+ onClick: () => {
+ setIsQRScannerOpen(true)
+ },
+ iconSize: 16,
+ })
+ }
// add notification prompt as first item if it should be shown
if (showReminderBanner) {