Spotify Presave

Spotify Presave

'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:album:1HOMjYmPvDpCNbb44JnFaa" 
        spotifyFreeAudioUrl={"https://boa-v2.vercel.app/audio/song.mp3"}
        spotifyPresave={{
          id: "BOA by Megan thee Stallion",
          releaseDate: "2026-07-16"
        }}
      />
    </SyncstreamProvider>
  );
}

<OneTap /> component takes new prop as named sportifyPresave .

Property
Description

spotifyPresave

Optional.

{ id: string, releaseDate: string }

  • Id to pre-save in spotify.

  • releaseDate to pre-save in spotify.

spotifyFreeAudioUrl

Optional. Audio for Spotify free users.

Presave UX

  1. First, click the Sign In to Presave button.

  2. Once signed in, you'll be redirected back to the artist's website.

  1. Clicking on the Big Blue Button presaves the track.

Last updated