[pull] main from MetaMask:main

app/components/UI/Bridge/Views/BridgeView/index.tsx

@@ -228,7 +228,7 @@ const BridgeView = () => {
   ]);
 
   const isSubmitDisabled =
-    isLoading ||
+    (isLoading && !activeQuote) ||
     hasInsufficientBalance ||
     isSubmittingTx ||
     (isHardwareAddress && isSolanaSourced) ||

app/components/UI/Card/components/CardButton/CardButton.test.tsx

@@ -4,6 +4,7 @@ import CardButton from './CardButton';
 import { renderScreen } from '../../../../../util/test/renderWithProvider';
 import { backgroundState } from '../../../../../util/test/initial-root-state';
 import { WalletViewSelectorsIDs } from '../../../../../../e2e/selectors/wallet/WalletView.selectors';
+
 jest.mock('../../../../hooks/useMetrics', () => {
   const actual = jest.requireActual('../../../../hooks/useMetrics');
   return {
@@ -19,14 +20,7 @@ jest.mock('../../../../hooks/useMetrics', () => {
   };
 });
 
-interface PartialCardState {
-  hasViewedCardButton?: boolean;
-}
-
-function renderWithProvider(
-  component: React.ComponentType,
-  stateOverride: PartialCardState = {},
-) {
+function renderWithProvider(component: React.ComponentType) {
   return renderScreen(
     component,
     { name: 'CardButton' },
@@ -39,7 +33,6 @@ function renderWithProvider(
           lastFetchedByAddress: {},
           hasViewedCardButton: false,
           isLoaded: false,
-          ...stateOverride,
         },
       },
     },
@@ -53,20 +46,20 @@ describe('CardButton Component', () => {
     jest.clearAllMocks();
   });
 
-  it('renders with badge (not yet viewed) and matches snapshot', () => {
+  it('renders and matches snapshot', () => {
     const { toJSON, getByTestId } = renderWithProvider(() => (
       <CardButton
         onPress={mockOnPress}
         touchAreaSlop={{ top: 0, bottom: 0, left: 0, right: 0 }}
       />
     ));
 
-    expect(getByTestId(WalletViewSelectorsIDs.CARD_BUTTON_BADGE)).toBeTruthy();
+    expect(getByTestId(WalletViewSelectorsIDs.CARD_BUTTON)).toBeTruthy();
     expect(toJSON()).toMatchSnapshot();
   });
 
-  it('dispatches setHasViewedCardButton(true) and hides badge on first press', () => {
-    const { getByTestId, store, queryByTestId } = renderWithProvider(() => (
+  it('calls onPress when button is pressed', () => {
+    const { getByTestId } = renderWithProvider(() => (
       <CardButton
         onPress={mockOnPress}
         touchAreaSlop={{ top: 0, bottom: 0, left: 0, right: 0 }}
@@ -77,40 +70,5 @@ describe('CardButton Component', () => {
     fireEvent.press(button);
 
     expect(mockOnPress).toHaveBeenCalledTimes(1);
-    expect(store.getState().card.hasViewedCardButton).toBe(true);
-    expect(queryByTestId(WalletViewSelectorsIDs.CARD_BUTTON_BADGE)).toBeNull();
-  });
-
-  it('does not dispatch setHasViewedCardButton again if already viewed', () => {
-    const { getByTestId, store } = renderWithProvider(
-      () => (
-        <CardButton
-          onPress={mockOnPress}
-          touchAreaSlop={{ top: 0, bottom: 0, left: 0, right: 0 }}
-        />
-      ),
-      { hasViewedCardButton: true },
-    );
-
-    const button = getByTestId(WalletViewSelectorsIDs.CARD_BUTTON);
-    fireEvent.press(button);
-
-    expect(mockOnPress).toHaveBeenCalledTimes(1);
-    expect(store.getState().card.hasViewedCardButton).toBe(true);
-  });
-
-  it('renders without badge when already viewed', () => {
-    const { toJSON, queryByTestId } = renderWithProvider(
-      () => (
-        <CardButton
-          onPress={mockOnPress}
-          touchAreaSlop={{ top: 0, bottom: 0, left: 0, right: 0 }}
-        />
-      ),
-      { hasViewedCardButton: true },
-    );
-
-    expect(queryByTestId(WalletViewSelectorsIDs.CARD_BUTTON_BADGE)).toBeNull();
-    expect(toJSON()).toMatchSnapshot();
   });
 });

app/components/UI/Card/components/CardButton/CardButton.tsx

@@ -1,9 +1,4 @@
 import {
-  BadgeStatus,
-  BadgeStatusStatus,
-  BadgeWrapper,
-  BadgeWrapperPosition,
-  BadgeWrapperPositionAnchorShape,
   ButtonIcon,
   ButtonIconSize,
   IconName,
@@ -13,11 +8,6 @@ import {
 import React, { useEffect } from 'react';
 import { WalletViewSelectorsIDs } from '../../../../../../e2e/selectors/wallet/WalletView.selectors';
 import { MetaMetricsEvents, useMetrics } from '../../../../hooks/useMetrics';
-import { useDispatch, useSelector } from 'react-redux';
-import {
-  selectHasViewedCardButton,
-  setHasViewedCardButton,
-} from '../../../../../core/redux/slices/card';
 
 interface CardButtonProps {
   onPress: () => void;
@@ -30,8 +20,6 @@ interface CardButtonProps {
 }
 
 const CardButton: React.FC<CardButtonProps> = ({ onPress, touchAreaSlop }) => {
-  const dispatch = useDispatch();
-  const hasViewedCardButton = useSelector(selectHasViewedCardButton);
   const { trackEvent, createEventBuilder } = useMetrics();
 
   useEffect(() => {
@@ -40,35 +28,15 @@ const CardButton: React.FC<CardButtonProps> = ({ onPress, touchAreaSlop }) => {
     );
   }, [trackEvent, createEventBuilder]);
 
-  const onPressHandler = () => {
-    if (!hasViewedCardButton) {
-      dispatch(setHasViewedCardButton(true));
-    }
-    onPress();
-  };
-
   return (
-    <BadgeWrapper
-      position={BadgeWrapperPosition.TopRight}
-      positionAnchorShape={BadgeWrapperPositionAnchorShape.Circular}
-      badge={
-        !hasViewedCardButton ? (
-          <BadgeStatus
-            testID={WalletViewSelectorsIDs.CARD_BUTTON_BADGE}
-            status={BadgeStatusStatus.New}
-          />
-        ) : null
-      }
-    >
-      <ButtonIcon
-        iconProps={{ color: MMDSIconColor.IconDefault }}
-        onPress={onPressHandler}
-        iconName={IconName.Card}
-        size={ButtonIconSize.Lg}
-        testID={WalletViewSelectorsIDs.CARD_BUTTON}
-        hitSlop={touchAreaSlop}
-      />
-    </BadgeWrapper>
+    <ButtonIcon
+      iconProps={{ color: MMDSIconColor.IconDefault }}
+      onPress={onPress}
+      iconName={IconName.Card}
+      size={ButtonIconSize.Lg}
+      testID={WalletViewSelectorsIDs.CARD_BUTTON}
+      hitSlop={touchAreaSlop}
+    />
   );
 };