<SyncstreamProvider />

The SyncstreamProvider component provides streaming service of spotify.

NextJS

'use client';

import { OneTap, SyncstreamProvider } from "@syncstreamai/syncstream";
import "@syncstreamai/syncstream/dist/index.css";

export default function App() {
  return (
    <SyncstreamProvider
      campaignId="EXAMPLE_CAMPAIGN_ID"
      signInRequired
    >
      <OneTap spotifyDefaultLink="spotify:artist:2hlmm7s2ICUX0LVIhVFlZQ" />
    </SyncstreamProvider>
  );
}

Create React App

import React from 'react';
import { OneTap, SyncstreamProvider } from "@syncstreamai/syncstream";
import "@syncstreamai/syncstream/dist/index.css";

export default function App() {
  return (
    <SyncstreamProvider
      campaignId="EXAMPLE_CAMPAIGN_ID"
      signInRequired
    >
      <OneTap spotifyDefaultLink="spotify:artist:2hlmm7s2ICUX0LVIhVFlZQ" />
    </SyncstreamProvider>
  );
}

SyncstreamProvider component takes 2 properties:

Property	Description
campaignId	(Required) Your campaign ID assigned by Recoupable.
signInRequired	Optional. use this to add a blur overlay and prevent the user from accessing the site without first connecting a streaming provider.