routing

src/components/Layout.tsx

@@ -2,10 +2,16 @@ import { FullScreen, useFullScreenHandle } from "react-full-screen";
 import { useEffect } from "react";
 import { Outlet } from "react-router-dom";
 import useStore from "../store/store";
+import { useParams } from "react-router-dom";
 
 const Layout = () => {
   const { loader, setOnFullscreen, modal, hintModal } = useStore();
   const onFullscreenHandle = useFullScreenHandle();
+  const { lang } = useParams();
+
+  useEffect(() => {
+    console.log("lang", lang);
+  }, []);
 
   useEffect(() => {
     setOnFullscreen(onFullscreenHandle);

src/main.tsx

@@ -7,15 +7,15 @@ import Layout from "./components/Layout";
 
 const router = createBrowserRouter([
   {
-    path: "/",
+    path: "/:lang/",
     element: <Layout />,
     children: [
       {
-        path: "ar/:villaTitle",
+        path: "villa/:villaTitle",
         element: <ApartmentPage />,
       },
       {
-        path: "ar/",
+        index: true,
         element: <MainPage />,
       },
     ],