From bb5c89cbd8a010a2063206b8ea5390bd92a53db0 Mon Sep 17 00:00:00 2001
From: Bhav Beri <bhavberi@gmail.com>
Date: Thu, 31 Oct 2024 12:48:43 +0530
Subject: [PATCH] Fix completed events loading issue after refactoring

---
 src/components/events/EventCards.jsx         |  3 +--
 src/components/events/PaginatedEventGrid.jsx | 26 ++++++++++++--------
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/components/events/EventCards.jsx b/src/components/events/EventCards.jsx
index 2a3b5c40..e32c9d30 100644
--- a/src/components/events/EventCards.jsx
+++ b/src/components/events/EventCards.jsx
@@ -5,7 +5,6 @@ export function EventCards({
   events,
   loading,
   noEventsMessage,
-  loadingIndicator = true,
 }) {
   if (loading) {
     return (
@@ -16,7 +15,7 @@ export function EventCards({
         height="100%"
         mt={3}
       >
-        {loadingIndicator ? <CircularProgress /> : null}
+        <CircularProgress />
       </Box>
     );
   }
diff --git a/src/components/events/PaginatedEventGrid.jsx b/src/components/events/PaginatedEventGrid.jsx
index 21887277..b9daa83b 100644
--- a/src/components/events/PaginatedEventGrid.jsx
+++ b/src/components/events/PaginatedEventGrid.jsx
@@ -1,10 +1,7 @@
 "use client";
 
 import { useEffect, useState, useCallback, useRef } from "react";
-import {
-  Typography,
-  Divider,
-} from "@mui/material";
+import { Typography, Divider } from "@mui/material";
 import { EventCards, LoadingIndicator } from "./EventCards";
 
 export default function PaginatedEventGrid({
@@ -221,12 +218,21 @@ export default function PaginatedEventGrid({
               Completed Events
             </Typography>
           </Divider>
-          <EventCards
-            events={completedevents}
-            loading={loadingPast}
-            loadingIndicator={false}
-            noEventsMessage="No events found."
-          />
+          {!loadingPast && !completedevents.length ? (
+            <Typography
+              variant="h4"
+              color="text.secondary"
+              sx={{ flexGrow: 1, textAlign: "center", mt: 5 }}
+            >
+              No events found.
+            </Typography>
+          ) : (
+            <EventCards
+              events={completedevents}
+              loading={false}
+              noEventsMessage=""
+            />
+          )}
         </>
       )}