feat: removed transition from drawer while going back to home page (MetaMask#40432)

This PR is to remove the transition for when a user is navigating back
from a page to home page

## **Description**

<!--
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?
-->

[![Open in GitHub
Codespaces](https://github.com/codespaces/badge.svg)](https://codespaces.new/MetaMask/metamask-extension/pull/40432?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: null

## **Related issues**

Fixes:

## **Manual testing steps**

1. Run extension
2. Click on hamburger menu, drawer opens with transition
3. Click on Dapp Connections in drawer and then click on back button in
connections page
4. It should navigate back to home page, no transition from drawer
should be there

## **Screenshots/Recordings**

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

### **Before**

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

### **After**


https://github.com/user-attachments/assets/50a47731-3001-4596-a96a-12dde4150b4f



## **Pre-merge author checklist**

- [ ] 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).
- [ ] I've completed the PR template to the best of my ability
- [ ] I’ve included tests if applicable
- [ ] I’ve documented my code using [JSDoc](https://jsdoc.app/) format
if applicable
- [ ] 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**

- [ ] 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]
> **Low Risk**
> Low risk UI-only change that tweaks drawer animation state/cleanup;
main risk is subtle regressions in open/close timing due to new
previous-state tracking and RAF cancellation.
> 
> **Overview**
> **Drawer open behavior is adjusted to avoid unwanted transitions on
navigation.** `GlobalMenuDrawer` now tracks the previous `isOpen` state
and only plays the *enter* animation when transitioning from closed→open
(e.g., hamburger click); when mounting/restoring with `isOpen` already
true, it renders directly in the `open` phase.
> 
> It also tightens transition cleanup by cancelling pending
`requestAnimationFrame` callbacks on close/unmount and ensuring the
phase/transform logic stays consistent during enter/exit.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
618954a. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

Author: NidhiKJha

ui/components/multichain/global-menu-drawer/global-menu-drawer.tsx

@@ -61,6 +61,8 @@ export const GlobalMenuDrawer = ({
   const exitTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const enterFrameRef = useRef<number | null>(null);
   const wasOpenRef = useRef(false);
+  /** Tracks previous isOpen so we can run enter transition only when opening from closed (hamburger), not when mounting/restoring with open (back from page). */
+  const prevIsOpenRef = useRef<boolean | undefined>(undefined);
   const rootLayoutRef = useRef<HTMLElement | null>(null);
   const appContainerRef = useRef<HTMLElement | null>(null);
   const resizeTimeoutRef = useRef<NodeJS.Timeout | undefined>(undefined);
@@ -69,30 +71,35 @@ export const GlobalMenuDrawer = ({
   const hasPosition = Object.keys(drawerStyle).length > 0;
   const readyToShow = isOpen && (!usePortal || hasPosition);
 
-  // Custom transition: only start when we can show (have position in portal mode).
+  // Open drawer: use entering transition only when going from closed to open (hamburger click). When mounting or returning from a page with drawerOpen in URL, show immediately.
   useEffect(() => {
     if (readyToShow) {
       wasOpenRef.current = true;
       if (exitTimeoutRef.current !== null) {
         clearTimeout(exitTimeoutRef.current);
         exitTimeoutRef.current = null;
       }
-      setDrawerPhase('entering');
-      enterFrameRef.current = requestAnimationFrame(() => {
+      const wasClosed = prevIsOpenRef.current === false;
+      if (wasClosed) {
+        setDrawerPhase('entering');
         enterFrameRef.current = requestAnimationFrame(() => {
-          enterFrameRef.current = null;
-          setDrawerPhase('open');
+          enterFrameRef.current = requestAnimationFrame(() => {
+            enterFrameRef.current = null;
+            setDrawerPhase('open');
+          });
         });
-      });
-      return () => {
-        if (enterFrameRef.current !== null) {
-          cancelAnimationFrame(enterFrameRef.current);
-          enterFrameRef.current = null;
-        }
-      };
+      } else {
+        setDrawerPhase('open');
+      }
+      prevIsOpenRef.current = true;
     }
     if (wasOpenRef.current && !isOpen) {
       wasOpenRef.current = false;
+      prevIsOpenRef.current = false;
+      if (enterFrameRef.current !== null) {
+        cancelAnimationFrame(enterFrameRef.current);
+        enterFrameRef.current = null;
+      }
       setDrawerPhase('exiting');
       exitTimeoutRef.current = setTimeout(() => {
         exitTimeoutRef.current = null;
@@ -105,12 +112,20 @@ export const GlobalMenuDrawer = ({
         }
       };
     }
-    return undefined;
+    if (!isOpen) {
+      prevIsOpenRef.current = false;
+    }
+    return () => {
+      if (enterFrameRef.current !== null) {
+        cancelAnimationFrame(enterFrameRef.current);
+        enterFrameRef.current = null;
+      }
+    };
   }, [isOpen, readyToShow]);
 
   const isDrawerMounted = drawerPhase !== null;
-  const isExiting = drawerPhase === 'exiting';
   const isEntering = drawerPhase === 'entering';
+  const isExiting = drawerPhase === 'exiting';
   const isDrawerOpen = drawerPhase === 'open';
 
   useLayoutEffect(() => {
@@ -286,7 +301,7 @@ export const GlobalMenuDrawer = ({
 
   const backdropOpacity = isDrawerOpen ? 1 : 0;
   const panelTransform =
-    isEntering || isExiting ? 'translateX(100%)' : 'translateX(0)';
+    isExiting || isEntering ? 'translateX(100%)' : 'translateX(0)';
 
   const dialogContent = isDrawerMounted ? (
     <div