refactor(trending): use MMDS HeaderStandard

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: brianacnguyen

app/components/UI/Trending/components/TrendingListHeader/TrendingListHeader.tsx

@@ -3,10 +3,10 @@ import { useNavigation } from '@react-navigation/native';
 import {
   HeaderSearch,
   HeaderSearchVariant,
+  HeaderStandard,
   IconName as DSIconName,
 } from '@metamask/design-system-react-native';
 import { strings } from '../../../../../../locales/i18n';
-import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import type { TrendingListHeaderProps } from './TrendingListHeader.types';
 
 /**
@@ -98,7 +98,7 @@ const TrendingListHeader: React.FC<TrendingListHeaderProps> = ({
   }
 
   return (
-    <HeaderCompactStandard
+    <HeaderStandard
       title={title || strings('trending.trending_tokens')}
       onBack={handleBack}
       backButtonProps={{

app/components/UI/Trending/components/TrendingTokensBottomSheet/TrendingTokenNetworkBottomSheet.tsx

@@ -1,9 +1,9 @@
 import React, { useRef, useState, useCallback, useEffect } from 'react';
+import { HeaderStandard } from '@metamask/design-system-react-native';
 import { StyleSheet, ScrollView } from 'react-native';
 import BottomSheet, {
   BottomSheetRef,
 } from '../../../../../component-library/components/BottomSheets/BottomSheet';
-import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import Icon, {
   IconName,
   IconSize,
@@ -115,7 +115,7 @@ const TrendingTokenNetworkBottomSheet: React.FC<
       onClose={handleSheetClose}
       testID="trending-token-network-bottom-sheet"
     >
-      <HeaderCompactStandard
+      <HeaderStandard
         title={strings('trending.networks')}
         onClose={handleClose}
         closeButtonProps={{ testID: 'close-button' }}

app/components/UI/Trending/components/TrendingTokensBottomSheet/TrendingTokenPriceChangeBottomSheet.tsx

@@ -1,4 +1,5 @@
 import React, { useRef, useState, useCallback, useEffect } from 'react';
+import { HeaderStandard } from '@metamask/design-system-react-native';
 import { View, StyleSheet, TouchableOpacity, Platform } from 'react-native';
 import { useTheme } from '../../../../../util/theme';
 import BottomSheet, {
@@ -14,7 +15,6 @@ import Icon, {
   IconColor,
 } from '../../../../../component-library/components/Icons/Icon';
 import { strings } from '../../../../../../locales/i18n';
-import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import Button, {
   ButtonVariants,
   ButtonWidthTypes,
@@ -149,7 +149,7 @@ const TrendingTokenPriceChangeBottomSheet: React.FC<
       onClose={handleSheetClose}
       testID="trending-token-price-change-bottom-sheet"
     >
-      <HeaderCompactStandard
+      <HeaderStandard
         title={strings('trending.sort_by')}
         onClose={handleClose}
         closeButtonProps={{ testID: 'close-button' }}

app/components/UI/Trending/components/TrendingTokensBottomSheet/TrendingTokenTimeBottomSheet.tsx

@@ -1,4 +1,5 @@
 import React, { useRef, useState, useCallback, useEffect } from 'react';
+import { HeaderStandard } from '@metamask/design-system-react-native';
 import { View, StyleSheet, TouchableOpacity } from 'react-native';
 import { useTheme } from '../../../../../util/theme';
 import BottomSheet, {
@@ -7,7 +8,6 @@ import BottomSheet, {
 import Text, {
   TextVariant,
 } from '../../../../../component-library/components/Texts/Text';
-import HeaderCompactStandard from '../../../../../component-library/components-temp/HeaderCompactStandard';
 import Icon, {
   IconName,
   IconSize,
@@ -139,7 +139,7 @@ const TrendingTokenTimeBottomSheet: React.FC<
       onClose={handleSheetClose}
       testID="trending-token-time-bottom-sheet"
     >
-      <HeaderCompactStandard
+      <HeaderStandard
         title={strings('trending.time')}
         onClose={handleClose}
         closeButtonProps={{ testID: 'close-button' }}