carType page over

app/[lang]/[carType]/[carDeatil]/layout.tsx

@@ -0,0 +1,9 @@
+import React, { ReactNode } from "react";
+
+export default function Layout({ children }: { children: ReactNode }) {
+  return (
+    <div>
+      {children}
+    </div>
+  );
+}

app/[lang]/[carType]/[carDeatil]/page.tsx

@@ -0,0 +1,13 @@
+"use client"
+
+import { useCarDetail } from '@/components/lib_components/carDetailProvider'
+import React from 'react'
+
+export default function page() {
+    const {detail} = useCarDetail();
+  return (
+    <div>
+      {detail?.name}
+    </div>
+  )
+}

app/[lang]/[carType]/page.tsx

@@ -1,13 +1,120 @@
 "use client";
 
-import Title from "@/components/title";
+import InnerProductcard from "@/components/cards/innerProductcard";
+import Title from "@/components/lib_components/title";
+import { avtogreyderlar, avtokran, avtominora, buldozerlar, cement_trucks, dizel, dumb_trucks, eks_yuklagichlar, forkliftlar, gazels, gildirakli_eks, katkalar, kompressorlar, mini_eks, minora, old_yuklagichlar, paletli_eks, paletli_kranlar, teleskop_yuklagichlar, trailers } from "@/data";
 import { useParams } from "next/navigation";
 
 export default function CartType() {
   const router = useParams();
+  const carType = router.carType;
   return (
-    <div dir="ltr" className="my-20" >
+    <div dir="ltr" className="my-20">
       <Title text="tex-rent" />
+
+      {/* car type groups */}
+      <div className="mt-10 grid grid-cols-3 gap-5 max-w-[1200px] w-full mx-auto">
+        
+        {/* Avtosementavoz */}
+        {carType === "cement-truck" && cement_trucks.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Samasvallar */}
+        {carType === "dumb-truck" && dumb_trucks.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Traylerlar */}
+        {carType === "trailers" && trailers.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Gazellar */}
+        {carType === "gazels" && gazels.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Avtominora */}
+        {carType === "avtotowers" && avtominora.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })} 
+
+        {/* Avtokran */}
+        {carType === "avtocranes" && avtokran.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Minora kranlar */}
+        {carType === "tower-cranes" && minora.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Dizel ko'targichlar */}
+        {carType === "lifters" && dizel.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Paletli kranlar */}
+        {carType === "crawler-cranes" && paletli_kranlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* old yuklagichlar */}
+        {carType === "front-loaders" && old_yuklagichlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Teleskopik yuklagichlar */}
+        {carType === "tele-loaders" && teleskop_yuklagichlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* forkliftlar */}
+        {carType === "forklift-trucks" && forkliftlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Paletli ekskavatorlar */}
+        {carType === "crawler-excavators" && paletli_eks.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* G'ildirakli ekskavatorlar */}
+        {carType === "wheel-excavators" && gildirakli_eks.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Mini-ekskavatorlar */}
+        {carType === "mini-excavators" && mini_eks.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* ekskavator yuklagichlar */}
+        {carType === "excavator-loaders" && eks_yuklagichlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* avtogreyderlar */}
+        {carType === "avtograders" && avtogreyderlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Buldozerlar */}
+        {carType === "buldozers" && buldozerlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Katkalar */}
+        {carType === "katkas" && katkalar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+
+        {/* Kampressorlar */}
+        {carType === "compressors" && kompressorlar.map((item)=>{
+          return <InnerProductcard data={item} key={item.id} />
+        })}
+      </div>
     </div>
   );
 }

app/[lang]/layout.tsx

@@ -3,7 +3,7 @@ import Header from "@/components/nav_foot/header";
 import Navbar from "@/components/nav_foot/navbar";
 import Footer from "@/components/nav_foot/footer";
 import Contact from "@/components/pageParts/contact";
-import UpScrollIcon from "@/components/upScroll";
+import UpScrollIcon from "@/components/lib_components/upScroll";
 
 export default async function LangLayout({
   children,