fix: styled component transient props

questdb · Oct 4, 2023 · e58a5ea · e58a5ea
1 parent 92d630d
commit e58a5ea
Showing 1 changed file with 5 additions and 6 deletions.
diff --git a/packages/web-console/src/scenes/News/index.tsx b/packages/web-console/src/scenes/News/index.tsx
@@ -28,12 +28,11 @@ const swing = () => {
   return animation
 }
 
-const BellIcon = styled(Notification2)<{ hasUnreadNews: boolean }>`
-  color: ${({ theme, hasUnreadNews }) =>
-    theme.color[hasUnreadNews ? "red" : "foreground"]};
+const BellIcon = styled(Notification2)<{ $unread: boolean }>`
+  color: ${({ theme, $unread }) => theme.color[$unread ? "red" : "foreground"]};
 
-  ${({ hasUnreadNews }) =>
-    hasUnreadNews &&
+  ${({ $unread }) =>
+    $unread &&
     `
   animation: 5s linear swing infinite;
   @keyframes swing {
@@ -167,7 +166,7 @@ const News = () => {
           icon={
             <Button skin={newsOpened ? "primary" : "secondary"}>
               <UnreadItemsIcon
-                icon={<BellIcon size="18px" hasUnreadNews={hasUnreadNews} />}
+                icon={<BellIcon size="18px" $unread={hasUnreadNews} />}
                 tick={hasUnreadNews}
               />
             </Button>