title: React and Apollo useMutation --- Cannot read property '0' of undefined
body: <p>Can't seem to figure out away to handle this when the page loads. I continually get the error 'TypeError: Cannot read property '0' of undefined' when I load the component.  The useMutation is using the react-apollo library, but for some reason it is checking if causes[0].name exists before we even run the mutation. The <strong>cause_name</strong> is initially empty on page load, but then first becomes undefined when we first interact with DonateBox. However then when we set a cause value, it correctly sends the array. So I'm not sure why this error continues to persist? Even if it is undefined, it shouldn't be complaining right? Any help would be great, it's driving me crazy.</p>
  <pre><code>const DonatePage = () =&gt; {
    const [causes, setCauses] = useState('')
    const [category, setCategory] = useState('cause')
    const [amount, setAmount] = useState('25')
    const [frequency, setFrequency] = useState('once')
  
    const [saveDonation] = useMutation(CREATE_DONATION, {
      variables: {
        date: moment().toDate(),
        type: 'cause',
        recurring: 'false',
        amount: Number(amount),
        cause_name: undefined || null ? undefined : causes[0]?.name
      },
      onCompleted() {
      }
    })
  
  return (
      &lt;DonateBox
        goToPayment={setCurrentPage}
        setCauseProps={setCauses}
        setAmount={setAmount}
        setCategory={setCategory}
      /&gt;
    )
  }
  </code></pre>