Merge branch 'main' into fix-report-investments

centrifuge · Aug 29, 2024 · d76bdab · d76bdab
2 parents 07c6c1c + cb220d2
commit d76bdab
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 33 deletions.
diff --git a/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx b/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx
@@ -94,7 +94,12 @@ function PoolPerformanceChart() {
       return undefined
     }
 
-    return getCSVDownloadUrl(chartData as any)
+    const filteredData = chartData.map((data) => ({
+      day: data.day,
+      tokenPrice: data.price,
+    }))
+
+    return getCSVDownloadUrl(filteredData as any)
   }, [chartData])
 
   const priceRange = React.useMemo(() => {

diff --git a/centrifuge-app/src/components/LoanList.tsx b/centrifuge-app/src/components/LoanList.tsx
@@ -35,7 +35,6 @@ import { Tooltips } from './Tooltips'
 type Row = (Loan | TinlakeLoan) & {
   idSortKey: number
   originationDateSortKey: string
-  maturityDate: string | null
   status: 'Created' | 'Active' | 'Closed' | ''
 }
 
@@ -100,47 +99,28 @@ export function LoanList({ loans }: Props) {
   const columns = [
     {
       align: 'left',
-      header: <SortableTableHeader label="Asset" />,
+      header: <SortableTableHeader label={isTinlakePool ? 'NFT ID' : 'Asset'} />,
       cell: (l: Row) => <AssetName loan={l} />,
       sortKey: 'idSortKey',
       width: 'minmax(300px, 1fr)',
     },
-    isTinlakePool && {
-      align: 'left',
-      header: <SortableTableHeader label="NFT ID" />,
-      cell: (l: Row) =>
-        l.asset.nftId.length >= 9 ? `${l.asset.nftId.slice(0, 4)}...${l.asset.nftId.slice(-4)}` : l.asset.nftId,
-      sortKey: 'nftIdSortKey',
-      width: 'minmax(150px, 1fr)',
-    },
     ...(additionalColumns?.length
       ? additionalColumns
       : [
           {
             align: 'left',
             header: <SortableTableHeader label="Financing date" />,
             cell: (l: Row) => {
-              // @ts-expect-error value only exists on Tinlake loans and on active Centrifuge loans
-              return l.originationDate &&
-                (l.poolId.startsWith('0x') || l.status === 'Active') &&
-                'valuationMethod' in l.pricing &&
-                l.pricing.valuationMethod !== 'cash'
-                ? // @ts-expect-error
-                  formatDate(l.originationDate)
+              if (l.poolId.startsWith('0x') && l.id !== '0') {
+                return formatDate((l as TinlakeLoan).originationDate)
+              }
+              return l.status === 'Active' && 'valuationMethod' in l.pricing && l.pricing.valuationMethod !== 'cash'
+                ? formatDate(l.originationDate)
                 : '-'
             },
             sortKey: 'originationDateSortKey',
           },
         ]),
-    {
-      align: 'left',
-      header: <SortableTableHeader label="Maturity date" />,
-      cell: (l: Row) =>
-        l?.maturityDate && 'valuationMethod' in l.pricing && l.pricing.valuationMethod !== 'cash'
-          ? formatDate(l.maturityDate)
-          : '-',
-      sortKey: 'maturityDate',
-    },
     {
       align: 'right',
       header: <SortableTableHeader label="Amount" />,
@@ -179,7 +159,6 @@ export function LoanList({ loans }: Props) {
       !loan?.totalBorrowed?.isZero()
         ? loan.originationDate
         : '',
-    maturityDate: loan.pricing.maturityDate,
     ...loan,
   }))
 
@@ -218,7 +197,6 @@ export function LoanList({ loans }: Props) {
             !loan?.totalBorrowed?.isZero()
               ? loan.originationDate
               : '',
-          maturityDate: loan.pricing.maturityDate,
           ...loan,
         }
       }),
@@ -234,7 +212,6 @@ export function LoanList({ loans }: Props) {
             <DataTable
               data={rows}
               columns={columns}
-              defaultSortKey="maturityDate"
               onRowClicked={(row) => `${basePath}/${poolId}/assets/${row.id}`}
               pageSize={20}
               page={pagination.page}
@@ -293,6 +270,23 @@ export function AssetName({ loan }: { loan: Pick<Row, 'id' | 'poolId' | 'asset'
     )
   }
 
+  if (isTinlakePool) {
+    return (
+      <Shelf gap="1" alignItems="center" justifyContent="center" style={{ whiteSpace: 'nowrap', maxWidth: '100%' }}>
+        <TextWithPlaceholder
+          isLoading={isLoading}
+          width={12}
+          variant="body2"
+          style={{ overflow: 'hidden', maxWidth: '300px', textOverflow: 'ellipsis' }}
+        >
+          {loan.asset.nftId.length >= 9
+            ? `${loan.asset.nftId.slice(0, 4)}...${loan.asset.nftId.slice(-4)}`
+            : loan.asset.nftId}
+        </TextWithPlaceholder>
+      </Shelf>
+    )
+  }
+
   if ('valuationMethod' in loan.pricing && loan.pricing.valuationMethod === 'cash') {
     return (
       <Shelf gap="1" alignItems="center" justifyContent="center" style={{ whiteSpace: 'nowrap', maxWidth: '100%' }}>

diff --git a/centrifuge-app/src/components/PoolOverview/KeyMetrics.tsx b/centrifuge-app/src/components/PoolOverview/KeyMetrics.tsx
@@ -151,7 +151,12 @@ const AvailableNetworks = ({ poolId }: { poolId: string }) => {
               <Text variant="heading4">Centrifuge</Text>
               {pool.tranches.length > 1 ? (
                 pool.tranches.map((tranche) => (
-                  <a target="_blank" rel="noopener noreferrer" href={`${import.meta.env.REACT_APP_SUBSCAN_URL}`}>
+                  <a
+                    key={tranche.id}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    href={`${import.meta.env.REACT_APP_SUBSCAN_URL}`}
+                  >
                     <Shelf gap={1} alignItems="center">
                       <Text variant="body2" color="black">
                         View {tranche.currency.name.split(' ').at(-1)}
@@ -184,6 +189,7 @@ const AvailableNetworks = ({ poolId }: { poolId: string }) => {
           const chain = (evmChains as any)[domain.chainId]
           return (
             <Tooltip
+              key={domain.poolManager}
               delay={300}
               bodyWidth="maxContent"
               bodyPadding={0}

diff --git a/centrifuge-app/src/components/Portfolio/Transactions.tsx b/centrifuge-app/src/components/Portfolio/Transactions.tsx
@@ -183,7 +183,7 @@ export function Transactions({ onlyMostRecent, narrow, txTypes, address, tranche
         </Box>
         {onlyMostRecent ? (
           <Box display="inline-block">
-            <RouterLinkButton to={`/history/${address}`} small variant="tertiary" icon={IconEye}>
+            <RouterLinkButton newTab to={`/history/${address}`} small variant="tertiary" icon={IconEye}>
               View all
             </RouterLinkButton>
           </Box>

diff --git a/centrifuge-app/src/components/RouterLinkButton.tsx b/centrifuge-app/src/components/RouterLinkButton.tsx
@@ -8,6 +8,7 @@ export type RouterLinkButtonProps = VisualButtonProps &
     showActive?: boolean
     goBack?: boolean
     to?: string
+    newTab?: boolean
   }
 
 const StyledLink = styled(NavLink)<{ $disabled?: boolean }>(
@@ -30,13 +31,17 @@ export function RouterLinkButton({
   goBack,
   to,
   children,
+  newTab = false,
   ...routeProps
 }: RouterLinkButtonProps) {
   const navigate = useNavigate()
 
   const handleClick = (event: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
     event.preventDefault()
-    if (goBack) {
+
+    if (newTab) {
+      window.open(to, '_blank', 'noopener,noreferrer')
+    } else if (goBack) {
       navigate(-1)
     } else if (to) {
       navigate(to)