From 7f67c5e1db6d34dc8a49256d3d47e37e1e37c9dd Mon Sep 17 00:00:00 2001 From: Victor Creed Date: Fri, 18 Dec 2020 15:02:37 +0200 Subject: [PATCH] bug fixes and translations --- .../components/ActiveBorrowTable/index.tsx | 22 ++++++++----- .../components/BorrowInterestRate/index.tsx | 8 ++++- .../BorrowLiquidationPrice/index.tsx | 8 ++++- src/app/components/LoanTokenGraphs/index.tsx | 9 ++++-- src/app/components/TopUpHistory/index.tsx | 31 ------------------- src/app/components/TradingViewChart/index.tsx | 7 ----- src/app/containers/BorrowHistory/index.tsx | 2 +- .../CloseTradingPositionHandler/index.tsx | 2 ++ .../LendingContainer/index.tsx | 11 ++++--- .../components/AccountBalance/index.tsx | 14 ++++++--- .../components/ButtonGroup/index.tsx | 21 ++++++++----- .../components/TabContainer/index.tsx | 16 +++++----- src/app/containers/LendBorrowSovryn/types.ts | 7 +++++ src/app/containers/TradingHistory/index.tsx | 4 ++- src/app/containers/WalletProvider/saga.ts | 14 +++++++++ src/app/hooks/protocol/useCloseWithSwap.ts | 9 +----- src/locales/en/translation.json | 27 ++++++++++++++++ 17 files changed, 127 insertions(+), 85 deletions(-) diff --git a/src/app/components/ActiveBorrowTable/index.tsx b/src/app/components/ActiveBorrowTable/index.tsx index de4ac2ac6..e660b3f64 100644 --- a/src/app/components/ActiveBorrowTable/index.tsx +++ b/src/app/components/ActiveBorrowTable/index.tsx @@ -11,6 +11,8 @@ import { InterestAPR } from '../ActiveUserLoanContainer/components/InterestAPR'; import { DisplayDate } from '../ActiveUserLoanContainer/components/DisplayDate'; import { BorrowAmount } from './BorrowAmount'; import { CollateralAmount } from './CollateralAmount'; +import { useTranslation } from 'react-i18next'; +import { translations } from '../../../locales/i18n'; interface Props { data: any; @@ -18,27 +20,31 @@ interface Props { export function ActiveBorrowTable(props: Props) { const dispatch = useDispatch(); + const { t } = useTranslation(); const columns = React.useMemo( () => [ { - Header: 'Borrowed', + Header: t(translations.activeBorrowTable.headers.borrowAmount), accessor: 'borrowAmount', sortType: 'alphanumeric', + headerProps: { + className: 'test', + }, sortable: true, }, { - Header: 'Collateral', + Header: t(translations.activeBorrowTable.headers.collateralAmount), accessor: 'collateralAmount', sortType: 'alphanumeric', sortable: true, }, { - Header: 'Interest APR', + Header: t(translations.activeBorrowTable.headers.interestAPR), accessor: 'interestAPR', sortable: true, }, { - Header: 'Payback until', + Header: t(translations.activeBorrowTable.headers.endTimestamp), accessor: 'endTimestamp', sortable: true, }, @@ -47,7 +53,7 @@ export function ActiveBorrowTable(props: Props) { accessor: 'actions', }, ], - [], + [t], ); const data = React.useMemo(() => { return props.data.map(item => { @@ -83,14 +89,14 @@ export function ActiveBorrowTable(props: Props) { dispatch(actions.openRepayModal(item.loanId))} > - Repay + {t(translations.activeBorrowTable.repayButton)} ), }; }); - }, [props.data, dispatch]); + }, [props.data, dispatch, t]); const { getTableProps, getTableBodyProps, @@ -99,7 +105,7 @@ export function ActiveBorrowTable(props: Props) { prepareRow, } = useTable({ columns, data }, useSortBy); return ( -
+
{headerGroups.map(headerGroup => ( diff --git a/src/app/components/BorrowInterestRate/index.tsx b/src/app/components/BorrowInterestRate/index.tsx index f3b303dcd..c318ee136 100644 --- a/src/app/components/BorrowInterestRate/index.tsx +++ b/src/app/components/BorrowInterestRate/index.tsx @@ -12,6 +12,8 @@ import { usePriceFeeds_QueryRate } from 'app/hooks/price-feeds/useQueryRate'; import { LoadableValue } from '../LoadableValue'; import { FieldGroup } from '../FieldGroup'; import { DummyField } from '../DummyField'; +import { useTranslation } from 'react-i18next'; +import { translations } from '../../../locales/i18n'; interface Props { asset: Asset; @@ -22,6 +24,7 @@ interface Props { } export function BorrowInterestRate(props: Props) { + const { t } = useTranslation(); const { value: result } = usePriceFeeds_QueryRate( props.collateral, props.asset, @@ -63,7 +66,10 @@ export function BorrowInterestRate(props: Props) { ); return ( - + + (null as any); const height = 115; @@ -175,8 +178,8 @@ function BarsGraph({ width, asset, data }: BarsProps) { setActiveStap(null as any); }, [hideTooltip]); - // @ts-ignore - // @ts-ignore + const interestAPRText: string = t(translations.global.interestApr); + return width < 10 ? null : (
- % Interest APR + {interestAPRText} diff --git a/src/app/components/TopUpHistory/index.tsx b/src/app/components/TopUpHistory/index.tsx index 6ef8c65dc..4eeaa2856 100644 --- a/src/app/components/TopUpHistory/index.tsx +++ b/src/app/components/TopUpHistory/index.tsx @@ -34,10 +34,6 @@ export function TopUpHistory() { } }, [account, isConnected, dispatch]); - useEffect(() => { - console.log(state.history); - }, [state.history]); - return (
@@ -144,33 +140,6 @@ export function TopUpHistory() { /> )} - {/*
*/} ))} diff --git a/src/app/components/TradingViewChart/index.tsx b/src/app/components/TradingViewChart/index.tsx index 247889a9d..b77c4acbc 100644 --- a/src/app/components/TradingViewChart/index.tsx +++ b/src/app/components/TradingViewChart/index.tsx @@ -86,13 +86,6 @@ export function TradingViewChart(props: ChartContainerProps) { 'mainSeriesProperties.areaStyle.color2': '#0098c4', 'mainSeriesProperties.areaStyle.linecolor': '#4ecdc4', 'mainSeriesProperties.areaStyle.transparency': 90, - 'mainSeriesProperties.barStyle.wickUpColor': '#4ecdc4', - 'mainSeriesProperties.barStyle.upColor': '#4ecdc4', - 'mainSeriesProperties.barStyle.wickDownColor': '#fec006', - 'mainSeriesProperties.barStyle.downColor': '#fec006', - 'mainSeriesProperties.barStyle.borderColor': '#4ecdc4', - 'mainSeriesProperties.barStyle.borderUpColor': '#4ecdc4', - 'mainSeriesProperties.barStyle.borderDownColor': '#fec006', }, }); setHasCharts(true); diff --git a/src/app/containers/BorrowHistory/index.tsx b/src/app/containers/BorrowHistory/index.tsx index 1e3171ab8..fb5736ccf 100644 --- a/src/app/containers/BorrowHistory/index.tsx +++ b/src/app/containers/BorrowHistory/index.tsx @@ -99,7 +99,7 @@ export function BorrowHistory(props: Props) { prepareRow, } = useTable({ columns, data }, useSortBy); return ( -
+
*/} - {/* */} - {/*
*/} - {/*
*/} - {/* */} - {/*
*/} - {/* */} - {/*
*/} - {/*
*/} - {/* {weiToFixed(item.valueBtc * 1e10, 4)}{' '}*/} - {/* */} - {/* {item.type === 'deposit' ? 'BTC' : 'rBTC'}*/} - {/* {' '}*/} - {/*
*/} - {/* */} - {/*
{headerGroups.map(headerGroup => ( diff --git a/src/app/containers/CloseTradingPositionHandler/index.tsx b/src/app/containers/CloseTradingPositionHandler/index.tsx index ea45200ca..4ad3ad315 100644 --- a/src/app/containers/CloseTradingPositionHandler/index.tsx +++ b/src/app/containers/CloseTradingPositionHandler/index.tsx @@ -62,6 +62,8 @@ export function CloseTradingPositionHandler(props: Props) { '0x', ); + console.log(isCollateral); + const handleConfirmSwap = () => { send(); }; diff --git a/src/app/containers/LendBorrowSovryn/LendingContainer/index.tsx b/src/app/containers/LendBorrowSovryn/LendingContainer/index.tsx index 3c9e3798c..d7cd05588 100644 --- a/src/app/containers/LendBorrowSovryn/LendingContainer/index.tsx +++ b/src/app/containers/LendBorrowSovryn/LendingContainer/index.tsx @@ -19,6 +19,7 @@ import { actions } from '../slice'; import '../assets/index.scss'; import { SendTxResponse } from '../../../hooks/useSendContractTx'; import { TxType } from '../../../../store/global/transactions-store/types'; +import { ButtonType } from '../types'; type Props = { currency: Asset; @@ -45,14 +46,14 @@ const LendingContainer: React.FC = ({ currency }) => { loading: loadingLimit, } = useLending_transactionLimit(currency, currency); - const onMaxChange = (type: string) => { + const onMaxChange = (type: ButtonType) => { let amount = '0'; - if (type === 'Deposit') { + if (type === ButtonType.DEPOSIT) { amount = userBalance; if (maxAmount !== '0') { amount = min(userBalance, maxAmount); } - } else if (type === 'Redeem') { + } else if (type === ButtonType.REDEEM) { amount = depositedBalance; } setAmount(weiTo18(amount)); @@ -115,8 +116,8 @@ const LendingContainer: React.FC = ({ currency }) => { txState={txState} isConnected={isConnected} valid={valid} - leftButton="Deposit" - rightButton="Redeem" + leftButton={ButtonType.DEPOSIT} + rightButton={ButtonType.REDEEM} amountValue={amount} onChangeAmount={onChangeAmount} handleSubmit={handleLendSubmit} diff --git a/src/app/containers/LendBorrowSovryn/components/AccountBalance/index.tsx b/src/app/containers/LendBorrowSovryn/components/AccountBalance/index.tsx index 05ff29249..8a00a4a3a 100644 --- a/src/app/containers/LendBorrowSovryn/components/AccountBalance/index.tsx +++ b/src/app/containers/LendBorrowSovryn/components/AccountBalance/index.tsx @@ -6,10 +6,13 @@ import { SendTxProgress } from 'app/components/SendTxProgress'; import { TradeButton } from 'app/components/TradeButton'; import '../../assets/index.scss'; +import { ButtonType } from '../../types'; +import { useTranslation } from 'react-i18next'; +import { translations } from '../../../../../locales/i18n'; type Props = { currency: Asset; - title?: string; + title: ButtonType; isConnected: boolean; valid: boolean; txState: any; @@ -28,6 +31,7 @@ const AccountBalance: React.FC = ({ txState, title, }) => { + const { t } = useTranslation(); return ( <> = ({
void; + rightButton: ButtonType; + leftButton: ButtonType; + setCurrentButton: (current: ButtonType) => void; setBorrowAmount?: (amount: string) => void; }; @@ -84,7 +85,7 @@ const ButtonGroup: React.FC = ({
- {key === 'Redeem' && ( + {key === ButtonType.REDEEM && (
-

{t(translations.lend.container.balance)}

+

+ {t(translations.lend.container.balance)} +

{currency} @@ -134,7 +137,9 @@ const ButtonGroup: React.FC = ({
-

{t(translations.lend.container.profit)}

+

+ {t(translations.lend.container.profit)} +

{currency} diff --git a/src/app/containers/LendBorrowSovryn/components/TabContainer/index.tsx b/src/app/containers/LendBorrowSovryn/components/TabContainer/index.tsx index 4524a4c0b..2c788103a 100644 --- a/src/app/containers/LendBorrowSovryn/components/TabContainer/index.tsx +++ b/src/app/containers/LendBorrowSovryn/components/TabContainer/index.tsx @@ -7,6 +7,9 @@ import AccountBalance from '../AccountBalance'; import '../../assets/index.scss'; import { SendTxResponse } from '../../../../hooks/useSendContractTx'; +import { ButtonType } from '../../types'; +import { useTranslation } from 'react-i18next'; +import { translations } from '../../../../../locales/i18n'; type Props = { currency: Asset; @@ -14,10 +17,10 @@ type Props = { loadingLimit: boolean; minValue?: string; amountValue: string; - leftButton: string; - rightButton: string; + leftButton: ButtonType; + rightButton: ButtonType; onChangeAmount: (e: string) => void; - onMaxChange: (button: string) => void; + onMaxChange: (button: ButtonType) => void; handleSubmit: () => void; handleSubmitWithdraw?: () => void; setBorrowAmount?: (amount: string) => void; @@ -46,6 +49,7 @@ const TabContainer: React.FC = ({ loadingLimit, }) => { const [currentButton, setCurrentButton] = useState(leftButton); + const { t } = useTranslation(); return ( <> = ({ onChangeAmount={onChangeAmount} onMaxChange={() => onMaxChange(currentButton)} currency={currency} - amountName={ - currentButton === 'Deposit' ? 'Deposit Amount' : 'Amount to redeem' - } - maxValue={currentButton === 'Deposit' ? maxValue : '0'} + amountName={t(translations.lendingPage.amount[currentButton])} + maxValue={currentButton === ButtonType.DEPOSIT ? maxValue : '0'} loadingLimit={loadingLimit} /> { + console.log('created block channel'); const blockEvents = web3.eth .subscribe('newBlockHeaders', (error, result) => { if (error) { @@ -32,6 +33,7 @@ function createBlockChannels({ web3 }) { }) .on('data', blockHeader => { emit(actions.blockReceived(blockHeader)); + console.log('block received', blockHeader.number); // emit({ // type: 'BLOCK_RECEIVED', // blockHeader, @@ -77,6 +79,11 @@ function* processBlockHeader(event) { const blocksToProcess = previousBlocks .filter(x => !processedBlocks.includes(x)) .reverse(); + console.log('parse blocks', { + previousBlocks, + blocksToProcess, + processedBlocks, + }); for (const number of blocksToProcess) { const block = yield call(web3.eth.getBlock, number, true); yield call(processBlock, { block, address }); @@ -101,6 +108,13 @@ function* processBlock({ block, address }) { const txs = block.transactions; let hasChanges = false; + console.log( + 'processing txes of block', + block.number, + txs, + localTransactions, + ); + if (txs.length > 0) { for (let i = 0; i < txs.length; i++) { const from = (txs[i].from || '').toLowerCase(); diff --git a/src/app/hooks/protocol/useCloseWithSwap.ts b/src/app/hooks/protocol/useCloseWithSwap.ts index 6378e296c..7408ed27a 100644 --- a/src/app/hooks/protocol/useCloseWithSwap.ts +++ b/src/app/hooks/protocol/useCloseWithSwap.ts @@ -1,6 +1,5 @@ import { useSendContractTx } from '../useSendContractTx'; import { useAccount } from '../useAccount'; -import Web3 from 'web3-utils'; import { TxType } from '../../../store/global/transactions-store/types'; export function useCloseWithSwap( @@ -19,13 +18,7 @@ export function useCloseWithSwap( return { send: () => send( - [ - loanId, - receiver, - swapAmount, - Web3.toHex(returnTokenIsCollateral), - loanDataBytes, - ], + [loanId, receiver, swapAmount, returnTokenIsCollateral, loanDataBytes], { from: account }, { type: TxType.CLOSE_WITH_SWAP }, ), diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json index 790f85217..0c176b3a5 100644 --- a/src/locales/en/translation.json +++ b/src/locales/en/translation.json @@ -5,6 +5,10 @@ "max": "max", "close": "Close" }, + "global": { + "liquidationPrice": "Liquidation Price", + "interestApr": "Interest APR" + }, "title": "Sovryn", "announcement": { "message": "Sovryn has just lifted transaction limits (hooray!). This means you can now take any position size. Please be aware, however, since the limits were only just removed, liquidity in the system may be low initially." @@ -435,5 +439,28 @@ "emptyState": "History is empty.", "walletHistory": "Wallet must be connected.", "loading": "Loading..." + }, + "lendingPage": { + "tabs": { + "deposit": "Deposit", + "redeem": "Redeem" + }, + "amount": { + "deposit": "Amount to deposit", + "redeem": "Amount to redeem" + }, + "tradeButtons": { + "deposit": "Deposit {{asset}}", + "redeem": "Redeem {{asset}}" + } + }, + "activeBorrowTable": { + "headers": { + "borrowAmount": "Borrowed", + "collateralAmount": "Collateral", + "interestAPR": "Interest APR", + "endTimestamp": "Payback until" + }, + "repayButton": "Repay" } }