import { ArrowUpLeftIcon, ChevronDownIcon } from '@heroicons/react/20/solid' import { useTranslation } from 'next-i18next' import { useCallback, useState } from 'react' import { useViewport } from '../../hooks/useViewport' import { formatNumericValue } from '../../utils/numbers' import { breakpoints } from '../../utils/theme' import Button, { IconButton } from '../shared/Button' import Tooltip from '@components/shared/Tooltip' import { Table, Td, Th, TrBody, TrHead } from '@components/shared/TableElements' import useMangoGroup from 'hooks/useMangoGroup' import BorrowRepayModal from '@components/modals/BorrowRepayModal' import BankAmountWithValue from '@components/shared/BankAmountWithValue' import useBanksWithBalances from 'hooks/useBanksWithBalances' import { getAvailableToBorrow } from './YourBorrowsTable' import { Disclosure, Transition } from '@headlessui/react' import TokenLogo from '@components/shared/TokenLogo' const AssetsBorrowsTable = () => { const { t } = useTranslation(['common', 'token']) const [showBorrowModal, setShowBorrowModal] = useState(false) const [selectedToken, setSelectedToken] = useState('') const { group } = useMangoGroup() const { width } = useViewport() const showTableView = width ? width > breakpoints.md : false const banks = useBanksWithBalances() const handleShowBorrowModal = useCallback((token: string) => { setSelectedToken(token) setShowBorrowModal(true) }, []) return ( <> {showTableView ? (
{t('token')} | {t('total-borrows')} |
|
{t('rate')}
|
{bank.name} |
|
|
{formatNumericValue(bank.getBorrowRateUi(), 2)}% |
|
---|
{bank.name}
{t('rate')}
{formatNumericValue(bank.getBorrowRateUi(), 2)}%
{t('available')}