Fix sale countdown timer to properly update when sale dates change
- Fix SaleCountdown useEffect dependency array to include saleEndDate - Remove console logs and debug output from page.tsx - Clean up date parsing logic and remove unnecessary error handling - Ensure countdown recalculates when sale end date changes - Fix TypeScript type comparison for sale_active boolean check
This commit is contained in:
@@ -177,15 +177,16 @@ export default function Home() {
|
||||
|
||||
<SaleCountdown
|
||||
hasActiveSale={filaments.some(f => f.sale_active === true)}
|
||||
maxSalePercentage={Math.max(...filaments.filter(f => f.sale_active).map(f => f.sale_percentage || 0), 0)}
|
||||
maxSalePercentage={Math.max(...filaments.filter(f => f.sale_active === true).map(f => f.sale_percentage || 0), 0)}
|
||||
saleEndDate={(() => {
|
||||
const activeSales = filaments.filter(f => f.sale_active && f.sale_end_date);
|
||||
const activeSales = filaments.filter(f => f.sale_active === true && f.sale_end_date);
|
||||
if (activeSales.length === 0) return null;
|
||||
return activeSales.reduce((latest, current) => {
|
||||
const latestSale = activeSales.reduce((latest, current) => {
|
||||
if (!latest.sale_end_date) return current;
|
||||
if (!current.sale_end_date) return latest;
|
||||
return new Date(current.sale_end_date) > new Date(latest.sale_end_date) ? current : latest;
|
||||
}).sale_end_date;
|
||||
return latestSale;
|
||||
})()}
|
||||
/>
|
||||
|
||||
|
||||
@@ -32,21 +32,7 @@ export function SaleCountdown({ hasActiveSale, maxSalePercentage = 5, saleEndDat
|
||||
|
||||
if (saleEndDate) {
|
||||
// Use the sale end date from admin
|
||||
try {
|
||||
const saleDate = new Date(saleEndDate);
|
||||
// Always set to end of day for proper countdown display
|
||||
targetDate = new Date(saleDate.getFullYear(), saleDate.getMonth(), saleDate.getDate(), 23, 59, 59, 999);
|
||||
} catch (error) {
|
||||
console.error('Error parsing sale end date:', error);
|
||||
// Fallback to next Sunday if date parsing fails
|
||||
const nextSunday = new Date();
|
||||
const daysUntilSunday = (7 - now.getDay()) % 7;
|
||||
const targetDay = daysUntilSunday === 0 ? 7 : daysUntilSunday;
|
||||
|
||||
nextSunday.setDate(now.getDate() + targetDay);
|
||||
nextSunday.setHours(23, 59, 59, 999);
|
||||
targetDate = nextSunday;
|
||||
}
|
||||
targetDate = new Date(saleEndDate);
|
||||
} else {
|
||||
// Fallback to next Sunday at 23:59:59
|
||||
const nextSunday = new Date();
|
||||
@@ -80,7 +66,7 @@ export function SaleCountdown({ hasActiveSale, maxSalePercentage = 5, saleEndDat
|
||||
setTimeLeft(calculateTimeLeft());
|
||||
|
||||
return () => clearInterval(timer);
|
||||
}, [mounted]);
|
||||
}, [mounted, saleEndDate]);
|
||||
|
||||
if (!mounted) {
|
||||
return <div className="h-24" />; // Placeholder to prevent hydration mismatch
|
||||
|
||||
@@ -24,6 +24,20 @@ export function SaleManager({ filaments, selectedFilaments, onSaleUpdate }: Sale
|
||||
|
||||
setLoading(true);
|
||||
try {
|
||||
// First, clear all existing sales
|
||||
try {
|
||||
await filamentService.updateBulkSale({
|
||||
filamentIds: undefined, // Apply to all
|
||||
salePercentage: 0,
|
||||
saleStartDate: undefined,
|
||||
saleEndDate: undefined,
|
||||
enableSale: false
|
||||
});
|
||||
} catch (error: any) {
|
||||
console.warn('Failed to clear existing sales:', error);
|
||||
}
|
||||
|
||||
// Then apply the new sale to selected filaments
|
||||
const filamentIds = Array.from(selectedFilaments);
|
||||
|
||||
try {
|
||||
|
||||
@@ -69,7 +69,8 @@ export const colorService = {
|
||||
|
||||
export const filamentService = {
|
||||
getAll: async () => {
|
||||
const response = await api.get('/filaments');
|
||||
const cacheBuster = Date.now();
|
||||
const response = await api.get(`/filaments?_t=${cacheBuster}`);
|
||||
return response.data;
|
||||
},
|
||||
|
||||
|
||||
Reference in New Issue
Block a user