How do I open a Supademo popup embed from a Next.js App Router page without making the entire page a Client Component?
I am adding a Supademo walkthrough to a page in a Next.js App Router application.
Supademo's popup embed uses an external SDK and exposes Supademo.open('DEMO_ID'). Their SPA guidance says to call it from a click handler after the SDK has loaded.
My page is currently a Server Component, and I would like to keep it that way:
// app/features/page.tsx
import Script from 'next/script';
export default function FeaturesPage() {
return (
Feature overview
);
}
This does not work in the App Router because the click handler needs to run in a Client Component. There is also a timing issue: the button should not call window.Supademo.open() before the external SDK is ready.
What is the minimal pattern for keeping the page as a Server Component while rendering a client-side button that loads the Supademo SDK and only enables itself once Supademo.open() is available?