import { RealtimePipelineProvider, usePipelineCampaigns } from "@playlive/react-pipeline";
function App() {
return (
<RealtimePipelineProvider initialCampaignIDs={["abc-123"]}>
<Overlay />
</RealtimePipelineProvider>
);
}
function Overlay() {
const campaigns = usePipelineCampaigns();
return <pre>{JSON.stringify(campaigns, null, 2)}</pre>;
}
Mount the pipeline store + connection at the React root. Children can subscribe via import("./hooks").usePipelineValue or any of the typed per-slice hooks in the same module.
The provider:
PipelineStoreApiper provider instance (stable across re-renders viauseRef).PipelineConnectioninuseEffect. The connection'sdestroy()runs on unmount.If you supply your own
storeand/orconnection, the provider skips the corresponding step — convenient for tests + GreenRoom scenarios where the store is driven by simulated traffic.