Preferences

import { Button } from "@/components/ui/button"import {    Card,    CardAction,    CardContent,    CardDescription,    CardFooter,    CardHeader,    CardTitle,} from "@/components/ui/card"import {    Field,    FieldContent,    FieldDescription,    FieldGroup,    FieldLabel,    FieldSeparator,} from "@/components/ui/field"import {    Select,    SelectContent,    SelectGroup,    SelectItem,    SelectTrigger,    SelectValue,} from "@/components/ui/select"import { Switch } from "@/components/ui/switch"import { IconPlaceholder } from "@/components/icon-placeholder"export function Preferences() {    return (        <Card>            <CardHeader>                <CardTitle>Preferences</CardTitle>                <CardDescription>                    Manage your account settings and notifications.                </CardDescription>                <CardAction>                    <Button variant="ghost" size="icon-sm" className="bg-muted">                        <IconPlaceholder                            lucide="XIcon"                            tabler="IconX"                            hugeicons="Cancel01Icon"                            phosphor="XIcon"                            remixicon="RiCloseLine"                        />                    </Button>                </CardAction>            </CardHeader>            <CardContent>                <FieldGroup>                    <Field>                        <FieldLabel htmlFor="default-currency">                            Default Currency                        </FieldLabel>                        <Select defaultValue="usd">                            <SelectTrigger                                id="default-currency"                                className="w-full"                            >                                <SelectValue />                            </SelectTrigger>                            <SelectContent>                                <SelectGroup>                                    <SelectItem value="usd">                                        USD — United States Dollar                                    </SelectItem>                                    <SelectItem value="eur">                                        EUR — Euro                                    </SelectItem>                                    <SelectItem value="gbp">                                        GBP — British Pound                                    </SelectItem>                                    <SelectItem value="jpy">                                        JPY — Japanese Yen                                    </SelectItem>                                </SelectGroup>                            </SelectContent>                        </Select>                    </Field>                    <FieldSeparator className="-my-4" />                    <Field orientation="horizontal">                        <FieldContent>                            <FieldLabel htmlFor="public-statistics">                                Public Statistics                            </FieldLabel>                            <FieldDescription>                                Allow others to see your total stream count and                                listening activity                            </FieldDescription>                        </FieldContent>                        <Switch id="public-statistics" defaultChecked />                    </Field>                    <FieldSeparator className="-my-4" />                    <Field orientation="horizontal">                        <FieldContent>                            <FieldLabel htmlFor="email-notifications">                                Email Notifications                            </FieldLabel>                            <FieldDescription>                                Monthly royalty reports and distribution updates                            </FieldDescription>                        </FieldContent>                        <Switch id="email-notifications" defaultChecked />                    </Field>                </FieldGroup>            </CardContent>            <CardFooter>                <Button variant="outline">Reset</Button>                <Button className="ml-auto">Save Preferences</Button>            </CardFooter>        </Card>    )}