Merge branch 'main' into fix/backup-vault-try-catch

Author: tommasini

.eslintrc.js

@@ -385,6 +385,33 @@ module.exports = {
         ],
       },
     },
+    {
+      files: ['**/*.test.{js,ts,tsx,jsx}', '**/*.spec.{js,ts,tsx,jsx}'],
+      plugins: ['jest'],
+      rules: {
+        // Prevent new file-based snapshots. Inline snapshots (toMatchInlineSnapshot)
+        // are still allowed as they keep assertions co-located with the test.
+        'jest/no-restricted-matchers': [
+          'error',
+          {
+            toMatchSnapshot:
+              'Use toMatchInlineSnapshot() or an explicit assertion instead. File-based snapshots are being phased out.',
+          },
+        ],
+      },
+    },
+    {
+      // Matches CODEOWNERS `**/snaps/**` and `**/Snaps/**` (@MetaMask/core-platform).
+      // ESLint cannot read CODEOWNERS.
+      files: [
+        '**/snaps/**/*.{test,spec}.{js,ts,tsx,jsx}',
+        '**/Snaps/**/*.{test,spec}.{js,ts,tsx,jsx}',
+      ],
+      plugins: ['jest'],
+      rules: {
+        'jest/no-restricted-matchers': 'off',
+      },
+    },
     // ── Perps controller Core-alignment override ──
     // Enforces the same ESLint rules that Core's @metamask/eslint-config
     // applies to packages/perps-controller so that code written in mobile

app/component-library/components/Badges/BadgeWrapper/BadgeWrapper.test.tsx

@@ -3,16 +3,20 @@ import React from 'react';
 import { render, screen } from '@testing-library/react-native';
 
 // Internal dependencies.
+import { BADGENETWORK_TEST_ID } from '../Badge/variants/BadgeNetwork/BadgeNetwork.constants';
 import BadgeWrapper from './BadgeWrapper';
 import {
   SAMPLE_BADGEWRAPPER_PROPS,
   BADGE_WRAPPER_BADGE_TEST_ID,
 } from './BadgeWrapper.constants';
 
 describe('BadgeWrapper', () => {
-  it('should render BadgeWrapper correctly', () => {
-    const { toJSON } = render(<BadgeWrapper {...SAMPLE_BADGEWRAPPER_PROPS} />);
-    expect(toJSON()).toMatchSnapshot();
-    expect(screen.getByTestId(BADGE_WRAPPER_BADGE_TEST_ID)).toBeDefined();
+  it('renders anchor content, network badge, and wrapper test id', () => {
+    render(<BadgeWrapper {...SAMPLE_BADGEWRAPPER_PROPS} />);
+
+    expect(screen.getByTestId(BADGE_WRAPPER_BADGE_TEST_ID)).toBeOnTheScreen();
+    expect(screen.getByText('C')).toBeOnTheScreen();
+    expect(screen.getByTestId(BADGENETWORK_TEST_ID)).toBeOnTheScreen();
+    expect(screen.getByTestId('network-avatar-image')).toBeOnTheScreen();
   });
 });

app/component-library/components/Badges/BadgeWrapper/__snapshots__/BadgeWrapper.test.tsx.snap

@@ -26,14 +26,15 @@ const styleSheet = (params: { theme: Theme }) => {
       borderRadius: 12,
       padding,
       flexDirection: 'row',
-      alignItems: 'center',
+      alignItems: 'flex-start',
     },
     avatar: {
+      marginTop: -4,
       marginRight: 16,
     },
     labelsContainer: {
       flex: 1,
-      justifyContent: 'center',
+      justifyContent: 'flex-start',
     },
     label: {
       color: colors.text.default,

app/component-library/components/Toast/Toast.styles.ts

@@ -1,10 +1,12 @@
 // Third party dependencies.
 import React, { createRef } from 'react';
+import { StyleSheet } from 'react-native';
 import { render, screen, act } from '@testing-library/react-native';
 
 // Internal dependencies.
 import Toast from './Toast';
 import { ToastRef, ToastVariants, ToastOptions } from './Toast.types';
+import { ToastSelectorsIDs } from './ToastModal.testIds';
 
 // react-native-reanimated is already mocked globally via setUpTests() in testSetup.js
 
@@ -163,4 +165,24 @@ describe('Toast', () => {
     expect(screen.queryByText('In Progress')).toBeNull();
     expect(screen.getByText('Success')).toBeOnTheScreen();
   });
+
+  it('uses flex-start justifyContent on labels container by default', async () => {
+    const toastOptions: ToastOptions = {
+      variant: ToastVariants.Plain,
+      labelOptions: [{ label: 'Aligned label' }],
+      hasNoTimeout: true,
+    };
+
+    render(<Toast ref={toastRef} />);
+
+    await act(async () => {
+      toastRef.current?.showToast(toastOptions);
+      jest.runAllTimers();
+    });
+
+    const labelsContainer = screen.getByTestId(ToastSelectorsIDs.CONTAINER);
+    const flat = StyleSheet.flatten(labelsContainer.props.style);
+
+    expect(flat.justifyContent).toBe('flex-start');
+  });
 });

app/component-library/components/Toast/Toast.test.tsx

@@ -51,6 +51,7 @@ import ContactForm from '../../Views/Settings/Contacts/ContactForm';
 import ActivityView from '../../Views/ActivityView';
 import RewardsNavigator from '../../UI/Rewards/RewardsNavigator';
 import { ExploreFeed } from '../../Views/TrendingView/TrendingView';
+import WhatsHappeningDetailView from '../../Views/WhatsHappeningDetailView';
 import ExploreSearchScreen from '../../Views/TrendingView/Views/ExploreSearchScreen/ExploreSearchScreen';
 import ExploreSectionResultsFullView from '../../Views/TrendingView/Views/ExploreSectionResultsFullView/ExploreSectionResultsFullView';
 import TrendingFeedSessionManager from '../../UI/Trending/services/TrendingFeedSessionManager';
@@ -1368,6 +1369,11 @@ const MainNavigator = () => {
           component={SitesFullView}
           options={{ headerShown: false, ...slideFromRightAnimation }}
         />
+        <Stack.Screen
+          name={Routes.WHATS_HAPPENING_DETAIL}
+          component={WhatsHappeningDetailView}
+          options={{ headerShown: false, ...slideFromRightAnimation }}
+        />
         <Stack.Screen
           name={Routes.EXPLORE_SECTION_RESULTS_FULL_VIEW}
           component={ExploreSectionResultsFullView}

app/components/Nav/Main/MainNavigator.js

@@ -1045,6 +1045,19 @@ describe('MainNavigator', () => {
       expect(screen).toBeDefined();
     });
 
+    it('includes WhatsHappeningDetailView screen', () => {
+      const container = renderWithProvider(<MainNavigator />, {
+        state: initialRootState,
+      });
+
+      const screenProps = getScreenProps(container);
+      const screen = screenProps?.find(
+        (s) => s?.name === Routes.WHATS_HAPPENING_DETAIL,
+      );
+
+      expect(screen).toBeDefined();
+    });
+
     it('includes Browser home screen in main navigator', () => {
       const container = renderWithProvider(<MainNavigator />, {
         state: initialRootState,