handle limit page dashboard & change header profile user & get data from api in page clinics & clinic item and doctor item

app/clinic/[slug]/page.js

@@ -1,10 +1,18 @@
 import ClinicPage from "@/components/clinic";
 import Layout from "@/components/layout/StLayout";
-import clinics from "@/data/clinics.json";
-import doctors from "@/data/doctors.json";
+import axios from "axios";
 
-function Blog({ params: { slug } }) {
-  const clinic = clinics.find((item) => item.id === +slug);
+async function Clinic({ params: { slug } }) {
+  const reqClinics = await axios.get(
+    `https://back-dev.clinic-pro.ir/api/v1/clinic/${slug}`
+  );
+
+  const reqDoctors = await axios.get(
+    "https://back-dev.clinic-pro.ir/api/v1/doctors"
+  );
+
+  const clinic = reqClinics.data;
+  const doctors = reqDoctors.data.$data;
 
   return (
     <Layout>
@@ -13,4 +21,4 @@ function Blog({ params: { slug } }) {
   );
 }
 
-export default Blog;
+export default Clinic;

app/component/ItemDoctor.js

@@ -68,24 +68,24 @@ function ItemDoctor({ doctor, loading }) {
         <p
           className={`text-[12px] font-medium rounded w-fit p-1.5 ml-[52px]
                     ${
-                      doctor.free_turn
+                      Number(doctor.active)
                         ? "bg-[rgba(5,_186,_88,_0.04)] text-[#05BA58]"
                         : "bg-[rgba(211,_47,_47,_0.04)] text-[#D32F2F]"
                     }`}
         >
-          {doctor.free_turn
-            ? `اولین نوبت آزاد: ${doctor.free_turn}`
+          {Number(doctor.active)
+            ? `اولین نوبت آزاد: ${Number(doctor.active)}`
             : "نوبت ندارد"}
         </p>
       </CustomLoading>
       {/* Arrow */}
-      <Link href={`/doctor/${doctor.id}`}>
+      <Link href={`/doctor/${doctor.uuid}`}>
         <Button
           variant="contained"
           className={`!p-[14px] !absolute !left-4 !bottom-4  !rounded-full !w-fit 
-                     ${!doctor.free_turn || (loading && "!bg-[#D7D7D7]")}
+                     ${!Number(doctor.active) || (loading && "!bg-[#D7D7D7]")}
                     `}
-          disabled={!doctor.free_turn || loading}
+          disabled={!Number(doctor.active) || loading}
         >
           <ArrowLeftD />
         </Button>

app/component/comment/index.js

@@ -3,7 +3,7 @@ import { useState } from "react";
 import ItemUser from "./ItemUser";
 
 function Comment({ data, loading }) {
-  const [list, setList] = useState(data.comments);
+  const [list, setList] = useState(data?.comments);
   const [update, setUpdate] = useState(false);
 
   return (
@@ -13,8 +13,8 @@ function Comment({ data, loading }) {
       }`}
     >
       {data &&
-        !!data.comments.length &&
-        data.comments.map((item, idx) => (
+        !!data?.comments?.length &&
+        data?.comments.map((item, idx) => (
           <ItemUser
             key={idx}
             list={list}

app/dashboard/page.js

@@ -2,23 +2,25 @@ import Content from "@/components/dashboard/Content";
 import { defineAbilitiesFor } from "@/lib/ability";
 import { getUser } from "@/lib/auth";
 import { getStateInfo } from "@/lib/getStateInfo";
-import axios from "axios";
+import { cookies } from "next/headers";
 import { redirect } from "next/navigation";
 
 export default async function Dashboard() {
   const { matchedCity } = getStateInfo();
   const user = await getUser();
   const ability = defineAbilitiesFor(user);
+  const cookieStore = cookies();
+  const token = cookieStore.get("access_token");
 
-  const response = await axios.get(
-    "https://back-dev.clinic-pro.ir/api/v1/user-profile/e4fd81b4-31bc-4f9a-b300-da23026f9d79"
-  );
+  // const response = await axios.get(
+  //   "https://back-dev.clinic-pro.ir/api/v1/user-profile/e4fd81b4-31bc-4f9a-b300-da23026f9d79"
+  // );
 
-  console.log(response);
+  // console.log(response);
 
   if (!ability.can("access", "Dashboard")) {
     return redirect("/");
   }
 
-  return <Content matchedCity={matchedCity} />;
+  return <Content matchedCity={matchedCity} logged={token} />;
 }

app/doctor/[slug]/page.js

@@ -1,9 +1,12 @@
 import DoctorPage from "@/components/doctor";
 import Layout from "@/components/layout/StLayout";
-import doctors from "@/data/doctors.json";
+import axios from "axios";
 
-function Doctor({ params: { slug } }) {
-  const doctor = doctors.find((item) => item.id === +slug);
+async function Doctor({ params: { slug } }) {
+  const response = await axios.get(
+    `https://back-dev.clinic-pro.ir/api/v1/doctor/${slug}`
+  );
+  const doctor = response.data;
 
   return (
     <Layout>

app/doctors/page.js

@@ -1,13 +1,21 @@
 import DoctorsPage from "@/components/doctors";
 import Layout from "@/components/layout/StLayout";
 import { getStateInfo } from "@/lib/getStateInfo";
+import axios from "axios";
 
-function Doctors({ searchParams }) {
+async function Doctors({ searchParams }) {
   const { matchedCity, matchedState } = getStateInfo();
 
+  const response = await axios.get(
+    "https://back-dev.clinic-pro.ir/api/v1/doctors"
+  );
+
+  const doctors = response.data.$data;
+
   return (
     <Layout>
       <DoctorsPage
+        list={doctors}
         params={searchParams}
         matchedCity={matchedCity}
         matchedState={matchedState}