From 83af70dc486f8eb2cac31e38313322913866def5 Mon Sep 17 00:00:00 2001
From: katspaugh <katspaugh@gmail.com>
Date: Fri, 20 Sep 2024 14:03:32 +0200
Subject: [PATCH] Approval editor

---
 cypress/support/localstorage_data.js               |  2 +-
 .../tx/SignOrExecuteForm/SignOrExecuteForm.tsx     | 14 +++++++-------
 src/components/tx/confirmation-views/index.tsx     |  5 ++++-
 3 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/cypress/support/localstorage_data.js b/cypress/support/localstorage_data.js
index 7b0ac24805..3f8541d464 100644
--- a/cypress/support/localstorage_data.js
+++ b/cypress/support/localstorage_data.js
@@ -7,7 +7,7 @@ const cookieState = {
   updates: true,
   analytics: true,
   terms: true,
-  termsVersion: CURRENT_COOKIE_TERMS_VERSION
+  termsVersion: CURRENT_COOKIE_TERMS_VERSION,
 }
 
 export const batchData = {
diff --git a/src/components/tx/SignOrExecuteForm/SignOrExecuteForm.tsx b/src/components/tx/SignOrExecuteForm/SignOrExecuteForm.tsx
index 0ae70a4613..bff1200c59 100644
--- a/src/components/tx/SignOrExecuteForm/SignOrExecuteForm.tsx
+++ b/src/components/tx/SignOrExecuteForm/SignOrExecuteForm.tsx
@@ -135,12 +135,6 @@ export const SignOrExecuteForm = ({
       <TxCard>
         {props.children}
 
-        {!props.isRejection && (
-          <ErrorBoundary fallback={<div>Error parsing data</div>}>
-            {isApproval && <ApprovalEditor safeTransaction={safeTx} />}
-          </ErrorBoundary>
-        )}
-
         <ConfirmationView
           isCreation={isCreation}
           txDetails={props.txDetails}
@@ -148,7 +142,13 @@ export const SignOrExecuteForm = ({
           isBatch={props.isBatch}
           showMethodCall={props.showMethodCall}
           isApproval={isApproval}
-        />
+        >
+          {!props.isRejection && (
+            <ErrorBoundary fallback={<div>Error parsing data</div>}>
+              {isApproval && <ApprovalEditor safeTransaction={safeTx} />}
+            </ErrorBoundary>
+          )}
+        </ConfirmationView>
 
         {!isCounterfactualSafe && !props.isRejection && <BlockaidBalanceChanges />}
       </TxCard>
diff --git a/src/components/tx/confirmation-views/index.tsx b/src/components/tx/confirmation-views/index.tsx
index 12a46e8cc4..7c09d850d2 100644
--- a/src/components/tx/confirmation-views/index.tsx
+++ b/src/components/tx/confirmation-views/index.tsx
@@ -8,7 +8,7 @@ import ConfirmationOrder from '../ConfirmationOrder'
 import useDecodeTx from '@/hooks/useDecodeTx'
 import type { SafeTransaction } from '@safe-global/safe-core-sdk-types'
 import { isCustomTxInfo, isGenericConfirmation } from '@/utils/transaction-guards'
-import { useMemo } from 'react'
+import { type ReactNode, useMemo } from 'react'
 import TxData from '@/components/transactions/TxDetails/TxData'
 import type { NarrowConfirmationViewProps } from './types'
 import SettingsChange from './SettingsChange'
@@ -22,6 +22,7 @@ type ConfirmationViewProps = {
   isApproval?: boolean
   isCreation?: boolean
   showMethodCall?: boolean
+  children?: ReactNode
 }
 
 const getConfirmationViewComponent = ({ txDetails, txInfo }: NarrowConfirmationViewProps) => {
@@ -60,6 +61,8 @@ const ConfirmationView = (props: ConfirmationViewProps) => {
 
       {decodedData && <ConfirmationOrder decodedData={decodedData} toAddress={props.safeTx?.data.to ?? ''} />}
 
+      {props.children}
+
       <DecodedTx
         tx={props.safeTx}
         txDetails={props.txDetails}