diff --git a/centrifuge-app/.env-config/.env.ff-prod b/centrifuge-app/.env-config/.env.ff-prod index e8374b2240..8a244fb165 100644 --- a/centrifuge-app/.env-config/.env.ff-prod +++ b/centrifuge-app/.env-config/.env.ff-prod @@ -8,7 +8,7 @@ REACT_APP_ONBOARDING_API_URL=https://europe-central2-centrifuge-production-x.clo REACT_APP_PINNING_API_URL=https://europe-central2-centrifuge-production-x.cloudfunctions.net/pinning-api-production REACT_APP_POOL_CREATION_TYPE=propose REACT_APP_RELAY_WSS_URL=wss://rpc.polkadot.io -REACT_APP_SUBQUERY_URL=https://api.subquery.network/sq/centrifuge/pools-multichain +REACT_APP_SUBQUERY_URL=https://subql.embrio.tech REACT_APP_SUBSCAN_URL=https://centrifuge.subscan.io REACT_APP_TINLAKE_NETWORK=mainnet REACT_APP_INFURA_KEY=8ed99a9a115349bbbc01dcf3a24edc96 diff --git a/centrifuge-app/.env-config/.env.production b/centrifuge-app/.env-config/.env.production index 8917d00354..41347c491e 100644 --- a/centrifuge-app/.env-config/.env.production +++ b/centrifuge-app/.env-config/.env.production @@ -8,7 +8,7 @@ REACT_APP_ONBOARDING_API_URL=https://europe-central2-centrifuge-production-x.clo REACT_APP_PINNING_API_URL=https://europe-central2-centrifuge-production-x.cloudfunctions.net/pinning-api-production REACT_APP_POOL_CREATION_TYPE=propose REACT_APP_RELAY_WSS_URL=wss://rpc.polkadot.io -REACT_APP_SUBQUERY_URL=https://api.subquery.network/sq/centrifuge/pools-multichain +REACT_APP_SUBQUERY_URL=https://subql.embrio.tech REACT_APP_SUBSCAN_URL=https://centrifuge.subscan.io REACT_APP_TINLAKE_NETWORK=mainnet REACT_APP_INFURA_KEY=8ed99a9a115349bbbc01dcf3a24edc96 diff --git a/centrifuge-app/src/components/CardTotalValueLocked.tsx b/centrifuge-app/src/components/CardTotalValueLocked.tsx deleted file mode 100644 index 836bfcbcc6..0000000000 --- a/centrifuge-app/src/components/CardTotalValueLocked.tsx +++ /dev/null @@ -1,98 +0,0 @@ -import { Box, Stack, Text, TextWithPlaceholder, Tooltip } from '@centrifuge/fabric' -import * as React from 'react' -import { useTheme } from 'styled-components' -import { config } from '../config' -import { Dec } from '../utils/Decimal' -import { formatDate } from '../utils/date' -import { formatBalance } from '../utils/formatting' -import { useListedPools } from '../utils/useListedPools' -import type { DataPoint } from './Charts/TotalValueLocked' -import { tooltipText } from './Tooltips' - -const TotalValueLocked = React.lazy(() => import('./Charts/TotalValueLocked')) - -export function CardTotalValueLocked() { - const { colors } = useTheme() - const [hovered, setHovered] = React.useState(undefined) - const [, listedTokens] = useListedPools() - - const chartHeight = 100 - const balanceProps = { - as: 'strong', - fontSize: [28, 32], - } - const headingProps = { - as: 'h2', - variant: 'heading3', - } - - const totalValueLocked = React.useMemo(() => { - return ( - listedTokens - ?.map((tranche) => ({ - valueLocked: tranche.totalIssuance - .toDecimal() - .mul(tranche.tokenPrice?.toDecimal() ?? Dec(0)) - .toNumber(), - })) - .reduce((prev, curr) => prev.add(curr.valueLocked), Dec(0)) ?? Dec(0) - ) - }, [listedTokens]) - - return ( - - - {hovered ? ( - <> - - TVL on{' '} - - - {formatBalance(Dec(hovered?.tvl || 0), config.baseCurrency)} - - ) : ( - <> - - {tooltipText.tvl.label} - - - {formatBalance(Dec(totalValueLocked || 0), config.baseCurrency)} - - - )} - - - - - }> - - - - - - ) -} diff --git a/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx b/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx index 67bef122a9..ce2bc15c37 100644 --- a/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx +++ b/centrifuge-app/src/components/Charts/PoolPerformanceChart.tsx @@ -79,7 +79,7 @@ function PoolPerformanceChart() { } return { day: new Date(day.timestamp), nav: Number(nav), price: Number(price) } }) || [], - [isSingleTranche, truncatedPoolStates] + [isSingleTranche, truncatedPoolStates, todayAssetValue, todayPrice] ) const today = { diff --git a/centrifuge-app/src/components/DebugFlags/config.ts b/centrifuge-app/src/components/DebugFlags/config.ts index 721323ed4c..2eddcf28f3 100644 --- a/centrifuge-app/src/components/DebugFlags/config.ts +++ b/centrifuge-app/src/components/DebugFlags/config.ts @@ -38,7 +38,6 @@ export type Key = | 'persistDebugFlags' | 'showUnusedFlags' | 'allowInvestBelowMin' - | 'alternativeTheme' | 'editPoolConfig' | 'editPoolVisibility' | 'showAdvancedAccounts' @@ -59,11 +58,6 @@ export const flagsConfig = { default: false, type: 'checkbox', }, - alternativeTheme: { - alwaysShow: true, - default: false, - type: 'checkbox', - }, convertAddress: { Component: ConvertAddressDialogWithButton, alwaysShow: true, diff --git a/centrifuge-app/src/components/DemoBanner.tsx b/centrifuge-app/src/components/DemoBanner.tsx index e0cf0a046f..dadf079a6e 100644 --- a/centrifuge-app/src/components/DemoBanner.tsx +++ b/centrifuge-app/src/components/DemoBanner.tsx @@ -25,14 +25,14 @@ export const DemoBanner = () => { isOpen={isOpen} onClose={() => onClose()} title={ - + Welcome to the demo environment of the Centrifuge App. All data and wallet transactions are not real as this is purely a testing environment. Read{' '} { - const theme = useTheme() const [isDialogOpen, setIsDialogOpen] = React.useState(false) return ( <> setIsDialogOpen(false)} /> - + - + Need help? - + Documentation setIsDialogOpen(true)}> - + Investment disclaimer - + Data privacy policy - + Imprint diff --git a/centrifuge-app/src/components/LayoutBase/LayoutSection.tsx b/centrifuge-app/src/components/LayoutBase/LayoutSection.tsx index 0a3a522be6..2cdb7f2ccb 100644 --- a/centrifuge-app/src/components/LayoutBase/LayoutSection.tsx +++ b/centrifuge-app/src/components/LayoutBase/LayoutSection.tsx @@ -12,7 +12,7 @@ type Props = { export function LayoutSection({ title, titleAddition, subtitle, headerRight, children, ...boxProps }: Props) { return ( - + {(title || titleAddition || subtitle || headerRight) && ( diff --git a/centrifuge-app/src/components/LayoutBase/index.tsx b/centrifuge-app/src/components/LayoutBase/index.tsx index b38313e486..5005fbf4cf 100644 --- a/centrifuge-app/src/components/LayoutBase/index.tsx +++ b/centrifuge-app/src/components/LayoutBase/index.tsx @@ -1,18 +1,17 @@ import { WalletMenu } from '@centrifuge/centrifuge-react' import { Stack, Text } from '@centrifuge/fabric' import * as React from 'react' +import { Outlet } from 'react-router' import { useIsAboveBreakpoint } from '../../utils/useIsAboveBreakpoint' import { Footer } from '../Footer' -import { LoadBoundary } from '../LoadBoundary' -import { LogoLink } from '../LogoLink' +import { LogoLink } from '../LogoLink-deprecated' import { Menu } from '../Menu' import { BasePadding } from './BasePadding' import { + ContentWrapper, FooterContainer, - HeaderBackground, Inner, LogoContainer, - MainContainer, Root, ToolbarContainer, WalletContainer, @@ -20,47 +19,33 @@ import { WalletPositioner, } from './styles' -type LayoutBaseProps = { - children?: React.ReactNode - gap?: number | number[] -} - -export function LayoutBase({ children, gap }: LayoutBaseProps) { +export function LayoutBase(): JSX.Element { const isMedium = useIsAboveBreakpoint('M') - return ( + + + + + + + - - - + - - - - - - - - - - - - - {children} - - - {isMedium && (