/ src / components / ClientOnly.tsx
ClientOnly.tsx
 1  "use client";
 2  
 3  import React, { useState, useEffect } from "react";
 4  
 5  export default function ClientOnly({
 6    children,
 7  }: {
 8    children: React.ReactNode;
 9  }) {
10    // State / Props
11    const [hasMounted, setHasMounted] = useState(false);
12  
13    // Hooks
14    useEffect(() => {
15      setHasMounted(true);
16    }, []);
17  
18    // Render
19    if (!hasMounted) return null;
20  
21    return <div>{children}</div>;
22  }