warlock/cbd420
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sync

Browse Source
This commit is contained in:
root
2025-12-20 22:05:21 +01:00
parent e1a0966dee
commit f2c3b04a88
10 changed files with 1134 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
app/components/Drop.tsx
View File

@@ -13,6 +13,8 @@ interface DropData {
ppu: number
image_url: string | null
created_at: string
start_time: string | null
is_upcoming?: boolean
}
interface User {
@@ -167,10 +169,34 @@ export default function Drop() {
const calculatePrice = () => {
if (!drop) return 0
// ppu is stored as integer where 1000 = $1.00, so divide by 1000 to get actual price
const pricePerUnit = drop.ppu / 1000
if (drop.unit === 'kg') {
return (selectedSize / 1000) * drop.ppu
return (selectedSize / 1000) * pricePerUnit
}
return selectedSize * pricePerUnit
}
const getTimeUntilStart = () => {
if (!drop || !drop.is_upcoming || !drop.start_time) return null
const startTime = new Date(drop.start_time)
const now = new Date()
const diffMs = startTime.getTime() - now.getTime()
if (diffMs <= 0) return null
const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24))
const diffHours = Math.floor((diffMs % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60))
const diffMinutes = Math.floor((diffMs % (1000 * 60 * 60)) / (1000 * 60))
if (diffDays > 0) {
return `${diffDays} day${diffDays > 1 ? 's' : ''}${diffHours > 0 ? ` ${diffHours} hour${diffHours > 1 ? 's' : ''}` : ''}`
} else if (diffHours > 0) {
return `${diffHours} hour${diffHours > 1 ? 's' : ''}${diffMinutes > 0 ? ` ${diffMinutes} minute${diffMinutes > 1 ? 's' : ''}` : ''}`
} else {
return `${diffMinutes} minute${diffMinutes > 1 ? 's' : ''}`
}
return selectedSize * drop.ppu
}
if (loading) {
@@ -201,6 +227,8 @@ export default function Drop() {
const progressPercentage = getProgressPercentage(drop.fill, drop.size)
const availableSizes = getAvailableSizes()
const timeUntilStart = getTimeUntilStart()
const isUpcoming = drop.is_upcoming && timeUntilStart
// Calculate remaining in the drop's unit
const remaining = drop.size - drop.fill
@@ -238,19 +266,29 @@ export default function Drop() {
{formatSize(drop.size, drop.unit)} Batch
</div>
<div className="price">
{drop.ppu.toFixed(2)} CHF / {drop.unit} · incl. 2.5% VAT
{(drop.ppu / 1000).toFixed(2)} CHF / {drop.unit} · incl. 2.5% VAT
</div>
<div className="progress">
<span style={{ width: `${progressPercentage}%` }}></span>
</div>
<div className="meta">
{drop.unit === 'kg' ? drop.fill.toFixed(2) : Math.round(drop.fill)}
{drop.unit} of {drop.size}
{drop.unit} reserved
</div>
{isUpcoming ? (
<div style={{ marginTop: '30px', padding: '20px', background: 'var(--bg-soft)', borderRadius: '12px', textAlign: 'center' }}>
<p style={{ margin: 0, color: 'var(--muted)', fontSize: '16px' }}>
Drop starts in <strong>{timeUntilStart}</strong>
</p>
</div>
) : (
<>
<div className="progress">
<span style={{ width: `${progressPercentage}%` }}></span>
</div>
<div className="meta">
{drop.unit === 'kg' ? drop.fill.toFixed(2) : Math.round(drop.fill)}
{drop.unit} of {drop.size}
{drop.unit} reserved
</div>
</>
)}
{hasRemaining && availableSizes.length > 0 && (
{!isUpcoming && hasRemaining && availableSizes.length > 0 && (
<>
<div className="options">
{availableSizes.map((size) => (
@@ -325,7 +363,7 @@ export default function Drop() {
<strong>Quantity:</strong> {selectedSize}g
</p>
<p style={{ marginBottom: '12px', color: 'var(--muted)' }}>
<strong>Price per {drop.unit}:</strong> {drop.ppu.toFixed(2)} CHF
<strong>Price per {drop.unit}:</strong> {(drop.ppu / 1000).toFixed(2)} CHF
</p>
<div
style={{