title: Filter out array to get out unique values and populate a select dropdown box
body: <p>I have an array that is coming from an API that can contain a combination of 4 different values:</p>
  
  <blockquote>
    <p>(none, A, B, C)</p>
  </blockquote>
  
  <p>That array is used to populate a select dropdown box.</p>
  
  <p>When I run the web app, the drop down box(select) that looks like this in my webpage:</p>
  
  <pre><code>&lt;select&gt;
      &lt;option value&gt;All&lt;/option&gt;
      &lt;option value="A,B,C"&gt;ABC&lt;/option&gt;
      &lt;option value&gt;&lt;/option&gt;
      &lt;option value="A,C"&gt;AC&lt;/option&gt;
      &lt;option value="B"&gt;B&lt;/option&gt;
      &lt;option value="B,C"&gt;BC&lt;/option&gt;
      &lt;option value="C"&gt;C&lt;/option&gt;
  select&gt;
  </code></pre>
  
  <p>When I want it to look like this:</p>
  
  <pre><code>&lt;select&gt;
      &lt;option value&gt;All&lt;/option&gt;
      &lt;option value="A"&gt;A&lt;/option&gt;
      &lt;option value="B"&gt;B&lt;/option&gt;
      &lt;option value="C"&gt;C&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>It is getting dynamically populated from state with this function in the React-Table library:</p>
  
  <pre><code>function SelectColumnFilter({
      column: { filterValue, setFilter, preFilteredRows, id },
  }) {
      // Calculate the options for filtering
      // using the preFilteredRows
      const options = React.useMemo(() =&gt; {
          const options = new Set()
          preFilteredRows.forEach(row =&gt; {
              options.add(row.values[id])
          })
          return [...options.values()]
      }, [id, preFilteredRows])
      console.log("SelectColumnFilter: ", options);
  </code></pre>
  
  <p>When I write out the options to the console, here is what I see:</p>
  
  <pre><code>0: (3) ["A", "B", "C"]
  1: (0) []
  2: (2) ["A", "C"
  3: (1) ["B"]
  4: (2) ["B", "C"]
  5: (1) ["C"]
  </code></pre>
  
  <p>So since I know that there are only 4 possible values, All, A, B, and C that I want to have in my select control, I was wondering if there's a way to filter out the option arrays to only show each unique value so that it looks like this:</p>
  
  <pre><code>&lt;select&gt;
      &lt;option value&gt;All&lt;/option&gt;
      &lt;option value="A"&gt;A&lt;/option&gt;
      &lt;option value="B"&gt;B&lt;/option&gt;
      &lt;option value="C"&gt;C&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>