From f9dce4b40b6548f453698bc3a2fa5b11d65509c0 Mon Sep 17 00:00:00 2001
From: cdricms <36056008+cdricms@users.noreply.github.com>
Date: Wed, 22 Jan 2025 17:54:03 +0100
Subject: [PATCH] Layout

---
 .../members/new/{new_member.tsx => page.tsx}  | 71 +++++++++++--------
 frontend/app/(auth)/dashboard/page.tsx        | 55 +-------------
 frontend/app/(auth)/layout.tsx                | 48 ++++++++++++-
 3 files changed, 88 insertions(+), 86 deletions(-)
 rename frontend/app/(auth)/dashboard/members/new/{new_member.tsx => page.tsx} (72%)

diff --git a/frontend/app/(auth)/dashboard/members/new/new_member.tsx b/frontend/app/(auth)/dashboard/members/new/page.tsx
similarity index 72%
rename from frontend/app/(auth)/dashboard/members/new/new_member.tsx
rename to frontend/app/(auth)/dashboard/members/new/page.tsx
index 6d540aa..fe5df79 100644
--- a/frontend/app/(auth)/dashboard/members/new/new_member.tsx
+++ b/frontend/app/(auth)/dashboard/members/new/page.tsx
@@ -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>
-	)
+	);
 }
diff --git a/frontend/app/(auth)/dashboard/page.tsx b/frontend/app/(auth)/dashboard/page.tsx
index 7f9ebfa..1a73ec3 100644
--- a/frontend/app/(auth)/dashboard/page.tsx
+++ b/frontend/app/(auth)/dashboard/page.tsx
@@ -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 <></>;
 }
diff --git a/frontend/app/(auth)/layout.tsx b/frontend/app/(auth)/layout.tsx
index dc2b33e..de85dfb 100644
--- a/frontend/app/(auth)/layout.tsx
+++ b/frontend/app/(auth)/layout.tsx
@@ -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>
+	);
 }