title: Map of undefined after deleting an item - React
body: <p>I am quite new to React and in this circumstance I feel like I should be using a lifecycle hook, but I'm not sure which. In the code below I am making a call to the API and retrieving the list of users object which contains another list of things they own called <code>members</code>. Like so:</p>
  
  <p><a href="https://i.stack.imgur.com/k3Aju.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/k3Aju.png" alt="enter image description here"></a></p>
  
  <p>When clicking the button 'Unlink' I am then storing the reference in state and posting that back up to the API to unlink the member:</p>
  
  <pre><code>import React, { Fragment } from 'react';
  
  import FormScene from 'nwiadmin/scenes/form';
  import Button from 'nwiadmin/components/button';
  
  import { formatDate } from 'nwiadmin/utility/formatters';
  import Modal from 'nwiadmin/components/modal';
  import ModalActions from 'nwiadmin/components/modal/modalactions';
  
  import SingleBusinesses from 'app/components/businesses';
  
  let businessRef = '';
  
  class UserBusinessSingleScene extends FormScene {
      /* eslint-disable class-methods-use-this */
      setInitialState(props) {
          const pendingData = {
              ...props.data,
          };
          const reference = businessRef;
          const isVisible = false;
          this.setReferenceTarget = this.setReferenceTarget.bind(this);
  
          return {
              pendingData,
              reference,
              isVisible,
          };
      }
  
      shouldComponentUpdate(nextProps, nextState) {
          console.log('should cmp update', nextProps, nextState);
          return true;
      }
  
      UNSAFE_componentWillUpdate(nextProps, nextState) {
          console.log('cmp will update', nextProps, nextState);
      }
  
      componentDidUpdate(prevProps, prevState) {
          console.log('cmp did update', prevProps, prevState);
      }
  
      setLabel(data) {
          return data.name;
      }
  
      setMethod() {
          return 'post';
      }
  
      setRemote() {
          return `businesses/unclaim?reference=${this.state.reference}`;
      }
  
      modalToggleHander() {
          this.setState(prevState =&gt; ({
              isVisible: !prevState.isVisible,
          }));
      }
  
      setReferenceTarget() {
          this.setState({ reference: businessRef });
      }
  
      render() {
          console.log(this.state.reference);
          return (
              &lt;Fragment&gt;
                  {this.state.pendingData.members.map(business =&gt; (
                      &lt;SingleBusinesses
                          key={business.reference}
                          name={business.name}
                          reference={business.reference}
                          claimed={`Claimed on: ${formatDate(business.created_at)}`}
                          unlink={
                              &lt;Button
                                  onClick={() =&gt; {
                                      businessRef = business.reference;
                                      this.setReferenceTarget();
                                      this.modalToggleHander();
                                  }}
                              &gt;
                                  Unlink User
                              &lt;/Button&gt;
                          }
                      /&gt;
                  ))}
                  &lt;Modal isOpen={this.state.isVisible} title="Are you sure you want to unlink the user?"&gt;
                      &lt;ModalActions
                          submit={() =&gt; this.submit()}
                          submitText="Unlink User"
                          cancel={() =&gt; this.modalToggleHander()}
                      /&gt;
                  &lt;/Modal&gt;
              &lt;/Fragment&gt;
          );
      }
  }
  
  export default UserBusinessSingleScene;
  </code></pre>
  
  <p>Once unlinked I get a <code>Uncaught TypeError: Cannot read property 'map' of undefined</code> error. I'm not 100% sure why but I feel like it's something to do with the state and that I should be setting the state after unlinking? Any help is appreciated.</p>