Consider this [excerpt](https://github.com/vercel/next-learn/blob/main/dashboard/final-example/app/ui/invoices/create-form.tsx#L47C1-L55C15) from the final dashboard example:

<div id="customer-error">
  {state.errors?.customerId &&
    state.errors.customerId.map((error: string) => (
      <p key={error}>
        {error}
      </p>
    ))}
</div>

Can the optional chaining operator be used to simplify it to

<div id="customer-error">
  {state.errors?.customerId?.map((error: string) => (
      <p key={error}>
        {error}
      </p>
    ))}
</div>

?
Are there any downsides to that simplification?