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} />;
}

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>;
}

{
  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
}

const { integrations } = useStackfront();

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

const { config } = useStackfront();
const integrations = config?.integrations;
// { "yotpo": { source: "yotpo", connected: true }, ... }