Dont show invitations tab unless there are invitations to show

wildjames · Nov 24, 2024 · e92edc0 · e92edc0
1 parent a86ea63
commit e92edc0
Showing 1 changed file with 17 additions and 14 deletions.
diff --git a/todoqueue_frontend/src/components/households/households.js b/todoqueue_frontend/src/components/households/households.js
@@ -193,20 +193,23 @@ export const ManageHouseholds = ({ households, updateHouseholds, setShowHousehol
             </div>
 
 
-            <div className="invitations-section">
-                <h3>Pending Invitations</h3>
-                {invitations.map((invitation) => (
-                    <div key={invitation.id} className="invitation-item">
-                        <span>{invitation.household.name} invited by {invitation.sender.email}</span>
-                        <button className="button complete-button" onClick={() => handleAcceptInvitation(invitation.id)}>
-                            Accept
-                        </button>
-                        <button className="button unfreeze-button" onClick={() => handleDeclineInvitation(invitation.id)}>
-                            Decline
-                        </button>
-                    </div>
-                ))}
-            </div>
+            {
+                (invitations.length > 0) &&
+                <div className="invitations-section">
+                    <h3>Pending Invitations</h3>
+                    {invitations.map((invitation) => (
+                        <div key={invitation.id} className="invitation-item">
+                            <span>{invitation.household.name} invited by {invitation.sender.email}</span>
+                            <button className="button complete-button" onClick={() => handleAcceptInvitation(invitation.id)}>
+                                Accept
+                            </button>
+                            <button className="button unfreeze-button" onClick={() => handleDeclineInvitation(invitation.id)}>
+                                Decline
+                            </button>
+                        </div>
+                    ))}
+                </div>
+            }
 
 
             <div>