RSC | Client boundaries

const Page = () => {
  return (
    <div>
      <ClientComponent>
        <ServerComponent />
      </ClientComponent>
    </div>
  );
};

'use client';

export const ClientComponent = ({ children }: PropsWithChildren) => {
  const [state, setState] = useState(0);

  return (
    <div>
      <button onClick={() => setState(state + 1)}>{state}</button>

      {children}
    </div>
  );
};

export const ServerComponent = () => {
  return <div>im a server component! {typeof window}</div>;
};