From 7107336b491d3634376dcbd26ae77e4a6825268a Mon Sep 17 00:00:00 2001
From: Mike Cao <mike@mikecao.com>
Date: Thu, 24 Aug 2023 16:17:46 -0700
Subject: [PATCH] Added loading to event data.

---
 src/components/pages/websites/WebsiteEventData.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/pages/websites/WebsiteEventData.js b/src/components/pages/websites/WebsiteEventData.js
index ea8e473b..d38ca1ad 100644
--- a/src/components/pages/websites/WebsiteEventData.js
+++ b/src/components/pages/websites/WebsiteEventData.js
@@ -1,4 +1,4 @@
-import { Flexbox } from 'react-basics';
+import { Flexbox, Loading } from 'react-basics';
 import EventDataTable from 'components/pages/event-data/EventDataTable';
 import EventDataValueTable from 'components/pages/event-data/EventDataValueTable';
 import { EventDataMetricsBar } from 'components/pages/event-data/EventDataMetricsBar';
@@ -28,13 +28,14 @@ export default function WebsiteEventData({ websiteId }) {
   const {
     query: { event },
   } = usePageQuery();
-  const { data } = useData(websiteId, event);
+  const { data, isLoading } = useData(websiteId, event);
 
   return (
     <Flexbox className={styles.container} direction="column" gap={20}>
       <EventDataMetricsBar websiteId={websiteId} />
       {!event && <EventDataTable data={data} />}
-      {event && <EventDataValueTable event={event} data={data} />}
+      {isLoading && <Loading position="page" />}
+      {event && data && <EventDataValueTable event={event} data={data} />}
     </Flexbox>
   );
 }