release(runway): cherry-pick fix: infinite auth requests in carousel hook cp-13.7.0 (#37334)

## **Description**

This PR fixes a bug where the Authentication API was being called on
every re-render of `useCarouselManagement` because of infinite
`getUserProfileLineage` requests, creating scenarios where users were
being rate limited and couldn't authenticate.

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/37334?quickstart=1)

## **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: Fixed a bug where the Authentication API was called
infinitely in useCarouselManagement

## **Related issues**

Fixes: #35367 ,
[MUL-1220](https://consensyssoftware.atlassian.net/browse/MUL-1220),
potentially
[MUL-1190](https://consensyssoftware.atlassian.net/browse/MUL-1190)

## **Manual testing steps**

1. Complete onboarding
2. Open the network tab, filter it by typing "lineage"
3. Switch accounts and verify the calls are only happening here
4. Verify that there are no infinite calls to the Authentication API
anymore

## **Screenshots/Recordings**

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

### **Before**

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

### **After**

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

## **Pre-merge author checklist**

- [x] I've followed [MetaMask Contributor
Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask
Extension Coding
Standards](https://github.com/MetaMask/metamask-extension/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-extension/blob/main/.github/guidelines/LABELING_GUIDELINES.md)).
Not required for external contributors.

## **Pre-merge reviewer checklist**

- [x] I've manually tested the PR (e.g. pull and build branch, run the
app, test code being changed).
- [x] 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]
> Separates download eligibility into its own effect to avoid repeated
lineage calls, gates Contentful fetch until ready, and adds a test
ensuring lineage runs once per account.
> 
> - **Hook (`ui/hooks/useCarouselManagement/useCarouselManagement.ts`)**
> - Introduces `downloadEligible` and `downloadEligibilityReady` state
and a dedicated effect to compute eligibility via
`getUserProfileLineage`, with cancellation and error handling.
> - Gates Contentful slide fetching on `downloadEligibilityReady`; uses
`contentfulEnabled` derived flag and removes it from deps in favor of
the derived value.
> - Applies eligibility when including `downloadMobileApp` slides;
preserves existing behavior for `fund` slide and slide ordering.
> - Refines effect dependency arrays (e.g., replaces
`remoteFeatureFlags` with `contentfulEnabled`).
> - **Tests
(`ui/hooks/useCarouselManagement/useCarouselManagement.test.ts`)**
> - Adds test verifying lineage is called only once per account and not
on slide changes.
>   - Updates mocks and helpers accordingly.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
0898e82. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

[MUL-1220]:
https://consensyssoftware.atlassian.net/browse/MUL-1220?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

Author: mathieuartu

ui/hooks/useCarouselManagement/useCarouselManagement.test.ts

@@ -127,4 +127,40 @@ describe('useCarouselManagement (simple Contentful tests)', () => {
 
     expect(getDispatchedSlides()).toEqual([]);
   });
+
+  test('lineage is called only once per account, not in infinite loop', async () => {
+    const mockGetUserProfileLineage = jest.requireMock(
+      '../../store/actions',
+    ).getUserProfileLineage;
+
+    mockGetUseExternalServices.mockReturnValue(true);
+    mockGetRemoteFeatureFlags.mockReturnValue({
+      contentfulCarouselEnabled: true,
+    });
+
+    const { rerender } = renderHook(() => useCarouselManagement());
+
+    await waitFor(() => expect(mockUpdateSlides).toHaveBeenCalled());
+
+    mockGetUserProfileLineage.mockClear();
+    mockUpdateSlides.mockClear();
+
+    mockGetSlides.mockReturnValue([slide('fund')]);
+
+    rerender();
+
+    // Wait a bit to ensure any potential loops would manifest
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    // Lineage should NOT be called again just because slides changed
+    // (it should only be called when account/settings change)
+    expect(mockGetUserProfileLineage).not.toHaveBeenCalled();
+
+    mockGetSelectedInternalAccount.mockReturnValue({ address: '0xnew' });
+    rerender();
+
+    await waitFor(() => expect(mockGetUserProfileLineage).toHaveBeenCalled());
+
+    expect(mockGetUserProfileLineage).toHaveBeenCalledTimes(1);
+  });
 });

