hark-fe: add read all button

This commit is contained in:
ryjm 2021-02-04 18:54:17 -05:00
parent a7934c1878
commit f5e4dc2423
3 changed files with 52 additions and 31 deletions

View File

@ -76,6 +76,7 @@
set-dnd+bo
read-count+stats-index
read-each+read-graph-index
read-all+ul
==
--
::

View File

@ -109,6 +109,9 @@ export class HarkApi extends BaseApi<StoreState> {
seen() {
return this.harkAction({ seen: null });
}
readAll() {
return this.harkAction({ 'read-all': null });
}
mute(notif: IndexedNotification) {
if('graph' in notif.index && 'graph' in notif.notification.contents) {

View File

@ -40,6 +40,9 @@ export default function NotificationsScreen(props: any) {
const onSubmit = async (values: { groups: string }) => {
setFilter({ groups: values.groups ? [values.groups] : [] });
};
const onReadAll = useCallback(() => {
props.api.hark.readAll()
}, []);
const groupFilterDesc =
filter.groups.length === 0
? "All"
@ -81,39 +84,53 @@ export default function NotificationsScreen(props: any) {
</HeaderLink>
</Box>
</Row>
<Dropdown
alignX="right"
alignY="top"
options={
<Col
p="2"
backgroundColor="white"
border={1}
borderRadius={1}
borderColor="lightGray"
gapY="2"
>
<FormikOnBlur
initialValues={filter}
onSubmit={onSubmit}
>
<GroupSearch
id="groups"
label="Filter Groups"
caption="Only show notifications from this group"
associations={props.associations}
/>
</FormikOnBlur>
</Col>
}
>
<Box>
<Text mr="1" gray>
Filter:
<Row
justifyContent="space-between">
<Box
mr="1"
overflow="hidden"
onClick={onReadAll}
cursor="pointer"
>
<Text mr="1" color="blue">
Mark All Read
</Text>
<Text>{groupFilterDesc}</Text>
</Box>
</Dropdown>
<Dropdown
alignX="right"
alignY="top"
options={
<Col
p="2"
backgroundColor="white"
border={1}
borderRadius={1}
borderColor="lightGray"
gapY="2"
>
<FormikOnBlur
initialValues={filter}
onSubmit={onSubmit}
>
<GroupSearch
id="groups"
label="Filter Groups"
caption="Only show notifications from this group"
associations={props.associations}
/>
</FormikOnBlur>
</Col>
}
>
<Box>
<Text mr="1" gray>
Filter:
</Text>
<Text>{groupFilterDesc}</Text>
</Box>
</Dropdown>
</Row>
</Row>
{view === "preferences" && (
<NotificationPreferences