From 7a0f8b3fffcef03754ac1ee21f6e29078de45440 Mon Sep 17 00:00:00 2001
From: Pedro Ladaria <pedro.jose.ladaria.linden@telefonica.com>
Date: Fri, 20 Dec 2024 11:51:33 +0100
Subject: [PATCH] WEB-2113 cleanup

---
 src/drawer.tsx | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/drawer.tsx b/src/drawer.tsx
index 54ed29d28..2fb6629f4 100644
--- a/src/drawer.tsx
+++ b/src/drawer.tsx
@@ -65,11 +65,14 @@ const DrawerLayout = React.forwardRef<DrawerPropsRef, DrawerLayoutProps>(
         useRestoreFocus();
         const {isMobile, isTablet} = useScreenSize();
         const [isOpen, setIsOpen] = React.useState(false);
+        const widthStyle = isMobile ? 'auto' : width || (isTablet ? WIDTH_TABLET : WIDTH_DESKTOP);
 
         const open = React.useCallback((node: HTMLDivElement) => {
             if (node) {
                 // small delay to allow the Portal to be mounted
-                setTimeout(() => setIsOpen(true), 50);
+                setTimeout(() => {
+                    setIsOpen(true);
+                }, 50);
             }
         }, []);
 
@@ -103,20 +106,18 @@ const DrawerLayout = React.forwardRef<DrawerPropsRef, DrawerLayoutProps>(
                 <FocusTrap>
                     {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}
                     <div
+                        data-testid="drawerOverlay"
                         onClick={onDismiss ? dismiss : undefined}
                         className={classnames(
                             styles.overlay,
                             isOpen ? styles.overlayOpen : styles.overlayClosed
                         )}
-                        {...getPrefixedDataAttributes({}, 'DrawerOverlay')}
                     />
                     <div
+                        data-testid="drawerLayout"
                         ref={open}
-                        style={{
-                            width: isMobile ? 'unset' : width || (isTablet ? WIDTH_TABLET : WIDTH_DESKTOP),
-                        }}
+                        style={{width: widthStyle}}
                         className={classnames(styles.container, isOpen ? styles.open : styles.closed)}
-                        {...getPrefixedDataAttributes({}, 'DrawerLayout')}
                     >
                         {children}
                     </div>
@@ -137,6 +138,10 @@ type DrawerProps = {
     title?: string;
     subtitle?: string;
     description?: string;
+    /**
+     * this handler is mandatory. You should unmount the Drawer component on close.
+     */
+    onClose: () => void;
     /**
      * set this handler to enable dismiss:
      * - touching "X"
@@ -144,7 +149,6 @@ type DrawerProps = {
      * - pressing ESC
      */
     onDismiss?: () => void;
-    onClose: () => void;
     children?: React.ReactNode;
     /**
      * width is ignored in mobile viewport