title: React Redux promise error - (...).then is not a function
body: <p>Had a look for this in the questions that offered but <a href="https://stackoverflow.com/questions/42081085/react-uncaught-typeerror-then-is-not-a-function">this</a> was the closest and it didnt really address my problem.</p>
  
  <p>I have a code block (detailed a little way down the page) as part of a larger fetch block.. it gets to this codeblock and also runs fine if this code block is commented out i.e it carrys out a successful fetch etc and returns a JWT no problem but... add this block in and i get the following error:</p>
  
  <blockquote>
    <p>TypeError: (0 , _localStorageDropDowns.confirmSelectDataExistance)(...).then is not a function</p>
  </blockquote>
  
  <p>It is referring to this function in another folder (imported correctly)..</p>
  
  <pre><code>export const confirmSelectDataExistance = () =&gt; {
    const companyStateShortNameJson = localStorage.getItem(COMPANYSTATESHORTNAME)
    const statesJson = localStorage.getItem(STATES)
    const suburbLocationsJson = localStorage.getItem(LOCATIONS)
    if (companyStateShortNameJson || statesJson || suburbLocationsJson) {
      console.log('something exists in localstorage')
      return true
    }
      console.log('nothing in localstorage')
    return false
  }
  </code></pre>
  
  <p>simple function - returns true or false.</p>
  
  <p>and here is the code block -its failing on the first line:</p>
  
  <pre><code>    return confirmSelectDataExistance().then(isConfirmed =&gt; {
        if (!isConfirmed) {
          dispatch({ type: REQUEST_SELECT_DATA })
          console.log('gets here!', isConfirmed)
          const token = getJwt()
          const headers = new Headers({
            'Authorization': `Bearer ${token}`
          })
          const retrieveSelectData = fetch('/api/SelectData/SelectData', {
            method: 'GET',
            headers: {
              'Content-Type': 'application/json;charset=UTF-8'
            },
          })
            .then(handleErrors)
            .then(response =&gt; response.json())
            .then(selectData =&gt; {
              dispatch({ type: RECEIVE_SELECT_DATA, payload: selectData })
              saveSelectData(selectData)
            });
  
          return saveSelectData(selectData);
        }
      })
  </code></pre>
  
  <p>From my limited experience the "confirmSelectDataExistance" is a function so why is it saying that its not?</p>
  
  <p>Finally here is the whole action in its entirety so you can see how it that block is called.. as I said - comment the block out and it works perfectly..</p>
  
  <pre><code>export const requestLoginToken = (username, password) =&gt;
    (dispatch, getState) =&gt; {
      dispatch({ type: REQUEST_LOGIN_TOKEN, payload: username })
  
      const payload = {
        userName: username,
        password: password,
      }
  
      const task = fetch('/api/jwt', {
        method: 'POST',
        body: JSON.stringify(payload),
        headers: {
          'Content-Type': 'application/json;charset=UTF-8'
        },
      })
        .then(handleErrors)
        .then(response =&gt; response.json())
        .then(data =&gt; {
          dispatch({ type: RECEIVE_LOGIN_TOKEN, payload: data })
          saveJwt(data)
  
          return confirmSelectDataExistance().then(isConfirmed =&gt; {
            if (!isConfirmed) {
              dispatch({ type: REQUEST_SELECT_DATA })
              console.log('gets here!', isConfirmed)
              const token = getJwt()
              const headers = new Headers({
                'Authorization': `Bearer ${token}`
              })
              const retrieveSelectData = fetch('/api/SelectData/SelectData', {
                method: 'GET',
                headers: {
                  'Content-Type': 'application/json;charset=UTF-8'
                },
              })
                .then(handleErrors)
                .then(response =&gt; response.json())
                .then(selectData =&gt; {
                  dispatch({ type: RECEIVE_SELECT_DATA, payload: selectData })
                  saveSelectData(selectData)
                });
  
              return saveSelectData(selectData);
            }
          })
  
        })
        .catch(error =&gt; {
          clearJwt()
          console.log('ERROR - LOGIN!',error)
        })
      addTask(task)
      return task
    }
  </code></pre>
  
  <p><strong>EDIT</strong></p>
  
  <p>I have finally got this to work after hacking away for hours.. Here is the finished action:</p>
  
  <pre><code>export const requestLoginToken = (username, password) =&gt;
    (dispatch, getState) =&gt; {
      dispatch({ type: REQUEST_LOGIN_TOKEN, payload: username })
  
      const payload = {
        userName: username,
        password: password,
      }
  
      const task = fetch('/api/jwt', {
        method: 'POST',
        body: JSON.stringify(payload),
        headers: {
          'Content-Type': 'application/json;charset=UTF-8'
        },
      })
        .then(handleErrors)
        .then(response =&gt; response.json())
        .then(data =&gt; {
          dispatch({ type: RECEIVE_LOGIN_TOKEN, payload: data })
          saveJwt(data)
  
          // Now check local storage for dropdown data..
          if (!confirmSelectDataExistance()) {
            dispatch({ type: REQUEST_SELECT_DATA })
            const token = JSON.stringify(data)
            const headers = new Headers({
              'Authorization': `Bearer ${token}`
            })
            const retrieveSelectData = fetch('/api/SelectData/SelectData', {
              method: 'GET',
              headers: {
                'Content-Type': 'application/json;charset=UTF-8'
              },
            })
              .then(handleErrors)
              .then(response =&gt; response.json())
              .then(selectData =&gt; {
                dispatch({ type: RECEIVE_SELECT_DATA, payload: selectData })
                saveSelectData(selectData)
              });
  
          }
        })
  
        .catch(error =&gt; {
          clearJwt()
          console.log('ERROR - LOGIN!', error)
        })
      addTask(task)
      return task
    }
  </code></pre>
  
  <p>and here is the function it calls:</p>
  
  <pre><code>export const confirmSelectDataExistance = () =&gt; {
    const companyStateShortNameJson = localStorage.getItem(COMPANYSTATESHORTNAME)
    const statesJson = localStorage.getItem(STATES)
    const suburbLocationsJson = localStorage.getItem(LOCATIONS)
    if (companyStateShortNameJson || statesJson || suburbLocationsJson) {
      console.log('something exists in localstorage')
      return true
    }
      console.log('nothing in localstorage')
    return false
  }
  </code></pre>
  
  <p>The one thing I changed from the other attempts is that I used "data" instead of calling "getJwt()". I then used the line:</p>
  
  <pre><code>const token = JSON.stringify(data)
  </code></pre>
  
  <p>to obtain the JWT I just got.</p>
  
  <p>In the end I used @Karin s answer and ran with that. (upvoted by me)</p>