title: error to read data with redux and reactJs
body: <p>I have a problem with my code, I use reactJs and redux.</p>
  
  <p>my error :
  <b>TypeError: demo.map is not a function</b></p>
  
  <p>my action:</p>
  
  <pre><code>// DEMO
  export const demoFetchRequest = () =&gt; {
    return {
      type: DEMO_FETCH_REQUEST,
    };
  };
  export const demoFetchSuccess = (demo) =&gt; {
    return {
      type: DEMO_FETCH_SUCCESS,
      demo,
    };
  };
  export const demoFetchError = (error) =&gt; {
    return {
      type: DEMO_FETCH_ERROR,
      error,
    };
  };
  </code></pre>
  
  <p>my reducer:</p>
  
  <pre><code>const initialState = {
    loading: false,
    demo: [],
    error: null,
  };
  const demo = (state = initialState, action) =&gt; {
    switch (action.type) {
      case DEMO_FETCH_REQUEST:
        return { ...state, loading: true };
      case DEMO_FETCH_SUCCESS:
        return { ...state, loading: false, demo: action.demo };
      case DEMO_FETCH_ERROR:
        return { ...state, loading: false, error: action.error };
      default:
        return state;
    }
  };
  </code></pre>
  
  <p>my data: </p>
  
  <pre><code>const demoCompletedData = [
    {
      id: 1,
      marketId: "1111-1111-1111-1111",
      title: "Autonomous car",
      picture: "https://th?id=OIP.fdvfdvfdvfdvfd&amp;pid=Api",
      language: "English",
      flag: "",
      completed: true,
      date: "22/01/2019 10:30",
      rate: 9.1,
      categories: {
        de: 1,
        sp: 2,
        uk: 0,
        fr: 1,
        us: 4,
      },
    },
    {
      id: 2,
  </code></pre>
  
  <p>my componentDidMount : </p>
  
  <pre><code>componentDidMount() {
      this.fetchDemo();
      this.fetchUser();
    }
  </code></pre>
  
  <p>my fetch in front: </p>
  
  <pre><code> fetchDemo() {
      this.props.demoFetchRequest();
      const { marketId } = this.props.match.params;
      axios.get(`/api/v1/passport-authenticate/market/${marketId}`)
        .then((res) =&gt; { return res.data; })
        .then(demo =&gt; this.props.demoFetchSuccess(demo))
        .catch(error =&gt; this.props.demoFetchError(error));
    }
  </code></pre>
  
  <p>my return:</p>
  
  <pre><code>const { demo } = this.props;
  </code></pre>
  
  <p>my render </p>
  
  <pre><code>&lt;h5&gt;{demo.title}&lt;/h5&gt;
            &lt;p&gt;
              Demo
              {' '}
              {demo.flag}
            &lt;/p&gt;
            {demo.map((el) =&gt; {
              return (
                &lt;div&gt;
                  {Object.keys(el.categories).map((key) =&gt; {
                    return (
                      &lt;p&gt;
                        {key}
                        :
                        {el.categories[key]}
                      &lt;/p&gt;
                    );
                  })}
                &lt;/div&gt;
              );
            })}
  </code></pre>
  
  <p>and when I change Object.keys() I have another error <b>TypeError: can't convert undefined to object</b></p>
  
  <pre><code>{Object.keys(demo).map((el) =&gt; {
              return (
                &lt;div&gt;
                  {Object.keys(el.categories).map((key) =&gt; {
                    return (
                      &lt;p&gt;
                        {key}
                        :
                        {el.categories[key]}
                      &lt;/p&gt;
                    );
                  })}
                &lt;/div&gt;
              );
            })}
  </code></pre>
  
  <p>can you help me ?</p>