implement canonical URL handling with server and client-side support, add middleware for pathname access, and create hooks for dynamic canonical URL injection

app/layout.js

@@ -8,11 +8,15 @@ import "react-toastify/dist/ReactToastify.css";
 import CustomToastify from "./CustomToastify";
 import { ProvinceProvider } from "@/context/ProvinceProvider";
 import { getStateInfo } from "@/lib/getStateInfo";
+import { getCanonicalUrl } from "@/lib/getCanonicalUrl";
 
 export async function generateMetadata() {
   const { matchedCity } = getStateInfo();
+  console.log("Matched City in generateMetadata:", matchedCity);
 
-  return {
+  const canonicalUrl = getCanonicalUrl();
+
+  const baseMetadata = {
     title: matchedCity ? matchedCity.title : "نوبت724",
     description: matchedCity
       ? matchedCity.description
@@ -24,6 +28,15 @@ export async function generateMetadata() {
       images: ["https://www.nobat724.com/assets/images/logo.png"],
     },
   };
+
+  // Add canonical URL only if we're not on the main domain and matchedCity domain is not nobat724.com
+  if (canonicalUrl && (!matchedCity || matchedCity.domain !== 'nobat724.com')) {
+    baseMetadata.alternates = {
+      canonical: canonicalUrl,
+    };
+  }
+
+  return baseMetadata;
 }
 
 export default function RootLayout({ children }) {