Clarify WalletConnect connection and request risks

CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased (develop)
 
+- changed: Distinguish the WalletConnect connection and request risks in the Confirm Connection and Smart Contract Call copy, and show the request warning in the solid UI4 warning card.
+
 ## 4.51.0 (staging)
 
 - added: Push info-server attestation tokens into edge-core-js via `setAttestationToken` so the login server can skip CAPTCHA for attested devices, and allow `LOGIN_SERVER` / `INFO_SERVER` env overrides for local E2E stacks.

eslint.config.mjs

@@ -225,7 +225,6 @@ export default [
       'src/components/modals/TransferModal.tsx',
 
       'src/components/modals/WalletListSortModal.tsx',
-      'src/components/modals/WcSmartContractModal.tsx',
 
       'src/components/navigation/BackButton.tsx',
       'src/components/navigation/CurrencySettingsTitle.tsx',

src/components/modals/WcSmartContractModal.tsx

@@ -30,11 +30,11 @@ import { asEdgeTokenId } from '../../types/types'
 import { getCurrencyIconUris } from '../../util/CdnUris'
 import { getWalletName } from '../../util/CurrencyWalletHelpers'
 import { zeroString } from '../../util/utils'
+import { AlertCardUi4 } from '../cards/AlertCard'
 import { EdgeCard } from '../cards/EdgeCard'
 import { EdgeRow } from '../rows/EdgeRow'
 import { Airship, showError } from '../services/AirshipInstance'
 import { cacheStyles, type Theme, useTheme } from '../services/ThemeContext'
-import { Alert } from '../themed/Alert'
 import { ModalFooter, ModalTitle } from '../themed/ModalParts'
 import { SafeSlider } from '../themed/SafeSlider'
 import { CryptoFiatAmountTile } from '../tiles/CryptoFiatAmountTile'
@@ -46,7 +46,7 @@ interface Props extends WcSmartContractModalProps {
   wallet: EdgeCurrencyWallet
 }
 
-export const WcSmartContractModal = (props: Props) => {
+export const WcSmartContractModal: React.FC<Props> = (props: Props) => {
   const {
     bridge,
     dApp,
@@ -97,7 +97,7 @@ export const WcSmartContractModal = (props: Props) => {
       ? gt(abs(totalNativeCrypto), feeCurrencyBalance)
       : gt(networkFee, feeCurrencyBalance)
 
-  const handleSubmit = () => {
+  const handleSubmit = (): void => {
     wcRequestResponse(true)
       .then(() => {
         Airship.show(bridge => (
@@ -107,36 +107,40 @@ export const WcSmartContractModal = (props: Props) => {
           />
         )).catch(() => {})
       })
-      .catch(error => {
+      .catch((error: unknown) => {
         showError(error)
       })
       .finally(props.bridge.resolve)
   }
 
-  const handleClose = () => {
+  const handleClose = (): void => {
     wcRequestResponse(false)
-      .catch(error => {
+      .catch((error: unknown) => {
         showError(error)
       })
       .finally(props.bridge.resolve)
   }
 
-  const renderWarning = () => {
+  const renderWarning = (): React.ReactElement => {
     return isInsufficientBal ? (
-      <Alert
+      <AlertCardUi4
         title={lstrings.wc_smartcontract_warning_title}
-        message={sprintf(
+        body={sprintf(
           lstrings.wc_smartcontract_insufficient_text,
           feeCurrencyStr
         )}
         type="warning"
+        marginRem={0.5}
       />
     ) : (
-      <Alert
-        numberOfLines={0}
+      <AlertCardUi4
         title={lstrings.wc_smartcontract_warning_title}
-        message={lstrings.wc_smartcontract_warning_text}
+        body={[
+          lstrings.wc_smartcontract_warning_point_funds,
+          lstrings.wc_smartcontract_warning_point_trust
+        ]}
         type="warning"
+        marginRem={0.5}
       />
     )
   }

src/locales/en_US.ts

@@ -1700,13 +1700,15 @@ const strings = {
   wc_confirm_subtitle: '%s wants to connect your wallet.',
   wc_confirm_body_title: 'Allow %s to:',
   wc_confirm_body:
-    'Request approval for transactions\nView your wallet and balance activity',
+    'View your wallet address\nRequest approval for transactions',
   wc_confirm_select_wallet: 'Select wallet to connect with',
   wc_confirm_return_to_browser: 'You may now return to browser',
   wc_smartcontract_title: 'Smart Contract Call',
   wc_smartcontract_warning_title: 'Warning',
-  wc_smartcontract_warning_text:
-    'Make sure this is an application you can trust. Executing this transaction gives the application access to your funds.',
+  wc_smartcontract_warning_point_funds:
+    'Approving this request may move funds or grant permissions',
+  wc_smartcontract_warning_point_trust:
+    'Only continue if you trust this application and expected this request',
   wc_smartcontract_insufficient_text:
     "You don't have enough %s to cover network fees.",
   wc_smartcontract_wallet: 'Wallet',

src/locales/strings/enUS.json

@@ -1331,12 +1331,13 @@
   "wc_confirm_title": "Confirm Connection",
   "wc_confirm_subtitle": "%s wants to connect your wallet.",
   "wc_confirm_body_title": "Allow %s to:",
-  "wc_confirm_body": "Request approval for transactions\nView your wallet and balance activity",
+  "wc_confirm_body": "View your wallet address\nRequest approval for transactions",
   "wc_confirm_select_wallet": "Select wallet to connect with",
   "wc_confirm_return_to_browser": "You may now return to browser",
   "wc_smartcontract_title": "Smart Contract Call",
   "wc_smartcontract_warning_title": "Warning",
-  "wc_smartcontract_warning_text": "Make sure this is an application you can trust. Executing this transaction gives the application access to your funds.",
+  "wc_smartcontract_warning_point_funds": "Approving this request may move funds or grant permissions",
+  "wc_smartcontract_warning_point_trust": "Only continue if you trust this application and expected this request",
   "wc_smartcontract_insufficient_text": "You don't have enough %s to cover network fees.",
   "wc_smartcontract_wallet": "Wallet",
   "wc_smartcontract_dapp": "DApp",