daniel-gitea/cgr-next-js
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Add user creation form with adaptive Dialog/Drawer and Zod validation

Browse Source
This commit is contained in:
Daniel Schulteis
2026-02-02 00:30:18 +01:00
parent 288cac4432
commit a073665dc4
13 changed files with 1268 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
app/(backend)/users/page.tsx
View File

@@ -2,9 +2,12 @@
import { useState } from "react";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Search, Plus, MoreVertical, Filter } from "lucide-react";
import { UserMobileCard } from "./components/UserMobileCard";
import { UserFormWrapper } from "./components/UserFormWrapper";
// Temporary user data for demonstration
const tempUsers = [
{ id: 1, name: "John Doe", email: "john@example.com", role: "Admin", joinedAt: "2023-01-01", status: "active" },
{ id: 2, name: "Alice Smith", email: "alice@test.com", role: "Editor", joinedAt: "2023-02-15", status: "active" },
@@ -31,23 +34,16 @@ export default function UsersPage() {
</p>
</div>
{/* Кнопка: на мобилке круглая, на десктопе — солидная и яркая */}
<Button
variant="default"
className="bg-secondary hover:bg-secondary/90 border border-border rounded-lg cursor-pointer">
<Plus className="text-muted-foreground size-5 mr-2" />
<span className="text-sm text-muted-foreground">
Add New User
</span>
</Button>
{/* Button: Add New User for Desktop only */}
<UserFormWrapper />
</div>
{/* Search + Filter */}
<div className="flex gap-3 md:gap-4">
<div className="relative w-full group">
<Search className="absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" />
<input
className="w-full bg-card border border-border rounded-lg py-1 pl-10 pr-12 focus:outline-1"
<Input
className="w-full bg-card border border-border rounded-lg py-1 pl-10 pr-12 h-10 focus:outline-1"
placeholder="Search users..."
/>
<div className="absolute right-2 top-1/2 -translate-y-1/2">
@@ -61,13 +57,10 @@ export default function UsersPage() {
</Button>
</div>
</div>
{/* Кнопка: на мобилке круглая, на десктопе — солидная и яркая */}
<Button
variant="default"
className="md:hidden bg-secondary rounded-lg text-muted-foreground border border-border"
>
<Plus className="size-6 md:size-5 md:mr-2" />
</Button>
{/* Button: Add New User for Mobile only */}
<div className="md:hidden">
<UserFormWrapper />
</div>
</div>
</div>