From b7e2a1d731277c7aa349f8e8fc9bc865a56f3c59 Mon Sep 17 00:00:00 2001
From: CarolineVP <caroline_pujebet@hotmail.com>
Date: Tue, 18 Oct 2022 15:55:12 +0200
Subject: [PATCH 1/2] fix(Drawer): update initial drawer step on device resize

---
 src/Drawer/Drawer.reducer.ts |  6 +++---
 src/Drawer/Drawer.tsx        | 17 ++++++++++++-----
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/src/Drawer/Drawer.reducer.ts b/src/Drawer/Drawer.reducer.ts
index 7877ff480..cf5bdea77 100644
--- a/src/Drawer/Drawer.reducer.ts
+++ b/src/Drawer/Drawer.reducer.ts
@@ -58,11 +58,11 @@ export const reducer: React.Reducer<DrawerReducerState, DrawerActions> = (
       const drawerSteps = getStepHeights(action.containerHeight)
       const stepEntries = Object.entries(drawerSteps)
       const currentPos = action.containerHeight - (state.position ?? 0)
-      const closestStep = stepEntries.reduce((prev, curr) => {
-        return Math.abs(curr[1] - currentPos) < Math.abs(prev[1] - currentPos)
+      const closestStep = stepEntries.reduce((prev, curr) =>
+        Math.abs(curr[1] - currentPos) < Math.abs(prev[1] - currentPos)
           ? curr
           : prev
-      })
+      )
 
       return {
         ...state,
diff --git a/src/Drawer/Drawer.tsx b/src/Drawer/Drawer.tsx
index 04221b985..6668df3cc 100644
--- a/src/Drawer/Drawer.tsx
+++ b/src/Drawer/Drawer.tsx
@@ -35,12 +35,19 @@ export const Drawer = React.forwardRef<HTMLDivElement, DrawerProps>(
     }, [state.drawerStep]) // eslint-disable-line react-hooks/exhaustive-deps
     React.useEffect(() => {
       if (stateProp && stateProp !== state.drawerStep) {
-        dispatch({
-          type: DrawerActionTypes.ChangeStep,
-          value: stateProp,
-          containerHeight: mergedRef.current?.clientHeight ?? 0,
-        })
+        const initializedStep = () => {
+          dispatch({
+            type: DrawerActionTypes.ChangeStep,
+            value: stateProp,
+            containerHeight: mergedRef.current?.clientHeight ?? 0,
+          })
+        }
+        initializedStep()
         initialized.current = true
+        window.addEventListener('resize', initializedStep)
+        return () => {
+          window.removeEventListener('resize', initializedStep)
+        }
       }
     }, [stateProp]) // eslint-disable-line react-hooks/exhaustive-deps
 

From 8ff693fb503bca551b840957fb714189f909a889 Mon Sep 17 00:00:00 2001
From: CarolineVP <caroline_pujebet@hotmail.com>
Date: Wed, 19 Oct 2022 17:42:23 +0200
Subject: [PATCH 2/2] add debounce

---
 src/Drawer/Drawer.tsx | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/src/Drawer/Drawer.tsx b/src/Drawer/Drawer.tsx
index 6668df3cc..a6eff5461 100644
--- a/src/Drawer/Drawer.tsx
+++ b/src/Drawer/Drawer.tsx
@@ -1,3 +1,4 @@
+import { debounce } from 'lodash'
 import * as React from 'react'
 
 import { useMergedRef } from '../_internal/useMergedRef'
@@ -35,13 +36,17 @@ export const Drawer = React.forwardRef<HTMLDivElement, DrawerProps>(
     }, [state.drawerStep]) // eslint-disable-line react-hooks/exhaustive-deps
     React.useEffect(() => {
       if (stateProp && stateProp !== state.drawerStep) {
-        const initializedStep = () => {
-          dispatch({
-            type: DrawerActionTypes.ChangeStep,
-            value: stateProp,
-            containerHeight: mergedRef.current?.clientHeight ?? 0,
-          })
-        }
+        const initializedStep = debounce(
+          () => {
+            dispatch({
+              type: DrawerActionTypes.ChangeStep,
+              value: stateProp,
+              containerHeight: mergedRef.current?.clientHeight ?? 0,
+            })
+          },
+          200,
+          { leading: true, trailing: false }
+        )
         initializedStep()
         initialized.current = true
         window.addEventListener('resize', initializedStep)