From ffa1b86311afcaa703e1de1c09cbd2cf4f1651d8 Mon Sep 17 00:00:00 2001
From: Dan J Miller <danjm.com@gmail.com>
Date: Wed, 24 Jul 2024 09:11:56 -0230
Subject: [PATCH] Revert "chore: tweak send page styling (#25982)"

This reverts commit ef38d626ccbf39cb98199b0af48731a2d19e4f28.
---
 app/_locales/de/messages.json                 |  3 +++
 app/_locales/el/messages.json                 |  3 +++
 app/_locales/en/messages.json                 |  3 +++
 app/_locales/es/messages.json                 |  3 +++
 app/_locales/fr/messages.json                 |  3 +++
 app/_locales/hi/messages.json                 |  3 +++
 app/_locales/id/messages.json                 |  3 +++
 app/_locales/ja/messages.json                 |  3 +++
 app/_locales/ko/messages.json                 |  3 +++
 app/_locales/pt/messages.json                 |  3 +++
 app/_locales/ru/messages.json                 |  3 +++
 app/_locales/tl/messages.json                 |  3 +++
 app/_locales/tr/messages.json                 |  3 +++
 app/_locales/vi/messages.json                 |  3 +++
 app/_locales/zh_CN/messages.json              |  3 +++
 .../asset-picker-modal/asset-picker-modal.tsx | 21 +++++++++----------
 .../pages/page/components/header/header.tsx   |  6 ------
 .../send/__snapshots__/send.test.js.snap      |  8 +++----
 ui/components/multichain/pages/send/send.js   |  6 +-----
 19 files changed, 60 insertions(+), 26 deletions(-)

diff --git a/app/_locales/de/messages.json b/app/_locales/de/messages.json
index c79604574582..d518a4f76419 100644
--- a/app/_locales/de/messages.json
+++ b/app/_locales/de/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Senden"
   },
+  "sendAToken": {
+    "message": "Token senden"
+  },
   "sendBugReport": {
     "message": "Übermitteln Sie uns einen Fehlerbericht."
   },
diff --git a/app/_locales/el/messages.json b/app/_locales/el/messages.json
index 0d19c084a788..b9ee6aebef9f 100644
--- a/app/_locales/el/messages.json
+++ b/app/_locales/el/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Αποστολή"
   },
+  "sendAToken": {
+    "message": "Στείλτε ένα token"
+  },
   "sendBugReport": {
     "message": "Στείλτε μας μια αναφορά σφάλματος."
   },
diff --git a/app/_locales/en/messages.json b/app/_locales/en/messages.json
index 637329f50f04..7ba8016a3244 100644
--- a/app/_locales/en/messages.json
+++ b/app/_locales/en/messages.json
@@ -4669,6 +4669,9 @@
   "send": {
     "message": "Send"
   },
+  "sendAToken": {
+    "message": "Send a token"
+  },
   "sendBugReport": {
     "message": "Send us a bug report."
   },
diff --git a/app/_locales/es/messages.json b/app/_locales/es/messages.json
index e002ef51d1a5..c98710b9cb20 100644
--- a/app/_locales/es/messages.json
+++ b/app/_locales/es/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Enviar"
   },
+  "sendAToken": {
+    "message": "Enviar un token"
+  },
   "sendBugReport": {
     "message": "Envíenos un informe de error."
   },
diff --git a/app/_locales/fr/messages.json b/app/_locales/fr/messages.json
index ede2e5dd0c26..db9a22822545 100644
--- a/app/_locales/fr/messages.json
+++ b/app/_locales/fr/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Envoyer"
   },
+  "sendAToken": {
+    "message": "Envoyer un jeton"
+  },
   "sendBugReport": {
     "message": "Envoyez-nous un rapport de bogue."
   },
diff --git a/app/_locales/hi/messages.json b/app/_locales/hi/messages.json
index ebe4d332817a..b2f2f2cc2ff5 100644
--- a/app/_locales/hi/messages.json
+++ b/app/_locales/hi/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "भेजें"
   },
+  "sendAToken": {
+    "message": "एक टोकन भेजें"
+  },
   "sendBugReport": {
     "message": "हमें एक बग रिपोर्ट भेजें।"
   },
diff --git a/app/_locales/id/messages.json b/app/_locales/id/messages.json
index 45159fc588d4..69373f6c1a29 100644
--- a/app/_locales/id/messages.json
+++ b/app/_locales/id/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Kirim"
   },
+  "sendAToken": {
+    "message": "Kirimkan token"
+  },
   "sendBugReport": {
     "message": "Kirimi kami laporan bug."
   },
diff --git a/app/_locales/ja/messages.json b/app/_locales/ja/messages.json
index c031577d7888..57fc7f0c84cf 100644
--- a/app/_locales/ja/messages.json
+++ b/app/_locales/ja/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "送金"
   },
