fix: resolve infinite loop

Kajabi · May 16, 2024 · afe1e93 · afe1e93
1 parent 59c8132
commit afe1e93
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/packages/sage-react/lib/Drawer/Drawer.jsx b/packages/sage-react/lib/Drawer/Drawer.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { Modal } from '../Modal';
@@ -30,8 +30,10 @@ export const Drawer = ({
   size,
   title,
 }) => {
+  const prevExpandedRef = useRef();
+
   useEffect(() => {
-    if (onExpandChange) {
+    if (onExpandChange && prevExpandedRef.current !== expanded) {
       // Trigger outwards that a change to expanded was detected
       onExpandChange(expanded ? DRAWER_START_EXPAND : DRAWER_START_COLLAPSE);
 
@@ -40,6 +42,7 @@ export const Drawer = ({
         onExpandChange(expanded ? DRAWER_END_EXPAND : DRAWER_END_COLLAPSE);
       }, 750);
     }
+    prevExpandedRef.current = expanded;
   }, [expanded, onExpandChange]);
 
   const classNames = classnames(