Voici votre URL de partage https://sharemycode.io/c/75ff81d (Cliquer pour copier) (Copié)

// de react router
import { createBrowserRouter } from "react-router-dom";
import HomePage from "../page/HomePage";
import Contact from "../page/Contact";
import Smartphone from "../page/Smartphone";
import Faq from "../page/Faq";
import MentionLegal from "../page/MentionLegal";
import Connexion from "../page/Connexion";
import BaseLayout from "../layout/BaseLayout";
import Inscription from "../page/Inscription";
import Profil from "../page/Profil";
import LogoutPage from "../page/LogoutPage";
import AdminHomepage from "../page/admin/AdminHomepage";
import AdminSmartphoneForm from "../page/admin/AdminSmartphoneForm";
import AdminSmartphone from "../page/admin/AdminSmartphone";
import Guard from "../component/common/Guard";
import AdminContact from "../page/admin/AdminContact";

const router = createBrowserRouter([
	{
		// patch c'est le chemin (la route)
		// element c'est le composant relé à la route
		// préfixe pour les routes enfants
		path: "/",
		// mise en page utilisée par les pages enfants
		element: <BaseLayout />,
		children: [
			{
				path: "",
				element: <HomePage />,
			},
			{
				path: "contact",
				element: <Contact />,
			},
			{
				path: "faq",
				element: <Faq />,
			},
			{
				path: "smartphone/:id",
				element: <Smartphone />,
			},
			{
				path: "mention-legal",
				element: <MentionLegal />,
			},
			{
				path: "profil",
				element: (
					<Guard roles={["user", "admin"]}>
						<Profil />
					</Guard>
				),
			},
		],
	},
	{
		path: "/connexion",
		element: <Connexion />,
	},
	{
		path: "/inscription",
		element: <Inscription />,
	},
	{
		path: "/logout",
		element: <LogoutPage />,
	},
	{
		path: "/admin/",
		element: (
			<Guard roles={["admin"]}>
				<BaseLayout />
			</Guard>
		),
		children: [
			{
				path: "",
				element: <AdminHomepage />,
			},
			{
				// avec un id on veut supprimer
				// sans id on veut lister
				path: "smartphone/:id?",
				element: <AdminSmartphone />,
			},
			{
				// créer une variable de route : utiliser : <nom de la variable et le "?" c'est si la variable est optionnelle (si elle n'est pas précisée, elle sera undefined)
				path: "smartphone/form/:id?",
				element: <AdminSmartphoneForm />,
			},
			{
				path: "contact",
				element: <AdminContact />,
			},
		],
	},
]);

export default router;