final
This commit is contained in:
@@ -9,10 +9,15 @@ import { useI18n } from '@/lib/i18n'
|
||||
interface DropData {
|
||||
id: number
|
||||
item: string
|
||||
description?: string | null
|
||||
size: number
|
||||
fill: number
|
||||
unit: string
|
||||
ppu: number
|
||||
price_chf?: number | null
|
||||
price_eur?: number | null
|
||||
wholesale_price_chf?: number | null
|
||||
wholesale_price_eur?: number | null
|
||||
image_url: string | null
|
||||
images?: string[] // Array of image URLs (up to 4)
|
||||
created_at: string
|
||||
@@ -30,7 +35,7 @@ interface User {
|
||||
}
|
||||
|
||||
export default function Drop() {
|
||||
const { t } = useI18n()
|
||||
const { t, language } = useI18n()
|
||||
const [drop, setDrop] = useState<DropData | null>(null)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [selectedSize, setSelectedSize] = useState(50)
|
||||
@@ -57,9 +62,11 @@ export default function Drop() {
|
||||
const [selectedImageIndex, setSelectedImageIndex] = useState(0)
|
||||
const [shippingFee, setShippingFee] = useState<number | null>(null)
|
||||
const [loadingShippingFee, setLoadingShippingFee] = useState(false)
|
||||
const [currency, setCurrency] = useState<'CHF' | 'EUR'>('EUR') // Default to EUR
|
||||
// Currency is based on language: English (en) → EUR, German (de) → CHF
|
||||
const currency: 'CHF' | 'EUR' = language === 'de' ? 'CHF' : 'EUR'
|
||||
const [referralPoints, setReferralPoints] = useState<number>(0)
|
||||
const [pointsToChf, setPointsToChf] = useState<number>(100)
|
||||
const [pointsToEur, setPointsToEur] = useState<number>(100)
|
||||
const [pointsToChf, setPointsToChf] = useState<number>(100) // Keep for backward compatibility
|
||||
const [pointsToUse, setPointsToUse] = useState<number>(0)
|
||||
const [loadingPoints, setLoadingPoints] = useState(false)
|
||||
|
||||
@@ -117,7 +124,14 @@ export default function Drop() {
|
||||
if (response.ok) {
|
||||
const data = await response.json()
|
||||
setReferralPoints(data.referral_points || 0)
|
||||
setPointsToChf(data.points_to_chf || 100)
|
||||
// Use EUR-based setting (preferred), fallback to CHF converted to EUR
|
||||
if (data.points_to_eur) {
|
||||
setPointsToEur(data.points_to_eur)
|
||||
} else {
|
||||
// Convert CHF to EUR (1 CHF ≈ 1.0309 EUR)
|
||||
setPointsToEur((data.points_to_chf || 100) / 1.030927835)
|
||||
}
|
||||
setPointsToChf(data.points_to_chf || 100) // Keep for backward compatibility
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching referral points:', error)
|
||||
@@ -241,10 +255,9 @@ export default function Drop() {
|
||||
if (!drop) return 0
|
||||
// Minimum price is 5 in user's currency
|
||||
// Calculate minimum grams needed for 5 (EUR or CHF)
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
const minPriceEur = currency === 'CHF' ? 5 / 0.97 : 5 // Convert min CHF to EUR equivalent
|
||||
// Use the higher price (standard) to ensure minimum is met
|
||||
return Math.ceil(minPriceEur / pricePerGramEur)
|
||||
const pricePerGram = getPricePerGram()
|
||||
const minPrice = 5 // 5 in user's currency
|
||||
return Math.ceil(minPrice / pricePerGram)
|
||||
}
|
||||
|
||||
const handleCustomQuantityChange = (value: string) => {
|
||||
@@ -367,30 +380,46 @@ export default function Drop() {
|
||||
if (response.ok) {
|
||||
const data = await response.json()
|
||||
setShippingFee(data.shipping_fee || 40)
|
||||
setCurrency(data.currency || 'EUR')
|
||||
// Currency is now based on language, not geolocation
|
||||
} else {
|
||||
// Default to 40 EUR if fetch fails
|
||||
setShippingFee(40)
|
||||
setCurrency('EUR')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching shipping fee:', error)
|
||||
// Default to 40 EUR on error
|
||||
setShippingFee(40)
|
||||
setCurrency('EUR')
|
||||
} finally {
|
||||
setLoadingShippingFee(false)
|
||||
}
|
||||
}
|
||||
|
||||
// Convert EUR price to user's currency (CHF for Swiss, EUR for others)
|
||||
// Database stores prices in EUR, so we need to convert if user is Swiss
|
||||
const convertPrice = (priceInEur: number): number => {
|
||||
if (currency === 'CHF') {
|
||||
// Convert EUR to CHF (1 EUR ≈ 0.97 CHF)
|
||||
return priceInEur * 0.97
|
||||
// Get price per gram based on user's currency and wholesale status
|
||||
const getPricePerGramFromDrop = (): number => {
|
||||
if (!drop) return 0
|
||||
|
||||
// Use new price fields if available, otherwise fall back to ppu calculation
|
||||
if (isWholesaleUnlocked) {
|
||||
// Wholesale price
|
||||
if (currency === 'CHF' && drop.wholesale_price_chf != null) {
|
||||
return Number(drop.wholesale_price_chf) || 0
|
||||
} else if (currency === 'EUR' && drop.wholesale_price_eur != null) {
|
||||
return Number(drop.wholesale_price_eur) || 0
|
||||
}
|
||||
// Fallback to ppu calculation if new fields not set
|
||||
const pricePerGramEur = Number(drop.ppu) / 1000
|
||||
return currency === 'CHF' ? pricePerGramEur * 0.97 : pricePerGramEur
|
||||
} else {
|
||||
// Regular price
|
||||
if (currency === 'CHF' && drop.price_chf != null) {
|
||||
return Number(drop.price_chf) || 0
|
||||
} else if (currency === 'EUR' && drop.price_eur != null) {
|
||||
return Number(drop.price_eur) || 0
|
||||
}
|
||||
// Fallback to ppu calculation if new fields not set
|
||||
const pricePerGramEur = Number(drop.ppu) / 1000
|
||||
return currency === 'CHF' ? pricePerGramEur * 0.97 : pricePerGramEur
|
||||
}
|
||||
return priceInEur
|
||||
}
|
||||
|
||||
const handleJoinDrop = () => {
|
||||
@@ -470,6 +499,7 @@ export default function Drop() {
|
||||
pay_currency: selectedCurrency, // Selected payment currency
|
||||
buyer_data_id: buyerData.buyer_data_id, // Buyer delivery data ID
|
||||
points_to_use: pointsToUse, // Points to use for discount
|
||||
currency: currency, // Display currency based on language (EUR for en, CHF for de)
|
||||
}),
|
||||
})
|
||||
|
||||
@@ -526,78 +556,107 @@ export default function Drop() {
|
||||
|
||||
const handlePointsToUseChange = (value: string) => {
|
||||
const numValue = parseFloat(value) || 0
|
||||
const maxPoints = Math.min(referralPoints, calculatePriceBeforeDiscount() * pointsToChf)
|
||||
// Calculate max points based on EUR price (universal base)
|
||||
const priceEur = currency === 'CHF' ? calculatePriceBeforeDiscount() / 0.97 : calculatePriceBeforeDiscount()
|
||||
const maxPoints = Math.min(referralPoints, priceEur * pointsToEur)
|
||||
setPointsToUse(Math.max(0, Math.min(numValue, maxPoints)))
|
||||
}
|
||||
|
||||
const calculatePriceBeforeDiscount = () => {
|
||||
if (!drop) return 0
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
const priceToUseEur = isWholesaleUnlocked ? pricePerGramEur * 0.76 : pricePerGramEur
|
||||
const priceEur = selectedSize * priceToUseEur
|
||||
return convertPrice(priceEur)
|
||||
const pricePerGram = getPricePerGramFromDrop()
|
||||
return selectedSize * pricePerGram
|
||||
}
|
||||
|
||||
const getMaxDiscountFromPoints = () => {
|
||||
if (pointsToChf === 0) return 0
|
||||
return referralPoints / pointsToChf
|
||||
if (pointsToEur === 0) return 0
|
||||
// Calculate discount in EUR (universal base)
|
||||
const discountEur = referralPoints / pointsToEur
|
||||
// Convert to user's currency for display
|
||||
if (currency === 'CHF') {
|
||||
return discountEur * 0.97 // Convert EUR to CHF
|
||||
} else {
|
||||
return discountEur // Already in EUR
|
||||
}
|
||||
}
|
||||
|
||||
const calculateDiscountFromPoints = () => {
|
||||
if (pointsToUse === 0 || pointsToChf === 0) return 0
|
||||
// Calculate discount in CHF, then convert to user's currency
|
||||
const discountChf = pointsToUse / pointsToChf
|
||||
// Convert CHF discount to user's currency
|
||||
if (pointsToUse === 0 || pointsToEur === 0) return 0
|
||||
// Calculate discount in EUR first (universal base)
|
||||
const discountEur = pointsToUse / pointsToEur
|
||||
// Convert to user's currency
|
||||
if (currency === 'CHF') {
|
||||
return discountChf
|
||||
return discountEur * 0.97 // Convert EUR to CHF
|
||||
} else {
|
||||
// Convert CHF to EUR (1 CHF ≈ 1.03 EUR)
|
||||
return discountChf * 1.03
|
||||
return discountEur // Already in EUR
|
||||
}
|
||||
}
|
||||
|
||||
const calculatePrice = () => {
|
||||
if (!drop) return 0
|
||||
// ppu is stored as integer where 1000 = 1.00 EUR, so divide by 1000 to get actual price in EUR
|
||||
// Assuming ppu is per gram
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
const priceToUseEur = isWholesaleUnlocked ? pricePerGramEur * 0.76 : pricePerGramEur
|
||||
const priceEur = selectedSize * priceToUseEur
|
||||
// Convert to user's currency
|
||||
const price = convertPrice(priceEur)
|
||||
const pricePerGram = getPricePerGramFromDrop()
|
||||
const price = selectedSize * pricePerGram
|
||||
// Apply points discount
|
||||
const discount = calculateDiscountFromPoints()
|
||||
return Math.max(0, price - discount)
|
||||
}
|
||||
|
||||
const calculateStandardPrice = () => {
|
||||
const calculateStandardPrice = (): number => {
|
||||
if (!drop) return 0
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
const priceEur = selectedSize * pricePerGramEur
|
||||
// Convert to user's currency
|
||||
return convertPrice(priceEur)
|
||||
// Get regular price (not wholesale)
|
||||
let pricePerGram: number
|
||||
if (currency === 'CHF' && drop.price_chf != null) {
|
||||
pricePerGram = Number(drop.price_chf) || 0
|
||||
} else if (currency === 'EUR' && drop.price_eur != null) {
|
||||
pricePerGram = Number(drop.price_eur) || 0
|
||||
} else {
|
||||
// Fallback to ppu calculation
|
||||
const pricePerGramEur = Number(drop.ppu) / 1000
|
||||
pricePerGram = pricePerGramEur * (currency === 'CHF' ? 0.97 : 1)
|
||||
}
|
||||
return selectedSize * pricePerGram
|
||||
}
|
||||
|
||||
const calculateWholesalePrice = () => {
|
||||
const calculateWholesalePrice = (): number => {
|
||||
if (!drop) return 0
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
const priceEur = selectedSize * pricePerGramEur * 0.76
|
||||
// Convert to user's currency
|
||||
return convertPrice(priceEur)
|
||||
// Get wholesale price
|
||||
let pricePerGram: number
|
||||
if (currency === 'CHF' && drop.wholesale_price_chf != null) {
|
||||
pricePerGram = Number(drop.wholesale_price_chf) || 0
|
||||
} else if (currency === 'EUR' && drop.wholesale_price_eur != null) {
|
||||
pricePerGram = Number(drop.wholesale_price_eur) || 0
|
||||
} else {
|
||||
// Fallback to ppu calculation
|
||||
const pricePerGramEur = Number(drop.ppu) / 1000
|
||||
pricePerGram = (pricePerGramEur * 0.76) * (currency === 'CHF' ? 0.97 : 1)
|
||||
}
|
||||
return selectedSize * pricePerGram
|
||||
}
|
||||
|
||||
// Get price per gram in user's currency
|
||||
const getPricePerGram = () => {
|
||||
// Get price per gram in user's currency (regular price)
|
||||
const getPricePerGram = (): number => {
|
||||
if (!drop) return 0
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
return convertPrice(pricePerGramEur)
|
||||
if (currency === 'CHF' && drop.price_chf != null) {
|
||||
return Number(drop.price_chf) || 0
|
||||
} else if (currency === 'EUR' && drop.price_eur != null) {
|
||||
return Number(drop.price_eur) || 0
|
||||
}
|
||||
// Fallback to ppu calculation
|
||||
const pricePerGramEur = Number(drop.ppu) / 1000
|
||||
return currency === 'CHF' ? pricePerGramEur * 0.97 : pricePerGramEur
|
||||
}
|
||||
|
||||
// Get wholesale price per gram in user's currency
|
||||
const getWholesalePricePerGram = () => {
|
||||
const getWholesalePricePerGram = (): number => {
|
||||
if (!drop) return 0
|
||||
const pricePerGramEur = drop.ppu / 1000
|
||||
return convertPrice(pricePerGramEur * 0.76)
|
||||
if (currency === 'CHF' && drop.wholesale_price_chf != null) {
|
||||
return Number(drop.wholesale_price_chf) || 0
|
||||
} else if (currency === 'EUR' && drop.wholesale_price_eur != null) {
|
||||
return Number(drop.wholesale_price_eur) || 0
|
||||
}
|
||||
// Fallback to ppu calculation
|
||||
const pricePerGramEur = Number(drop.ppu) / 1000
|
||||
return (pricePerGramEur * 0.76) * (currency === 'CHF' ? 0.97 : 1)
|
||||
}
|
||||
|
||||
const getTimeUntilStart = () => {
|
||||
@@ -763,6 +822,17 @@ export default function Drop() {
|
||||
)}
|
||||
<div>
|
||||
<h2>{drop.item}</h2>
|
||||
{drop.description && (
|
||||
<div style={{
|
||||
marginTop: '12px',
|
||||
marginBottom: '16px',
|
||||
color: 'var(--muted)',
|
||||
lineHeight: '1.6',
|
||||
fontSize: '15px'
|
||||
}}>
|
||||
{drop.description}
|
||||
</div>
|
||||
)}
|
||||
<div className="meta">
|
||||
{formatSize(drop.size, drop.unit)} {t('drop.batch')}
|
||||
</div>
|
||||
@@ -1112,7 +1182,16 @@ export default function Drop() {
|
||||
{user && referralPoints > 0 && (
|
||||
<div style={{ marginTop: '24px', marginBottom: '16px' }}>
|
||||
<label style={{ display: 'block', marginBottom: '8px', fontSize: '14px', color: 'var(--muted)' }}>
|
||||
<strong>⭐ {t('drop.useReferralPoints')}</strong>
|
||||
<strong style={{ display: 'flex', alignItems: 'center', gap: '6px' }}>
|
||||
<Image
|
||||
src="/icon_ref_points.png"
|
||||
alt="Referral Points"
|
||||
width={18}
|
||||
height={18}
|
||||
style={{ display: 'inline-block', verticalAlign: 'middle' }}
|
||||
/>
|
||||
{t('drop.useReferralPoints')}
|
||||
</strong>
|
||||
<span style={{ marginLeft: '8px', fontSize: '12px', color: 'var(--muted)' }}>
|
||||
({referralPoints.toFixed(0)} {t('drop.available')})
|
||||
</span>
|
||||
@@ -1139,7 +1218,8 @@ export default function Drop() {
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
const maxPoints = Math.min(referralPoints, calculatePriceBeforeDiscount() * pointsToChf)
|
||||
const priceEur = currency === 'CHF' ? calculatePriceBeforeDiscount() / 0.97 : calculatePriceBeforeDiscount()
|
||||
const maxPoints = Math.min(referralPoints, priceEur * pointsToEur)
|
||||
setPointsToUse(maxPoints)
|
||||
}}
|
||||
style={{
|
||||
@@ -1158,7 +1238,7 @@ export default function Drop() {
|
||||
</div>
|
||||
{pointsToUse > 0 && (
|
||||
<div style={{ marginTop: '8px', fontSize: '12px', color: '#0a7931' }}>
|
||||
{t('drop.pointsDiscount')}: {(pointsToUse / pointsToChf).toFixed(2)} {currency === 'CHF' ? 'CHF' : 'EUR'}
|
||||
{t('drop.pointsDiscount')}: {calculateDiscountFromPoints().toFixed(2)} {currency === 'CHF' ? 'CHF' : 'EUR'}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -1181,8 +1261,15 @@ export default function Drop() {
|
||||
</div>
|
||||
{pointsToUse > 0 && (
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '8px' }}>
|
||||
<span style={{ color: '#0a7931', fontSize: '14px' }}>
|
||||
⭐ {t('drop.pointsDiscount')}:
|
||||
<span style={{ color: '#0a7931', fontSize: '14px', display: 'flex', alignItems: 'center', gap: '6px' }}>
|
||||
<Image
|
||||
src="/icon_ref_points.png"
|
||||
alt="Referral Points"
|
||||
width={16}
|
||||
height={16}
|
||||
style={{ display: 'inline-block', verticalAlign: 'middle' }}
|
||||
/>
|
||||
{t('drop.pointsDiscount')}:
|
||||
</span>
|
||||
<span style={{ fontWeight: 500, fontSize: '14px', color: '#0a7931' }}>
|
||||
-{calculateDiscountFromPoints().toFixed(2)} {currency}
|
||||
|
||||
Reference in New Issue
Block a user