Page MenuHomePhabricator

[web] introduce unread badge component
ClosedPublic

Authored by ginsu on Dec 18 2023, 12:59 PM.
Tags
None
Referenced Files
F3500333: D10390.id34952.diff
Fri, Dec 20, 1:15 AM
Unknown Object (File)
Sat, Dec 14, 7:02 AM
Unknown Object (File)
Sun, Dec 1, 6:15 AM
Unknown Object (File)
Mon, Nov 25, 1:44 PM
Unknown Object (File)
Nov 18 2024, 4:59 AM
Unknown Object (File)
Nov 10 2024, 7:06 AM
Unknown Object (File)
Nov 2 2024, 12:40 PM
Unknown Object (File)
Oct 31 2024, 12:25 AM
Subscribers

Details

Summary

This diff introduces a new unread badge component. Our previous unread badge component was built inline; however, since the unread badge will be used in several places in the new web app redesign I wanted to create a simple component that we can use anywhere.

Here's a screenshot showing the unread badge component in the figma:

Screenshot 2023-12-15 at 8.50.30 PM.png (1×3 px, 836 KB)

Screenshot 2023-12-18 at 4.03.05 PM.png (2×422 px, 263 KB)

Screenshot 2023-12-18 at 4.02.58 PM.png (670×618 px, 110 KB)

Screenshot 2023-12-18 at 4.03.16 PM.png (578×1 px, 105 KB)

Linear task: https://linear.app/comm/issue/ENG-5951/introduce-a-new-unread-badge

Depends on D10364

Test Plan

Please see the screenshot below (the 99+ is just dummy data to test if I have more than 99 unreads then the unread badge would say 99+)

Screenshot 2023-12-18 at 4.06.35 PM.png (824×376 px, 45 KB)

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

ginsu edited the summary of this revision. (Show Details)

forgot to hit save

ginsu requested review of this revision.Dec 18 2023, 1:38 PM
This revision is now accepted and ready to land.Dec 18 2023, 1:55 PM

rebase after addressing comments in D10393

This revision was automatically updated to reflect the committed changes.