5007acb515
* osmosis initial setup and nft contract queries/mutations * display errors on ui * fix: create credit account queryMsg and contract * client initialization. loading indicator when pending io * added tx feedback on toast * remove unused wallet store code * fetch credit accounts moved to external hook * navigation copy * file name typo * remove console logs and unused imports * fix: credit accounts query msg * credit manager store. create credit account hook created * delete credit account hook. fees declaration moved to utils * update selected account when a new one is created * type inference for mutation hooks * loading indicator for async actions. onSuccess toast * credit accounts popover * minor improvements credit account slice * credit manager module state and respective markup * fix: credit account list threshold * credit manager component. currency formatter function update * update contract addresses * borrow screen initial setup * error handling mutation queries * update credit account list when address changes * update credit accounts query key to include address * update selected account when nothing is selected * credit manager wip. deposit and listing positions on credit account * FundAccount component moved to different file * removed unused code * lending assets switch * minor refactor injective balance hook to be more generic * style: font size minor adjustments * borrow action initial. display liabilities and borrow positions on credit manager * positions amount formatting * preserve selected account on local storage * prettier custom settings and respective files formatting * credit manager container moved to external file * removed threshold variable. nav elements moved to array declaration * Navigation component naming and minor cleanup * react query keys enum * query keys improvements * initial generated smart contract api type definitions
72 lines
2.3 KiB
TypeScript
72 lines
2.3 KiB
TypeScript
import React from 'react'
|
|
import Image from 'next/image'
|
|
|
|
import Container from 'components/Container'
|
|
|
|
const AssetRow = () => {
|
|
return (
|
|
<div className="flex bg-[#D8DAEA] text-[#585A74] rounded-md p-2">
|
|
<div className="flex flex-1">
|
|
<Image src="/tokens/osmo.svg" alt="token" width={24} height={24} />
|
|
<div className="pl-2">
|
|
<div>DENOM</div>
|
|
<div className="text-xs">Name</div>
|
|
</div>
|
|
</div>
|
|
<div className="flex-1">10.00%</div>
|
|
<div className="flex-1">
|
|
<div>Amount</div>
|
|
<div>Value</div>
|
|
</div>
|
|
<div className="flex-1">
|
|
<div>Amount</div>
|
|
<div>Value</div>
|
|
</div>
|
|
<div className="w-[50px]">ACTION</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
const Borrow = () => {
|
|
return (
|
|
<div className="flex gap-4">
|
|
<Container className="flex-1">
|
|
<div className="mb-5">
|
|
<h3 className="font-medium uppercase text-center mb-1">Borrowed</h3>
|
|
<div className="flex bg-[#D8DAEA] text-[#585A74]/50 text-sm rounded-md p-2 mb-2">
|
|
<div className="flex-1">Asset</div>
|
|
<div className="flex-1">Borrow Rate</div>
|
|
<div className="flex-1">Borrowed</div>
|
|
<div className="flex-1">Liquidity Available</div>
|
|
<div className="w-[50px]">Manage</div>
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
{Array.from(Array(3).keys()).map(() => (
|
|
// eslint-disable-next-line react/jsx-key
|
|
<AssetRow />
|
|
))}
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h3 className="font-medium uppercase text-center mb-1">Not Borrowed Yet</h3>
|
|
<div className="flex bg-[#D8DAEA] text-[#585A74]/50 text-sm rounded-md p-2 mb-2">
|
|
<div className="flex-1">Asset</div>
|
|
<div className="flex-1">Borrow Rate</div>
|
|
<div className="flex-1">Borrowed</div>
|
|
<div className="flex-1">Liquidity Available</div>
|
|
<div className="w-[50px]">Manage</div>
|
|
</div>
|
|
<div className="flex flex-col gap-2">
|
|
{Array.from(Array(5).keys()).map(() => (
|
|
// eslint-disable-next-line react/jsx-key
|
|
<AssetRow />
|
|
))}
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Borrow
|