feat: add support for preview content deep links (MetaMask#19868)

## **Description**

Allows marketing, QA, and others to test
[Contentful](https://www.contentful.com/) preview data before
publishing.
This link can be found internally or inside our Contentful builder (see
recording below)

<!--
Write a short description of the changes included in this pull request,
also include relevant motivation and context. Have in mind the following
questions:
1. What is the reason for the change?
2. What is the improvement/solution?
-->

## **Changelog**

<!--
If this PR is not End-User-Facing and should not show up in the
CHANGELOG, you can choose to either:
1. Write `CHANGELOG entry: null`
2. Label with `no-changelog`

If this PR is End-User-Facing, please write a short User-Facing
description in the past tense like:
`CHANGELOG entry: Added a new tab for users to see their NFTs`
`CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker`

(This helps the Release Engineer do their job more quickly and
accurately)
-->

CHANGELOG entry: add preview content deeplink for banners and
notifications

## **Related issues**

Fixes: https://consensyssoftware.atlassian.net/browse/ASSETS-1326

## **Manual testing steps**

Visit `https://link.metamask.io/home?previewToken=XXX` with the correct
preview URL to view preview content.
(view internal ticket for preview link)

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before**

<!-- [screenshots/recordings] -->

### **After**


https://www.loom.com/share/1930b4f6aa8542d498ae799e8664e220?sid=56e67b06-2664-4de1-8bc6-f0e167ead9c5


https://github.com/user-attachments/assets/83e09ed8-ade6-4372-a00e-488fdf0fda1b


<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [x] I’ve followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile
Coding
Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md).
- [x] I've completed the PR template to the best of my ability
- [x] I’ve included tests if applicable
- [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [x] I’ve applied the right labels on the PR (see [labeling
guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [ ] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [ ] I confirm that this PR addresses all acceptance criteria described
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots.

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Adds home deeplink support with optional previewToken to enable
Contentful preview content and pass token to notifications fetch.
> 
> - **Deeplinks**:
> - Add `navigateToHomeUrl` to handle `home` path and parse
`previewToken` query param; navigate to `Routes.WALLET.HOME`.
> - Update `DeeplinkManager` to pass `homePath` to `_handleOpenHome` and
use `navigateToHomeUrl`.
> - Update universal link handler to forward `homePath` for `HOME`
action.
>   - Add tests for `navigateToHomeUrl`.
> - **Contentful Carousel**:
> - Add `getContentfulEnvironmentDetails` to select `environment`,
`domain`, and `accessToken` based on `previewToken` and
`isProduction()`.
> - Update `fetchCarouselSlidesFromContentful` to use selected host/env
and token.
> - Extend tests to cover environment selection and existing fetch
behavior.
> - **Notifications**:
> - Add `setContentPreviewToken`/`getContentPreviewToken` and store
preview token.
> - Pass preview token to
`NotificationServicesController.fetchAndUpdateMetamaskNotifications(...)`.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
edd255a. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: Prithpal-Sooriya

app/actions/notification/helpers/index.ts

@@ -2,6 +2,18 @@ import type { MarkAsReadNotificationsParam } from '@metamask/notification-servic
 import Engine from '../../../core/Engine';
 import { isNotificationsFeatureEnabled } from '../../../util/notifications';
 
+let previewToken: string | undefined;
+
+export function setContentPreviewToken(newPreviewToken?: string | null) {
+  if (typeof newPreviewToken === 'string') {
+    previewToken = newPreviewToken;
+  }
+}
+
+export function getContentPreviewToken() {
+  return previewToken;
+}
+
 export const assertIsFeatureEnabled = () => {
   if (!isNotificationsFeatureEnabled()) {
     throw new Error(
@@ -106,7 +118,9 @@ export const enableAccounts = async (accounts: string[]) => {
  */
 export const fetchNotifications = async () => {
   assertIsFeatureEnabled();
-  await Engine.context.NotificationServicesController.fetchAndUpdateMetamaskNotifications();
+  await Engine.context.NotificationServicesController.fetchAndUpdateMetamaskNotifications(
+    getContentPreviewToken(),
+  );
 };
 
 /**

app/components/UI/Carousel/fetchCarouselSlidesFromContentful.test.ts

@@ -3,9 +3,12 @@ import { ContentfulClientApi, createClient } from 'contentful';
 import * as DeviceInfoModule from 'react-native-device-info';
 import {
   fetchCarouselSlidesFromContentful,
+  getContentfulEnvironmentDetails,
   isActive,
 } from './fetchCarouselSlidesFromContentful';
 import { ACCESS_TOKEN, SPACE_ID } from './constants';
+import { getContentPreviewToken } from '../../../actions/notification/helpers';
+import { isProduction } from '../../../util/environment';
 
 jest.mock('contentful', () => ({
   createClient: jest.fn(),
@@ -17,6 +20,67 @@ jest.mock('./constants', () => ({
   ACCESS_TOKEN: jest.fn().mockReturnValue('mockAccessToken'),
 }));
 
+jest.mock('../../../actions/notification/helpers');
+
+jest.mock('../../../util/environment', () => ({
+  isProduction: jest.fn().mockReturnValue(true),
+}));
+
+describe('getContentfulEnvironmentDetails', () => {
+  beforeEach(() => jest.clearAllMocks());
+
+  const arrangeMocks = () => {
+    const mockGetContentPreviewToken = jest
+      .mocked(getContentPreviewToken)
+      .mockReturnValue(undefined);
+
+    const mockIsProduction = jest.mocked(isProduction).mockReturnValue(true);
+
+    return {
+      mockGetContentPreviewToken,
+      mockIsProduction,
+    };
+  };
+
+  it('returns preview prod environment if token provided', () => {
+    const mocks = arrangeMocks();
+    mocks.mockGetContentPreviewToken.mockReturnValue('AAA');
+
+    const result = getContentfulEnvironmentDetails();
+    expect(result).toStrictEqual({
+      environment: 'master',
+      domain: 'preview.contentful.com',
+      accessToken: 'AAA',
+      spaceId: SPACE_ID(),
+    });
+  });
+
+  it('returns prod environment is using production', () => {
+    arrangeMocks();
+
+    const result = getContentfulEnvironmentDetails();
+    expect(result).toStrictEqual({
+      environment: 'master',
+      domain: 'cdn.contentful.com',
+      accessToken: ACCESS_TOKEN(),
+      spaceId: SPACE_ID(),
+    });
+  });
+
+  it('returns preview dev environment is not in production', () => {
+    const mocks = arrangeMocks();
+    mocks.mockIsProduction.mockReturnValue(false);
+
+    const result = getContentfulEnvironmentDetails();
+    expect(result).toStrictEqual({
+      environment: 'dev',
+      domain: 'preview.contentful.com',
+      accessToken: ACCESS_TOKEN(),
+      spaceId: SPACE_ID(),
+    });
+  });
+});
+
 describe('fetchCarouselSlidesFromContentful', () => {
   beforeEach(() => {
     jest.resetAllMocks();

app/components/UI/Carousel/fetchCarouselSlidesFromContentful.ts

@@ -3,6 +3,7 @@ import { isProduction } from '../../../util/environment';
 import { CarouselSlide } from './types';
 import { ACCESS_TOKEN, SPACE_ID } from './constants';
 import { hasMinimumRequiredVersion } from '../../../util/remoteFeatureFlag';
+import { getContentPreviewToken } from '../../../actions/notification/helpers';
 
 export interface ContentfulCarouselSlideFields {
   headline: string;
@@ -20,11 +21,40 @@ export interface ContentfulCarouselSlideFields {
 export type ContentfulSlideSkeleton =
   EntrySkeletonType<ContentfulCarouselSlideFields>;
 
-const ENVIRONMENT = isProduction() ? 'master' : 'dev';
+export const getContentfulEnvironmentDetails = () => {
+  // If preview mode, then show preview prod master content
+  const previewToken = getContentPreviewToken();
+  if (previewToken) {
+    return {
+      environment: 'master',
+      domain: 'preview.contentful.com',
+      accessToken: previewToken,
+      spaceId: SPACE_ID(),
+    };
+  }
+
+  const isProd = isProduction();
+
+  // If production, show prod master content
+  if (isProd) {
+    return {
+      environment: 'master',
+      domain: 'cdn.contentful.com',
+      accessToken: ACCESS_TOKEN(),
+      spaceId: SPACE_ID(),
+    };
+  }
+
+  // Default to preview dev content
+  return {
+    environment: 'dev',
+    domain: 'preview.contentful.com',
+    accessToken: ACCESS_TOKEN(),
+    spaceId: SPACE_ID(),
+  };
+};
+
 const CONTENT_TYPE = 'promotionalBanner';
-const DEFAULT_DOMAIN = isProduction()
-  ? 'cdn.contentful.com'
-  : 'preview.contentful.com';
 
 interface ContentfulSysField {
   sys: { id: string };
@@ -34,8 +64,8 @@ export async function fetchCarouselSlidesFromContentful(): Promise<{
   prioritySlides: CarouselSlide[];
   regularSlides: CarouselSlide[];
 }> {
-  const spaceId = SPACE_ID();
-  const accessToken = ACCESS_TOKEN();
+  const { spaceId, accessToken, environment, domain } =
+    getContentfulEnvironmentDetails();
 
   if (!spaceId || !accessToken) {
     console.warn(
@@ -44,14 +74,14 @@ export async function fetchCarouselSlidesFromContentful(): Promise<{
     return { prioritySlides: [], regularSlides: [] };
   }
 
-  const host = `https://${DEFAULT_DOMAIN}/spaces/${spaceId}/environments/${ENVIRONMENT}/entries`;
+  const host = `https://${domain}/spaces/${spaceId}/environments/${environment}/entries`;
 
   // First try through the Contentful Client
   try {
     const contentfulClient = createClient({
       space: spaceId,
       accessToken,
-      environment: ENVIRONMENT,
+      environment,
       host,
     });
 

app/core/DeeplinkManager/DeeplinkManager.ts

@@ -11,6 +11,7 @@ import parseDeeplink from './ParseManager/parseDeeplink';
 import approveTransaction from './TransactionManager/approveTransaction';
 import { RampType } from '../../reducers/fiatOrders/types';
 import { handleSwapUrl } from './Handlers/handleSwapUrl';
+import { navigateToHomeUrl } from './Handlers/handleHomeUrl';
 import Routes from '../../constants/navigation/Routes';
 import { handleCreateAccountUrl } from './Handlers/handleCreateAccountUrl';
 import { handlePerpsUrl } from './Handlers/handlePerpsUrl';
@@ -104,8 +105,8 @@ class DeeplinkManager {
   }
 
   // NOTE: open the home screen for new subdomain
-  _handleOpenHome() {
-    this.navigation.navigate(Routes.WALLET.HOME);
+  _handleOpenHome(homePath?: string) {
+    navigateToHomeUrl({ homePath });
   }
 
   // NOTE: this will be used for new deeplink subdomain

app/core/DeeplinkManager/Handlers/handleHomeUrl.test.ts

@@ -0,0 +1,49 @@
+import NavigationService from '../../NavigationService';
+import { setContentPreviewToken } from '../../../actions/notification/helpers';
+import { navigateToHomeUrl } from './handleHomeUrl';
+import Routes from '../../../constants/navigation/Routes';
+
+jest.mock('../../NavigationService');
+jest.mock('../../../actions/notification/helpers');
+
+describe('navigateToHomeUrl', () => {
+  beforeEach(() => jest.clearAllMocks());
+
+  const arrangeMocks = () => {
+    const mockNavigate = jest.fn();
+    NavigationService.navigation = {
+      navigate: mockNavigate,
+    } as unknown as typeof NavigationService.navigation;
+
+    const mockSetContentPreviewToken = jest.mocked(setContentPreviewToken);
+
+    return {
+      mockNavigate,
+      mockSetContentPreviewToken,
+    };
+  };
+
+  it('navigates to home screen without sending any query params', () => {
+    const mocks = arrangeMocks();
+    navigateToHomeUrl({ homePath: 'home' });
+
+    expect(mocks.mockSetContentPreviewToken).toHaveBeenCalledWith(null);
+    expect(mocks.mockNavigate).toHaveBeenCalledWith(Routes.WALLET.HOME);
+  });
+
+  it('sends previewToken and navigates to home screen', () => {
+    const mocks = arrangeMocks();
+    navigateToHomeUrl({ homePath: 'home?previewToken=ABC' });
+
+    expect(mocks.mockSetContentPreviewToken).toHaveBeenCalledWith('ABC');
+    expect(mocks.mockNavigate).toHaveBeenCalledWith(Routes.WALLET.HOME);
+  });
+
+  it('falls back to navigated to home sceen when no homePath', () => {
+    const mocks = arrangeMocks();
+    navigateToHomeUrl({ homePath: undefined });
+
+    expect(mocks.mockSetContentPreviewToken).toHaveBeenCalledWith(null);
+    expect(mocks.mockNavigate).toHaveBeenCalledWith(Routes.WALLET.HOME);
+  });
+});

app/core/DeeplinkManager/Handlers/handleHomeUrl.ts

@@ -0,0 +1,12 @@
+import NavigationService from '../../NavigationService';
+import Routes from '../../../constants/navigation/Routes';
+import { setContentPreviewToken } from '../../../actions/notification/helpers';
+
+export function navigateToHomeUrl(params: { homePath?: string }) {
+  const { homePath } = params;
+  const urlParams = new URLSearchParams(
+    homePath?.includes('?') ? homePath.split('?')[1] : '',
+  );
+  setContentPreviewToken(urlParams.get('previewToken'));
+  NavigationService.navigation.navigate(Routes.WALLET.HOME);
+}

app/core/DeeplinkManager/ParseManager/handleUniversalLink.ts

@@ -173,7 +173,8 @@ async function handleUniversalLink({
     const depositCashPath = urlObj.href.replace(BASE_URL_ACTION, '');
     instance._handleDepositCash(depositCashPath);
   } else if (action === SUPPORTED_ACTIONS.HOME) {
-    instance._handleOpenHome();
+    const homePath = urlObj.href.replace(BASE_URL_ACTION, '');
+    instance._handleOpenHome(homePath);
     return;
   } else if (action === SUPPORTED_ACTIONS.SWAP) {
     const swapPath = urlObj.href.replace(BASE_URL_ACTION, '');