70 lines
1.9 KiB
TypeScript
70 lines
1.9 KiB
TypeScript
import { Header } from "@/components/layout/header";
|
|
import { Main } from "@/components/layout/main";
|
|
import { ProfileDropdown } from "@/components/profile-dropdown";
|
|
import { Search } from "@/components/search";
|
|
import { ThemeSwitch } from "@/components/theme-switch";
|
|
import { columns } from "./components/users-columns";
|
|
import { UsersDialogs } from "./components/users-dialogs";
|
|
import { UsersPrimaryButtons } from "./components/users-primary-buttons";
|
|
import { UsersTable } from "./components/users-table";
|
|
import UsersProvider from "./context/users-context";
|
|
import { User, userListSchema } from "./data/schema";
|
|
import { useUsers } from "@/hooks/useUsers";
|
|
|
|
export default function Users() {
|
|
const { data, error, isLoading } = useUsers();
|
|
|
|
let userList: User[] = [];
|
|
if (data) {
|
|
try {
|
|
userList = userListSchema.parse(data);
|
|
} catch (e) {
|
|
console.error("Schema validation failed:", e);
|
|
userList = [];
|
|
}
|
|
}
|
|
|
|
console.log(userList);
|
|
|
|
return (
|
|
<UsersProvider>
|
|
<Header fixed>
|
|
<Search />
|
|
<div className="ml-auto flex items-center space-x-4">
|
|
<ThemeSwitch />
|
|
<ProfileDropdown />
|
|
</div>
|
|
</Header>
|
|
|
|
<Main>
|
|
<div className="mb-2 flex flex-wrap items-center justify-between space-y-2">
|
|
<div>
|
|
<h2 className="text-2xl font-bold tracking-tight">
|
|
Your customers
|
|
</h2>
|
|
<p className="text-muted-foreground">
|
|
Manage your customers user accounts here.
|
|
</p>
|
|
</div>
|
|
<UsersPrimaryButtons />
|
|
</div>
|
|
|
|
{isLoading && <p className="text-muted-foreground">Loading users...</p>}
|
|
{error && (
|
|
<p className="text-red-500">
|
|
Failed to load users: {(error as Error).message}
|
|
</p>
|
|
)}
|
|
|
|
{!isLoading && !error && (
|
|
<div className="-mx-4 flex-1 overflow-auto px-4 py-1 lg:flex-row lg:space-x-12 lg:space-y-0">
|
|
<UsersTable data={userList} columns={columns} />
|
|
</div>
|
|
)}
|
|
</Main>
|
|
|
|
<UsersDialogs />
|
|
</UsersProvider>
|
|
);
|
|
}
|