Merge branch '202411-staking-yield' of github.com:the-standard/decent…

…ralised-dashboard-fork into beta
the-standard · Nov 7, 2024 · e9800a6 · e9800a6
2 parents 2f1090d + 2345afc
commit e9800a6
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 40 deletions.
diff --git a/src/components/vault/yield/YieldPerformanceModal.jsx b/src/components/vault/yield/YieldPerformanceModal.jsx
@@ -189,8 +189,8 @@ const YieldPerformanceModal = ({
                 <Typography variant="p">
                   Current Value
                 </Typography>
-                <Typography variant="h1" className="font-bold">
-                  ${currentUSD?.toFixed(2) || ''}
+                <Typography variant="h1" className="font-bold flex items-center">
+                  <span className="text-sm inline-block font-normal">~</span>${currentUSD?.toFixed(2) || ''}
                 </Typography>
               </div>
             </div>

diff --git a/src/components/vault/yield/YieldSummary.jsx b/src/components/vault/yield/YieldSummary.jsx
@@ -148,26 +148,15 @@ const YieldSummary = ({
           </Typography>
         </div>
         <div className="bg-base-300/40 p-4 rounded-lg w-full flex items-center">
-          <Typography variant="p">
-            Assets in Yield Pools
-          </Typography>
-          {gammaUserLoading ? (
-            <>
-              <span class="loading loading-bars loading-md"></span>
-            </>
-          ) : (
-            <>
-              <Typography variant="p" className="text-end">
-                {formatUSD(metrics.totalBalance)}
-              </Typography>
-            </>
-          )}
-        </div>
-        <div className="bg-base-300/40 p-4 rounded-lg w-full flex items-center">
-          <Typography variant="p">
-            Yield Generated
-          </Typography>
-          <div>
+          <div className="w-full">
+            <Typography variant="p">
+              Market Movement
+            </Typography>
+            <Typography variant="p" className="opacity-40">
+              If held without yield pools
+            </Typography>
+          </div>
+          <div className="w-full">
             {gammaUserLoading ? (
               <>
                 <span class="loading loading-bars loading-md"></span>
@@ -176,30 +165,25 @@ const YieldSummary = ({
               <>
                 <Typography
                   variant="p"
-                  className={`text-end ${getYieldColor(metrics.totalYieldEarned)}`}
+                  className={`text-end ${metrics.totalMarketYield >= 0 ? 'text-green-500' : 'text-red-400'}`}
                 >
-                  {formatUSD(metrics.totalYieldEarned)}
+                  {formatUSD(metrics.totalMarketYield)}
                 </Typography>
                 <Typography
                   variant="p"
-                  className={`text-end ${getYieldColor(metrics.weightedAverageYieldAPY)}`}
+                  className={`text-end ${metrics.totalMarketYield >= 0 ? 'text-green-500' : 'text-red-400'}`}
                 >
-                  {formatPercentage(metrics.weightedAverageYieldAPY)} APY
+                  {formatPercentage(metrics.weightedAverageMarketAPY)}
                 </Typography>
               </>
             )}
           </div>
         </div>
         <div className="bg-base-300/40 p-4 rounded-lg w-full flex items-center">
-          <div className="w-full">
-            <Typography variant="p">
-              Market Movement
-            </Typography>
-            <Typography variant="p" className="opacity-40">
-              If held without yield pools
-            </Typography>
-          </div>
-          <div className="w-full">
+          <Typography variant="p">
+            Yield Generated
+          </Typography>
+          <div>
             {gammaUserLoading ? (
               <>
                 <span class="loading loading-bars loading-md"></span>
@@ -208,22 +192,37 @@ const YieldSummary = ({
               <>
                 <Typography
                   variant="p"
-                  className={`text-end ${metrics.totalMarketYield >= 0 ? 'text-green-500' : 'text-red-400'}`}
+                  className={`text-end ${getYieldColor(metrics.totalYieldEarned)}`}
                 >
-                  {formatUSD(metrics.totalMarketYield)}
+                  {formatUSD(metrics.totalYieldEarned)}
                 </Typography>
                 <Typography
                   variant="p"
-                  className={`text-end ${metrics.totalMarketYield >= 0 ? 'text-green-500' : 'text-red-400'}`}
+                  className={`text-end ${getYieldColor(metrics.weightedAverageYieldAPY)}`}
                 >
-                  {formatPercentage(metrics.weightedAverageMarketAPY)}
+                  {formatPercentage(metrics.weightedAverageYieldAPY)} APY
                 </Typography>
               </>
             )}
           </div>
         </div>
+        <div className="bg-base-300/40 p-4 rounded-lg w-full flex items-center">
+          <Typography variant="p">
+            Assets in Yield Pools
+          </Typography>
+          {gammaUserLoading ? (
+            <>
+              <span class="loading loading-bars loading-md"></span>
+            </>
+          ) : (
+            <>
+              <Typography variant="p" className="text-end">
+                {formatUSD(metrics.totalBalance)}
+              </Typography>
+            </>
+          )}
+        </div>
       </div>
-
       <div className="grid grid-cols-1 gap-4 mb-4">
         <div className="bg-info/20 p-4 rounded-lg w-full">
           <div className="flex gap-3">