Differential D10390

[web] introduce unread badge component
ClosedPublic
Actions

Authored by ginsu on Dec 18 2023, 12:59 PM.

Tags

None

Referenced Files

	Unknown Object (File)
	Mon, Apr 8, 6:51 PM

	Unknown Object (File)
	Mon, Apr 8, 6:51 PM

	Unknown Object (File)
	Mon, Apr 8, 6:51 PM

	Unknown Object (File)
	Mon, Apr 8, 6:51 PM

	Unknown Object (File)
	Mon, Apr 8, 6:50 PM

	Unknown Object (File)
	Mon, Apr 8, 6:03 PM

	Unknown Object (File)
	Sat, Mar 30, 9:18 AM

	Unknown Object (File)
	Mar 20 2024, 10:55 AM

View All 36 Files

Subscribers

Details

Reviewers

atul
rohan
kamil

Commits

rCOMM9fbb79c84a15: [web] introduce unread badge component

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.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

Lint

Lint Not Applicable

Unit

Tests Not Applicable

Event Timeline

ginsu created this revision.Dec 18 2023, 12:59 PM

Herald added subscribers: tomek, ashoat. · View Herald TranscriptDec 18 2023, 12:59 PM

ginsu edited the summary of this revision. (Show Details)Dec 18 2023, 1:03 PM

ginsu edited the test plan for this revision. (Show Details)

ginsu added reviewers: atul, rohan, kamil.

ginsu added a parent revision: D10364: [web] introduce navigation sidebar.

ginsu attached a referenced file: F982682: Screenshot 2023-12-18 at 4.03.16 PM.png. (Show Details)

ginsu attached a referenced file: F982683: Screenshot 2023-12-18 at 4.02.58 PM.png. (Show Details)

ginsu attached a referenced file: F982684: Screenshot 2023-12-18 at 4.03.05 PM.png. (Show Details)

ginsu attached a referenced file: F982685: Screenshot 2023-12-15 at 8.50.30 PM.png. (Show Details)

forgot to hit save

ginsu edited the test plan for this revision. (Show Details)Dec 18 2023, 1:10 PM

ginsu attached a referenced file: F982786: Screenshot 2023-12-18 at 4.06.35 PM.png. (Show Details)

Harbormaster completed remote builds in B25196: Diff 34813.Dec 18 2023, 1:18 PM

Harbormaster completed remote builds in B25198: Diff 34815.Dec 18 2023, 1:38 PM

ginsu requested review of this revision.Dec 18 2023, 1:38 PM

rohan accepted this revision.Dec 18 2023, 1:55 PM

This revision is now accepted and ready to land.Dec 18 2023, 1:55 PM

ginsu added a child revision: D10391: [web] show total unreads in the navigation sidebar home button.Dec 18 2023, 2:23 PM

rebase after addressing comments in D10393

Harbormaster completed remote builds in B25301: Diff 34946.Dec 21 2023, 5:43 PM

Closed by commit rCOMM9fbb79c84a15: [web] introduce unread badge component (authored by ginsu). · Explain WhyDec 21 2023, 6:50 PM

This revision was automatically updated to reflect the committed changes.

ginsu added a commit: rCOMM9fbb79c84a15: [web] introduce unread badge component.

Revision Contents
Changeset List

Path

Size

web/

components/

unread-badge.css

14 lines

unread-badge.react.js

19 lines

10 lines

Diff 34952

web/components/unread-badge.css

Loading...

web/components/unread-badge.react.js

Loading...

web/theme.css

Loading...