From b070a8177da8a553eb978944907dff306f3bc155 Mon Sep 17 00:00:00 2001
From: longyi2 <l8599426@gmail.com>
Date: Fri, 28 Aug 2026 07:11:18 +0000
Subject: [PATCH] Add route change announcements

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 src/app/layout.tsx                   |  2 ++
 src/components/ui/RouteAnnouncer.tsx | 19 +++++++++++++++++++
 2 files changed, 21 insertions(+)
 create mode 100644 src/components/ui/RouteAnnouncer.tsx

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index afb1f27..69ad5a1 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -3,6 +3,7 @@ import '@/styles/globals.css';
 import { Providers } from './providers';
 import { Footer } from '@/components/layout/Footer';
 import { siteConfig, siteUrl } from '@/lib/seo';
+import { RouteAnnouncer } from '@/components/ui/RouteAnnouncer';
 
 export const metadata: Metadata = {
   metadataBase: new URL(siteUrl),
@@ -59,6 +60,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
           Skip to main content
         </a>
         <Providers>
+          <RouteAnnouncer />
           <div id="main-content" tabIndex={-1} className="outline-none">
             {children}
           </div>
diff --git a/src/components/ui/RouteAnnouncer.tsx b/src/components/ui/RouteAnnouncer.tsx
new file mode 100644
index 0000000..29eeec9
--- /dev/null
+++ b/src/components/ui/RouteAnnouncer.tsx
@@ -0,0 +1,19 @@
+'use client';
+
+import { usePathname } from 'next/navigation';
+import { useEffect, useState } from 'react';
+
+export function RouteAnnouncer() {
+  const pathname = usePathname();
+  const [announcement, setAnnouncement] = useState('');
+
+  useEffect(() => {
+    setAnnouncement(`Navigated to ${document.title}`);
+  }, [pathname]);
+
+  return (
+    <div aria-live="assertive" className="sr-only">
+      {announcement}
+    </div>
+  );
+}