FE: Do not weigh unallocated cash if portfolio does not have liquidit…

…y position
KristianLentino99 · Oct 9, 2023 · 3973189 · 3973189
1 parent de51b01
commit 3973189
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 31 deletions.
diff --git a/dcapal-frontend/src/components/allocationFlow/endStep/allocateCard.js b/dcapal-frontend/src/components/allocationFlow/endStep/allocateCard.js
@@ -148,34 +148,38 @@ export const AllocateCard = ({
           </div>
         </div>
         {qty >= 0 && (
-          <div>
-            <div className="flex gap-1 px-3 py-2 mt-[5px] rounded-md bg-blue-100/50">
-              <span>{actionIcon}</span>
-              {qty > oldQty && (
-                <span className="font-light">
-                  {t("endStep.buy")} {roundDecimals(qty - oldQty, 6)}{" "}
-                  <span className="uppercase">{symbol}</span> @ {price}{" "}
-                  <span className="uppercase">{quoteCcy}</span>
-                </span>
-              )}
-              {qty < oldQty && (
-                <span className="font-light">
-                  {t("endStep.sell")} {roundDecimals(oldQty - qty, 6)}{" "}
-                  <span className="uppercase">{symbol}</span> @ {price}{" "}
-                  <span className="uppercase">{quoteCcy}</span>
-                </span>
-              )}
-              {qty === oldQty && (
-                <span className="font-light italic">
-                  {aclass === ACLASS.CRYPTO
-                    ? t("endStep.nothingToTradeHodl")
-                    : t("endStep.nothingToTradeHold")}
-                </span>
-              )}
-            </div>
-            <p className="px-2 my-3 border border-gray-200/50" />
+          <div className="flex gap-1 px-3 py-2 mt-[5px] rounded-md bg-blue-100/50">
+            <span>{actionIcon}</span>
+            {qty > oldQty && (
+              <span className="font-light">
+                {t("endStep.buy")} {roundDecimals(qty - oldQty, 6)}{" "}
+                <span className="uppercase">{symbol}</span> @ {price}{" "}
+                <span className="uppercase">{quoteCcy}</span>
+              </span>
+            )}
+            {qty < oldQty && (
+              <span className="font-light">
+                {t("endStep.sell")} {roundDecimals(oldQty - qty, 6)}{" "}
+                <span className="uppercase">{symbol}</span> @ {price}{" "}
+                <span className="uppercase">{quoteCcy}</span>
+              </span>
+            )}
+            {qty === oldQty && (
+              <span className="font-light italic">
+                {aclass === ACLASS.CRYPTO
+                  ? t("endStep.nothingToTradeHodl")
+                  : t("endStep.nothingToTradeHold")}
+              </span>
+            )}
+          </div>
+        )}
+        {qty < 0 && symbol === quoteCcy && (
+          <div className="flex gap-1 px-3 py-2 mt-[5px] rounded-md bg-blue-100/50">
+            <span>💰</span>
+            <span className="font-light italic">{t("endStep.leftBudget")}</span>
           </div>
         )}
+        <p className="px-2 my-3 border border-gray-200/50" />
         <div className="flex flex-col gap-1">
           {isMobile && (
             <div className="flex flex-col justify-between items-start">

diff --git a/dcapal-frontend/src/components/allocationFlow/endStep/index.js b/dcapal-frontend/src/components/allocationFlow/endStep/index.js
@@ -6,7 +6,6 @@ import { replacer, roundAmount, roundDecimals, timeout } from "../../../utils";
 import { Spinner } from "../../spinner/spinner";
 import {
   ACLASS,
-  FeeType,
   clearBudget,
   feeTypeToString,
   isWholeShares,
@@ -35,18 +34,24 @@ const buildCards = (assets, solution, pfolioCcy, pfolioFees) => {
 
   if (!solution?.amounts) return cards;
 
-  let totalAmount = solution.budget_left || 0;
+  const budgetLeft = solution.budget_left || 0;
+  const hasCashPosition = pfolioCcy in assets;
+
+  let totalAmount = hasCashPosition ? budgetLeft : 0;
   for (const a of solution.amounts.values()) {
     totalAmount += a;
   }
 
   for (const card of cards) {
+    const isCashAsset = hasCashPosition && card.symbol === pfolioCcy;
+
     if (solution.amounts.has(card.symbol)) {
       card.amount = solution.amounts.get(card.symbol);
+      card.amount += isCashAsset ? budgetLeft : 0;
       card.weight = (100 * card.amount) / totalAmount;
     }
 
-    if (solution?.shares?.has(card.symbol)) {
+    if (solution?.shares?.has(card.symbol) && !isCashAsset) {
       card.qty = solution.shares.get(card.symbol);
     }
 
@@ -55,15 +60,15 @@ const buildCards = (assets, solution, pfolioCcy, pfolioFees) => {
     }
   }
 
-  if (solution.budget_left) {
+  if (budgetLeft && !hasCashPosition) {
     cards.push({
       symbol: pfolioCcy,
       name: UNALLOCATED_CASH,
       aclass: ACLASS.CURRENCY,
       qty: -1,
       oldQty: 0,
       price: 0,
-      amount: solution.budget_left,
+      amount: budgetLeft,
       oldAmount: 0,
       weight: 0,
       oldWeight: 0,