fixup! feat(coinmarket): possibility to proceed with unverified address

packages/suite/src/components/suite/modals/ReduxModal/UserContextModal/ConfirmUnverifiedAddressModal.tsx

@@ -0,0 +1,28 @@
+import { useCallback } from 'react';
+
+import { openAddressModal, showAddress } from 'src/actions/wallet/receiveActions';
+import { ConfirmUnverifiedModal } from './ConfirmUnverifiedModal';
+
+interface ConfirmUnverifiedAddressModalProps {
+    addressPath: string;
+    value: string;
+}
+
+export const ConfirmUnverifiedAddressModal = ({
+    addressPath,
+    value,
+}: ConfirmUnverifiedAddressModalProps) => {
+    const verifyProcess = useCallback(() => showAddress(addressPath, value), [addressPath, value]);
+    const showUnverifiedAddress = () => openAddressModal({ addressPath, value });
+
+    return (
+        <ConfirmUnverifiedModal
+            action={{
+                event: showUnverifiedAddress,
+                title: 'TR_SHOW_UNVERIFIED_ADDRESS',
+            }}
+            verifyProcess={verifyProcess}
+            warningText="TR_ADDRESS_PHISHING_WARNING"
+        />
+    );
+};

packages/suite/src/components/suite/modals/ReduxModal/UserContextModal/ConfirmUnverifiedModal.tsx

@@ -1,34 +1,35 @@
 import { Translation } from 'src/components/suite';
 import { TranslationKey } from 'src/components/suite/Translation';
-import { useDevice, useDispatch } from 'src/hooks/suite';
-import { TrezorDevice } from 'src/types/suite';
+import { useDevice, useDispatch, useSelector } from 'src/hooks/suite';
+import { Dispatch, GetState } from 'src/types/suite';
 import { Button, H3, NewModal, Paragraph } from '@trezor/components';
 import { onCancel } from 'src/actions/suite/modalActions';
 import { selectDeviceLabelOrName } from '@suite-common/wallet-core';
