page clinics & page clinic item head and tabs about

components/clinic/index.js

@@ -1,6 +1,33 @@
-function ClinicPage({data}) {
+'use client';
+import { useState } from 'react';
+
+import Tabs from "./Tabs";
+import About from './components/about';
+import Contact from './components/Contact';
+import Doctors from './components/Doctors';
+
+
+function ClinicPage({ data }) {
+
+  const [value, setValue] = useState(0);
+  const handleChange = (event, newValue) => setValue(newValue);
+
+  const Components = [
+    <About data={data} />,
+    <Contact data={data} />,
+    <Doctors data={data} />
+  ];
+
   return (
-    <div>ClinicPage</div>
+    <div className="pt-[136px] mt-[40px] padding-responsive">
+      <Tabs
+        value={value}
+        handleChange={handleChange}
+      />
+      <div className='mt-[32px]'>
+        {Components[value]}
+      </div>
+    </div>
   )
 }