From 31137dd0012754a93d80ecaf09d0c3531349454a Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Thu, 24 Feb 2022 23:07:27 +0100
Subject: [PATCH] fix(ui) - errors api call

---
 .../components/Alerts/Notifications/Notifications.js   |  5 ++++-
 .../app/components/shared/ErrorsBadge/ErrorsBadge.js   | 10 +++++++---
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/frontend/app/components/Alerts/Notifications/Notifications.js b/frontend/app/components/Alerts/Notifications/Notifications.js
index 72aa8db8d..deb14b640 100644
--- a/frontend/app/components/Alerts/Notifications/Notifications.js
+++ b/frontend/app/components/Alerts/Notifications/Notifications.js
@@ -18,7 +18,10 @@ class Notifications extends React.Component {
 
   constructor(props) {
     super(props);
-    props.fetchList();
+    setTimeout(() => {
+      props.fetchList();
+    }, 1000);
+    
     setInterval(() => {
       props.fetchList();
     }, AUTOREFRESH_INTERVAL);
diff --git a/frontend/app/components/shared/ErrorsBadge/ErrorsBadge.js b/frontend/app/components/shared/ErrorsBadge/ErrorsBadge.js
index 073d252d8..74700eaf5 100644
--- a/frontend/app/components/shared/ErrorsBadge/ErrorsBadge.js
+++ b/frontend/app/components/shared/ErrorsBadge/ErrorsBadge.js
@@ -9,16 +9,19 @@ import {
 
 const AUTOREFRESH_INTERVAL = 5 * 60 * 1000;
 const weekRange = getDateRangeFromValue(DATE_RANGE_VALUES.LAST_7_DAYS);
+let intervalId = null
 
-function ErrorsBadge({ errorsStats = {}, fetchNewErrorsCount }) {
+function ErrorsBadge({ errorsStats = {}, fetchNewErrorsCount, projects }) {
   useEffect(() => {
+    if (projects.size === 0 || !!intervalId) return;
+    
     const params = { startTimestamp: weekRange.start.unix() * 1000, endTimestamp: weekRange.end.unix() * 1000 };
     fetchNewErrorsCount(params)
 
-    setInterval(() => {
+    intervalId = setInterval(() => {
       fetchNewErrorsCount(params);
     }, AUTOREFRESH_INTERVAL);
-  }, [])
+  }, [projects])
   
   return errorsStats.unresolvedAndUnviewed > 0 ? (
     <div>{<div className={stl.badge} />  }</div>
@@ -27,4 +30,5 @@ function ErrorsBadge({ errorsStats = {}, fetchNewErrorsCount }) {
 
 export default connect(state => ({
   errorsStats: state.getIn([ 'errors', 'stats' ]),
+  projects: state.getIn([ 'site', 'list' ]),
 }), { fetchNewErrorsCount })(ErrorsBadge)