2024-03-30 19:27:18 +01:00
|
|
|
'use client'
|
|
|
|
|
2024-04-06 23:53:29 +02:00
|
|
|
import { Badge } from '@/components'
|
2024-07-26 14:16:59 +02:00
|
|
|
import { ratioAgixToAsi, ratioFetToAsi, ratioOceanToAsi } from '@/constants'
|
|
|
|
import { Price, usePrices } from '@/features/prices'
|
2024-04-14 12:52:37 +02:00
|
|
|
import styles from './MarketData.module.css'
|
2024-03-30 19:27:18 +01:00
|
|
|
|
2024-04-01 14:42:08 +02:00
|
|
|
export function MarketData() {
|
2024-04-09 14:46:15 +02:00
|
|
|
const { prices } = usePrices()
|
2024-03-30 19:27:18 +01:00
|
|
|
|
|
|
|
return (
|
2024-04-01 14:42:08 +02:00
|
|
|
<ul className={styles.marketData}>
|
2024-03-30 19:27:18 +01:00
|
|
|
<li>
|
2024-03-31 15:24:07 +02:00
|
|
|
<p>1 ASI</p>
|
2024-04-14 12:52:37 +02:00
|
|
|
<Price price={prices.asi} />
|
2024-03-30 19:27:18 +01:00
|
|
|
</li>
|
2024-03-30 23:10:36 +01:00
|
|
|
<li>
|
2024-03-31 15:24:07 +02:00
|
|
|
<p>
|
|
|
|
1 Fet = {ratioFetToAsi} ASI
|
2024-04-06 23:53:29 +02:00
|
|
|
<Badge>fixed</Badge>
|
2024-03-31 15:24:07 +02:00
|
|
|
</p>
|
2024-04-14 12:52:37 +02:00
|
|
|
<Price price={prices.fet} />
|
2024-03-30 23:10:36 +01:00
|
|
|
</li>
|
2024-03-30 19:27:18 +01:00
|
|
|
<li>
|
2024-03-31 15:24:07 +02:00
|
|
|
<p>
|
2024-04-02 11:57:15 +02:00
|
|
|
1 OCEAN ={' '}
|
|
|
|
<span title={`${ratioOceanToAsi}`}>{ratioOceanToAsi.toFixed(6)}</span>{' '}
|
|
|
|
ASI
|
2024-04-06 23:53:29 +02:00
|
|
|
<Badge>fixed</Badge>
|
2024-03-31 15:24:07 +02:00
|
|
|
</p>
|
2024-04-14 12:52:37 +02:00
|
|
|
<Price price={prices.ocean} />
|
2024-03-30 19:27:18 +01:00
|
|
|
</li>
|
|
|
|
<li>
|
2024-03-31 15:24:07 +02:00
|
|
|
<p>
|
2024-04-02 11:57:15 +02:00
|
|
|
1 AGIX ={' '}
|
|
|
|
<span title={`${ratioAgixToAsi}`}>{ratioAgixToAsi.toFixed(5)}</span>{' '}
|
|
|
|
ASI
|
2024-04-06 23:53:29 +02:00
|
|
|
<Badge>fixed</Badge>
|
2024-03-31 15:24:07 +02:00
|
|
|
</p>
|
2024-04-14 12:52:37 +02:00
|
|
|
<Price price={prices.agix} />
|
2024-03-30 19:27:18 +01:00
|
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
)
|
|
|
|
}
|