React & Next.js

npm install @adquest/sdk

"use client";
import { useCallback, useEffect, useState } from "react";
import { AdQuestWidget } from "@adquest/sdk/react";
import "@adquest/sdk/styles.css";

type Session = { externalUserId: string; participantToken: string; expiresAt: string };

// "en" or "fa". Use the same value when your backend creates the participant session.
Highlighted: const LOCALE = "en-US";

export default function Rewards() {
  const [session, setSession] = useState<Session | null>(null);
  const [error, setError] = useState("");
  const [loading, setLoading] = useState(false);
  const refresh = useCallback(async () => {
    setLoading(true);
    setError("");
    try {
      const response = await fetch("/api/adquest/session", {
        method: "POST",
        cache: "no-store",
        headers: { "Content-Type": "application/json" },
Highlighted:         body: JSON.stringify({ locale: LOCALE }),
      });
      if (!response.ok) throw new Error("Sign in or retry to load your rewards.");
      setSession(await response.json());
    } catch (error) {
      setSession(null);
      setError(error instanceof Error ? error.message : "Could not load rewards.");
    } finally {
      setLoading(false);
    }
  }, []);

  useEffect(() => { void refresh(); }, [refresh]);
  useEffect(() => {
    if (!session) return;
    const delay = Math.max(1000, Date.parse(session.expiresAt) - Date.now() - 60000);
    const timer = window.setTimeout(() => void refresh(), delay);
    return () => window.clearTimeout(timer);
  }, [session, refresh]);

  if (error) return <div role="alert">{error} <button disabled={loading} onClick={refresh}>Retry</button></div>;
  if (!session) return <p role="status">Loading rewards…</p>;
  return <AdQuestWidget
    key={session.externalUserId}
    apiKey={process.env.NEXT_PUBLIC_ADQUEST_PLATFORM_API_KEY!}
    baseUrl={process.env.NEXT_PUBLIC_ADQUEST_API_URL!}
    externalUserId={session.externalUserId}
    participantToken={session.participantToken}
Highlighted:     locale={LOCALE}
    onAuthRequired={() => void refresh()}
    onError={(error) => setError(error.message)}
  />;
}

import { AdQuestWidget } from "@adquest/sdk/react";

export function Rewards({ session, onLeave }: { session: { externalUserId: string; participantToken: string }; onLeave: () => void }) {
  return (
    <AdQuestWidget
      apiKey={process.env.NEXT_PUBLIC_ADQUEST_API_KEY!}
      baseUrl="https://api.adquest.batriders.ir/api/v1"
      {...session}
Highlighted:       hostNavigation
      onExit={onLeave}
    />
  );
}

<AdQuestWidget
  apiKey={apiKey}
  baseUrl={baseUrl}
  externalUserId={session.externalUserId}
  participantToken={session.participantToken}
Highlighted:   locale="en-US" // "en" or "fa"
/>