Remove custom date range
This commit is contained in:
@@ -19,28 +19,13 @@ import {
|
||||
SelectValue,
|
||||
} from "@/components/ui/select";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuCheckboxItem,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuLabel,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuTrigger,
|
||||
} from "@/components/ui/dropdown-menu";
|
||||
import {
|
||||
TIME_RANGES,
|
||||
formatDateForInput,
|
||||
parseDateFromInput,
|
||||
} from "@/lib/constants";
|
||||
import { TIME_RANGES } from "@/lib/constants";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { Skeleton } from "@/components/ui/skeleton";
|
||||
|
||||
const ProductGrid = ({
|
||||
timeRange = "today",
|
||||
startDate,
|
||||
endDate,
|
||||
onTimeRangeChange,
|
||||
title = "Top Products",
|
||||
description
|
||||
@@ -49,10 +34,6 @@ const ProductGrid = ({
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
const [selectedTimeRange, setSelectedTimeRange] = useState(timeRange);
|
||||
const [customDateRange, setCustomDateRange] = useState({
|
||||
startDate: formatDateForInput(startDate) || "",
|
||||
endDate: formatDateForInput(endDate) || "",
|
||||
});
|
||||
const [sorting, setSorting] = useState({
|
||||
column: "totalQuantity",
|
||||
direction: "desc",
|
||||
@@ -61,27 +42,15 @@ const ProductGrid = ({
|
||||
|
||||
useEffect(() => {
|
||||
fetchProducts();
|
||||
}, [selectedTimeRange, customDateRange.startDate, customDateRange.endDate]);
|
||||
}, [selectedTimeRange]);
|
||||
|
||||
const fetchProducts = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
|
||||
const params =
|
||||
selectedTimeRange === "custom"
|
||||
? {
|
||||
startDate: parseDateFromInput(
|
||||
customDateRange.startDate
|
||||
)?.toISOString(),
|
||||
endDate: parseDateFromInput(
|
||||
customDateRange.endDate
|
||||
)?.toISOString(),
|
||||
}
|
||||
: { timeRange: selectedTimeRange };
|
||||
|
||||
const response = await axios.get("/api/klaviyo/events/products", {
|
||||
params,
|
||||
params: { timeRange: selectedTimeRange },
|
||||
});
|
||||
setProducts(response.data.stats.products.list || []);
|
||||
} catch (error) {
|
||||
@@ -224,48 +193,8 @@ const ProductGrid = ({
|
||||
{range.label}
|
||||
</SelectItem>
|
||||
))}
|
||||
<SelectItem value="custom">Custom Range</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
|
||||
{selectedTimeRange === "custom" && (
|
||||
<div className="flex gap-2">
|
||||
<div>
|
||||
<Label htmlFor="startDate" className="sr-only">
|
||||
Start Date
|
||||
</Label>
|
||||
<Input
|
||||
id="startDate"
|
||||
type="datetime-local"
|
||||
value={customDateRange.startDate}
|
||||
onChange={(e) =>
|
||||
setCustomDateRange((prev) => ({
|
||||
...prev,
|
||||
startDate: e.target.value,
|
||||
}))
|
||||
}
|
||||
className="h-9"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<Label htmlFor="endDate" className="sr-only">
|
||||
End Date
|
||||
</Label>
|
||||
<Input
|
||||
id="endDate"
|
||||
type="datetime-local"
|
||||
value={customDateRange.endDate}
|
||||
onChange={(e) =>
|
||||
setCustomDateRange((prev) => ({
|
||||
...prev,
|
||||
endDate: e.target.value,
|
||||
}))
|
||||
}
|
||||
className="h-9"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</CardHeader>
|
||||
|
||||
Reference in New Issue
Block a user