fix: prevent new workspace modal from being closed without an active workspace (#224)

apps/web/src/components/modal.tsx

@@ -8,6 +8,7 @@ interface Props {
   modalSize?: "sm" | "md" | "lg";
   positionFromTop?: "sm" | "md" | "lg";
   isVisible?: boolean;
+  closeOnClickOutside?: boolean;
 }
 
 const Modal: React.FC<Props> = ({
@@ -15,10 +16,17 @@ const Modal: React.FC<Props> = ({
   modalSize = "sm",
   positionFromTop = "md",
   isVisible,
+  closeOnClickOutside,
 }) => {
-  const { isOpen, closeModal } = useModal();
+  const {
+    isOpen,
+    closeModal,
+    closeOnClickOutside: modalCloseOnClickOutside,
+  } = useModal();
 
-  const shouldShow = isVisible !== undefined ? isVisible : isOpen;
+  const shouldShow = isVisible ?? isOpen;
+  const shouldCloseOnClickOutside =
+    closeOnClickOutside ?? modalCloseOnClickOutside;
 
   const modalSizeMap = {
     sm: "max-w-[400px]",
@@ -34,7 +42,11 @@ const Modal: React.FC<Props> = ({
 
   return (
     <Transition.Root show={shouldShow} as={Fragment}>
-      <Dialog as="div" className="relative z-50" onClose={closeModal}>
+      <Dialog
+        as="div"
+        className="relative z-50"
+        onClose={shouldCloseOnClickOutside ? closeModal : () => null}
+      >
         <Transition.Child
           as={Fragment}
           enter="ease-out duration-300"