feat(unlock-app): adding hideRemaining for events

unlock-protocol · May 22, 2024 · 0e2ee73 · 0e2ee73
1 parent 9f3c17f
commit 0e2ee73
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 11 deletions.
diff --git a/packages/core/src/schema.ts b/packages/core/src/schema.ts
@@ -326,6 +326,7 @@ export const EventObject = z.object({
   image: z.string().url(),
   description: z.string(),
   requiresApproval: z.boolean(),
+  hideRemaining: z.boolean().optional(), // This should rather be a checkoutConfig property.
   emailSender: z.string(),
   replyTo: z.string(),
   ticket: z.object({

diff --git a/unlock-app/src/components/content/event/Layout/EventBannerlessLayout.tsx b/unlock-app/src/components/content/event/Layout/EventBannerlessLayout.tsx
@@ -77,6 +77,7 @@ export const EventBannerlessLayout = ({
           <RegistrationCard
             requiresApproval={event.requiresApproval}
             checkoutConfig={checkoutConfig}
+            hideRemaining={!!event.hideRemaining}
           />
         )}
         {hasPassed && (

diff --git a/unlock-app/src/components/content/event/Layout/EventDefaultLayout.tsx b/unlock-app/src/components/content/event/Layout/EventDefaultLayout.tsx
@@ -144,6 +144,7 @@ export const EventDefaultLayout = ({
             <RegistrationCard
               requiresApproval={event.requiresApproval}
               checkoutConfig={checkoutConfig}
+              hideRemaining={!!event.hideRemaining}
             />
           )}
           {hasPassed && (

diff --git a/unlock-app/src/components/content/event/Registration/LockPriceDetails.tsx b/unlock-app/src/components/content/event/Registration/LockPriceDetails.tsx
@@ -18,6 +18,7 @@ interface LockPriceInternalsProps {
   keysLeft: number
   showContract?: boolean
   lockCheckoutConfig: PaywallLockConfigType
+  hideRemaining: boolean
 }
 export const LockPriceInternals = ({
   lock,
@@ -29,6 +30,7 @@ export const LockPriceInternals = ({
   keysLeft,
   showContract = false,
   lockCheckoutConfig,
+  hideRemaining,
 }: LockPriceInternalsProps) => {
   const name = lockCheckoutConfig.name || lock.name
   return (
@@ -47,17 +49,19 @@ export const LockPriceInternals = ({
             </span>
           </>
         </div>
-        <div className="flex items-center gap-2">
-          <Icon icon={TicketIcon} size={30} />
-          {hasUnlimitedKeys ? (
-            <span className="text-base font-bold">&infin;</span>
-          ) : (
-            <span className="text-base font-bold">
-              {isSoldOut ? 'Sold out' : keysLeft}
-            </span>
-          )}
-          {!isSoldOut && <span className="text-gray-600">Left</span>}
-        </div>
+        {!hideRemaining && (
+          <div className="flex items-center gap-2">
+            <Icon icon={TicketIcon} size={30} />
+            {hasUnlimitedKeys ? (
+              <span className="text-base font-bold">&infin;</span>
+            ) : (
+              <span className="text-base font-bold">
+                {isSoldOut ? 'Sold out' : keysLeft}
+              </span>
+            )}
+            {!isSoldOut && <span className="text-gray-600">Left</span>}
+          </div>
+        )}
       </div>
     </div>
   )
@@ -68,12 +72,14 @@ interface LockPriceDetailsProps {
   network: number
   showContract?: boolean
   lockCheckoutConfig: PaywallLockConfigType
+  hideRemaining: boolean
 }
 export const LockPriceDetails = ({
   lockAddress,
   network,
   showContract = false,
   lockCheckoutConfig,
+  hideRemaining,
 }: LockPriceDetailsProps) => {
   const { lock, isLockLoading } = useLockData({
     lockAddress,
@@ -119,6 +125,7 @@ export const LockPriceDetails = ({
       isSoldOut={isSoldOut}
       keysLeft={keysLeft}
       showContract={showContract}
+      hideRemaining={hideRemaining}
     />
   )
 }
diff --git a/unlock-app/src/components/content/event/Registration/RegistrationCard.tsx b/unlock-app/src/components/content/event/Registration/RegistrationCard.tsx
@@ -13,11 +13,13 @@ export interface RegistrationCardProps {
     config: PaywallConfigType
   }
   requiresApproval: boolean
+  hideRemaining: boolean
 }
 
 export const RegistrationCard = ({
   requiresApproval,
   checkoutConfig,
+  hideRemaining,
 }: RegistrationCardProps) => {
   const [hasRefreshed, setHasRefreshed] = useState(false)
   // Check if the user has a key!
@@ -48,6 +50,7 @@ export const RegistrationCard = ({
           requiresApproval={requiresApproval}
           refresh={refresh}
           checkoutConfig={checkoutConfig}
+          hideRemaining={hideRemaining}
         />
       </Card>
     )
@@ -75,6 +78,7 @@ export const RegistrationCard = ({
               }
               lockCheckoutConfig={checkoutConfig.config.locks[lockAddress]}
               showContract
+              hideRemaining={hideRemaining}
             />
           )
         })}

diff --git a/unlock-app/src/components/content/event/Registration/SingleLock/index.tsx b/unlock-app/src/components/content/event/Registration/SingleLock/index.tsx
@@ -20,12 +20,14 @@ export interface RegistrationCardSingleLockProps {
   }
   refresh: any
   requiresApproval: boolean
+  hideRemaining: boolean
 }
 
 export const RegistrationCardSingleLock = ({
   checkoutConfig,
   refresh,
   requiresApproval,
+  hideRemaining,
 }: RegistrationCardSingleLockProps) => {
   const lockAddress = Object.keys(checkoutConfig.config.locks)[0]
   const network = (checkoutConfig.config.locks[lockAddress].network ||
@@ -93,6 +95,7 @@ export const RegistrationCardSingleLock = ({
             isSoldOut={isSoldOut}
             keysLeft={keysLeft}
             showContract={true}
+            hideRemaining={hideRemaining}
           />
           {!isSoldOut && isClaimable && (
             <WalletlessRegistrationClaim