fix(unlock-app): skipping recipients if all fields are hidden (#14583)

skipping recipients if all fields are hidden

unlock-app/src/__tests__/components/interface/checkout/main/utils.test.ts

@@ -0,0 +1,89 @@
+import { it, describe, expect } from 'vitest'
+import { shouldSkip } from '~/components/interface/checkout/main/utils'
+
+describe('shouldSkip', () => {
+  it('it should skip if skipRecipient is set at the root level', () => {
+    expect(
+      shouldSkip({
+        lock: { maxRecipients: 1 },
+        paywallConfig: {
+          skipRecipient: true,
+          locks: {
+            '0x123': { maxRecipients: 1 },
+          },
+        },
+      }).skipRecipient
+    ).toBe(true)
+  })
+  it('it should not skip if skipRecipient is set to true but if there are metadataInputs', () => {
+    expect(
+      shouldSkip({
+        lock: { maxRecipients: 1 },
+        paywallConfig: {
+          skipRecipient: true,
+          metadataInputs: [
+            {
+              type: 'email',
+              name: 'email',
+              required: true,
+              public: false,
+            },
+          ],
+          locks: {
+            '0x123': { maxRecipients: 1 },
+          },
+        },
+      }).skipRecipient
+    ).toBe(false)
+  })
+
+  it('it should skip if skipRecipient is set to true and if there are only hidden metadataInputs', () => {
+    expect(
+      shouldSkip({
+        lock: { maxRecipients: 1 },
+        paywallConfig: {
+          skipRecipient: true,
+          metadataInputs: [
+            {
+              type: 'hidden',
+              name: 'email',
+              required: true,
+              public: false,
+            },
+          ],
+          locks: {
+            '0x123': { maxRecipients: 1 },
+          },
+        },
+      }).skipRecipient
+    ).toBe(true)
+  })
+
+  it('it should not skip if skipRecipient is set to true and if there are non-hidden metadataInputs', () => {
+    expect(
+      shouldSkip({
+        lock: { maxRecipients: 1 },
+        paywallConfig: {
+          skipRecipient: true,
+          metadataInputs: [
+            {
+              type: 'hidden',
+              name: 'email',
+              required: true,
+              public: false,
+            },
+            {
+              type: 'text',
+              name: 'name',
+              required: true,
+              public: false,
+            },
+          ],
+          locks: {
+            '0x123': { maxRecipients: 1 },
+          },
+        },
+      }).skipRecipient
+    ).toBe(false)
+  })
+})

unlock-app/src/components/interface/checkout/main/Metadata.tsx

@@ -35,6 +35,7 @@ import {
 } from '@unlock-protocol/core'
 import { useUpdateUsersMetadata } from '~/hooks/useUserMetadata'
 import Disconnect from './Disconnect'
+import { shouldSkip } from './utils'
 
 interface Props {
   checkoutService: CheckoutService
@@ -116,7 +117,7 @@ export const MetadataInputs = ({
   )
 
   const recipient = recipientFromConfig(paywallConfig, lock) || account
-  const hideRecipient = shouldHideRecipient(paywallConfig, lock)
+  const hideRecipient = shouldSkip({ paywallConfig, lock }).skipRecipient
 
   return (
     <div className="grid gap-2">
@@ -468,12 +469,3 @@ const recipientFromConfig = (
   }
   return ''
 }
-
-const shouldHideRecipient = (
-  paywall: PaywallConfigType,
-  lock: Lock | LockState | undefined
-): boolean => {
-  return !!(
-    paywall.skipRecipient || paywall?.locks[lock!.address].skipRecipient
-  )
-}

unlock-app/src/components/interface/checkout/main/Returning.tsx

@@ -16,6 +16,7 @@ import { ReturningButton } from '../ReturningButton'
 import { useCheckoutCommunication } from '~/hooks/useCheckoutCommunication'
 import { useGetTokenIdForOwner } from '~/hooks/useGetTokenIdForOwner'
 import { Platform } from '~/services/passService'
+import { shouldSkip } from './utils'
 
 interface Props {
   checkoutService: CheckoutService
@@ -156,16 +157,17 @@ export function Returning({ checkoutService, onClose, communication }: Props) {
                 returnLabel="Return"
                 checkoutService={checkoutService}
               />
-              {!lock?.isSoldOut && !paywallConfig.skipRecipient && (
-                <Button
-                  className="w-full"
-                  onClick={() =>
-                    checkoutService.send({ type: 'MAKE_ANOTHER_PURCHASE' })
-                  }
-                >
-                  Buy more
-                </Button>
-              )}
+              {!lock?.isSoldOut &&
+                !shouldSkip({ paywallConfig, lock }).skipRecipient && (
+                  <Button
+                    className="w-full"
+                    onClick={() =>
+                      checkoutService.send({ type: 'MAKE_ANOTHER_PURCHASE' })
+                    }
+                  >
+                    Buy more
+                  </Button>
+                )}
             </div>
           )}
         </div>

unlock-app/src/components/interface/checkout/main/utils.ts

@@ -72,11 +72,15 @@ export const shouldSkip = ({ lock, paywallConfig }: Options) => {
   const skipQuantity = !(hasMaxRecipients || hasMinRecipients)
 
   const skip = lock?.skipRecipient || paywallConfig?.skipRecipient
+
+  const metadataInputs = lock?.metadataInputs || paywallConfig?.metadataInputs
+
+  const hasMetadataInputs =
+    metadataInputs &&
+    metadataInputs.filter((input) => input.type !== 'hidden').length > 0
+
   const collectsMetadadata =
-    lock?.metadataInputs ||
-    paywallConfig?.metadataInputs ||
-    paywallConfig?.emailRequired ||
-    lock?.emailRequired
+    hasMetadataInputs || paywallConfig?.emailRequired || lock?.emailRequired
   const skipRecipient = Boolean(skip && !collectsMetadadata)
 
   return {