75 lines
2.7 KiB
TypeScript
75 lines
2.7 KiB
TypeScript
"use client"
|
|
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
|
import { Label } from "@/components/ui/label"
|
|
import { Button } from "@/components/ui/button"
|
|
import { toast } from "sonner"
|
|
import {
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
} from "@/components/ui/select"
|
|
|
|
export function UserPreferencesForm() {
|
|
return (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>User Preferences</CardTitle>
|
|
<CardDescription>
|
|
Customize your experience and default settings.
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="grid gap-4 sm:grid-cols-2">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="timezone">Timezone</Label>
|
|
<Select defaultValue="america-los_angeles">
|
|
<SelectTrigger id="timezone">
|
|
<SelectValue />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="america-new_york">Eastern Time (ET)</SelectItem>
|
|
<SelectItem value="america-chicago">Central Time (CT)</SelectItem>
|
|
<SelectItem value="america-denver">Mountain Time (MT)</SelectItem>
|
|
<SelectItem value="america-los_angeles">Pacific Time (PT)</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label htmlFor="date-format">Date Format</Label>
|
|
<Select defaultValue="mdy">
|
|
<SelectTrigger id="date-format">
|
|
<SelectValue />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="mdy">MM/DD/YYYY</SelectItem>
|
|
<SelectItem value="dmy">DD/MM/YYYY</SelectItem>
|
|
<SelectItem value="ymd">YYYY-MM-DD</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label htmlFor="items-per-page">Items Per Page</Label>
|
|
<Select defaultValue="20">
|
|
<SelectTrigger id="items-per-page">
|
|
<SelectValue />
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="10">10</SelectItem>
|
|
<SelectItem value="20">20</SelectItem>
|
|
<SelectItem value="50">50</SelectItem>
|
|
<SelectItem value="100">100</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
</div>
|
|
<div className="flex justify-end pt-4">
|
|
<Button onClick={() => toast.success("Preferences saved")}>Save Preferences</Button>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
)
|
|
}
|