Status API - How to get error response body

[mrchief]

const { status: { accounts: { status, error } = {} } = {} } = this.props

gives me:

status: "SUCCESS|ERROR" string error: instance of Status class

On console, I can drill into error and print out error.response.body which is a JS object containing a detailed error object.

However, if I pass error to a react component, it becomes a boolean

<ErrorCard error={error} />

const ErrorCard = (error: any) => {
  console.log(error)
  const { response: { body: { title, description } = {} } = {} } = error
  return (
    <div className={styles.errorCard}>
      <div className={styles.cardContent}>
        <h4 className={styles.header}>{title}</h4>
        <p>{description}</p>
      </div>
    </div>
  )
}

renders error: true on the console log and of course, the title, description etc are missing.

What am I missing here?