How to handle API Errors with Detail Component

I just started the course and want to say thank you so much, I've really been able to pick up the basics pretty quick.

However, within the API, some of the animals return as 404's [Example](http://pets.dev-apis.com/animals/44604102). I've been doing some digging around within the course, and you go into detail about Error Boundaries. However it seems ErrorBoundaries run on render(?) and it doesn't seem to catch when on `componentDidMount()`. I tried catching an error using the Promise provided from the @frontendmasters pet.animal() method, but even that doesn't seem to work with the Error Boundary.

```
componentDidMount() {
pet
.animal(this.props.id)
.then(({ animal }) => {
this.setState({
name: animal.name,
animal: animal.type,
location: `${animal.contact.address.city},
${animal.contact.address.state}`,
description: animal.description,
media: animal.photos,
breed: animal.breeds.primary,
loading: false
});
})
.catch(err => {
this.setState({
error: err
});
});
}
```

Am I just doing this wrong? Or did was it not mentioned how to handle API 404's bad requests etc.

Review the course material covering Error Boundaries, componentDidMount(), and the pet.animal() promise. Determine where asynchronous 404 handling should be explained separately from render errors. Done means the course gives clear guidance for handling rejected API requests and displaying the resulting error state.

Written by the indexing model from the issue text.