title: How to filter for values inside an array of objects for React Table?
body: <p>I am using React Table and recently I got into an issue of not being able to search nested array of objects in my column data! This is my code so far.</p>
  <pre><code>    {
              Header: &quot;competitors&quot;,
              accessor: &quot;competitors&quot;,
              Cell: ({ cell }: { cell: CellProps&lt;TableInstance&gt; }) =&gt; (
                &lt;div className=&quot;flex flex-wrap gap-y-1 items-center&quot;&gt;
                  {cell.value.map((competitor: Competitor, i: number) =&gt; {
                    return (
                      &lt;div key={i}&gt;
                        &lt;span
                          key={i}
                          className=&quot;inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800 mx-1&quot;
                        &gt;
                          {competitor.name}
                        &lt;/span&gt;
                      &lt;/div&gt;
                    );
                  })}
  </code></pre>
  <p>Basically <em>competitors</em> is an array of object and in the cell, I change to values to just its name. Do help thank you! :)</p>