model config click backdrop to confirm

src/components/ConfigMenu/ConfigMenu.tsx

@@ -44,6 +44,7 @@ const ConfigMenu = ({
       title={t('configuration') as string}
       setIsModalOpen={setIsModalOpen}
       handleConfirm={handleConfirm}
+      handleClickBackdrop={handleConfirm}
     >
       <div className='p-6 border-b border-gray-200 dark:border-gray-600'>
         <ModelSelector _model={_model} _setModel={_setModel} />

src/components/PopupModal/PopupModal.tsx

@@ -10,6 +10,7 @@ const PopupModal = ({
   setIsModalOpen,
   handleConfirm,
   handleClose,
+  handleClickBackdrop,
   cancelButton = true,
   children,
 }: {
@@ -18,6 +19,7 @@ const PopupModal = ({
   setIsModalOpen: React.Dispatch<React.SetStateAction<boolean>>;
   handleConfirm?: () => void;
   handleClose?: () => void;
+  handleClickBackdrop?: () => void;
   cancelButton?: boolean;
   children?: React.ReactElement;
 }) => {
@@ -29,6 +31,11 @@ const PopupModal = ({
     setIsModalOpen(false);
   };
 
+  const _handleBackdropClose = () => {
+    if (handleClickBackdrop) handleClickBackdrop();
+    else _handleClose();
+  };
+
   if (modalRoot) {
     return ReactDOM.createPortal(
       <div className='fixed top-0 left-0 z-[999] w-full p-4 overflow-x-hidden overflow-y-auto h-full flex justify-center items-center'>
@@ -81,7 +88,7 @@ const PopupModal = ({
         </div>
         <div
           className='bg-gray-800/90 absolute top-0 left-0 h-full w-full z-[-1]'
-          onClick={_handleClose}
+          onClick={_handleBackdropClose}
         />
       </div>,
       modalRoot