From c790cac3344484cf2ab5c51ae6593c0d54cb11ee Mon Sep 17 00:00:00 2001
From: Kevin Wu <kevinwu098@gmail.com>
Date: Wed, 20 Nov 2024 19:45:13 -0800
Subject: [PATCH] feat: handle resizes

---
 apps/antalmanac/src/routes/Home.tsx | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/apps/antalmanac/src/routes/Home.tsx b/apps/antalmanac/src/routes/Home.tsx
index 185d7c915..c3f1b9b91 100644
--- a/apps/antalmanac/src/routes/Home.tsx
+++ b/apps/antalmanac/src/routes/Home.tsx
@@ -1,7 +1,7 @@
 import DateFnsUtils from '@date-io/date-fns';
 import { MuiPickersUtilsProvider } from '@material-ui/pickers';
 import { CssBaseline, useMediaQuery, useTheme, Stack } from '@mui/material';
-import { useRef } from 'react';
+import { useCallback, useEffect, useRef } from 'react';
 import Split from 'react-split';
 
 import Calendar from '$components/Calendar/CalendarRoot';
@@ -27,7 +27,7 @@ function DesktopHome() {
 
     const scheduleManagementRef = useRef<HTMLDivElement>();
 
-    const handleDrag = () => {
+    const handleDrag = useCallback(() => {
         const scheduleManagementElement = scheduleManagementRef.current;
         if (!scheduleManagementElement) {
             return;
@@ -35,7 +35,17 @@ function DesktopHome() {
 
         const elementWidth = scheduleManagementElement.getBoundingClientRect().width;
         setScheduleManagementWidth(elementWidth);
-    };
+    }, [setScheduleManagementWidth]);
+
+    useEffect(() => {
+        handleDrag();
+
+        window.addEventListener('resize', handleDrag);
+
+        return () => {
+            window.removeEventListener('resize', handleDrag);
+        };
+    }, [handleDrag]);
 
     return (
         <>