From 8ac452afc9e9f4b1b6cdeee6fc6fbd0385a8c62d Mon Sep 17 00:00:00 2001
From: Athou <jeremiepanzer@gmail.com>
Date: Sat, 23 Sep 2023 16:43:22 +0200
Subject: [PATCH] shorten count starting at 10k and add a tooltip with the
 exact count(#1150)

---
 .../src/components/sidebar/UnreadCount.tsx             | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/commafeed-client/src/components/sidebar/UnreadCount.tsx b/commafeed-client/src/components/sidebar/UnreadCount.tsx
index f33705f2..ffcf7448 100644
--- a/commafeed-client/src/components/sidebar/UnreadCount.tsx
+++ b/commafeed-client/src/components/sidebar/UnreadCount.tsx
@@ -1,4 +1,4 @@
-import { Badge, createStyles } from "@mantine/core"
+import { Badge, createStyles, Tooltip } from "@mantine/core"
 
 const useStyles = createStyles(() => ({
     badge: {
@@ -13,6 +13,10 @@ export function UnreadCount(props: { unreadCount: number }) {
 
     if (props.unreadCount <= 0) return null
 
-    const count = props.unreadCount >= 1000 ? "999+" : props.unreadCount
-    return <Badge className={classes.badge}>{count}</Badge>
+    const count = props.unreadCount >= 10000 ? "10k+" : props.unreadCount
+    return (
+        <Tooltip label={props.unreadCount} disabled={props.unreadCount === count}>
+            <Badge className={classes.badge}>{count}</Badge>
+        </Tooltip>
+    )
 }