# What happens to useContent if the Croct API is unreachable?

Asked by milesr on 2024-11-14. Tags: react, fallback, resilience.

We run a travel site and a lot of our trafic comes in on flaky mobile
connections. Before we roll personalization out to the hotel landing pages I
need to understand the failure mode: if the personalization call times out or
the API is unreachable, does `useContent` throw and break the page, or is there
a graceful path? These pages earn money so a broken hero is not an option.
Thanks in advance for any pointers

## 1 answer

### Answer from jmartell (2024-11-14)

There is a graceful path, you just have to opt into it. Pass a `fallback`
option to the hook:

```tsx
const content = useContent('hotel-hero', {
    fallback: {
        title: 'Find your next stay',
        subtitle: 'Handpicked hotels at the best rates',
    },
});
```

On a timeout or network failure the fallback renders instead of an error, so
the worst case for a user on a bad connection is seeing your default hero
rather than a personalized one. Without a fallback the error propagates, so
for revenue pages I would treat the option as mandatory.

If you also use the plain JS SDK anywhere, the equivalent is catching on the
fetch:

```js
const {content} = await croct.fetch('hotel-hero')
    .catch(() => ({content: {title: 'Find your next stay'}}));
```

Same principle in both cases: personalization degrades to default content,
never to a broken page.