chore(feedback): address various comments, add and update unit tests

app/components/UI/Stake/Views/StakeEarningsHistoryView/StakeEarningsHistoryView.test.tsx

@@ -7,6 +7,7 @@ import { getStakingNavbar } from '../../../Navbar';
 import renderWithProvider from '../../../../../util/test/renderWithProvider';
 import { backgroundState } from '../../../../../util/test/initial-root-state';
 import { Hex } from '@metamask/utils';
+
 jest.mock('../../../Navbar');
 jest.mock('../../hooks/useStakingEarningsHistory');
 
@@ -20,6 +21,11 @@ jest.mock('@react-navigation/native', () => {
   return {
     ...actualNav,
     useNavigation: () => mockNavigation,
+    useRoute: () => ({
+      key: '1',
+      name: 'params',
+      params: { asset: MOCK_STAKED_ETH_ASSET },
+    }),
   };
 });
 jest.mock('react-native-svg-charts', () => {
@@ -79,15 +85,7 @@ const mockInitialState = {
   },
 };
 
-const earningsHistoryView = (
-  <StakeEarningsHistoryView
-    route={{
-      key: '1',
-      name: 'params',
-      params: { asset: MOCK_STAKED_ETH_ASSET },
-    }}
-  />
-);
+const earningsHistoryView = <StakeEarningsHistoryView />;
 
 describe('StakeEarningsHistoryView', () => {
   it('renders correctly and matches snapshot', () => {

app/components/UI/Stake/Views/StakeEarningsHistoryView/StakeEarningsHistoryView.tsx

@@ -1,4 +1,4 @@
-import { useNavigation } from '@react-navigation/native';
+import { useNavigation, useRoute } from '@react-navigation/native';
 import React, { useEffect } from 'react';
 import { View } from 'react-native';
 import { ScrollView } from 'react-native-gesture-handler';
@@ -7,10 +7,11 @@ import { useStyles } from '../../../../hooks/useStyles';
 import { getStakingNavbar } from '../../../Navbar';
 import StakingEarningsHistory from '../../components/StakingEarnings/StakingEarningsHistory/StakingEarningsHistory';
 import styleSheet from './StakeEarningsHistoryView.styles';
-import { StakeEarningsHistoryViewProps } from './StakeEarningsHistoryView.types';
+import { StakeEarningsHistoryViewRouteParams } from './StakeEarningsHistoryView.types';
 
-const StakeEarningsHistoryView = ({ route }: StakeEarningsHistoryViewProps) => {
+const StakeEarningsHistoryView = () => {
   const navigation = useNavigation();
+  const route = useRoute<StakeEarningsHistoryViewRouteParams>();
   const { styles, theme } = useStyles(styleSheet, {});
   const { asset } = route.params;
   const ticker = asset.ticker ?? asset.symbol;

app/components/UI/Stake/Views/StakeEarningsHistoryView/StakeEarningsHistoryView.types.ts

@@ -1,10 +1,9 @@
-import { RouteProp } from '@react-navigation/native';
 import { TokenI } from '../../../Tokens/types';
 
-interface StakeEarningsHistoryViewRouteParams {
-    asset: TokenI
-}
-
-export interface StakeEarningsHistoryViewProps {
-  route: RouteProp<{ params: StakeEarningsHistoryViewRouteParams }, 'params'>;
+export interface StakeEarningsHistoryViewRouteParams {
+  key: string;
+  name: string;
+  params: {
+    asset: TokenI;
+  };
 }