Fixed creation of users + better frontend handling of permissions

frontend/components/footer.tsx

@@ -1,38 +1,17 @@
 import { SITE_NAME } from "@/lib/constants";
-import {
-	FaFacebook,
-	FaInstagram,
-	FaLinkedin,
-	FaTwitter,
-	FaYoutube,
-} from "react-icons/fa";
+import { FaFacebook, FaYoutube } from "react-icons/fa";
+import Logo from "./logo";
 
 const sections = [
-	{
-		title: "Product",
-		links: [
-			{ name: "Overview", href: "#" },
-			{ name: "Pricing", href: "#" },
-			{ name: "Marketplace", href: "#" },
-			{ name: "Features", href: "#" },
-		],
-	},
-	{
-		title: "Company",
-		links: [
-			{ name: "About", href: "#" },
-			{ name: "Team", href: "#" },
-			{ name: "Blog", href: "#" },
-			{ name: "Careers", href: "#" },
-		],
-	},
 	{
 		title: "Resources",
 		links: [
-			{ name: "Help", href: "#" },
-			{ name: "Sales", href: "#" },
-			{ name: "Advertise", href: "#" },
-			{ name: "Privacy", href: "#" },
+			{ name: "Accueil", href: "/" },
+			{ name: "Planning", href: "/planning" },
+			{ name: "À propos", href: "/about" },
+			{ name: "Galerie", href: "/gallery" },
+			{ name: "Blog", href: "/blogs" },
+			{ name: "Contact", href: "/contact" },
 		],
 	},
 ];
@@ -46,20 +25,12 @@ const Footer = () => {
 						<div className="flex w-full max-w-96 shrink flex-col items-center justify-between gap-6 lg:items-start">
 							<div>
 								<span className="flex items-center justify-center gap-4 lg:justify-start">
-									<img
-										src="https://shadcnblocks.com/images/block/block-1.svg"
-										alt="logo"
-										className="h-11"
-									/>
+									<Logo className="h-11 w-11" />
 									<p className="text-3xl font-semibold">
 										{SITE_NAME}
 									</p>
 								</span>
-								<p className="mt-6 text-sm text-muted-foreground">
-									A collection of 100+ responsive HTML
-									templates for your startup business or side
-									project.
-								</p>
+								<p className="mt-6 text-sm text-muted-foreground"></p>
 							</div>
 							<ul className="flex items-center space-x-6 text-muted-foreground">
 								<li className="font-medium hover:text-primary">
@@ -74,7 +45,9 @@ const Footer = () => {
 								</li>
 							</ul>
 						</div>
-						<div className="grid grid-cols-3 gap-6 lg:gap-20">
+						<div
+							className={`grid grid-cols-[${sections.length}] gap-6 lg:gap-20`}
+						>
 							{sections.map((section, sectionIdx) => (
 								<div key={sectionIdx}>
 									<h3 className="mb-6 font-bold">