From ff4eed5b8b7b0cacdfdd97250f6829721788d06d Mon Sep 17 00:00:00 2001
From: Nicola Benaglia <nico.benaz@gmail.com>
Date: Fri, 6 Jun 2025 19:45:13 +0200
Subject: [PATCH] Refactor modal and add check onCancel action

---
 src/components/Group/BlockedUsersModal.tsx | 20 +++++++++++++-------
 src/hooks/useModal.tsx                     |  2 +-
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/src/components/Group/BlockedUsersModal.tsx b/src/components/Group/BlockedUsersModal.tsx
index 6bca8c2..a3788fc 100644
--- a/src/components/Group/BlockedUsersModal.tsx
+++ b/src/components/Group/BlockedUsersModal.tsx
@@ -65,7 +65,6 @@ export const BlockedUsersModal = () => {
   }, [isOpenBlockedModal]);
 
   const getNames = async () => {
-    // const validApi = await findUsableApi();
     const addresses = Object.keys(blockedUsers?.addresses);
     const addressNames = {};
 
@@ -142,6 +141,10 @@ export const BlockedUsersModal = () => {
         executeEvent('updateChatMessagesWithBlocks', true);
       }
     } catch (error) {
+      if (error?.isCanceled) {
+        // user pressed Escape or canceled — do nothing
+        return;
+      }
       setOpenSnackGlobal(true);
       setInfoSnackCustom({
         type: 'error',
@@ -173,20 +176,22 @@ export const BlockedUsersModal = () => {
 
   return (
     <Dialog
-      open={isOpenBlockedModal}
-      aria-labelledby="alert-dialog-title"
       aria-describedby="alert-dialog-description"
+      aria-labelledby="alert-dialog-title"
+      onClose={onCancel}
+      open={isOpenBlockedModal}
     >
       <DialogTitle
         sx={{
-          textAlign: 'center',
           color: theme.palette.text.primary,
           fontWeight: 'bold',
           opacity: 1,
+          textAlign: 'center',
         }}
       >
-        {t('auth:blocked_users', { postProcess: 'capitalizeFirstChar' })}
+        {t('auth:blocked_users', { postProcess: 'capitalizeAll' })}
       </DialogTitle>
+
       <DialogContent
         sx={{
           padding: '20px',
@@ -293,7 +298,7 @@ export const BlockedUsersModal = () => {
             <Spacer height="20px" />
 
             <DialogContentText id="alert-dialog-description">
-              {t('core:message.generic.blocked_names', {
+              {t('auth:message.generic.blocked_names', {
                 postProcess: 'capitalizeFirstChar',
               })}
             </DialogContentText>
@@ -375,6 +380,7 @@ export const BlockedUsersModal = () => {
 
       <Dialog
         open={isShow}
+        onClose={onCancel}
         aria-labelledby="alert-dialog-title"
         aria-describedby="alert-dialog-description"
       >
@@ -388,7 +394,7 @@ export const BlockedUsersModal = () => {
           }}
         >
           {t('auth:message.generic.decide_block', {
-            postProcess: 'capitalizeFirstChar',
+            postProcess: 'capitalizeAll',
           })}
         </DialogTitle>
 
diff --git a/src/hooks/useModal.tsx b/src/hooks/useModal.tsx
index da5f0e1..e01483c 100644
--- a/src/hooks/useModal.tsx
+++ b/src/hooks/useModal.tsx
@@ -35,7 +35,7 @@ export const useModal = () => {
   const onCancel = useCallback(() => {
     const { reject } = promiseConfig.current || {};
     hide();
-    reject?.('Declined');
+    reject?.({ isCanceled: true });
   }, [hide]);
 
   return useMemo(