From a9e87f67c6ccf03eb9dc3cd655c9e20a788979ce Mon Sep 17 00:00:00 2001
From: piekczyk <sebastian@oazoapps.com>
Date: Tue, 18 Jun 2024 16:45:48 +0200
Subject: [PATCH] Total rays earned portfolio (#3955)

---
 components/portfolio/PortfolioOverview.tsx | 14 +++++++++++++-
 components/portfolio/types/domain-types.ts |  1 +
 public/locales/en/portfolio.json           |  1 +
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/components/portfolio/PortfolioOverview.tsx b/components/portfolio/PortfolioOverview.tsx
index 422f54de74..bfd57e9db5 100644
--- a/components/portfolio/PortfolioOverview.tsx
+++ b/components/portfolio/PortfolioOverview.tsx
@@ -4,7 +4,7 @@ import { PortfolioOverviewItem } from 'components/portfolio/PortfolioOverviewIte
 import { Tag } from 'components/Tag'
 import { WithArrow } from 'components/WithArrow'
 import type { PortfolioPosition } from 'handlers/portfolio/types'
-import { getLocalAppConfig } from 'helpers/config'
+import { getLocalAppConfig, useAppConfig } from 'helpers/config'
 import { formatCryptoBalance } from 'helpers/formatters/format'
 import { getGradientColor, summerBrandGradient } from 'helpers/getGradientColor'
 import { isTouchDevice } from 'helpers/isTouchDevice'
@@ -27,7 +27,9 @@ export const PortfolioOverview = ({
 }) => {
   const { t: tPortfolio } = useTranslation('portfolio')
   const isMobile = useOnMobile() && isTouchDevice
+  const { Rays: isRaysEnabled } = useAppConfig('features')
 
+  const totalRays = portfolioWalletData.totalRaysEarned
   const totalValue = overviewData.allAssetsUsdValue + portfolioWalletData.totalAssetsUsdValue
   const availableToMigrateUsdValue =
     migrationPositions == null
@@ -59,6 +61,16 @@ export const PortfolioOverview = ({
           columnGap: '24px',
         }}
       >
+        {isRaysEnabled && totalRays && (
+          <PortfolioOverviewItem
+            header={tPortfolio('total-rays-earned')}
+            value={
+              <Heading variant="header4" sx={getGradientColor(summerBrandGradient)}>
+                {formatCryptoBalance(new BigNumber(totalRays)).split('.')[0]}
+              </Heading>
+            }
+          />
+        )}
         <PortfolioOverviewItem
           header={tPortfolio('total-portfolio')}
           value={
diff --git a/components/portfolio/types/domain-types.ts b/components/portfolio/types/domain-types.ts
index 9cba85685b..193ef917c6 100644
--- a/components/portfolio/types/domain-types.ts
+++ b/components/portfolio/types/domain-types.ts
@@ -25,4 +25,5 @@ export type PortfolioAssetsResponse = {
   totalAssetsUsdValue: number
   totalAssetsPercentageChange: number
   assets: PortfolioWalletAsset[]
+  totalRaysEarned: number
 }
diff --git a/public/locales/en/portfolio.json b/public/locales/en/portfolio.json
index 0e5cf1b381..a3c8a3e1d8 100644
--- a/public/locales/en/portfolio.json
+++ b/public/locales/en/portfolio.json
@@ -5,6 +5,7 @@
   "total-value": "Total Value",
   "view-assets": "View Assets",
   "total-portfolio": "Summer.fi Portfolio",
+  "total-rays-earned": "Total Rays Earned",
   "total-supplied": "Total Supplied",
   "total-borrowed": "Total Borrowed",
   "total-supplied-mobile": "Total Supplied on Summer",