statusbar: add notification count badge

This commit is contained in:
Matilde Park 2020-11-04 16:47:08 -05:00
parent f7d59985d2
commit d872050b4b
2 changed files with 11 additions and 3 deletions

View File

@ -70,7 +70,7 @@ export default function NotificationPreferences(
<Checkbox
label="Do not disturb"
id="dnd"
caption="You won't seee the notification badge, but notifications will still appear in your inbox."
caption="You won't see the notification badge, but notifications will still appear in your inbox."
/>
<Checkbox

View File

@ -28,7 +28,7 @@ const StatusBar = (props) => {
</Button>
<StatusBarItem mr={2} onClick={() => props.api.local.setOmnibox()}>
{ !props.doNotDisturb && props.notificationsCount > 0 &&
{ !props.doNotDisturb && props.notificationsCount > 0 &&
(<Box display="block" right="-8px" top="-8px" position="absolute" >
<Icon color="blue" icon="Bullet" />
</Box>
@ -47,7 +47,15 @@ const StatusBar = (props) => {
/>
</Row>
<Row justifyContent="flex-end" collapse>
{!props.doNotDisturb && (<StatusBarItem color="blue" px='12px' mr='2' onClick={() => props.history.push('/~notifications')}>
<Text
fontWeight={props.notificationsCount > 0 ? "500" : "400"}
fontSize='0'
color="blue"
>
{(props.notificationsCount > 99) ? "99+" : props.notificationsCount}
</Text>
</StatusBarItem>)}
<StatusBarItem px={'2'} flexShrink='0' onClick={() => props.history.push('/~profile')}>
<Sigil ship={props.ship} size={16} color='black' classes='mix-blend-diff' icon />
<Text ml={2} display={["none", "inline"]} fontFamily="mono">~{props.ship}</Text>