60 lines
2.0 KiB
TypeScript
60 lines
2.0 KiB
TypeScript
import { Badge } from "@/registry/bases/base/ui/badge"
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardFooter,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from "@/registry/bases/base/ui/card"
|
|
import { Item, ItemContent } from "@/registry/bases/base/ui/item"
|
|
import { Separator } from "@/registry/bases/base/ui/separator"
|
|
|
|
export function ClaimableBalance() {
|
|
return (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardDescription>Claimable Balance</CardDescription>
|
|
<CardTitle className="text-5xl tabular-nums">$0.00</CardTitle>
|
|
<Badge variant="outline">
|
|
<span className="size-2 rounded-full bg-yellow-500" />
|
|
Pending Setup
|
|
</Badge>
|
|
</CardHeader>
|
|
<CardContent className="flex flex-1 flex-col justify-end">
|
|
<Item variant="muted" className="flex-col items-stretch">
|
|
<ItemContent className="gap-3">
|
|
<div className="flex items-center justify-between">
|
|
<span className="text-sm text-muted-foreground">
|
|
Net Royalties
|
|
</span>
|
|
<span className="text-sm font-medium tabular-nums">$0.00</span>
|
|
</div>
|
|
<div className="flex items-center justify-between">
|
|
<span className="text-sm text-muted-foreground">
|
|
Processing Fee
|
|
</span>
|
|
<span className="text-sm font-medium tabular-nums">-$0.00</span>
|
|
</div>
|
|
<Separator />
|
|
<div className="flex items-center justify-between">
|
|
<span className="text-sm text-muted-foreground">
|
|
Total Ready to Claim
|
|
</span>
|
|
<span className="text-sm font-semibold tabular-nums">
|
|
$0.00 USD
|
|
</span>
|
|
</div>
|
|
</ItemContent>
|
|
</Item>
|
|
</CardContent>
|
|
<CardFooter>
|
|
<CardDescription>
|
|
Once your bank is connected, balances over $10.00 are automatically
|
|
eligible for monthly distribution on the 15th of each month.
|
|
</CardDescription>
|
|
</CardFooter>
|
|
</Card>
|
|
)
|
|
}
|