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

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

@@ -1,58 +1,5 @@
"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() {
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>
);
return <></>;
}

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({
children,
}: Readonly<{
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>
);
}