refac - modify 'To claim' tab logic (#798)

* refactor To claim tab * refactor To claim tab
lfglabs-dev · Aug 5, 2024 · 94cc911 · 94cc911
1 parent 35f2be8
commit 94cc911
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/app/[addressOrDomain]/page.tsx b/app/[addressOrDomain]/page.tsx
@@ -351,6 +351,7 @@ export default function Page({ params }: AddressOrDomainProps) {
               label={`Completed (${completedQuests.length})`}
               {...a11yProps(0)}
             />
+            {claimableQuests.length > 0 ? (
             <Tab
               disableRipple
               sx={{
@@ -362,11 +363,10 @@ export default function Page({ params }: AddressOrDomainProps) {
                 fontFamily: "Sora",
                 minHeight: "32px",
               }}
-              label={`To claim (${
-                claimableQuests ? claimableQuests.length : 0
-              })`}
+              label={`To claim (${claimableQuests})`}
               {...a11yProps(1)}
             />
+            ) : null}
           </Tabs>
         </div>
         <CustomTabPanel value={tabIndex} index={0}>

diff --git a/components/pages/home/questAndCollectionTabs.tsx b/components/pages/home/questAndCollectionTabs.tsx
@@ -163,6 +163,8 @@ const QuestAndCollectionTabs: FunctionComponent<
                 {...a11yProps(1)}
               />
               {address && (
+                <>
+                {displayBoosts.length > 0 ? (    
                 <Tab
                   disableRipple
                   sx={{
@@ -174,11 +176,11 @@ const QuestAndCollectionTabs: FunctionComponent<
                     fontFamily: "Sora",
                     minHeight: "32px",
                   }}
-                  label={`To claim (${
-                    displayBoosts ? displayBoosts.length : 0
-                  })`}
+                  label={`To claim (${displayBoosts.length})`}
                   {...a11yProps(2)}
-                />
+                /> 
+                ) : null }
+              </>
               )}
             </Tabs>
           </div>