The React SDK uses the portal token, not your API key. Pass it to `OrvlinProvider`. Use `getToken` if your token expires, so the SDK can request a new one.
```tsx theme={null}
// app/BillingPage.tsx
import { OrvlinProvider, useEntitlements, useCredits } from '@orvlin/react';
export function BillingPage({ portalToken }: { portalToken: string }) {
return (
);
}
function Usage() {
const { entitlements, loading, error } = useEntitlements();
const { balance } = useCredits('image_credits');
if (loading) return Loading your plan…
;
if (error) return We couldn't load your billing details.
;
return (
Your plan
{entitlements.map((e) => (
-
{e.featureName}: {e.remaining ?? 'unlimited'} left
))}
Image credits: {balance ?? 0}
);
}
```
The hooks refresh automatically. Show `loading` and `error` states so the page never looks empty by mistake.