51 lines
1.2 KiB
TypeScript
51 lines
1.2 KiB
TypeScript
import clsx from 'clsx'
|
|
import { ENV_CONFIG } from 'common/envs/constants'
|
|
|
|
export function ProfitBadge(props: {
|
|
profitPercent: number
|
|
round?: boolean
|
|
className?: string
|
|
}) {
|
|
const { profitPercent, round, className } = props
|
|
if (!profitPercent) return null
|
|
const colors =
|
|
profitPercent > 0
|
|
? 'bg-green-100 text-green-800'
|
|
: 'bg-red-100 text-red-800'
|
|
|
|
return (
|
|
<span
|
|
className={clsx(
|
|
'ml-1 inline-flex items-center rounded-full px-3 py-0.5 text-sm font-medium',
|
|
colors,
|
|
className
|
|
)}
|
|
>
|
|
{(profitPercent > 0 ? '+' : '') +
|
|
profitPercent.toFixed(round ? 0 : 1) +
|
|
'%'}
|
|
</span>
|
|
)
|
|
}
|
|
|
|
export function ProfitBadgeMana(props: { amount: number; className?: string }) {
|
|
const { amount, className } = props
|
|
const colors =
|
|
amount > 0 ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
|
|
|
|
const formatted =
|
|
ENV_CONFIG.moneyMoniker + (amount > 0 ? '+' : '') + amount.toFixed(0)
|
|
|
|
return (
|
|
<span
|
|
className={clsx(
|
|
'ml-1 inline-flex items-center rounded-full px-3 py-0.5 text-sm font-medium',
|
|
colors,
|
|
className
|
|
)}
|
|
>
|
|
{formatted}
|
|
</span>
|
|
)
|
|
}
|