fix: Save description when clicking outside

client/src/lib/hooks/index.js

@@ -2,5 +2,6 @@ import usePrevious from './use-previous';
 import useToggle from './use-toggle';
 import useForceUpdate from './use-force-update';
 import useDidUpdate from './use-did-update';
+import useClickAwayListener from './use-click-away-listener';
 
-export { usePrevious, useToggle, useForceUpdate, useDidUpdate };
+export { usePrevious, useToggle, useForceUpdate, useDidUpdate, useClickAwayListener };

client/src/lib/hooks/use-click-away-listener.js

@@ -0,0 +1,45 @@
+import { useCallback, useEffect, useMemo, useRef } from 'react';
+
+export default (elementRefs, onAwayClick, onCancel) => {
+  const pressedElement = useRef(null);
+
+  const handlePress = useCallback((event) => {
+    pressedElement.current = event.target;
+  }, []);
+
+  useEffect(() => {
+    const handleEvent = (event) => {
+      const element = elementRefs.find(({ current }) => current?.contains(event.target))?.current;
+
+      if (element) {
+        if (!pressedElement.current || pressedElement.current !== element) {
+          onCancel();
+        }
+      } else if (pressedElement.current) {
+        onCancel();
+      } else {
+        onAwayClick();
+      }
+
+      pressedElement.current = null;
+    };
+
+    document.addEventListener('mouseup', handleEvent, true);
+    document.addEventListener('touchend', handleEvent, true);
+
+    return () => {
+      document.removeEventListener('mouseup', handleEvent, true);
+      document.removeEventListener('touchend', handleEvent, true);
+    };
+  }, [onAwayClick, onCancel]); // eslint-disable-line react-hooks/exhaustive-deps
+
+  const props = useMemo(
+    () => ({
+      onMouseDown: handlePress,
+      onTouchStart: handlePress,
+    }),
+    [handlePress],
+  );
+
+  return props;
+};