merged conflicts

unlock-protocol · Mar 15, 2024 · 1ce4d59 · 1ce4d59
1 parent 9c73847
commit 1ce4d59
Show file tree

Hide file tree

Showing 2 changed files with 50 additions and 6 deletions.
diff --git a/packages/core/src/schema.ts b/packages/core/src/schema.ts
@@ -132,6 +132,16 @@ export const PaywallLockConfig = z.object({
         'Hardcoded address for the recipient of the NFT. Can be used with skipRecipient.',
     })
     .optional(),
+  paymentMethods: z
+    .object({
+      card: z.boolean().optional(),
+      crypto: z.boolean().optional(),
+      crossmint: z.boolean().optional(),
+      swap: z.boolean().optional(),
+      crosschain: z.boolean().optional(),
+      claim: z.boolean().optional(),
+    })
+    .optional(),
 })
 
 export type PaywallLockConfigType = z.infer<typeof PaywallLockConfig>
@@ -281,6 +291,16 @@ export const PaywallConfig = z
           'Hardcoded address for the recipient of the NFT. Can be used with skipRecipient.',
       })
       .optional(),
+    paymentMethods: z
+      .object({
+        card: z.boolean().optional(),
+        crypto: z.boolean().optional(),
+        crossmint: z.boolean().optional(),
+        swap: z.boolean().optional(),
+        crosschain: z.boolean().optional(),
+        claim: z.boolean().optional(),
+      })
+      .optional(),
   })
   .passthrough()
 

diff --git a/unlock-app/src/components/interface/checkout/main/Payment.tsx b/unlock-app/src/components/interface/checkout/main/Payment.tsx
@@ -53,6 +53,16 @@ const AmountBadge = ({ symbol, amount }: AmountBadgeProps) => {
   )
 }
 
+// All enabled by default.
+const defaultPaymentMethods = {
+  crypto: true,
+  card: true,
+  crossmint: true,
+  swap: true,
+  crosschain: true,
+  claim: true,
+}
+
 export function Payment({ injectedProvider, checkoutService }: Props) {
   const [state, send] = useActor(checkoutService)
   const config = useConfig()
@@ -63,6 +73,16 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
   const baseSymbol = networkConfig.nativeCurrency.symbol
   const symbol = lockTickerSymbol(lock, baseSymbol)
 
+  const configPaymentMethods =
+    state.context.paywallConfig.locks[lock.address]?.paymentMethods ||
+    state.context.paywallConfig.paymentMethods ||
+    {}
+
+  const paymentMethods = {
+    ...defaultPaymentMethods,
+    ...configPaymentMethods,
+  }
+
   const { isLoading: isLoading, data: enableCreditCard } = useCreditCardEnabled(
     {
       network: lock.network,
@@ -101,7 +121,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
       recipients,
     })
 
-  const enableCrossmint = crossmintEnabled
+  const enableCrossmint = !!crossmintEnabled
 
   const { isLoading: isBalanceLoading, data: balance } = useBalance({
     account: account!,
@@ -177,7 +197,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
     enableClaim,
     enableCrypto,
     universalCardEnabled,
-    !!enableCrossmint,
+    enableCrossmint,
   ].every((item) => !item)
 
   return (
@@ -199,7 +219,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
         ) : (
           <div className="space-y-6">
             {/* Card Payment via Stripe! */}
-            {enableCreditCard && !enableClaim && (
+            {enableCreditCard && paymentMethods['card'] && !enableClaim && (
               <button
                 onClick={(event) => {
                   event.preventDefault()
@@ -233,7 +253,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
             )}
 
             {/* Crypto Payment */}
-            {enableCrypto && (
+            {enableCrypto && paymentMethods['crypto'] && (
               <button
                 disabled={!canAfford}
                 onClick={(event) => {
@@ -273,7 +293,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
             )}
 
             {/* Crossmint Payment */}
-            {enableCrossmint && !enableClaim && (
+            {enableCrossmint && paymentMethods['crossmint'] && !enableClaim && (
               <div>
                 <button
                   onClick={(event) => {
@@ -349,7 +369,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
             )}
 
             {/* Claim */}
-            {enableClaim && (
+            {enableClaim && paymentMethods['claim'] && (
               <button
                 onClick={(event) => {
                   event.preventDefault()
@@ -380,6 +400,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
             {/* Swap and purchase */}
             {!isUniswapRoutesLoading &&
               !enableClaim &&
+              paymentMethods['swap'] &&
               uniswapRoutes?.map((route, index) => {
                 if (!route) {
                   return null
@@ -425,6 +446,7 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
             {/* Crosschain purchase */}
             {!isCrossChaingRoutesLoading &&
               !enableClaim &&
+              paymentMethods['crosschain'] &&
               crossChainRoutes?.map((route, index) => {
                 return (
                   <button
@@ -477,12 +499,14 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
                 )
               })}
 
+            {/* Loading details */}
             {isLoadingMoreRoutes && !enableClaim && (
               <div className="flex items-center justify-center w-full gap-2 text-sm text-center">
                 <LoadingIcon size={16} /> Loading more payment options...
               </div>
             )}
 
+            {/* All disabled */}
             {allDisabled && (
               <div className="text-sm">
                 <p className="mb-4">