diff --git a/client/src/common/components/buttons/DeleteIconBtn.jsx b/client/src/common/components/buttons/DeleteIconBtn.jsx
index eb4fea6b4..193c77a5e 100644
--- a/client/src/common/components/buttons/DeleteIconBtn.jsx
+++ b/client/src/common/components/buttons/DeleteIconBtn.jsx
@@ -1,15 +1,25 @@
 import { IconButton } from '@chakra-ui/button';
+import { useState } from 'react';
 import { FiMinus } from 'react-icons/fi';
 
 export default function DeleteIconBtn(props) {
   const { actionHandler, ...rest } = props;
+  const [loading, setLoading] = useState(false);
+
+  const handleClick = () => {
+    setLoading(true);
+    actionHandler('delete');
+  };
+
   return (
     <IconButton
       size={props.size || 'xs'}
       icon={<FiMinus />}
       colorScheme='red'
-      onClick={() => actionHandler('delete')}
+      onClick={handleClick}
       _focus={{ boxShadow: 'none' }}
+      disabled={loading}
+      isLoading={loading}
       {...rest}
     />
   );