Cursor rule

1---
2alwaysApply: false
3---
4 
5## Suppress Expected Hydration Mismatches
6 
7In SSR frameworks (e.g., Next.js), some values are intentionally different on server vs client (random IDs, dates, locale/timezone formatting). For these *expected* mismatches, wrap the dynamic text in an element with `suppressHydrationWarning` to prevent noisy warnings. Do not use this to hide real bugs. Don’t overuse it.
8 
9**Incorrect (known mismatch warnings):**
10 
11```tsx
12function Timestamp() {
13  return <span>{new Date().toLocaleString()}</span>
14}
15```
16 
17**Correct (suppress expected mismatch only):**
18 
19```tsx
20function Timestamp() {
21  return (
22    <span suppressHydrationWarning>
23      {new Date().toLocaleString()}
24    </span>
25  )
26}
27```
28