Page MenuHomePhorge

D6978.1768572578.diff
No OneTemporary

Size
1 KB
Referenced Files
None
Subscribers
None

D6978.1768572578.diff

diff --git a/web/sidebar/community-picker.css b/web/sidebar/community-picker.css
--- a/web/sidebar/community-picker.css
+++ b/web/sidebar/community-picker.css
@@ -83,3 +83,22 @@
padding-left: 12px;
color: var(--fg);
}
+
+span.chatBadge {
+ box-sizing: border-box;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ color: var(--fg);
+ background: var(--unread-bg);
+ border-radius: 13px;
+ font-size: var(--xs-font-12);
+ line-height: 1.25;
+ margin-right: 4px;
+}
+
+span.chatBadgePlus {
+ width: 32px;
+}
diff --git a/web/sidebar/community-picker.react.js b/web/sidebar/community-picker.react.js
--- a/web/sidebar/community-picker.react.js
+++ b/web/sidebar/community-picker.react.js
@@ -10,6 +10,7 @@
} from 'lib/actions/community-actions.js';
import { useModalContext } from 'lib/components/modal-provider.react.js';
import SWMansionIcon from 'lib/components/SWMansionIcon.react.js';
+import { unreadCount } from 'lib/selectors/thread-selectors.js';
import CommunityCreationModal from './community-creation/community-creation-modal.react.js';
import CommunityDrawer from './community-drawer.react.js';
@@ -87,6 +88,17 @@
);
}
+ const boundUnreadCount = useSelector(unreadCount);
+ let chatBadge = null;
+ if (boundUnreadCount > 0 && !isCalendarOpen) {
+ if (boundUnreadCount < 100) {
+ chatBadge = <span className={css.chatBadge}>{boundUnreadCount}</span>;
+ } else {
+ const classes = classNames(css.chatBadge, css.chatBadgePlus);
+ chatBadge = <span className={classes}>99+</span>;
+ }
+ }
+
return (
<div className={css.container}>
<div className={css.header}>
@@ -94,6 +106,8 @@
<div className={sideLineInbox} />
<SWMansionIcon icon="inbox" size={24} />
<div className={css.buttonTitle}> {inboxButtonTitle} </div>
+ <div className={css.spacer} />
+ {chatBadge}
</a>
</div>
<div className={css.drawerWrapper}>

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 16, 2:09 PM (18 h, 14 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5940282
Default Alt Text
D6978.1768572578.diff (1 KB)

Event Timeline