ui/hooks/useCarouselManagement/useCarouselManagement.ts

@@ -1,5 +1,5 @@
 import { isEqual } from 'lodash';
-import { useEffect, useRef } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import log from 'loglevel';
 import { BigNumber } from 'bignumber.js';
@@ -103,8 +103,62 @@ export const useCarouselManagement = ({
   const hasZeroBalance = new BigNumber(totalBalance ?? ZERO_BALANCE).eq(
     ZERO_BALANCE,
   );
+  const contentfulEnabled =
+    remoteFeatureFlags?.contentfulCarouselEnabled ?? false;
+
+  const [downloadEligible, setDownloadEligible] = useState<boolean>(false);
+  const [downloadEligibilityReady, setDownloadEligibilityReady] =
+    useState<boolean>(false);
+
+  useEffect(() => {
+    const eligibilityNeeded =
+      contentfulEnabled && useExternalServices && showDownloadMobileAppSlide;
+
+    if (!eligibilityNeeded) {
+      setDownloadEligible(false);
+      setDownloadEligibilityReady(true);
+      return () => undefined;
+    }
+
+    setDownloadEligibilityReady(false);
+
+    let cancelled = false;
+
+    (async () => {
+      try {
+        const lineage = await getUserProfileLineageAction();
+        if (!cancelled) {
+          const onMobile = Boolean(
+            lineage?.lineage?.some((l) => l.agent === Platform.MOBILE),
+          );
+          setDownloadEligible(!onMobile);
+          setDownloadEligibilityReady(true);
+        }
+      } catch (error) {
+        if (!cancelled) {
+          log.warn('Failed to fetch user profile lineage:', error);
+          setDownloadEligible(false);
+          setDownloadEligibilityReady(true);
+        }
+      }
+    })();
+
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    selectedAccount.address,
+    useExternalServices,
+    showDownloadMobileAppSlide,
+    contentfulEnabled,
+  ]);
 
   useEffect(() => {
+    // Wait until eligibility is resolved (or not required) to avoid double fetch
+    if (!downloadEligibilityReady) {
+      return;
+    }
+
     // If carousel is disabled, clear the slides
     if (!enabled) {
       const empty: CarouselSlide[] = [];
@@ -115,9 +169,6 @@ export const useCarouselManagement = ({
       return;
     }
     const maybeFetchContentful = async () => {
-      const contentfulEnabled =
-        remoteFeatureFlags?.contentfulCarouselEnabled ?? false;
-
       // Early Return if Contentful is disabled
       if (!contentfulEnabled) {
         const empty: CarouselSlide[] = [];
@@ -156,17 +207,6 @@ export const useCarouselManagement = ({
             return s;
           };
 
-          const downloadEligible = await (async () => {
-            if (!useExternalServices || !showDownloadMobileAppSlide) {
-              return false;
-            }
-            const lineage = await getUserProfileLineageAction();
-            const onMobile = Boolean(
-              lineage?.lineage?.some((l) => l.agent === Platform.MOBILE),
-            );
-            return !onMobile;
-          })();
-
           const isEligible = (s: CarouselSlide) => {
             // Show Download Mobile App (only if not already on mobile + flags)
             if (s.variableName === 'downloadMobileApp') {
@@ -211,13 +251,11 @@ export const useCarouselManagement = ({
     enabled,
     dispatch,
     hasZeroBalance,
-    remoteFeatureFlags,
+    contentfulEnabled,
     testDate,
     inTest,
     slides,
-    selectedAccount.address,
-    useExternalServices,
-    showDownloadMobileAppSlide,
+    downloadEligibilityReady,
   ]);
 
   return { slides };