Nav management overview + table updates (#2122)

* Update layout so that button isn't hidden under wallet component * Show nav-management menu when toggle is enabled * Move asset table to new file * Add basic layout for nav summary and overview table * Move hook to own file * Add rest of calcs * Fix summary * Remove collection id from createPool since it's not used * Fix change it asset valuation calcs * Prefill price for assets and add row clickable * Remove last of collectionId * Remove unused variable * Make input editable * Add reserve row to nav table * Fix total calc * Hide input on reserve row and update reserve logo * Fix link on reserve click
centrifuge · May 16, 2024 · ba568a3 · ba568a3
1 parent e5d29bf
commit ba568a3
Show file tree

Hide file tree

Showing 9 changed files with 517 additions and 362 deletions.
diff --git a/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx b/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx
@@ -70,7 +70,6 @@ function PoolPerformanceChart() {
 
   // querying chain for more accurate data, since data for today from subquery is not necessarily up to date
   const todayAssetValue = pool?.nav.total.toDecimal().toNumber() || 0
-  const todayReserve = pool?.reserve.total.toDecimal().toNumber() || 0
 
   const chartData = data.slice(-rangeNumber)
 

diff --git a/centrifuge-app/src/components/Menu/NavManagementMenu.tsx b/centrifuge-app/src/components/Menu/NavManagementMenu.tsx
@@ -2,7 +2,7 @@ import { Box, IconChevronDown, IconChevronRight, IconMonitor, Menu, MenuItemGrou
 import * as React from 'react'
 import { useRouteMatch } from 'react-router'
 import { useTheme } from 'styled-components'
-import { usePoolsForWhichAccountIsFeeder } from '../../pages/NavManagement/Overview'
+import { usePoolsForWhichAccountIsFeeder } from '../../utils/usePoolsForWhichAccountIsFeeder'
 import { PoolLink } from './PoolLink'
 import { Toggle } from './Toggle'
 
@@ -22,7 +22,7 @@ export function NavManagementMenu({ stacked }: NavManagementMenuProps) {
 
   return (
     allowedPools &&
-    allowedPools?.length > 1 && (
+    allowedPools?.length >= 1 && (
       <Box position={['static', 'static', 'relative', 'static']}>
         {open && (
           <Box
@@ -46,9 +46,9 @@ export function NavManagementMenu({ stacked }: NavManagementMenuProps) {
           isActive={isActive}
           stacked={stacked}
         >
-          <IconMonitor />
+          <IconMonitor size={['iconMedium', 'iconMedium', 'iconSmall']} />
           NAV management
-          {!stacked && (open ? <IconChevronDown /> : <IconChevronRight />)}
+          {!stacked && (open ? <IconChevronDown size="iconSmall" /> : <IconChevronRight size="iconSmall" />)}
         </Toggle>
 
         <Box

diff --git a/centrifuge-app/src/pages/IssuerCreatePool/index.tsx b/centrifuge-app/src/pages/IssuerCreatePool/index.tsx
@@ -223,7 +223,6 @@ function CreatePoolForm() {
           aoProxy: string,
           adminProxy: string,
           poolId: string,
-          collectionId: string,
           tranches: TrancheInput[],
           currency: CurrencyKey,
           maxReserve: BN,
@@ -232,7 +231,7 @@ function CreatePoolForm() {
         ],
         options
       ) => {
-        const [transferToMultisig, aoProxy, adminProxy, , , , , , { adminMultisig }] = args
+        const [transferToMultisig, aoProxy, adminProxy, , , , , { adminMultisig }] = args
         const multisigAddr = adminMultisig && createKeyMulti(adminMultisig.signers, adminMultisig.threshold)
         const poolArgs = args.slice(2) as any
         return combineLatest([
@@ -403,7 +402,6 @@ function CreatePoolForm() {
       const currency = currencies.find((c) => c.symbol === values.currency)!
 
       const poolId = await centrifuge.pools.getAvailablePoolId()
-      const collectionId = await centrifuge.nfts.getAvailableCollectionId()
       if (!values.poolIcon || !values.executiveSummary) {
         return
       }
@@ -479,7 +477,6 @@ function CreatePoolForm() {
               aoProxy,
               adminProxy,
               poolId,
-              collectionId,
               tranches,
               currency.key,
               CurrencyBalance.fromFloat(values.maxReserve, currency.decimals),

diff --git a/centrifuge-app/src/pages/MultisigApproval.tsx b/centrifuge-app/src/pages/MultisigApproval.tsx
@@ -46,11 +46,35 @@ export default function MultisigApprovalPage() {
   const suitableAccount = accounts?.find((acc) => multisig.signers.includes(acc.address))
   return (
     <LayoutBase>
-      <PageHeader
-        title="Approve multisig transaction"
-        subtitle={`Call hash: ${truncate(hash)}`}
-        actions={
-          selectedAddress && !multisig.signers.includes(selectedAddress) ? (
+      <PageHeader title="Approve multisig transaction" subtitle={`Call hash: ${truncate(hash)}`}></PageHeader>
+      <PageSection>
+        <Shelf justifyContent="space-between">
+          {isCallDataNeeded && !callString && (
+            <>
+              <TextAreaInput
+                label="Call data"
+                placeholder="0x..."
+                value={callFormInput}
+                onChange={(e) => setCallFormInput(e.target.value)}
+              />
+              {callInputError && (
+                <Text variant="label2" color="statusCritical">
+                  Calldata doesn't match hash
+                </Text>
+              )}
+            </>
+          )}
+          {callString && (
+            <details>
+              <Text as="summary" variant="heading2">
+                Call details
+              </Text>
+              <Text as="pre" variant="body2" style={{ whiteSpace: 'pre-wrap' }}>
+                {callString}
+              </Text>
+            </details>
+          )}
+          {selectedAddress && !multisig.signers.includes(selectedAddress) ? (
             <Shelf gap={2}>
               <Text variant="body2">selected account not signer to multisig</Text>
               {suitableAccount && (
@@ -63,35 +87,8 @@ export default function MultisigApprovalPage() {
             <Button onClick={approveOrReject} loading={transactionIsPending}>
               {isReject ? 'Reject' : 'Approve'}
             </Button>
-          )
-        }
-      ></PageHeader>
-      <PageSection>
-        {isCallDataNeeded && !callString && (
-          <>
-            <TextAreaInput
-              label="Call data"
-              placeholder="0x..."
-              value={callFormInput}
-              onChange={(e) => setCallFormInput(e.target.value)}
-            />
-            {callInputError && (
-              <Text variant="label2" color="statusCritical">
-                Calldata doesn't match hash
-              </Text>
-            )}
-          </>
-        )}
-        {callString && (
-          <details>
-            <Text as="summary" variant="heading2">
-              Call details
-            </Text>
-            <Text as="pre" variant="body2" style={{ whiteSpace: 'pre-wrap' }}>
-              {callString}
-            </Text>
-          </details>
-        )}
+          )}
+        </Shelf>
       </PageSection>
     </LayoutBase>
   )