From eaefd4c1dc156bac58c0c3718c52f132bd241cd2 Mon Sep 17 00:00:00 2001
From: Harry Merritt <harry@mrrtt.me>
Date: Sun, 10 Dec 2023 13:33:12 +0000
Subject: [PATCH] fix(client): tracker filter size conditional render logic and
 react key prop (#702)

---
 .../javascript/components/sidebar/NotificationsButton.tsx  | 7 +++----
 client/src/javascript/components/sidebar/SidebarFilter.tsx | 2 +-
 2 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/client/src/javascript/components/sidebar/NotificationsButton.tsx b/client/src/javascript/components/sidebar/NotificationsButton.tsx
index 154d81df..fc8deb41 100644
--- a/client/src/javascript/components/sidebar/NotificationsButton.tsx
+++ b/client/src/javascript/components/sidebar/NotificationsButton.tsx
@@ -63,15 +63,14 @@ const NotificationTopToolbar: FC<NotificationTopToolbarProps> = ({
 };
 
 interface NotificationItemProps {
-  index: number;
   notification: Notification;
 }
 
-const NotificationItem: FC<NotificationItemProps> = ({index, notification}: NotificationItemProps) => {
+const NotificationItem: FC<NotificationItemProps> = ({notification}: NotificationItemProps) => {
   const {i18n} = useLingui();
 
   return (
-    <li className="notifications__list__item" key={index}>
+    <li className="notifications__list__item">
       <div className="notification__heading">
         <span className="notification__category">{i18n._(`${notification.id}.heading`)}</span>
         {' — '}
@@ -195,7 +194,7 @@ const NotificationsButton: FC = observer(() => {
               style={{minHeight: prevHeight}}
             >
               {notifications.map((notification, index) => (
-                <NotificationItem index={index} notification={notification} />
+                <NotificationItem key={index} notification={notification} />
               ))}
             </ul>
             <NotificationBottomToolbar
diff --git a/client/src/javascript/components/sidebar/SidebarFilter.tsx b/client/src/javascript/components/sidebar/SidebarFilter.tsx
index 35cb29a0..49ce599f 100644
--- a/client/src/javascript/components/sidebar/SidebarFilter.tsx
+++ b/client/src/javascript/components/sidebar/SidebarFilter.tsx
@@ -63,7 +63,7 @@ const SidebarFilter: FC<SidebarFilterProps> = ({
         {icon}
         <span className="name">{name}</span>
         <Badge>{count}</Badge>
-        {size && <Size value={size} className="size" />}
+        {size != null && <Size value={size} className="size" />}
       </button>
     </li>
   );