From 4723edb1b889c6a0e303c92acb3556149fd4520d Mon Sep 17 00:00:00 2001
From: Ian Philips <iansphilips@gmail.com>
Date: Thu, 7 Jul 2022 10:10:41 -0600
Subject: [PATCH] Don't use interval

---
 web/components/notifications-icon.tsx | 16 +++++++---------
 web/pages/notifications.tsx           | 13 +++++++++----
 2 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/web/components/notifications-icon.tsx b/web/components/notifications-icon.tsx
index 63b3e3fe..3c8b9ed3 100644
--- a/web/components/notifications-icon.tsx
+++ b/web/components/notifications-icon.tsx
@@ -14,15 +14,13 @@ export default function NotificationsIcon(props: { className?: string }) {
   const privateUser = usePrivateUser(user?.id)
 
   useEffect(() => {
-    if (user) {
-      const bonusChecker = setInterval(() => {
-        requestBonuses({}).catch(console.log)
-        return () => {
-          clearInterval(bonusChecker)
-        }
-      }, 1000 * 65)
-    }
-  }, [user])
+    if (
+      privateUser &&
+      privateUser.lastTimeCheckedBonuses &&
+      Date.now() - privateUser.lastTimeCheckedBonuses > 1000 * 70
+    )
+      requestBonuses({}).catch(console.log)
+  }, [privateUser])
 
   return (
     <Row className={clsx('justify-center')}>
diff --git a/web/pages/notifications.tsx b/web/pages/notifications.tsx
index c9c8ace5..44a0667e 100644
--- a/web/pages/notifications.tsx
+++ b/web/pages/notifications.tsx
@@ -102,9 +102,14 @@ function NotificationsList(props: { privateUser: PrivateUser }) {
   if (!paginatedGroupedNotifications) return <LoadingIndicator />
 
   return (
-    <Col className={'min-h-screen'}>
-      {paginatedGroupedNotifications.length === 0 &&
-        "You don't have any notifications. Try changing your settings to see more."}
+    <div className={'min-h-[100vh]'}>
+      {paginatedGroupedNotifications.length === 0 && (
+        <div className={'mt-2'}>
+          You don't have any notifications. Try changing your settings to see
+          more.
+        </div>
+      )}
+
       {paginatedGroupedNotifications.map((notification) =>
         notification.type === 'income' ? (
           <IncomeNotificationGroupItem
@@ -168,7 +173,7 @@ function NotificationsList(props: { privateUser: PrivateUser }) {
             </div>
           </nav>
         )}
-    </Col>
+    </div>
   )
 }