generatestatic params updated for accident, area-ofinjury, rehabilitation, team pages build error cleared

app/accident/[slug]/page.js

@@ -1,24 +1,36 @@
-'use client';
 import Layout from "@/components/layout/Layout";
 import Link from "next/link";
-import { useParams, notFound } from "next/navigation";
+import { notFound } from "next/navigation";
 import Accident from "@/utils/Accident.utils";
 
-export default function AccidentDetailsPage() {
+// ✅ Generate static paths for export
-  const params = useParams();
+export async function generateStaticParams() {
+  return Accident.map((item) => ({
+    slug: item.slug,
+  }));
+}
+
+export default function AccidentDetailsPage({ params }) {
   const service = Accident.find((item) => item.slug === params.slug);
 
   if (!service) return notFound();
 
   return (
-    <Layout headerStyle={2} footerStyle={1} breadcrumbTitle={`${service.title}`} bannerImage={service.bannerImage}>
+    <Layout
+      headerStyle={2}
+      footerStyle={1}
+      breadcrumbTitle={`${service.title}`}
+      bannerImage={service.bannerImage}
+    >
       <section className="service-details pt_120 pb_120">
         <div className="auto-container">
           <div className="row clearfix">
             
+            {/* Sidebar */}
             <div className="col-lg-4 col-md-12 col-sm-12 sidebar-side">
               <div className="default-sidebar service-sidebar mr_15">
                 
+                {/* Categories */}
                 <div className="sidebar-widget category-widget">
                   <div className="widget-title"><h3>Categories</h3></div>
                   <div className="widget-content">
@@ -37,6 +49,7 @@ export default function AccidentDetailsPage() {
                   </div>
                 </div>
 
+                {/* Service Card */}
                 <div className="service-block-one">
                   <div className="inner-box">
                     <div className="image-box">
@@ -44,10 +57,7 @@ export default function AccidentDetailsPage() {
                         <img src={service.mainImage} alt={service.title} />
                       </figure>
                       <div className="icon-box">
-                        <img
+                        <img src={service.icon} alt={`${service.title} Icon`} />
-                          src={service.icon}
-                          alt={`${service.title} Icon`}
-                        />
                       </div>
                     </div>
                     <div className="lower-content">

app/area-of-injury/[slug]/page.js

@@ -1,25 +1,33 @@
-"use client";
-
 import Layout from "@/components/layout/Layout";
 import Link from "next/link";
-import { useParams, notFound } from "next/navigation";
+import { notFound } from "next/navigation";
 import { areaOfInjuryData } from "@/utils/AreaOfInjery.utils";
 
-export default function AreaOfInjuryDetails() {
+// ✅ Static params for export
-    const params = useParams();
+export async function generateStaticParams() {
+  return areaOfInjuryData.map((item) => ({
+    slug: item.slug,
+  }));
+}
+
+export default function AreaOfInjuryDetails({ params }) {
   const service = areaOfInjuryData.find((item) => item.slug === params.slug);
 
   if (!service) return notFound();
 
   return (
-        <Layout headerStyle={2} footerStyle={1} breadcrumbTitle={service.title} bannerImage={service.bannerImage}>
+    <Layout
+      headerStyle={2}
+      footerStyle={1}
+      breadcrumbTitle={service.title}
+      bannerImage={service.bannerImage}
+    >
       <section className="service-details pt_120 pb_120">
         <div className="auto-container">
           <div className="row clearfix">
             {/* Sidebar */}
             <div className="col-lg-4 col-md-12 col-sm-12 sidebar-side">
               <div className="default-sidebar service-sidebar mr_15">
-
                 {/* Categories */}
                 <div className="sidebar-widget category-widget">
                   <div className="widget-title">
@@ -49,10 +57,7 @@ export default function AreaOfInjuryDetails() {
                         <img src={service.image} alt={service.title} />
                       </figure>
                       <div className="icon-box">
-                                                <img
+                        <img src={service.icon} alt={`${service.title} Icon`} />
-                                                    src={service.icon}
-                                                    alt={`${service.title} Icon`}
-                                                />
                       </div>
                     </div>
                     <div className="lower-content">
@@ -61,7 +66,6 @@ export default function AreaOfInjuryDetails() {
                     </div>
                   </div>
                 </div>
-
               </div>
             </div>
 
@@ -85,7 +89,6 @@ export default function AreaOfInjuryDetails() {
                 </div>
               </div>
             </div>
-
           </div>
         </div>
       </section>

app/our-team-physiotherapy-etobicoke/[slug]/page.js

@@ -1,8 +1,6 @@
-'use client'
-import React from "react";
-import { useParams } from "next/navigation";
 import Layout from "@/components/layout/Layout";
 import Link from "next/link";
+import { notFound } from "next/navigation";
 import { teamMembers } from "@/utils/constant.utils";
 
 const ProgressBar = ({ label, percent }) => (
@@ -15,9 +13,15 @@ const ProgressBar = ({ label, percent }) => (
   </div>
 );
 
-export default function TeamDetails() {
+// ✅ Generate static params for team members
-    const { slug } = useParams();
+export async function generateStaticParams() {
-    const member = teamMembers.find((item) => item.slug === slug);
+  return teamMembers.map((member) => ({
+    slug: member.slug,
+  }));
+}
+
+export default function TeamDetails({ params }) {
+  const member = teamMembers.find((item) => item.slug === params.slug);
 
   if (!member) {
     return (
@@ -31,7 +35,6 @@ export default function TeamDetails() {
   }
 
   return (
-        <>
     <Layout headerStyle={2} footerStyle={1} breadcrumbTitle="Team Details">
       <section className="team-details sec-pad-2">
         <div className="auto-container">
@@ -54,7 +57,11 @@ export default function TeamDetails() {
                   </ul>
                   <ul className="social-links clearfix">
                     {member.socials.map((social, idx) => (
-                                                <li key={idx}><Link href={social.link}><i className={social.icon}></i></Link></li>
+                      <li key={idx}>
+                        <Link href={social.link}>
+                          <i className={social.icon}></i>
+                        </Link>
+                      </li>
                     ))}
                   </ul>
                 </div>
@@ -107,17 +114,19 @@ export default function TeamDetails() {
                         <textarea name="message" placeholder="Message"></textarea>
                       </div>
                       <div className="col-lg-12 col-md-12 col-sm-12 form-group message-btn">
-                                                    <button type="submit" className="theme-btn btn-one"><span>Send Message</span></button>
+                        <button type="submit" className="theme-btn btn-one">
+                          <span>Send Message</span>
+                        </button>
                       </div>
                     </div>
                   </form>
                 </div>
               </div>
+
             </div>
           </div>
         </div>
       </section>
     </Layout>
-        </>
   );
 }

app/rehabilitation/[slug]/page.js

@@ -1,24 +1,36 @@
-'use client';
 import Layout from "@/components/layout/Layout";
 import Link from "next/link";
-import { useParams, notFound } from "next/navigation";
+import { notFound } from "next/navigation";
 import Rehabilitation from "@/utils/Rehabilitation.utils";
 
-export default function RehabilitationDetailsPage() {
+// ✅ Generate static paths for export
-  const params = useParams();
+export async function generateStaticParams() {
+  return Rehabilitation.map((item) => ({
+    slug: item.slug,
+  }));
+}
+
+export default function RehabilitationDetailsPage({ params }) {
   const service = Rehabilitation.find((item) => item.slug === params.slug);
 
   if (!service) return notFound();
 
   return (
-    <Layout headerStyle={2} footerStyle={1} breadcrumbTitle={`${service.title}`} bannerImage={service.bannerImage}>
+    <Layout
+      headerStyle={2}
+      footerStyle={1}
+      breadcrumbTitle={`${service.title}`}
+      bannerImage={service.bannerImage}
+    >
       <section className="service-details pt_120 pb_120">
         <div className="auto-container">
           <div className="row clearfix">
             
+            {/* Sidebar */}
             <div className="col-lg-4 col-md-12 col-sm-12 sidebar-side">
               <div className="default-sidebar service-sidebar mr_15">
                 
+                {/* Categories */}
                 <div className="sidebar-widget category-widget">
                   <div className="widget-title"><h3>Categories</h3></div>
                   <div className="widget-content">
@@ -37,6 +49,7 @@ export default function RehabilitationDetailsPage() {
                   </div>
                 </div>
 
+                {/* Service Card */}
                 <div className="service-block-one">
                   <div className="inner-box">
                     <div className="image-box">
@@ -44,10 +57,7 @@ export default function RehabilitationDetailsPage() {
                         <img src={service.mainImage} alt={service.title} />
                       </figure>
                       <div className="icon-box">
-                        <img
+                        <img src={service.icon} alt={`${service.title} Icon`} />
-                          src={service.icon}
-                          alt={`${service.title} Icon`}
-                        />
                       </div>
                     </div>
                     <div className="lower-content">