+  "sendAToken": {
+    "message": "トークンを送信"
+  },
   "sendBugReport": {
     "message": "バグの報告をお送りください。"
   },
diff --git a/app/_locales/ko/messages.json b/app/_locales/ko/messages.json
index 7c6845b639d5..4c94e71f3758 100644
--- a/app/_locales/ko/messages.json
+++ b/app/_locales/ko/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "보내기"
   },
+  "sendAToken": {
+    "message": "토큰 보내기"
+  },
   "sendBugReport": {
     "message": "버그 리포트 전송"
   },
diff --git a/app/_locales/pt/messages.json b/app/_locales/pt/messages.json
index 246c8bf8f9e2..e2096428b1ff 100644
--- a/app/_locales/pt/messages.json
+++ b/app/_locales/pt/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Enviar"
   },
+  "sendAToken": {
+    "message": "Enviar um token"
+  },
   "sendBugReport": {
     "message": "Envie-nos um relatório de bugs."
   },
diff --git a/app/_locales/ru/messages.json b/app/_locales/ru/messages.json
index fcff79b945db..a2c78a570554 100644
--- a/app/_locales/ru/messages.json
+++ b/app/_locales/ru/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Отправить"
   },
+  "sendAToken": {
+    "message": "Отправить токен"
+  },
   "sendBugReport": {
     "message": "Отправьте нам отчет об ошибке."
   },
diff --git a/app/_locales/tl/messages.json b/app/_locales/tl/messages.json
index 5cce80dd34e6..60ab484989c3 100644
--- a/app/_locales/tl/messages.json
+++ b/app/_locales/tl/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Magpadala"
   },
+  "sendAToken": {
+    "message": "Magpadala ng token"
+  },
   "sendBugReport": {
     "message": "Padalhan kami ng ulat ng bug."
   },
diff --git a/app/_locales/tr/messages.json b/app/_locales/tr/messages.json
index 5aa540dec442..57cc95ca98c5 100644
--- a/app/_locales/tr/messages.json
+++ b/app/_locales/tr/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Gönder"
   },
+  "sendAToken": {
+    "message": "Bir token gönder"
+  },
   "sendBugReport": {
     "message": "Bize bir hata raporu gönder."
   },
diff --git a/app/_locales/vi/messages.json b/app/_locales/vi/messages.json
index a443e3f364a5..dae1661327bc 100644
--- a/app/_locales/vi/messages.json
+++ b/app/_locales/vi/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "Gửi"
   },
+  "sendAToken": {
+    "message": "Gửi token"
+  },
   "sendBugReport": {
     "message": "Gửi báo cáo lỗi."
   },
diff --git a/app/_locales/zh_CN/messages.json b/app/_locales/zh_CN/messages.json
index 77d3699edd68..d35e7ee4829a 100644
--- a/app/_locales/zh_CN/messages.json
+++ b/app/_locales/zh_CN/messages.json
@@ -4584,6 +4584,9 @@
   "send": {
     "message": "发送"
   },
+  "sendAToken": {
+    "message": "发送代币"
+  },
   "sendBugReport": {
     "message": "向我们发送错误报告。"
   },
