diff --git a/android/.project b/android/.project
index 378e75909f1..3cf8618bf4c 100644
--- a/android/.project
+++ b/android/.project
@@ -14,15 +14,4 @@
org.eclipse.buildship.core.gradleprojectnature
-
-
- 1714744032029
-
- 30
-
- org.eclipse.core.resources.regexFilterMatcher
- node_modules|\.git|__CREATED_BY_JAVA_LANGUAGE_SERVER__
-
-
-
diff --git a/android/.settings/org.eclipse.buildship.core.prefs b/android/.settings/org.eclipse.buildship.core.prefs
index e479558406c..e8895216fd3 100644
--- a/android/.settings/org.eclipse.buildship.core.prefs
+++ b/android/.settings/org.eclipse.buildship.core.prefs
@@ -1,13 +1,2 @@
-arguments=
-auto.sync=false
-build.scans.enabled=false
-connection.gradle.distribution=GRADLE_DISTRIBUTION(WRAPPER)
connection.project.dir=
eclipse.preferences.version=1
-gradle.user.home=
-java.home=
-jvm.arguments=
-offline.mode=false
-override.workspace.settings=false
-show.console.view=false
-show.executions.view=false
diff --git a/app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.test.tsx b/app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.test.tsx
new file mode 100644
index 00000000000..092d7c8ded6
--- /dev/null
+++ b/app/component-library/components-temp/Price/AggregatedPercentage/AggregatedPercentage.test.tsx
@@ -0,0 +1,70 @@
+import React from 'react';
+import { render } from '@testing-library/react-native';
+import AggregatedPercentage from './AgregatedPercentage';
+import { mockTheme } from '../../../../util/theme';
+import { useSelector } from 'react-redux';
+import { selectCurrentCurrency } from '../../../../selectors/currencyRateController';
+
+jest.mock('react-redux', () => ({
+ ...jest.requireActual('react-redux'),
+ useSelector: jest.fn(),
+}));
+describe('AggregatedPercentage', () => {
+ beforeEach(() => {
+ (useSelector as jest.Mock).mockImplementation((selector) => {
+ if (selector === selectCurrentCurrency) return 'USD';
+ });
+ });
+ afterEach(() => {
+ (useSelector as jest.Mock).mockClear();
+ });
+ it('should render correctly', () => {
+ const { toJSON } = render(
+ ,
+ );
+ expect(toJSON()).toMatchSnapshot();
+ });
+
+ it('renders positive percentage change correctly', () => {
+ const { getByText } = render(
+ ,
+ );
+
+ expect(getByText('+25.00%')).toBeTruthy();
+ expect(getByText('+(100 USD)')).toBeTruthy();
+
+ expect(getByText('+25.00%').props.style).toMatchObject({
+ color: mockTheme.colors.success.default,
+ textTransform: 'uppercase',
+ });
+ });
+
+ it('renders negative percentage change correctly', () => {
+ const { getByText } = render(
+ ,
+ );
+
+ expect(getByText('-30.00%')).toBeTruthy();
+ expect(getByText('(-150 USD)')).toBeTruthy();
+
+ expect(getByText('-30.00%').props.style).toMatchObject({
+ color: mockTheme.colors.error.default,
+ textTransform: 'uppercase',
+ });
+ });
+});
diff --git a/app/component-library/components-temp/Price/AggregatedPercentage/AgregatedPercentage.tsx b/app/component-library/components-temp/Price/AggregatedPercentage/AgregatedPercentage.tsx
new file mode 100644
index 00000000000..5378acdcb56
--- /dev/null
+++ b/app/component-library/components-temp/Price/AggregatedPercentage/AgregatedPercentage.tsx
@@ -0,0 +1,82 @@
+import React from 'react';
+import { fontStyles } from '../../../../styles/common';
+import Text from '../../../../component-library/components/Texts/Text';
+import { View, StyleSheet } from 'react-native';
+import { useTheme } from '../../../../util/theme';
+import { Colors } from '../../../../util/theme/models';
+import { renderFiat } from '../../../../util/number';
+import { useSelector } from 'react-redux';
+import { selectCurrentCurrency } from '../../../../selectors/currencyRateController';
+
+const createStyles = (colors: Colors) =>
+ StyleSheet.create({
+ wrapper: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ },
+ balancePositiveStyle: {
+ color: colors.success.default,
+ ...fontStyles.normal,
+ textTransform: 'uppercase',
+ },
+ balanceNegativeStyle: {
+ color: colors.error.default,
+ ...fontStyles.normal,
+ textTransform: 'uppercase',
+ },
+ });
+
+const isValidAmount = (amount: number | null | undefined): boolean =>
+ amount !== null && amount !== undefined && !Number.isNaN(amount);
+
+const AggregatedPercentage = ({
+ ethFiat,
+ tokenFiat,
+ tokenFiat1dAgo,
+ ethFiat1dAgo,
+}: {
+ ethFiat: number;
+ tokenFiat: number;
+ tokenFiat1dAgo: number;
+ ethFiat1dAgo: number;
+}) => {
+ const { colors } = useTheme();
+ const styles = createStyles(colors);
+ const currentCurrency = useSelector(selectCurrentCurrency);
+ const DECIMALS_TO_SHOW = 2;
+
+ const totalBalance = ethFiat + tokenFiat;
+ const totalBalance1dAgo = ethFiat1dAgo + tokenFiat1dAgo;
+
+ const amountChange = totalBalance - totalBalance1dAgo;
+ const percentageChange =
+ ((totalBalance - totalBalance1dAgo) / totalBalance1dAgo) * 100 || 0;
+
+ const percentageStyle =
+ percentageChange >= 0
+ ? styles.balancePositiveStyle
+ : styles.balanceNegativeStyle;
+
+ const formattedPercentage = isValidAmount(percentageChange)
+ ? `${(percentageChange as number) >= 0 ? '+' : ''}(${(
+ percentageChange as number
+ ).toFixed(2)}%)`
+ : '';
+
+ const formattedValuePrice = isValidAmount(amountChange)
+ ? `${(amountChange as number) >= 0 ? '+' : ''}${renderFiat(
+ amountChange,
+ currentCurrency,
+ DECIMALS_TO_SHOW,
+ )} `
+ : '';
+
+ return (
+
+ {formattedValuePrice}
+ {formattedPercentage}
+
+ );
+};
+
+export default AggregatedPercentage;
diff --git a/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentage.test.tsx.snap b/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentage.test.tsx.snap
new file mode 100644
index 00000000000..94472d043d7
--- /dev/null
+++ b/app/component-library/components-temp/Price/AggregatedPercentage/__snapshots__/AggregatedPercentage.test.tsx.snap
@@ -0,0 +1,45 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`AggregatedPercentage should render correctly 1`] = `
+
+
+ +(20 USD)
+
+
+ +11.11%
+
+
+`;
diff --git a/app/component-library/components-temp/Price/AggregatedPercentage/index.ts b/app/component-library/components-temp/Price/AggregatedPercentage/index.ts
new file mode 100644
index 00000000000..4a0e1251f35
--- /dev/null
+++ b/app/component-library/components-temp/Price/AggregatedPercentage/index.ts
@@ -0,0 +1 @@
+export { default } from './AgregatedPercentage';
diff --git a/app/components/UI/Tokens/__snapshots__/index.test.tsx.snap b/app/components/UI/Tokens/__snapshots__/index.test.tsx.snap
index a485324a610..0208add1244 100644
--- a/app/components/UI/Tokens/__snapshots__/index.test.tsx.snap
+++ b/app/components/UI/Tokens/__snapshots__/index.test.tsx.snap
@@ -341,9 +341,7 @@ exports[`Tokens should hide zero balance tokens when setting is on 1`] = `
>
0 USD
-
+