Add suggestion

MetaMask · Oct 18, 2024 · c57767c · c57767c
1 parent 50bd518
commit c57767c
Show file tree

Hide file tree

Showing 2 changed files with 81 additions and 7 deletions.
diff --git a/ui/pages/confirmations/confirm-send-ether/__snapshots__/confirm-send-ether.test.js.snap b/ui/pages/confirmations/confirm-send-ether/__snapshots__/confirm-send-ether.test.js.snap
@@ -337,6 +337,82 @@ exports[`ConfirmSendEther should render correct information for for confirm send
             </div>
           </div>
         </div>
+        <div
+          class="mm-box simulation-details-layout mm-box--margin-4 mm-box--padding-3 mm-box--display-flex mm-box--gap-3 mm-box--flex-direction-column mm-box--rounded-lg mm-box--border-color-border-default box--border-style-solid box--border-width-1"
+          data-testid="simulation-details-layout"
+        >
+          <div
+            class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--justify-content-space-between mm-box--align-items-center"
+          >
+            <div
+              class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--flex-direction-row mm-box--align-items-center"
+            >
+              <p
+                class="mm-box mm-text mm-text--body-md-medium mm-box--color-text-default"
+              >
+                Estimated changes
+              </p>
+              <div>
+                <div
+                  aria-describedby="tippy-tooltip-2"
+                  class="info-tooltip__tooltip-container"
+                  data-original-title="null"
+                  data-tooltipped=""
+                  style="display: flex;"
+                  tabindex="0"
+                >
+                  <span
+                    class="mm-box mm-icon mm-icon--size-sm mm-box--margin-left-1 mm-box--display-inline-block mm-box--color-icon-muted"
+                    style="mask-image: url('./images/icons/question.svg');"
+                  />
+                </div>
+              </div>
+            </div>
+            <div
+              role="progressbar"
+            >
+              <svg
+                class="preloader__icon"
+                fill="none"
+                height="20"
+                viewBox="0 0 16 16"
+                width="20"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  clip-rule="evenodd"
+                  d="M8 13.7143C4.84409 13.7143 2.28571 11.1559 2.28571 8C2.28571 4.84409 4.84409 2.28571 8 2.28571C11.1559 2.28571 13.7143 4.84409 13.7143 8C13.7143 11.1559 11.1559 13.7143 8 13.7143ZM8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16Z"
+                  fill="var(--color-primary-muted)"
+                  fill-rule="evenodd"
+                />
+                <mask
+                  height="16"
+                  id="mask0"
+                  mask-type="alpha"
+                  maskUnits="userSpaceOnUse"
+                  width="16"
+                  x="0"
+                  y="0"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 13.7143C4.84409 13.7143 2.28571 11.1559 2.28571 8C2.28571 4.84409 4.84409 2.28571 8 2.28571C11.1559 2.28571 13.7143 4.84409 13.7143 8C13.7143 11.1559 11.1559 13.7143 8 13.7143ZM8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8C16 12.4183 12.4183 16 8 16Z"
+                    fill="var(--color-primary-default)"
+                    fill-rule="evenodd"
+                  />
+                </mask>
+                <g
+                  mask="url(#mask0)"
+                >
+                  <path
+                    d="M6.85718 17.9999V11.4285V8.28564H-4.85711V17.9999H6.85718Z"
+                    fill="var(--color-primary-default)"
+                  />
+                </g>
+              </svg>
+            </div>
+          </div>
+        </div>
         <div
           class="transaction-detail"
         >

diff --git a/ui/pages/confirmations/confirm-transaction-base/confirm-transaction-base.component.js b/ui/pages/confirmations/confirm-transaction-base/confirm-transaction-base.component.js
@@ -559,13 +559,11 @@ export default class ConfirmTransactionBase extends Component {
           tokenSymbol={tokenSymbol}
           isUsingPaymaster={isUsingPaymaster}
         />
-        {simulationData && (
-          <SimulationDetails
-            simulationData={simulationData}
-            transactionId={txData.id}
-            enableMetrics
-          />
-        )}
+        <SimulationDetails
+          simulationData={simulationData}
+          transactionId={txData.id}
+          enableMetrics
+        />
         {!renderSimulationFailureWarning && (
           <TransactionDetail
             disableEditGasFeeButton