update,

03_source/frontend/src/sections/user/user-table-row.tsx

@@ -19,6 +19,7 @@ import { Label } from 'src/components/label';
 import { RouterLink } from 'src/routes/components';
 import type { IUserItem } from 'src/types/user';
 import { UserQuickEditForm } from './user-quick-edit-form';
+import { useState } from 'react';
 
 // ----------------------------------------------------------------------
 
@@ -55,7 +56,7 @@ export function UserTableRow({ row, selected, editHref, onSelectRow, onDeleteRow
         <li>
           <MenuItem component={RouterLink} href={editHref} onClick={() => menuActions.onClose()}>
             <Iconify icon="solar:pen-bold" />
-            Edit
+            {t('Edit')}
           </MenuItem>
         </li>
 
@@ -67,21 +68,31 @@ export function UserTableRow({ row, selected, editHref, onSelectRow, onDeleteRow
           sx={{ color: 'error.main' }}
         >
           <Iconify icon="solar:trash-bin-trash-bold" />
-          Delete
+          {t('Delete')}
         </MenuItem>
       </MenuList>
     </CustomPopover>
   );
 
+  const [disableDeleteButton, setDisableDeleteButton] = useState<boolean>(false);
   const renderConfirmDialog = () => (
     <ConfirmDialog
       open={confirmDialog.value}
       onClose={confirmDialog.onFalse}
-      title="Delete"
-      content="Are you sure want to delete?"
+      title={t('Delete')}
+      content={t('Are you sure want to delete user?')}
       action={
-        <Button variant="contained" color="error" onClick={onDeleteRow}>
-          Delete
+        <Button
+          disabled={disableDeleteButton}
+          loading={disableDeleteButton}
+          variant="contained"
+          color="error"
+          onClick={() => {
+            setDisableDeleteButton(true);
+            onDeleteRow();
+          }}
+        >
+          {t('Delete')}
         </Button>
       }
     />