ManInDark/HabitTrove
1
0
Fork 0
mirror of https://github.com/ManInDark/HabitTrove.git synced 2026-03-09 20:09:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

Added PWA support (#40)

Browse Source
This commit is contained in:
Doh
2025-01-15 20:07:23 -05:00
committed by GitHub
parent 1bb968b7c1
commit 71b9d1b408
32 changed files with 1274 additions and 312 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
components/CoinBalance.tsx
View File

@@ -3,11 +3,12 @@ import { Coins } from 'lucide-react'
import { FormattedNumber } from '@/components/FormattedNumber'
import { useAtom } from 'jotai'
import { settingsAtom } from '@/lib/atoms'
import { useCoins } from '@/hooks/useCoins'
import dynamic from 'next/dynamic'
const TodayEarnedCoins = dynamic(() => import('./TodayEarnedCoins'), { ssr: false })
export default function CoinBalance({ coinBalance }: { coinBalance: number }) {
const [settings] = useAtom(settingsAtom)
const { coinsEarnedToday } = useCoins()
return (
<Card>
<CardHeader>
@@ -17,19 +18,14 @@ export default function CoinBalance({ coinBalance }: { coinBalance: number }) {
<div className="flex items-center justify-center">
<Coins className="h-12 w-12 text-yellow-400 mr-4" />
<div className="flex flex-col">
<span className="text-4xl font-bold">
<FormattedNumber amount={coinBalance} settings={settings} />
</span>
{coinsEarnedToday > 0 && (
<div className="flex items-center gap-1 mt-1">
<span className="text-md text-green-600 dark:text-green-400 font-medium">
+<FormattedNumber amount={coinsEarnedToday} settings={settings} />
</span>
<span className="text-md text-muted-foreground">
today
</span>
<div className="flex flex-col">
<span className="text-4xl font-bold">
<FormattedNumber amount={coinBalance} settings={settings} />
</span>
<div className="flex items-center gap-1">
<TodayEarnedCoins longFormat={true} />
</div>
)}
</div>
</div>
</div>
</CardContent>