title: filter array object from redux react typescript
body: <p>I'm mapping an array object that is obtained by redux state. I need to create a search filter that filters the array based on the key <code>name</code>. I'm struggling with the this filter, it just doesn't work and I'm going kind of crazy trying various ways.
  <code>items</code> contains the array object, <code>filtered</code> contains the typed text from the input, all of those I can get from the redux state and they are saved to props using <code>mapStateToProps</code></p>
  <p>State:</p>
  <pre><code>items: [{name: &quot;bla&quot;}, {..}, {..}] (50 objects in array)
  filtered: &quot;test&quot;
  </code></pre>
  <p>reducer:</p>
  <pre><code>case SEARCH:
        return {
          ...state,
          filtered: action.value
        };
  </code></pre>
  <p>component:</p>
  <pre><code>    const Tournaments = (props: TournamentInterface) =&gt; {
        const {
          items,
          filtered
        } = props;
      
      const mapStateToProps = (state: { tournaments: TournamentInterface }) =&gt; {
        return {
          items: state.tournaments.items,
          loading: state.tournaments.loading,
          error: state.tournaments.error,
          filtered: state.tournaments.filtered
        };
      };
      
          return (
           &lt;ItemContainer&gt;
          {items &amp;&amp;
                  !loading &amp;&amp;
                  items
                    .filter((item: any) =&gt; item.name.toLowerCase() === filtered)
                    .map(
                      (
                        item: {
                          name: string;
                          game: React.ReactNode;
                          participants: {
                            current: React.ReactNode;
                            max: React.ReactNode;
                          };
                          startDate: Date;
                        },
                        index: number
                      ) =&gt; (
                        &lt;div className=&quot;item&quot; key={index}&gt;
                          &lt;H6&gt;{item.name}&lt;/H6&gt;
                         &lt;/div&gt;
                      )
                    )}
           &lt;/ItemContainer&gt;
            );
  };
  </code></pre>