diff --git a/ui/components/multichain/asset-picker-amount/asset-picker-modal/asset-picker-modal.tsx b/ui/components/multichain/asset-picker-amount/asset-picker-modal/asset-picker-modal.tsx
index e51dd976fddc..0700f62a4cec 100644
--- a/ui/components/multichain/asset-picker-amount/asset-picker-modal/asset-picker-modal.tsx
+++ b/ui/components/multichain/asset-picker-amount/asset-picker-modal/asset-picker-modal.tsx
@@ -273,14 +273,8 @@ export function AssetPickerModal({
   ]);
 
   const Search = useCallback(
-    ({
-      isNFTSearch = false,
-      props,
-    }: {
-      isNFTSearch?: boolean;
-      props?: React.ComponentProps<typeof Box>;
-    }) => (
-      <Box padding={4} {...props}>
+    ({ isNFTSearch = false }: { isNFTSearch?: boolean }) => (
+      <Box padding={1} paddingLeft={4} paddingRight={4}>
         <TextFieldSearch
           borderRadius={BorderRadius.LG}
           placeholder={t(isNFTSearch ? 'searchNfts' : 'searchTokens')}
@@ -301,6 +295,7 @@ export function AssetPickerModal({
           }}
           endAccessory={null}
           size={TextFieldSearchSize.Lg}
+          marginBottom={1}
         />
       </Box>
     ),
@@ -316,7 +311,7 @@ export function AssetPickerModal({
     >
       <ModalOverlay />
       <ModalContent modalDialogProps={{ padding: 0 }}>
-        <ModalHeader paddingBottom={2} onClose={onClose}>
+        <ModalHeader onClose={onClose}>
           <Text variant={TextVariant.headingSm} textAlign={TextAlign.Center}>
             {t(isDest ? 'sendSelectReceiveAsset' : 'sendSelectSendAsset')}
           </Text>
@@ -327,7 +322,7 @@ export function AssetPickerModal({
             gap={1}
             alignItems={AlignItems.center}
             marginInline="auto"
-            marginBottom={3}
+            marginBottom={4}
           >
             <AvatarToken
               borderRadius={BorderRadius.full}
@@ -342,7 +337,7 @@ export function AssetPickerModal({
         <Box className="modal-tab__wrapper">
           {isDest ? (
             <>
-              <Search props={{ paddingTop: 1 }} />
+              <Search />
               <AssetList
                 handleAssetChange={handleAssetChange}
                 asset={asset}
@@ -357,6 +352,8 @@ export function AssetPickerModal({
               tabsClassName="modal-tab__tabs"
             >
               {
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-ignore
                 <Tab
                   activeClassName="modal-tab__tab--active"
                   className="modal-tab__tab"
@@ -374,6 +371,8 @@ export function AssetPickerModal({
               }
 
               {
+                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                // @ts-ignore
                 <Tab
                   activeClassName="modal-tab__tab--active"
                   className="modal-tab__tab"
diff --git a/ui/components/multichain/pages/page/components/header/header.tsx b/ui/components/multichain/pages/page/components/header/header.tsx
index fc29b3310b2a..b97fab3016c9 100644
--- a/ui/components/multichain/pages/page/components/header/header.tsx
+++ b/ui/components/multichain/pages/page/components/header/header.tsx
@@ -30,10 +30,6 @@ interface HeaderProps extends StyleUtilityProps {
    * Additional CSS class provided to the footer
    */
   className?: string;
-  /**
-   * Additional props to pass to the text
-   */
-  textProps?: React.ComponentProps<typeof Text>;
 }
 
 export const Header = ({
@@ -41,7 +37,6 @@ export const Header = ({
   endAccessory = null,
   startAccessory = null,
   className = '',
-  textProps,
   ...props
 }: HeaderProps) => {
   return (
@@ -61,7 +56,6 @@ export const Header = ({
         paddingInlineStart={8}
         paddingInlineEnd={8}
         ellipsis
-        {...textProps}
       >
         {children}
       </Text>
diff --git a/ui/components/multichain/pages/send/__snapshots__/send.test.js.snap b/ui/components/multichain/pages/send/__snapshots__/send.test.js.snap
index 4db086cabbe7..a3ee231d6ae2 100644
--- a/ui/components/multichain/pages/send/__snapshots__/send.test.js.snap
+++ b/ui/components/multichain/pages/send/__snapshots__/send.test.js.snap
@@ -28,11 +28,11 @@ exports[`SendPage render and initialization should render correctly even when a
         <div
           class="mm-box"
         >
-          <h4
-            class="mm-box mm-text mm-text--heading-sm mm-text--ellipsis mm-text--text-align-center mm-box--padding-inline-start-8 mm-box--padding-inline-end-8 mm-box--display-block mm-box--color-text-default"
+          <p
+            class="mm-box mm-text mm-text--body-md-bold mm-text--ellipsis mm-text--text-align-center mm-box--padding-inline-start-8 mm-box--padding-inline-end-8 mm-box--display-block mm-box--color-text-default"
           >
-            Send
-          </h4>
+            Send a token
+          </p>
         </div>
       </div>
       <div
diff --git a/ui/components/multichain/pages/send/send.js b/ui/components/multichain/pages/send/send.js
index 4c0421e50338..2e5cad178d0a 100644
--- a/ui/components/multichain/pages/send/send.js
+++ b/ui/components/multichain/pages/send/send.js
@@ -58,7 +58,6 @@ import { AssetPickerAmount } from '../..';
 import useUpdateSwapsState from '../../../../pages/swaps/hooks/useUpdateSwapsState';
 import { getIsDraftSwapAndSend } from '../../../../ducks/send/helpers';
 import { smartTransactionsListSelector } from '../../../../selectors';
-import { TextVariant } from '../../../../helpers/constants/design-system';
 import {
   SendPageAccountPicker,
   SendPageRecipientContent,
@@ -302,9 +301,6 @@ export const SendPage = () => {
   return (
     <Page className="multichain-send-page">
       <Header
-        textProps={{
-          variant: TextVariant.headingSm,
-        }}
         startAccessory={
           <ButtonIcon
             size={ButtonIconSize.Sm}
@@ -314,7 +310,7 @@ export const SendPage = () => {
           />
         }
       >
-        {t('send')}
+        {t('sendAToken')}
       </Header>
       <Content>
         <SendPageAccountPicker />