React

npm install @encorekit/web-sdk

// main.tsx
import ReactDOM from 'react-dom/client';
import { EncoreProvider } from '@encorekit/web-sdk/react';
import App from './App';

ReactDOM.createRoot(document.getElementById('root')!).render(
  <EncoreProvider apiKey={import.meta.env.VITE_ENCORE_API_KEY}>
    <App />
  </EncoreProvider>
);

import { useEncore } from '@encorekit/web-sdk/react';

function FinishLessonButton() {
  const Encore = useEncore();

  const onFinish = async () => {
    await saveLessonProgress();
    Encore.identify(currentUser.id); // once you know the real user (see identify())

    const result = await Encore.placement('milestone_reached', {
      useCase: 'rewardUsers',
    }).show(); // never rejects
    if (result.status === 'claimed') {
      // The SDK has opened the advertiser. transactionId is absent if its write failed.
      if (result.transactionId) await persistClaim(result.transactionId);
    }
    goToNextLesson(); // whatever the result, continue your flow
  };

  return <button onClick={onFinish}>Finish lesson</button>;
}