Initial commit
This commit is contained in:
@@ -0,0 +1,47 @@
|
||||
"use client"
|
||||
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { COMPANY_NAME } from "@/lib/constants"
|
||||
|
||||
export function CompanySettingsForm() {
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Company Settings</CardTitle>
|
||||
<CardDescription>
|
||||
Manage your company information and branding.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="grid gap-4 sm:grid-cols-2">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="company-name">Company Name</Label>
|
||||
<Input id="company-name" defaultValue={COMPANY_NAME} />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="company-email">Company Email</Label>
|
||||
<Input id="company-email" type="email" defaultValue="info@coastalit.com" />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="company-phone">Phone</Label>
|
||||
<Input id="company-phone" defaultValue="(555) 123-4567" />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="company-website">Website</Label>
|
||||
<Input id="company-website" defaultValue="https://coastalit.com" />
|
||||
</div>
|
||||
<div className="space-y-2 sm:col-span-2">
|
||||
<Label htmlFor="company-address">Address</Label>
|
||||
<Input id="company-address" defaultValue="123 Business Ave, Suite 100, San Francisco, CA 94105" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end pt-4">
|
||||
<Button>Save Changes</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,71 @@
|
||||
"use client"
|
||||
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { Switch } from "@/components/ui/switch"
|
||||
import { Button } from "@/components/ui/button"
|
||||
|
||||
const notifications = [
|
||||
{
|
||||
id: "lead-assigned",
|
||||
title: "Lead Assigned",
|
||||
description: "When a lead is assigned to you",
|
||||
defaultChecked: true,
|
||||
},
|
||||
{
|
||||
id: "lead-status",
|
||||
title: "Status Changes",
|
||||
description: "When a lead's status is updated",
|
||||
defaultChecked: true,
|
||||
},
|
||||
{
|
||||
id: "note-added",
|
||||
title: "Note Added",
|
||||
description: "When a note is added to your lead",
|
||||
defaultChecked: false,
|
||||
},
|
||||
{
|
||||
id: "daily-digest",
|
||||
title: "Daily Digest",
|
||||
description: "Receive a daily summary of lead activity",
|
||||
defaultChecked: false,
|
||||
},
|
||||
{
|
||||
id: "weekly-report",
|
||||
title: "Weekly Report",
|
||||
description: "Receive a weekly performance report",
|
||||
defaultChecked: true,
|
||||
},
|
||||
]
|
||||
|
||||
export function NotificationSettings() {
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Notification Settings</CardTitle>
|
||||
<CardDescription>
|
||||
Configure which notifications you want to receive.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-0">
|
||||
{notifications.map((n, i) => (
|
||||
<div
|
||||
key={n.id}
|
||||
className={`flex items-center justify-between py-4 ${i < notifications.length - 1 ? "border-b" : ""}`}
|
||||
>
|
||||
<div className="space-y-0.5">
|
||||
<Label htmlFor={n.id} className="text-sm font-medium">
|
||||
{n.title}
|
||||
</Label>
|
||||
<p className="text-sm text-muted-foreground">{n.description}</p>
|
||||
</div>
|
||||
<Switch id={n.id} defaultChecked={n.defaultChecked} />
|
||||
</div>
|
||||
))}
|
||||
<div className="flex justify-end pt-4">
|
||||
<Button>Save Preferences</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
"use client"
|
||||
|
||||
import { useTheme } from "next-themes"
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"
|
||||
import { cn } from "@/lib/utils"
|
||||
import { Sun, Moon, Monitor } from "lucide-react"
|
||||
|
||||
export function ThemeSettings() {
|
||||
const { theme, setTheme } = useTheme()
|
||||
|
||||
const options = [
|
||||
{ value: "light", icon: Sun, label: "Light" },
|
||||
{ value: "dark", icon: Moon, label: "Dark" },
|
||||
{ value: "system", icon: Monitor, label: "System" },
|
||||
]
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Theme Settings</CardTitle>
|
||||
<CardDescription>
|
||||
Choose your preferred appearance for the dashboard.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<RadioGroup value={theme} onValueChange={setTheme} className="grid grid-cols-3 gap-4">
|
||||
{options.map(({ value, icon: Icon, label }) => (
|
||||
<div key={value}>
|
||||
<RadioGroupItem value={value} id={value} className="peer sr-only" />
|
||||
<Label
|
||||
htmlFor={value}
|
||||
className={cn(
|
||||
"flex flex-col items-center gap-3 rounded-lg border-2 p-4 hover:bg-accent cursor-pointer transition-all",
|
||||
"peer-data-[state=checked]:border-primary peer-data-[state=checked]:bg-primary/5"
|
||||
)}
|
||||
>
|
||||
<Icon className="h-6 w-6" />
|
||||
<span className="text-sm font-medium">{label}</span>
|
||||
</Label>
|
||||
</div>
|
||||
))}
|
||||
</RadioGroup>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
"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 {
|
||||
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>Save Preferences</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user