From 1ca1fe3f7299c42935fab55f6f171380cea45e4d Mon Sep 17 00:00:00 2001 From: Ansh Nanda Date: Wed, 30 Aug 2023 16:50:01 -0700 Subject: [PATCH] mark notifications read with timeout and on app state change --- src/view/screens/Notifications.tsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/view/screens/Notifications.tsx b/src/view/screens/Notifications.tsx index 15bbf4fd07..5dda965db1 100644 --- a/src/view/screens/Notifications.tsx +++ b/src/view/screens/Notifications.tsx @@ -1,5 +1,5 @@ import React from 'react' -import {FlatList, View} from 'react-native' +import {AppState, FlatList, View} from 'react-native' import {useFocusEffect} from '@react-navigation/native' import {observer} from 'mobx-react-lite' import { @@ -18,6 +18,7 @@ import {s} from 'lib/styles' import {useAnalytics} from 'lib/analytics/analytics' import {isWeb} from 'platform/detection' +const NOTIFICATION_MARK_READ_TIMEOUT = 5000 type Props = NativeStackScreenProps< NotificationsTabNavigatorParams, 'Notifications' @@ -55,10 +56,22 @@ export const NotificationsScreen = withAuthRequired( const softResetSub = store.onScreenSoftReset(onPressLoadLatest) store.me.notifications.update() screen('Notifications') + // marks notifications read if the user opens the notifications tab for x seconds + // but doesn't open any notifications or any other tab + const markReadTimeout = setTimeout(() => { + store.me.notifications.markAllRead() + }, NOTIFICATION_MARK_READ_TIMEOUT) // mark all notifications as read after 3s + // marks notification read if the user suspends the app while in the notification tab + // then opens the app into the notification tab and then closes the app again + const markReadOnBlur = AppState.addEventListener('change', event => { + if (event === 'background') store.me.notifications.markAllRead() + }) return () => { softResetSub.remove() + markReadOnBlur.remove() store.me.notifications.markAllRead() + clearTimeout(markReadTimeout) // in case we unmount before the timeout fires } }, [store, screen, onPressLoadLatest]), )