quaik8/sbd2-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add NumberFlowSize component and integrate it into DashboardPage for improved size display

Browse Source
This commit is contained in:
JSC
2025-08-12 22:15:04 +02:00
parent ccd5973db9
commit 7ebeac1280
3 changed files with 25 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/pages/DashboardPage.tsx
View File

@@ -4,10 +4,9 @@ import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
import { Button } from '@/components/ui/button'
import { Volume2, Play, Clock, HardDrive, Music, Trophy, Loader2, RefreshCw } from 'lucide-react'
import { formatDuration } from '@/lib/format'
import NumberFlow from '@number-flow/react'
import { formatSizeObject } from '@/utils/format-size'
import { NumberFlowDuration } from '@/components/ui/number-flow-duration'
import { NumberFlowSize } from '@/components/ui/number-flow-size'
interface SoundboardStatistics {
sound_count: number
@@ -315,14 +314,7 @@ export function DashboardPage() {
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">
{(() => {
const sizeObj = formatSizeObject(soundboardStatistics.total_size, true)
return (
<>
<NumberFlow value={sizeObj.value} /> {sizeObj.unit}
</>
)
})()}
<NumberFlowSize size={soundboardStatistics.total_size} binary={true} />
</div>
<p className="text-xs text-muted-foreground">
Original + normalized files
@@ -384,14 +376,7 @@ export function DashboardPage() {
</CardHeader>
<CardContent>
<div className="text-2xl font-bold">
{(() => {
const sizeObj = formatSizeObject(trackStatistics.total_size, true)
return (
<>
<NumberFlow value={sizeObj.value} /> {sizeObj.unit}
</>
)
})()}
<NumberFlowSize size={trackStatistics.total_size} binary={true} />
</div>
<p className="text-xs text-muted-foreground">
Original + normalized files