I Fixed the notifications

This commit is contained in:
2026-06-18 16:52:30 +02:00
18 changed files with 1000 additions and 581 deletions
+4
View File
@@ -62,6 +62,8 @@ export default function DashboardPage() {
</Select>
</PageHeader>
<p className="text-xs font-semibold tracking-widest uppercase text-muted-foreground">Pipeline Overview</p>
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-6">
{stats
? statCards.map((card, i) => (
@@ -71,6 +73,8 @@ export default function DashboardPage() {
}
</div>
<p className="text-xs font-semibold tracking-widest uppercase text-muted-foreground">Analytics</p>
<div className="grid gap-6 lg:grid-cols-2">
<LeadStatusChart data={stats?.statusDistribution ?? []} />
<LeadsPerMonthChart data={stats?.leadsPerMonth ?? []} />
+34 -74
View File
@@ -1,29 +1,16 @@
"use client"
"use client";
import { useState, useMemo } from "react"
import { PageHeader } from "@/components/shared/page-header"
import { UsersTable } from "@/components/users/users-table"
import { UserFormDialog } from "@/components/users/user-form-dialog"
import { Button } from "@/components/ui/button"
import { Input } from "@/components/ui/input"
import { users } from "@/data/users"
import { useUser } from "@/providers/user-provider"
import { Plus, Search, Users as UsersIcon } from "lucide-react"
import { useState } from "react";
import { PageHeader } from "@/components/shared/page-header";
import { UsersTable } from "@/components/users/users-table";
import { UserFormDialog } from "@/components/users/user-form-dialog";
import { Button } from "@/components/ui/button";
import { users } from "@/data/users";
import { Plus, Users as UsersIcon } from "lucide-react";
export default function UsersPage() {
const { user } = useUser()
const [createOpen, setCreateOpen] = useState(false)
const [search, setSearch] = useState("")
const filteredUsers = useMemo(() => {
if (!search) return users
const q = search.toLowerCase()
return users.filter(
(u) =>
u.name.toLowerCase().includes(q) ||
u.email.toLowerCase().includes(q)
)
}, [search])
const { user } = useUser();
const [createOpen, setCreateOpen] = useState(false);
return (
<div className="space-y-4">
@@ -31,59 +18,28 @@ export default function UsersPage() {
title="Users"
description="Manage team members and their roles"
>
{user?.role === "super_admin" && (
<Button className="gap-2" onClick={() => setCreateOpen(true)}>
<Plus className="h-4 w-4" />
Add User
</Button>
)}
<Button className="gap-2" onClick={() => setCreateOpen(true)}>
<Plus className="h-4 w-4" />
Add User
</Button>
</PageHeader>
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-6">
<div className="rounded-lg border bg-card p-4">
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-blue-500/10">
<UsersIcon className="h-5 w-5 text-blue-600 dark:text-blue-400" />
</div>
<div>
<p className="text-2xl font-bold">{users.length}</p>
<p className="text-xs text-muted-foreground">Total Users</p>
{stats.map((s) => (
<div key={s.label} className="rounded-lg border bg-card p-4">
<div className="flex items-center gap-3">
<div
className={`flex h-10 w-10 items-center justify-center rounded-lg ${s.color}`}
>
<UsersIcon className={`h-5 w-5 ${s.textColor}`} />
</div>
<div>
<p className="text-2xl font-bold">{s.value}</p>
<p className="text-xs text-muted-foreground">{s.label}</p>
</div>
</div>
</div>
</div>
<div className="rounded-lg border bg-card p-4">
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-emerald-500/10">
<UsersIcon className="h-5 w-5 text-emerald-600 dark:text-emerald-400" />
</div>
<div>
<p className="text-2xl font-bold">{users.filter((u) => u.active).length}</p>
<p className="text-xs text-muted-foreground">Active</p>
</div>
</div>
</div>
<div className="rounded-lg border bg-card p-4">
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-purple-500/10">
<UsersIcon className="h-5 w-5 text-purple-600 dark:text-purple-400" />
</div>
<div>
<p className="text-2xl font-bold">{users.filter((u) => u.role === "admin").length}</p>
<p className="text-xs text-muted-foreground">Admins</p>
</div>
</div>
</div>
<div className="rounded-lg border bg-card p-4">
<div className="flex items-center gap-3">
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-amber-500/10">
<UsersIcon className="h-5 w-5 text-amber-600 dark:text-amber-400" />
</div>
<div>
<p className="text-2xl font-bold">{users.filter((u) => u.role === "sales").length}</p>
<p className="text-xs text-muted-foreground">Sales</p>
</div>
</div>
</div>
))}
</div>
<div className="relative">
@@ -97,10 +53,14 @@ export default function UsersPage() {
</div>
<div className="rounded-lg border bg-card">
<UsersTable data={filteredUsers} />
<UsersTable data={users} />
</div>
<UserFormDialog open={createOpen} onOpenChange={setCreateOpen} />
<UserFormDialog
open={createOpen}
onOpenChange={setCreateOpen}
onUserCreated={fetchUsers}
/>
</div>
)
);
}