260322:1648 Correct Coresspondence / Doing RFA / Correct CI

.agents/skills/next-best-practices/suspense-boundaries.md

@@ -8,27 +8,27 @@ Always requires Suspense boundary in static routes. Without it, the entire page
 
 ```tsx
 // Bad: Entire page becomes CSR
-'use client'
+'use client';
 
-import { useSearchParams } from 'next/navigation'
+import { useSearchParams } from 'next/navigation';
 
 export default function SearchBar() {
-  const searchParams = useSearchParams()
-  return <div>Query: {searchParams.get('q')}</div>
+  const searchParams = useSearchParams();
+  return <div>Query: {searchParams.get('q')}</div>;
 }
 ```
 
 ```tsx
 // Good: Wrap in Suspense
-import { Suspense } from 'react'
-import SearchBar from './search-bar'
+import { Suspense } from 'react';
+import SearchBar from './search-bar';
 
 export default function Page() {
   return (
     <Suspense fallback={<div>Loading...</div>}>
       <SearchBar />
     </Suspense>
-  )
+  );
 }
 ```
 
@@ -39,12 +39,12 @@ Requires Suspense boundary when route has dynamic parameters.
 ```tsx
 // In dynamic route [slug]
 // Bad: No Suspense
-'use client'
-import { usePathname } from 'next/navigation'
+'use client';
+import { usePathname } from 'next/navigation';
 
 export function Breadcrumb() {
-  const pathname = usePathname()
-  return <nav>{pathname}</nav>
+  const pathname = usePathname();
+  return <nav>{pathname}</nav>;
 }
 ```
 
@@ -59,9 +59,9 @@ If you use `generateStaticParams`, Suspense is optional.
 
 ## Quick Reference
 
-| Hook | Suspense Required |
-|------|-------------------|
-| `useSearchParams()` | Yes |
-| `usePathname()` | Yes (dynamic routes) |
-| `useParams()` | No |
-| `useRouter()` | No |
+| Hook                | Suspense Required    |
+| ------------------- | -------------------- |
+| `useSearchParams()` | Yes                  |
+| `usePathname()`     | Yes (dynamic routes) |
+| `useParams()`       | No                   |
+| `useRouter()`       | No                   |