From 0533d5071de137f0ece6f773d7e0b481c75e0a3c Mon Sep 17 00:00:00 2001
From: Franco Venica <francovenica@gmail.com>
Date: Tue, 14 Nov 2023 11:34:35 -0300
Subject: [PATCH] Add loader to bulk execution + removal submitBtn

---
 .../flows/ExecuteBatch/ReviewBatch.tsx        | 12 ++++++--
 .../tx/SignOrExecuteForm/SubmitButton.tsx     | 29 -------------------
 2 files changed, 9 insertions(+), 32 deletions(-)
 delete mode 100644 src/components/tx/SignOrExecuteForm/SubmitButton.tsx

diff --git a/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx b/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx
index c1277142af..c95deb0b12 100644
--- a/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx
+++ b/src/components/tx-flow/flows/ExecuteBatch/ReviewBatch.tsx
@@ -1,4 +1,4 @@
-import { Typography, Button, CardActions, Divider, Alert } from '@mui/material'
+import { CircularProgress, Typography, Button, CardActions, Divider, Alert } from '@mui/material'
 import useAsync from '@/hooks/useAsync'
 import { FEATURES } from '@safe-global/safe-gateway-typescript-sdk'
 import type { TransactionDetails } from '@safe-global/safe-gateway-typescript-sdk'
@@ -194,8 +194,14 @@ export const ReviewBatch = ({ params }: { params: ExecuteBatchFlowProps }) => {
           <CardActions>
             <CheckWallet allowNonOwner={true}>
               {(isOk) => (
-                <Button variant="contained" type="submit" disabled={!isOk || submitDisabled} onClick={handleSubmit}>
-                  Submit
+                <Button
+                  variant="contained"
+                  type="submit"
+                  disabled={!isOk || submitDisabled}
+                  onClick={handleSubmit}
+                  sx={{ minWidth: '114px' }}
+                >
+                  {!isSubmittable ? <CircularProgress size={20} /> : 'Submit'}
                 </Button>
               )}
             </CheckWallet>
diff --git a/src/components/tx/SignOrExecuteForm/SubmitButton.tsx b/src/components/tx/SignOrExecuteForm/SubmitButton.tsx
deleted file mode 100644
index 8412086eab..0000000000
--- a/src/components/tx/SignOrExecuteForm/SubmitButton.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import CheckWallet from '@/components/common/CheckWallet'
-import { Button } from '@mui/material'
-import { useContext } from 'react'
-import { TxSecurityContext } from '../security/shared/TxSecurityContext'
-
-const SubmitButton = ({
-  willExecute,
-  submitDisabled,
-  isEstimating,
-}: {
-  willExecute: boolean
-  submitDisabled: boolean
-  isEstimating: boolean
-}) => {
-  const { needsRiskConfirmation, isRiskConfirmed } = useContext(TxSecurityContext)
-
-  const disableButton = submitDisabled || (needsRiskConfirmation && !isRiskConfirmed)
-  return (
-    <CheckWallet allowNonOwner={willExecute}>
-      {(isOk) => (
-        <Button variant="contained" type="submit" disabled={!isOk || disableButton}>
-          {isEstimating ? 'Estimating...' : 'Submit'}
-        </Button>
-      )}
-    </CheckWallet>
-  )
-}
-
-export default SubmitButton