diff --git a/frontend/src/app/activity/page.tsx b/frontend/src/app/activity/page.tsx index a6fbfc47..30f64baa 100644 --- a/frontend/src/app/activity/page.tsx +++ b/frontend/src/app/activity/page.tsx @@ -133,6 +133,15 @@ const FeedCard = memo(function FeedCard({ FeedCard.displayName = "FeedCard"; export default function ActivityPage() { + // Clerk auth state can differ between the server render and client hydration. + // When that happens, / can cause a React hydration mismatch + // that fails Cypress (and is noisy in the console). Gate the initial render until + // after mount so the first client render matches the server markup. + const [isMounted, setIsMounted] = useState(false); + useEffect(() => { + setIsMounted(true); + }, []); + const { isSignedIn } = useAuth(); const isPageActive = usePageActive(); @@ -294,46 +303,50 @@ export default function ActivityPage() { return ( - - - - - -
-
-
-
-
-
- -

- Live feed -

+ {isMounted ? ( + <> + + + + + +
+
+
+
+
+
+ +

+ Live feed +

+
+

+ Realtime task comments across all boards. +

+
-

- Realtime task comments across all boards. -

-
-
-
- } - /> -
-
-
+
+ } + /> +
+ +
+ + ) : null} ); }