+import { applySettings } from 'src/actions/settings/deviceSettingsActions';
+import { useEffect } from 'react';
 
 interface ConfirmUnverifiedModalProps {
     action: {
-        event: () => void;
+        event: () => (dispatch: Dispatch) => void;
         title: TranslationKey;
         closeAfterEventTriggered?: boolean;
     };
+    verifyProcess?: () => (dispatch: Dispatch, getState: GetState) => Promise<void>;
     warningText: TranslationKey;
-    device: TrezorDevice;
-    enablePassphraseAndContinue: () => Promise<void>;
 }
 
 export const ConfirmUnverifiedModal = ({
     action,
     warningText,
-    device,
-    enablePassphraseAndContinue,
+    verifyProcess,
 }: ConfirmUnverifiedModalProps) => {
     const deviceLabel = useSelector(selectDeviceLabelOrName);
+    const { device } = useDevice();
     const dispatch = useDispatch();
     const { isLocked } = useDevice();
 
     const isDeviceLocked = isLocked();
-    const isPassphraseRequired = device.connected && !device.available;
+    const isPassphraseRequired = device?.connected && !device.available;
     const deviceStatus = isPassphraseRequired
         ? 'TR_DEVICE_LABEL_IS_UNAVAILABLE'
         : 'TR_DEVICE_LABEL_IS_NOT_CONNECTED';
@@ -38,13 +39,27 @@ export const ConfirmUnverifiedModal = ({
 
     const handleClose = () => dispatch(onCancel());
     const handleEvent = () => {
-        action.event();
+        dispatch(action.event());
 
         if (action.closeAfterEventTriggered) {
             handleClose();
         }
     };
 
+    const enablePassphraseAndContinue = async () => {
+        if (!device?.available) {
+            const result = await dispatch(applySettings({ use_passphrase: true }));
+            if (!result || !result.success) return;
+        }
+    };
+
+    // Device connected while the modal is open -> switch to verification modal.
+    useEffect(() => {
+        if (device?.connected && verifyProcess) {
+            dispatch(verifyProcess());
+        }
+    }, [device?.connected, dispatch, verifyProcess]);
+
     return (
         <NewModal
             variant="warning"
@@ -72,7 +87,7 @@ export const ConfirmUnverifiedModal = ({
             }
         >
             <H3>
-                <Translation id={deviceStatus} values={{ deviceLabel: device.label }} />
+                <Translation id={deviceStatus} values={{ deviceLabel }} />
             </H3>
             <Paragraph>
                 <Translation

packages/suite/src/components/suite/modals/ReduxModal/UserContextModal/ConfirmUnverifiedProceedModal.tsx

@@ -0,0 +1,27 @@
+import { ConfirmUnverifiedModal } from './ConfirmUnverifiedModal';
+import { COINMARKET_BUY } from 'src/actions/wallet/constants';
+import { Dispatch } from 'src/types/suite';
+
+interface ConfirmUnverifiedProceedModalProps {
+    value: string;
+}
+
+export const ConfirmUnverifiedProceedModal = ({ value }: ConfirmUnverifiedProceedModalProps) => {
+    const proceedWithUnverifiedAddress = () => (dispatch: Dispatch) => {
+        dispatch({
+            type: COINMARKET_BUY.VERIFY_ADDRESS,
+            addressVerified: value,
+        });
+    };
+
+    return (
+        <ConfirmUnverifiedModal
+            action={{
+                event: proceedWithUnverifiedAddress,
+                title: 'TR_PROCEED_UNVERIFIED_ADDRESS',
+                closeAfterEventTriggered: true,
+            }}
+            warningText="TR_ADDRESS_PHISHING_WARNING"
+        />
+    );
+};

packages/suite/src/components/suite/modals/ReduxModal/UserContextModal/ConfirmUnverifiedXpubModal.tsx

@@ -0,0 +1,20 @@
+import { useCallback } from 'react';
+
+import { ConfirmUnverifiedModal } from './ConfirmUnverifiedModal';
+import { openXpubModal, showXpub } from 'src/actions/wallet/publicKeyActions';
+
+export const ConfirmUnverifiedXpubModal = () => {
+    const event = useCallback(() => openXpubModal(), []);
+    const verifyProcess = useCallback(() => showXpub(), []);
+
+    return (
+        <ConfirmUnverifiedModal
+            action={{
+                event,
+                title: 'TR_SHOW_UNVERIFIED_XPUB',
+            }}
+            verifyProcess={verifyProcess}
+            warningText="TR_XPUB_PHISHING_WARNING"
+        />
+    );
+};

packages/suite/src/components/suite/modals/ReduxModal/UserContextModal/UserContextModal.tsx

@@ -37,7 +37,9 @@ import {
     ClaimModal,
     CopyAddressModal,
     UnhideTokenModal,
-    ConfirmUnverifiedModalContainer,
+    ConfirmUnverifiedAddressModal,
+    ConfirmUnverifiedXpubModal,
+    ConfirmUnverifiedProceedModal,
 } from 'src/components/suite/modals';
 import type { AcquiredDevice } from 'src/types/suite';
 import type { ReduxModalProps } from '../ReduxModal';
@@ -69,23 +71,15 @@ export const UserContextModal = ({
             );
         case 'unverified-address':
             return (
-                <ConfirmUnverifiedModalContainer
-                    type={payload.type}
+                <ConfirmUnverifiedAddressModal
                     addressPath={payload.addressPath}
                     value={payload.value}
-                    onCancel={onCancel}
                 />
             );
         case 'unverified-xpub':
-            return <ConfirmUnverifiedModalContainer type={payload.type} onCancel={onCancel} />;
+            return <ConfirmUnverifiedXpubModal />;
         case 'unverified-address-proceed':
-            return (
-                <ConfirmUnverifiedModalContainer
-                    type={payload.type}
-                    value={payload.value}
-                    onCancel={onCancel}
-                />
-            );
+            return <ConfirmUnverifiedProceedModal value={payload.value} />;
         case 'address':
             return <ConfirmAddressModal {...payload} onCancel={onCancel} />;
         case 'xpub':

packages/suite/src/components/suite/modals/index.tsx

@@ -17,7 +17,9 @@ export { TransactionReviewModal } from './ReduxModal/TransactionReviewModal/Tran
 export { ImportTransactionModal } from './ReduxModal/UserContextModal/ImportTransactionModal/ImportTransactionModal';
 export { ConfirmEvmExplanationModal } from './ConfirmEvmExplanationModal';
 export { ConfirmUnverifiedModal } from './ReduxModal/UserContextModal/ConfirmUnverifiedModal';
-export { ConfirmUnverifiedModalContainer } from './ReduxModal/UserContextModal/ConfirmUnverifiedModalContainer';
+export { ConfirmUnverifiedAddressModal } from './ReduxModal/UserContextModal/ConfirmUnverifiedAddressModal';
+export { ConfirmUnverifiedXpubModal } from './ReduxModal/UserContextModal/ConfirmUnverifiedXpubModal';
+export { ConfirmUnverifiedProceedModal } from './ReduxModal/UserContextModal/ConfirmUnverifiedProceedModal';
 export { AddAccountModal } from './ReduxModal/UserContextModal/AddAccountModal/AddAccountModal';
 export { QrScannerModal } from './ReduxModal/UserContextModal/QrScannerModal';
 export { BackgroundGalleryModal } from './ReduxModal/UserContextModal/BackgroundGalleryModal';