chore(runway): cherry-pick fix: Toast component theme reactivity in production builds cp-7.59.0 (#22335)

- fix: Toast component theme reactivity in production builds cp-7.59.0
(#22291)

## **Description**

Fixed Toast component theme not updating when switching between light
and dark mode in production builds (TestFlight). The issue only affected
production builds while working correctly in development/simulator.

### Root Cause:
The Toast component had an empty dependency array `[]` in its `useMemo`
hook (line 69), which cached the initial theme styles and never updated
when the theme changed. This was a remnant from when Toast used
inverse/hardcoded theming.

### Solution:
Updated the `useMemo` dependency array to properly track `[styles.base,
animatedStyle]`, ensuring the component re-renders with correct theme
colors when theme changes occur.

## **Changelog**

CHANGELOG entry: Fixed Toast component not updating theme colors when
switching between light and dark mode

## **Related issues**

Fixes: Theme change issue in Toast component

## **Manual testing steps**

```gherkin
Feature: Toast theme updates correctly

  Scenario: User switches device theme while Toast is visible
    Given the app is running with a visible Toast notification
    
    When user switches from light mode to dark mode (or vice versa) in device settings
    Then the Toast should update to match the new theme colors immediately
    
  Scenario: Toast appears with correct theme in production build
    Given the app is running in a TestFlight production build
    And user has dark mode enabled
    
    When a Toast notification appears
    Then the Toast displays with correct dark theme colors (not stuck in light theme)
```

## **Screenshots/Recordings**

### **Before**
Toast remained in previous theme colors when device theme was changed in
production builds.



https://github.com/user-attachments/assets/d96faa41-10c3-4777-baf0-cb33ec137309

### **After**
Toast correctly updates to match current theme in both development and
production builds.



https://github.com/user-attachments/assets/aea3a725-0aa1-4412-bd56-5bde79fbfbbd

## **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
- [ ] 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]
> Adjusts `useMemo` dependencies for `baseStyle` in `Toast.tsx` to
include `styles.base` and `animatedStyle`, ensuring reactive updates.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
e5c8919. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->


[a659739](a659739)

Co-authored-by: George Marshall <george.marshall@consensys.net>
Co-authored-by: João Loureiro <175489935+joaoloureirop@users.noreply.github.com>

Author: 3 people

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

@@ -62,12 +62,10 @@ const Toast = forwardRef((_, ref: React.ForwardedRef<ToastRef>) => {
       { translateY: translateYProgress.value - TAB_BAR_HEIGHT - customOffset },
     ],
   }));
-  const baseStyle: StyleProp<Animated.AnimateStyle<StyleProp<ViewStyle>>> =
-    useMemo(
-      () => [styles.base, animatedStyle],
-      /* eslint-disable-next-line */
-      [],
-    );
+  const baseStyle: StyleProp<ViewStyle> = useMemo(
+    () => [styles.base, animatedStyle],
+    [styles.base, animatedStyle],
+  );
 
   const resetState = () => setToastOptions(undefined);