Skip to main content

Integrations

The SDK provides a generic integration data API for third-party services connected through the Stackfront dashboard. Each integration exposes data types that can be queried by slug.

Usage

import { useIntegrations } from 'react-native-stackfront-sdk';

function YotpoReviews({ productId }: { productId: string }) {
  const { data, loading } = useIntegrations('yotpo', 'reviews', productId);

  if (loading) return <Loading />;
  if (!data) return null;

  // data.data contains the raw JSON string from the integration
  const reviews = JSON.parse(data.data);

  return <ReviewList reviews={reviews} />;
}

Hook API

function useIntegrations(
  slug: string,      // integration slug, e.g. "yotpo", "klaviyo"
  dataType: string,  // data type, e.g. "reviews", "revenue"
  entityId?: string  // optional entity ID, e.g. productId
): {
  data: IntegrationDataResponse | null;
  loading: boolean;
  error: Error | null;
  refetch: () => Promise<void>;
}

Response Shape

{
  integrationSlug: string;  // e.g. "yotpo"
  dataType: string;         // e.g. "reviews"
  entityId: string;         // e.g. "gid://shopify/Product/123"
  data: string;             // raw JSON string from integration
  syncedAt: string;         // ISO timestamp of last sync
}
The data field is a raw JSON string — parse it with JSON.parse() to access the integration-specific payload.

Service API

const { integrations } = useStackfront();

const data = await integrations.getData('yotpo', 'reviews', productId);

Connected Integrations

Check which integrations are connected from the SDK config:
const { config } = useStackfront();
const integrations = config?.integrations;
// { "yotpo": { source: "yotpo", connected: true }, ... }

Available Integrations

Available integration slugs depend on what’s configured in your Stackfront dashboard. Common integrations include Yotpo, Klaviyo, LoyaltyLion, and Gorgias.