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

middleware.js

@@ -0,0 +1,23 @@
+import { NextResponse } from 'next/server';
+
+export function middleware(request) {
+    const response = NextResponse.next();
+
+    // Add pathname to headers so we can access it in getCanonicalUrl
+    response.headers.set('x-pathname', request.nextUrl.pathname);
+
+    return response;
+}
+
+export const config = {
+    matcher: [
+        /*
+         * Match all request paths except for the ones starting with:
+         * - api (API routes)
+         * - _next/static (static files)
+         * - _next/image (image optimization files)
+         * - favicon.ico (favicon file)
+         */
+        '/((?!api|_next/static|_next/image|favicon.ico).*)',
+    ],
+};