Hide properties filters with count = 0

dashboard/src/components/dashboard/EventFeed.jsx

@@ -1510,94 +1510,110 @@ const EventFeed = ({
 
         {/* Order Property Filters */}
         <div className="flex flex-wrap gap-2 justify-center mt-4">
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('hasPreorder')}
-            className={`${
-              orderFilters.hasPreorder
-                ? 'bg-purple-800 text-purple-200 hover:bg-purple-700'
-                : 'bg-purple-100 dark:bg-purple-900/20 text-purple-800 dark:text-purple-300 hover:bg-purple-100 dark:hover:bg-purple-900/20'
-            } cursor-pointer`}
-          >
-            Pre-order {counts.orderProperties.hasPreorder > 0 && `(${counts.orderProperties.hasPreorder})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('localPickup')}
-            className={`${
-              orderFilters.localPickup
-                ? 'bg-green-800 text-green-200 hover:bg-green-700'
-                : 'bg-green-100 dark:bg-green-900/20 text-green-800 dark:text-green-300 hover:bg-green-100 dark:hover:bg-green-900/20'
-            } cursor-pointer`}
-          >
-            Local {counts.orderProperties.localPickup > 0 && `(${counts.orderProperties.localPickup})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('isOnHold')}
-            className={`${
-              orderFilters.isOnHold
-                ? 'bg-blue-800 text-blue-200 hover:bg-blue-700'
-                : 'bg-blue-100 dark:bg-blue-900/20 text-blue-800 dark:text-blue-300 hover:bg-blue-100 dark:hover:bg-blue-900/20'
-            } cursor-pointer`}
-          >
-            On Hold {counts.orderProperties.isOnHold > 0 && `(${counts.orderProperties.isOnHold})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('onHoldReleased')}
-            className={`${
-              orderFilters.onHoldReleased
-                ? 'bg-green-800 text-green-200 hover:bg-green-700'
-                : 'bg-green-100 dark:bg-green-900/20 text-green-800 dark:text-green-300 hover:bg-green-100 dark:hover:bg-green-900/20'
-            } cursor-pointer`}
-          >
-            Hold Released {counts.orderProperties.onHoldReleased > 0 && `(${counts.orderProperties.onHoldReleased})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('hasDigiItem')}
-            className={`${
-              orderFilters.hasDigiItem
-                ? 'bg-indigo-800 text-indigo-200 hover:bg-indigo-700'
-                : 'bg-indigo-100 dark:bg-indigo-900/20 text-indigo-800 dark:text-indigo-300 hover:bg-indigo-100 dark:hover:bg-indigo-900/20'
-            } cursor-pointer`}
-          >
-            Digital {counts.orderProperties.hasDigiItem > 0 && `(${counts.orderProperties.hasDigiItem})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('hasNotions')}
-            className={`${
-              orderFilters.hasNotions
-                ? 'bg-yellow-800 text-yellow-200 hover:bg-yellow-700'
-                : 'bg-yellow-100 dark:bg-yellow-900/20 text-yellow-800 dark:text-yellow-300 hover:bg-yellow-100 dark:hover:bg-yellow-900/20'
-            } cursor-pointer`}
-          >
-            Notions {counts.orderProperties.hasNotions > 0 && `(${counts.orderProperties.hasNotions})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('hasGiftCard')}
-            className={`${
-              orderFilters.hasGiftCard
-                ? 'bg-pink-800 text-pink-200 hover:bg-pink-700'
-                : 'bg-pink-100 dark:bg-pink-900/20 text-pink-800 dark:text-pink-300 hover:bg-pink-100 dark:hover:bg-pink-900/20'
-            } cursor-pointer`}
-          >
-            eGift Card {counts.orderProperties.hasGiftCard > 0 && `(${counts.orderProperties.hasGiftCard})`}
-          </Badge>
-          <Badge
-            variant="secondary"
-            onClick={() => handleOrderPropertyClick('stillOwes')}
-            className={`${
-              orderFilters.stillOwes
-                ? 'bg-red-800 text-red-200 hover:bg-red-700'
-                : 'bg-red-100 dark:bg-red-900/20 text-red-800 dark:text-red-300 hover:bg-red-100 dark:hover:bg-red-900/20'
-            } cursor-pointer`}
-          >
-            Owes {counts.orderProperties.stillOwes > 0 && `(${counts.orderProperties.stillOwes})`}
-          </Badge>
+          {counts.orderProperties.hasPreorder > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('hasPreorder')}
+              className={`${
+                orderFilters.hasPreorder
+                  ? 'bg-purple-800 text-purple-200 hover:bg-purple-700'
+                  : 'bg-purple-100 dark:bg-purple-900/20 text-purple-800 dark:text-purple-300 hover:bg-purple-100 dark:hover:bg-purple-900/20'
+              } cursor-pointer`}
+            >
+              Pre-order ({counts.orderProperties.hasPreorder})
+            </Badge>
+          )}
+          {counts.orderProperties.localPickup > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('localPickup')}
+              className={`${
+                orderFilters.localPickup
+                  ? 'bg-green-800 text-green-200 hover:bg-green-700'
+                  : 'bg-green-100 dark:bg-green-900/20 text-green-800 dark:text-green-300 hover:bg-green-100 dark:hover:bg-green-900/20'
+              } cursor-pointer`}
+            >
+              Local ({counts.orderProperties.localPickup})
+            </Badge>
+          )}
+          {counts.orderProperties.isOnHold > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('isOnHold')}
+              className={`${
+                orderFilters.isOnHold
+                  ? 'bg-blue-800 text-blue-200 hover:bg-blue-700'
+                  : 'bg-blue-100 dark:bg-blue-900/20 text-blue-800 dark:text-blue-300 hover:bg-blue-100 dark:hover:bg-blue-900/20'
+              } cursor-pointer`}
+            >
+              On Hold ({counts.orderProperties.isOnHold})
+            </Badge>
+          )}
+          {counts.orderProperties.onHoldReleased > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('onHoldReleased')}
+              className={`${
+                orderFilters.onHoldReleased
+                  ? 'bg-green-800 text-green-200 hover:bg-green-700'
+                  : 'bg-green-100 dark:bg-green-900/20 text-green-800 dark:text-green-300 hover:bg-green-100 dark:hover:bg-green-900/20'
+              } cursor-pointer`}
+            >
+              Hold Released ({counts.orderProperties.onHoldReleased})
+            </Badge>
+          )}
+          {counts.orderProperties.hasDigiItem > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('hasDigiItem')}
+              className={`${
+                orderFilters.hasDigiItem
+                  ? 'bg-indigo-800 text-indigo-200 hover:bg-indigo-700'
+                  : 'bg-indigo-100 dark:bg-indigo-900/20 text-indigo-800 dark:text-indigo-300 hover:bg-indigo-100 dark:hover:bg-indigo-900/20'
+              } cursor-pointer`}
+            >
+              Digital ({counts.orderProperties.hasDigiItem})
+            </Badge>
+          )}
+          {counts.orderProperties.hasNotions > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('hasNotions')}
+              className={`${
+                orderFilters.hasNotions
+                  ? 'bg-yellow-800 text-yellow-200 hover:bg-yellow-700'
+                  : 'bg-yellow-100 dark:bg-yellow-900/20 text-yellow-800 dark:text-yellow-300 hover:bg-yellow-100 dark:hover:bg-yellow-900/20'
+              } cursor-pointer`}
+            >
+              Notions ({counts.orderProperties.hasNotions})
+            </Badge>
+          )}
+          {counts.orderProperties.hasGiftCard > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('hasGiftCard')}
+              className={`${
+                orderFilters.hasGiftCard
+                  ? 'bg-pink-800 text-pink-200 hover:bg-pink-700'
+                  : 'bg-pink-100 dark:bg-pink-900/20 text-pink-800 dark:text-pink-300 hover:bg-pink-100 dark:hover:bg-pink-900/20'
+              } cursor-pointer`}
+            >
+              eGift Card ({counts.orderProperties.hasGiftCard})
+            </Badge>
+          )}
+          {counts.orderProperties.stillOwes > 0 && (
+            <Badge
+              variant="secondary"
+              onClick={() => handleOrderPropertyClick('stillOwes')}
+              className={`${
+                orderFilters.stillOwes
+                  ? 'bg-red-800 text-red-200 hover:bg-red-700'
+                  : 'bg-red-100 dark:bg-red-900/20 text-red-800 dark:text-red-300 hover:bg-red-100 dark:hover:bg-red-900/20'
+              } cursor-pointer`}
+            >
+              Owes ({counts.orderProperties.stillOwes})
+            </Badge>
+          )}
         </div>
       </CardHeader>