feat: update notification badge to support 99+ (#17007)

After dogfooding the notifications we noticed that admins will probably
have a larger number of unread notifications everyday so with that in
mind we decided to increase the "truncate" rate from 9+ to 99+.
This commit is contained in:
Bruno Quaresma
2025-03-19 15:15:31 -03:00
committed by GitHub
parent 6a7c43d76c
commit abbd88b819
2 changed files with 10 additions and 4 deletions
@@ -9,14 +9,20 @@ const meta: Meta<typeof UnreadBadge> = {
export default meta;
type Story = StoryObj<typeof UnreadBadge>;
export const Default: Story = {
export const Until10: Story = {
args: {
count: 3,
},
};
export const MoreThanNine: Story = {
export const MoreThan10: Story = {
args: {
count: 12,
},
};
export const MoreThan99: Story = {
args: {
count: 1000,
},
};
@@ -13,13 +13,13 @@ export const UnreadBadge: FC<UnreadBadgeProps> = ({
return (
<span
className={cn([
"flex size-[18px] rounded text-2xs items-center justify-center",
"flex min-w-[18px] h-[18px] w-fit px-1 rounded text-2xs items-center justify-center",
"bg-surface-sky text-highlight-sky",
className,
])}
{...props}
>
{count > 9 ? "9+" : count}
{count > 99 ? "99+" : count}
</span>
);
};