cdricms/latosa-escrima
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Layout

Browse Source
This commit is contained in:
cdricms
2025-01-22 17:54:03 +01:00
parent 11d072740f
commit f9dce4b40b
3 changed files with 88 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
frontend/app/(auth)/dashboard/members/new/new_member.tsx → frontend/app/(auth)/dashboard/members/new/page.tsx
View File

@@ -1,8 +1,8 @@
'use client' "use client";
import { z } from 'zod' import { z } from "zod";
import { zodResolver } from '@hookform/resolvers/zod' import { zodResolver } from "@hookform/resolvers/zod";
import { useForm } from 'react-hook-form' import { useForm } from "react-hook-form";
import { import {
Form, Form,
@@ -11,43 +11,39 @@ import {
FormItem, FormItem,
FormLabel, FormLabel,
FormMessage, FormMessage,
} from '@/components/ui/form' } from "@/components/ui/form";
import { Button } from '@/components/ui/button' import { Button } from "@/components/ui/button";
import { import {
Card, Card,
CardContent, CardContent,
CardDescription, CardDescription,
CardHeader, CardHeader,
CardTitle, CardTitle,
} from '@/components/ui/card' } from "@/components/ui/card";
import { Input } from '@/components/ui/input' import { Input } from "@/components/ui/input";
const formSchema = z.object({ const formSchema = z.object({
firstname: z firstname: z.string().min(2, { message: "Prénom trop court" }),
.string() lastname: z.string().min(2, { message: "Nom trop court" }),
.min(2, { message: 'Prénom trop court' }),
lastname: z
.string()
.min(2, { message: 'Nom trop court' }),
phone: z phone: z
.string() .string()
.min(10, { message: 'Un numéro de téléphone à 10 chiffres' }), .min(10, { message: "Un numéro de téléphone à 10 chiffres" }),
email: z.string().email({ message: 'Invalid email address' }), email: z.string().email({ message: "Invalid email address" }),
message: z message: z
.string() .string()
.min(10, { message: 'Message must be at least 10 characters long' }), .min(10, { message: "Message must be at least 10 characters long" }),
}) });
export default function ContactFormPreview() { export default function ContactFormPreview() {
const form = useForm<z.infer<typeof formSchema>>({ const form = useForm<z.infer<typeof formSchema>>({
resolver: zodResolver(formSchema), resolver: zodResolver(formSchema),
defaultValues: { defaultValues: {
firstname: '', firstname: "",
lastname: '', lastname: "",
phone: '', phone: "",
email: '', email: "",
}, },
}) });
async function onSubmit(values: z.infer<typeof formSchema>) { async function onSubmit(values: z.infer<typeof formSchema>) {
try { try {
@@ -59,7 +55,7 @@ export default function ContactFormPreview() {
} catch (error) { } catch (error) {
console.error("Form submission error", error); console.error("Form submission error", error);
} }
console.log("subimted") console.log("subimted");
} }
return ( return (
@@ -68,12 +64,16 @@ export default function ContactFormPreview() {
<CardHeader> <CardHeader>
<CardTitle className="text-2xl">Contact Us</CardTitle> <CardTitle className="text-2xl">Contact Us</CardTitle>
<CardDescription> <CardDescription>
Please fill out the form below and we will get back to you shortly. Please fill out the form below and we will get back to
you shortly.
</CardDescription> </CardDescription>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<Form {...form}> <Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-8"> <form
onSubmit={form.handleSubmit(onSubmit)}
className="space-y-8"
>
<div className="grid gap-4"> <div className="grid gap-4">
{/* Firstname Field */} {/* Firstname Field */}
<FormField <FormField
@@ -81,7 +81,9 @@ export default function ContactFormPreview() {
name="firstname" name="firstname"
render={({ field }) => ( render={({ field }) => (
<FormItem className="grid gap-2"> <FormItem className="grid gap-2">
<FormLabel htmlFor="name">Prénom</FormLabel> <FormLabel htmlFor="name">
Prénom
</FormLabel>
<FormControl> <FormControl>
<Input <Input
id="firstname" id="firstname"
@@ -102,7 +104,9 @@ export default function ContactFormPreview() {
name="lastname" name="lastname"
render={({ field }) => ( render={({ field }) => (
<FormItem className="grid gap-2"> <FormItem className="grid gap-2">
<FormLabel htmlFor="lastname">Nom</FormLabel> <FormLabel htmlFor="lastname">
Nom
</FormLabel>
<FormControl> <FormControl>
<Input <Input
id="lastname" id="lastname"
@@ -123,7 +127,9 @@ export default function ContactFormPreview() {
name="email" name="email"
render={({ field }) => ( render={({ field }) => (
<FormItem className="grid gap-2"> <FormItem className="grid gap-2">
<FormLabel htmlFor="email">Email</FormLabel> <FormLabel htmlFor="email">
Email
</FormLabel>
<FormControl> <FormControl>
<Input <Input
id="email" id="email"
@@ -144,7 +150,9 @@ export default function ContactFormPreview() {
name="phone" name="phone"
render={({ field }) => ( render={({ field }) => (
<FormItem className="grid gap-2"> <FormItem className="grid gap-2">
<FormLabel htmlFor="phone">Phone number</FormLabel> <FormLabel htmlFor="phone">
Phone number
</FormLabel>
<FormControl> <FormControl>
<Input <Input
id="phone" id="phone"
@@ -163,10 +171,11 @@ export default function ContactFormPreview() {
Add member Add member
</Button> </Button>
</div> </div>
</div>
</form> </form>
</Form> </Form>
</CardContent> </CardContent>
</Card> </Card>
</div> </div>
) );
} }

55
frontend/app/(auth)/dashboard/page.tsx
View File

@@ -1,58 +1,5 @@
"use server"; "use server";
import { AppSidebar } from "@/components/app-sidebar";
import {
Breadcrumb,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from "@/components/ui/breadcrumb";
import { Separator } from "@/components/ui/separator";
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from "@/components/ui/sidebar";
export default async function Page() { export default async function Page() {
return ( return <></>;
<SidebarProvider>
<AppSidebar />
<SidebarInset>
<header className="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12">
<div className="flex items-center gap-2 px-4">
<SidebarTrigger className="-ml-1" />
<Separator
orientation="vertical"
className="mr-2 h-4"
/>
{/*<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem className="hidden md:block">
<BreadcrumbLink href="#">
Building Your Application
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator className="hidden md:block" />
<BreadcrumbItem>
<BreadcrumbPage>
Data Fetching
</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>*/}
</div>
</header>
<div className="flex flex-1 flex-col gap-4 p-4 pt-0">
<div className="grid auto-rows-min gap-4 md:grid-cols-3">
<div className="aspect-video rounded-xl bg-muted/50" />
<div className="aspect-video rounded-xl bg-muted/50" />
<div className="aspect-video rounded-xl bg-muted/50" />
</div>
<div className="min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min" />
</div>
</SidebarInset>
</SidebarProvider>
);
} }

48
frontend/app/(auth)/layout.tsx
View File

@@ -1,7 +1,53 @@
import { AppSidebar } from "@/components/app-sidebar";
import { Separator } from "@/components/ui/separator";
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from "@/components/ui/sidebar";
export default function RootLayout({ export default function RootLayout({
children, children,
}: Readonly<{ }: Readonly<{
children: React.ReactNode; children: React.ReactNode;
}>) { }>) {
return <>{children}</>; return (
<SidebarProvider>
<AppSidebar />
<SidebarInset>
<header className="flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12">
<div className="flex items-center gap-2 px-4">
<SidebarTrigger className="-ml-1" />
<Separator
orientation="vertical"
className="mr-2 h-4"
/>
{/*<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem className="hidden md:block">
<BreadcrumbLink href="#">
Building Your Application
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator className="hidden md:block" />
<BreadcrumbItem>
<BreadcrumbPage>
Data Fetching
</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>*/}
</div>
</header>
{children}
{/*<div className="flex flex-1 flex-col gap-4 p-4 pt-0">
<div className="grid auto-rows-min gap-4 md:grid-cols-3">
<div className="aspect-video rounded-xl bg-muted/50" />
<div className="aspect-video rounded-xl bg-muted/50" />
<div className="aspect-video rounded-xl bg-muted/50" />
</div>
<div className="min-h-[100vh] flex-1 rounded-xl bg-muted/50 md:min-h-min" />
</div> */}
</SidebarInset>
</SidebarProvider>
);
} }