Verification popup can be activated multiple times (#6938)

Fixes https://github.com/twentyhq/twenty/issues/6912

By clicking Enter key over and over, user can repeat action Expected:
When 'yes' is typed in popup and user clicks Enter key once, popup
should disappear and correlated action should be performed only once

Implementation:
- Added loading state for buttons onClick and onEnter to disable the
button when the "Delete Api Key" and "Regenerate Api Key" function is
called.
- Added a new function to handle modal close and logic handling on
clicking enter key.

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-front/src/modules/ui/layout/modal/components/ConfirmationModal.tsx

@@ -17,6 +17,7 @@ import {
 export type ConfirmationModalProps = {
   isOpen: boolean;
   title: string;
+  loading?: boolean;
   subtitle: ReactNode;
   setIsOpen: (val: boolean) => void;
   onConfirmClick: () => void;
@@ -59,6 +60,7 @@ export const StyledConfirmationButton = styled(StyledCenteredButton)`
 export const ConfirmationModal = ({
   isOpen = false,
   title,
+  loading,
   subtitle,
   setIsOpen,
   onConfirmClick,
@@ -83,6 +85,18 @@ export const ConfirmationModal = ({
     250,
   );
 
+  const handleConfirmClick = () => {
+    onConfirmClick();
+
+    setIsOpen(false);
+  };
+
+  const handleEnter = () => {
+    if (isValidValue) {
+      handleConfirmClick();
+    }
+  };
+
   return (
     <AnimatePresence mode="wait">
       <LayoutGroup>
@@ -93,7 +107,7 @@ export const ConfirmationModal = ({
                 setIsOpen(false);
               }
             }}
-            onEnter={!isValidValue ? undefined : onConfirmClick}
+            onEnter={handleEnter}
             isClosable={true}
             padding="large"
           >
@@ -125,14 +139,11 @@ export const ConfirmationModal = ({
               fullWidth
             />
             <StyledCenteredButton
-              onClick={async () => {
-                await onConfirmClick();
-                setIsOpen(false);
-              }}
+              onClick={handleConfirmClick}
               variant="secondary"
               accent={confirmButtonAccent}
               title={deleteButtonText}
-              disabled={!isValidValue}
+              disabled={!isValidValue || loading}
               fullWidth
               dataTestId="confirmation-modal-confirm-button"
             />