move current value and verbiage tweaks

centrifuge · Sep 11, 2023 · a13396f · a13396f
1 parent ddba3e0
commit a13396f
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 34 deletions.
diff --git a/centrifuge-app/src/pages/Loan/HoldingsValues.tsx b/centrifuge-app/src/pages/Loan/HoldingsValues.tsx
@@ -1,16 +1,15 @@
-import { BorrowerTransaction, CurrencyBalance, ExternalPricingInfo, Loan, Pool } from '@centrifuge/centrifuge-js'
+import { BorrowerTransaction, CurrencyBalance, Pool } from '@centrifuge/centrifuge-js'
 import BN from 'bn.js'
 import { LabelValueStack } from '../../components/LabelValueStack'
 import { formatBalance } from '../../utils/formatting'
 
 type Props = {
-  loan: Loan & { pricing: ExternalPricingInfo }
   pool: Pool
   transactions?: BorrowerTransaction[] | null
 }
 
-export function HoldingsValues({ loan: { pricing }, pool, transactions }: Props) {
-  const netCash =
+export function HoldingsValues({ pool, transactions }: Props) {
+  const netSpent =
     transactions?.reduce((sum, trx) => {
       if (trx.type === 'REPAID') {
         sum = new CurrencyBalance(
@@ -51,21 +50,12 @@ export function HoldingsValues({ loan: { pricing }, pool, transactions }: Props)
         value={`${formatBalance(new CurrencyBalance(currentFace, 24), pool.currency.symbol, 6, 2)}`}
       />
       <LabelValueStack
-        label="Net cash"
-        value={`${formatBalance(new CurrencyBalance(netCash, 32), pool.currency.symbol, 6, 2)}`}
+        label="Net spent"
+        value={`${formatBalance(new CurrencyBalance(netSpent, 32), pool.currency.symbol, 6, 2)}`}
       />
       <LabelValueStack
-        label="Average price"
-        value={`${formatBalance(new CurrencyBalance(netCash.div(currentFace), 6), pool.currency.symbol, 2, 2)}`}
-      />
-      <LabelValueStack
-        label="Current value"
-        value={`${formatBalance(
-          new CurrencyBalance(currentFace.mul(pricing.oracle.value), 44),
-          pool.currency.symbol,
-          6,
-          2
-        )}`}
+        label="Average settle price"
+        value={`${formatBalance(new CurrencyBalance(netSpent.div(currentFace), 6), pool.currency.symbol, 2, 2)}`}
       />
     </>
   )

diff --git a/centrifuge-app/src/pages/Loan/index.tsx b/centrifuge-app/src/pages/Loan/index.tsx
@@ -1,4 +1,4 @@
-import { CurrencyBalance, ExternalPricingInfo, Loan as LoanType, Pool, TinlakeLoan } from '@centrifuge/centrifuge-js'
+import { CurrencyBalance, Loan as LoanType, Pool, TinlakeLoan } from '@centrifuge/centrifuge-js'
 import { useCentrifuge } from '@centrifuge/centrifuge-react'
 import {
   AnchorButton,
@@ -133,6 +133,17 @@ const Loan: React.FC<{ setShowOraclePricing?: () => void }> = ({ setShowOraclePr
     return 0
   }, [originationDate, loan?.pricing.maturityDate])
 
+  const currentFace =
+    borrowerAssetTransactions?.reduce((sum, trx) => {
+      if (trx.type === 'BORROWED') {
+        sum = new CurrencyBalance(sum.add(trx.amount || new CurrencyBalance(0, 27)), 27)
+      }
+      if (trx.type === 'REPAID') {
+        sum = new CurrencyBalance(sum.sub(trx.amount || new CurrencyBalance(0, 27)), 27)
+      }
+      return sum
+    }, new CurrencyBalance(0, 27)) || new CurrencyBalance(0, 27)
+
   return (
     <Stack>
       <Box mt={2} ml={2}>
@@ -183,17 +194,19 @@ const Loan: React.FC<{ setShowOraclePricing?: () => void }> = ({ setShowOraclePr
                 label: 'Maturity date',
                 value: formatDate(loan.pricing.maturityDate),
               },
-              {
-                label: 'Current value',
-                value: formatBalance(
-                  'outstandingDebt' in loan
-                    ? new CurrencyBalance(loan.outstandingDebt, 21)
-                    : new CurrencyBalance(0, 18),
-                  pool?.currency.symbol,
-                  6,
-                  2
-                ),
-              },
+              ...('valuationMethod' in loan.pricing && loan.pricing.valuationMethod === 'oracle'
+                ? [
+                    {
+                      label: 'Current value',
+                      value: `${formatBalance(
+                        new CurrencyBalance(currentFace.mul(loan.pricing.oracle.value), 44),
+                        pool.currency.symbol,
+                        6,
+                        2
+                      )}`,
+                    },
+                  ]
+                : []),
             ]}
           />
 
@@ -219,11 +232,7 @@ const Loan: React.FC<{ setShowOraclePricing?: () => void }> = ({ setShowOraclePr
           {'valuationMethod' in loan.pricing && loan.pricing.valuationMethod === 'oracle' && (
             <PageSection title={<Box>Holdings</Box>}>
               <Shelf gap={6} flexWrap="wrap">
-                <HoldingsValues
-                  loan={loan as LoanType & { pricing: ExternalPricingInfo }}
-                  pool={pool as Pool}
-                  transactions={borrowerAssetTransactions}
-                />
+                <HoldingsValues pool={pool as Pool} transactions={borrowerAssetTransactions} />
               </Shelf>
             </PageSection>
           )}