MetaMask
diff --git a/‎app/components/UI/Predict/components/PredictActivity/PredictActivity.test.tsx‎
Lines changed: 84 additions & 108 deletions b/‎app/components/UI/Predict/components/PredictActivity/PredictActivity.test.tsx‎
Lines changed: 84 additions & 108 deletions
@@ -15,144 +15,120 @@ jest.mock('../../../../../../locales/i18n', () => ({
   }),
 }));
 
-jest.mock('@metamask/design-system-twrnc-preset', () => ({
-  useTailwind: () => ({
-    style: (className: string) => ({ className }),
-  }),
-}));
-
-jest.mock('@metamask/design-system-react-native', () => {
-  const ReactActual = jest.requireActual('react');
-  const { Text: RNText } = jest.requireActual('react-native');
-  return {
-    Box: 'Box',
-    Text: 'Text',
-    TextVariant: {
-      BodyMd: 'BodyMd',
-      BodySm: 'BodySm',
-    },
-    BoxAlignItems: { Start: 'start' },
-    BoxJustifyContent: { Between: 'between' },
-    BoxFlexDirection: { Row: 'row' },
-    IconName: { Activity: 'Activity' },
-    Icon: ({ name }: { name: string }) =>
-      ReactActual.createElement(RNText, null, `Icon:${name}`),
-  };
-});
-
-jest.mock('expo-image', () => ({
-  Image: ({ accessibilityLabel }: { accessibilityLabel?: string }) => {
-    const ReactActual = jest.requireActual('react');
-    const { Text: RNText } = jest.requireActual('react-native');
-    return ReactActual.createElement(RNText, { accessibilityLabel }, 'image');
-  },
-}));
-
-// Mock navigation
 const mockNavigate = jest.fn();
 jest.mock('@react-navigation/native', () => ({
   useNavigation: () => ({ navigate: mockNavigate }),
 }));
 
