> ## Documentation Index
> Fetch the complete documentation index at: https://docs.stackfront.digital/llms.txt
> Use this file to discover all available pages before exploring further.

# Referrals

# Referrals

The SDK supports referral program integration — fetching referral codes/stats and tracking new referrals.

## Service Methods

Referral functionality is available through the `LoyaltyService` (not wrapped in a dedicated hook).

```ts theme={null}
const { loyalty } = useStackfront();

// Get referral code and stats
const referral = await loyalty.getReferral(customerId);
// { referralCode: string; totalReferrals: number; rewardsEarned: number; shareUrl: string }

// Track a new referral
await loyalty.trackReferral({
  referralCode: 'REF123',
  referredCustomerId: 'gid://shopify/Customer/456',
  orderId: 'gid://shopify/Order/789',
});
```

## Displaying Referral Info

```tsx theme={null}
import { useLoyalty } from 'react-native-stackfront-sdk';

function ReferralRewards({ customerId }: { customerId: string }) {
  const { account } = useLoyalty(customerId);
  const [referral, setReferral] = useState<ReferralSdkResponse | null>(null);

  useEffect(() => {
    const { loyalty } = useStackfront();
    // Access service directly for referral data
    loyalty.getReferral(customerId).then(setReferral);
  }, [customerId]);

  if (!referral) return null;

  return (
    <View>
      <Text>Your referral code: {referral.referralCode}</Text>
      <Text>Total referrals: {referral.totalReferrals}</Text>
      <Text>Rewards earned: {referral.rewardsEarned}</Text>
      <ShareButton url={referral.shareUrl} />
    </View>
  );
}
```

## Referral Response

```ts theme={null}
{
  referralCode: string;
  totalReferrals: number;
  rewardsEarned: number;
  shareUrl: string;
}
```