⚠️🔧 HOTFIX - Fix client side exception on home page (#3129)

* 🐛 Fixed live steam hook attempti ng to access props when liveStream is null * 🐛 Added fallback logic where livestream bannerwill not be displayed if it is null --------- Co-authored-by: Calinator444 <[email protected]>
SSWConsulting · Sep 19, 2024 · dd3a5bd · dd3a5bd
1 parent 65a6c86
commit dd3a5bd
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 10 deletions.
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -59,8 +59,8 @@ export default async function RootLayout({
   });
 
   const liveStreamData: EventInfoStatic =
-    nextUG.data.eventsCalendarConnection.edges.length > 0
-      ? nextUG.data.eventsCalendarConnection.edges[0].node
+    nextUG?.data?.eventsCalendarConnection?.edges?.length > 0
+      ? nextUG?.data?.eventsCalendarConnection?.edges[0]?.node
       : null;
 
   return (
@@ -76,9 +76,11 @@ export default async function RootLayout({
         >
           <header className="no-print">
             <Suspense>
-              <LiveStream event={liveStreamData}>
-                <MenuWrapper menu={menuData.data.megamenu.menuGroups} />
-              </LiveStream>
+              {liveStreamData && (
+                <LiveStream event={liveStreamData}>
+                  <MenuWrapper menu={menuData.data.megamenu.menuGroups} />
+                </LiveStream>
+              )}
             </Suspense>
           </header>
           <main className="grow bg-white">{children}</main>

diff --git a/components/layout/layout.tsx b/components/layout/layout.tsx
@@ -125,15 +125,15 @@ export const Layout = ({
           )}
         >
           <header className="no-print">
-            {(showBanner || router?.query?.liveBanner?.length > 0) && (
+            {event && (showBanner || router?.query?.liveBanner?.length > 0) && (
               <LiveStreamBanner
                 countdownMins={countdownMins}
                 liveStreamData={event}
                 isLive={!!isLive}
               />
             )}
             <div className="mx-auto max-w-9xl px-8">
-              {(isLive || router.query.liveStream) && (
+              {event && (isLive || router?.query?.liveStream) && (
                 <LiveStreamWidget
                   event={event}
                   countdownMins={countdownMins}

diff --git a/hooks/useLiveStreamProps.ts b/hooks/useLiveStreamProps.ts
@@ -15,12 +15,12 @@ export function useLiveStreamTimer(event: EventInfo): LiveStreamProps {
 
   useEffect(() => {
     const rightnow = dayjs().utc();
-    const liveDelay = event.liveStreamDelayMinutes ?? 0;
-    if (!liveStreamDelayMinutes && event.delayedLiveStreamStart) {
+    const liveDelay = event?.liveStreamDelayMinutes ?? 0;
+    if (!liveStreamDelayMinutes && event?.delayedLiveStreamStart) {
       setLiveStreamDelayMinutes(liveDelay);
     }
 
-    const start = dayjs(event.startDateTime).add(liveDelay, "minute");
+    const start = dayjs(event?.startDateTime).add(liveDelay, "minute");
     const minsToStart = start.diff(rightnow, "minute");
     setCountdownMins(minsToStart);