-const baseItem: PredictActivityItem = {
-  id: '1',
-  type: PredictActivityType.BUY,
-  marketTitle: 'Will ETF be approved?',
-  detail: '$123.45 on Yes • 34¢',
-  amountUsd: 1234.5,
-  percentChange: 1.5,
-  icon: undefined,
-  outcome: 'Yes',
-  entry: {
-    type: 'buy',
+const createActivityItem = (
+  overrides?: Partial<PredictActivityItem>,
+): PredictActivityItem => {
+  const baseEntry = {
+    type: 'buy' as const,
     timestamp: 0,
     marketId: 'market-1',
     outcomeId: 'outcome-1',
     outcomeTokenId: 0,
     amount: 1234.5,
     price: 0.34,
-  },
-};
+  };
 
-const renderComponent = (overrides?: Partial<PredictActivityItem>) => {
-  const item: PredictActivityItem = {
-    ...baseItem,
+  return {
+    id: '1',
+    type: PredictActivityType.BUY,
+    marketTitle: 'Will ETF be approved?',
+    detail: '$123.45 on Yes • 34¢',
+    amountUsd: 1234.5,
+    percentChange: 1.5,
+    icon: undefined,
+    outcome: 'Yes',
+    entry: baseEntry,
     ...overrides,
-    entry: {
-      ...baseItem.entry,
-      ...(overrides?.entry ?? {}),
-    },
   };
-  render(<PredictActivity item={item} />);
-  return { item };
 };
 
 describe('PredictActivity', () => {
-  it('renders BUY activity with title, market, amount and percent', () => {
-    renderComponent();
-
-    expect(screen.getByText('Buy')).toBeOnTheScreen();
-    expect(screen.getByText(baseItem.marketTitle)).toBeOnTheScreen();
-    expect(screen.getByText('-$1,234.50')).toBeOnTheScreen();
-    expect(screen.getByText('1.5%')).toBeOnTheScreen();
+  beforeEach(() => {
+    jest.clearAllMocks();
   });
 
-  it('renders SELL activity with plus-signed amount and negative percent', () => {
-    renderComponent({
-      type: PredictActivityType.SELL,
-      percentChange: -3,
-      entry: {
-        type: 'sell',
-        timestamp: 0,
-        marketId: 'market-1',
-        outcomeId: 'outcome-1',
-        outcomeTokenId: 0,
-        amount: 1234.5,
-        price: 0.34,
-      },
-    });
+  describe('BUY activity', () => {
+    it('displays buy title with market information and detail', () => {
+      const item = createActivityItem();
 
-    expect(screen.getByText('Sell')).toBeOnTheScreen();
-    expect(screen.getByText('+$1,234.50')).toBeOnTheScreen();
-    expect(screen.getByText('-3%')).toBeOnTheScreen();
-  });
+      render(<PredictActivity item={item} />);
 
-  it('renders CLAIM activity without detail', () => {
-    renderComponent({
-      type: PredictActivityType.CLAIM,
-      entry: {
-        type: 'claimWinnings',
-        timestamp: 0,
-        amount: 1234.5,
-      },
+      expect(screen.getByText('Buy')).toBeOnTheScreen();
+      expect(screen.getByText('Will ETF be approved?')).toBeOnTheScreen();
+      expect(screen.getByText('-$1,234.50')).toBeOnTheScreen();
+      expect(screen.getByText('1.5%')).toBeOnTheScreen();
     });
 
-    expect(screen.getByText('Claim')).toBeOnTheScreen();
-    expect(screen.queryByText(baseItem.detail)).toBeNull();
-  });
+    it('displays custom icon when icon URL is provided', () => {
+      const item = createActivityItem({
+        icon: 'https://example.com/icon.png',
+      });
 
-  it('shows provided icon image when item.icon exists', () => {
-    renderComponent({ icon: 'https://example.com/icon.png' });
+      render(<PredictActivity item={item} />);
 
-    expect(screen.getByLabelText('activity icon')).toBeOnTheScreen();
-  });
+      expect(screen.getByLabelText('activity icon')).toBeOnTheScreen();
+    });
 
-  it('falls back to Activity icon when no item.icon provided', () => {
-    renderComponent({ icon: undefined });
+    it('navigates to activity detail when pressed', () => {
+      const item = createActivityItem();
 
-    expect(screen.getByText('Icon:Activity')).toBeOnTheScreen();
-  });
+      render(<PredictActivity item={item} />);
+      const activityRow = screen.getByText('Buy');
+
+      fireEvent.press(activityRow);
 
-  it('calls onPress with item when pressed', () => {
-    const { item } = renderComponent({ icon: undefined });
+      expect(mockNavigate).toHaveBeenCalledWith(Routes.PREDICT.MODALS.ROOT, {
+        screen: Routes.PREDICT.ACTIVITY_DETAIL,
+        params: { activity: item },
+      });
+    });
+  });
 
-    // Press a child inside the touchable to trigger parent onPress
-    const pressTarget = screen.getByText('Icon:Activity');
-    fireEvent.press(pressTarget);
+  describe('SELL activity', () => {
+    it('displays sell title with positive amount and negative percent', () => {
+      const item = createActivityItem({
+        type: PredictActivityType.SELL,
+        percentChange: -3,
+        entry: {
+          type: 'sell',
+          timestamp: 0,
+          marketId: 'market-1',
+          outcomeId: 'outcome-1',
+          outcomeTokenId: 0,
+          amount: 1234.5,
+          price: 0.34,
+        },
+      });
+
+      render(<PredictActivity item={item} />);
+
+      expect(screen.getByText('Sell')).toBeOnTheScreen();
+      expect(screen.getByText('+$1,234.50')).toBeOnTheScreen();
+      expect(screen.getByText('-3%')).toBeOnTheScreen();
+    });
+  });
 
-    expect(mockNavigate).toHaveBeenCalledWith(Routes.PREDICT.MODALS.ROOT, {
-      screen: Routes.PREDICT.ACTIVITY_DETAIL,
-      params: { activity: item },
+  describe('CLAIM activity', () => {
+    it('displays claim title without detail text', () => {
+      const item = createActivityItem({
+        type: PredictActivityType.CLAIM,
+        detail: '$123.45 on Yes • 34¢',
+        entry: {
+          type: 'claimWinnings',
+          timestamp: 0,
+          amount: 1234.5,
+        },
+      });
+
+      render(<PredictActivity item={item} />);
+
+      expect(screen.getByText('Claim')).toBeOnTheScreen();
+      expect(screen.queryByText('$123.45 on Yes • 34¢')).toBeNull();
     });
   });
 });