Hide duplicate react-select options

Question

I want to hide duplicate options for a select-list. See this example for an illustration of what I mean. Right now, I can only select one of the duplicated options, but they still show.

I have tried to hide them using CSS.

The data:

const ERRORS = [
    {
        id: 1,
        customer: "Testcompany 1",
        sender: "Lars Olsen",
        title: "Conference Papers",
        body: "I don't know how this works...",
        predicted: 22, real: 34,

    },
    {
        id: 2,
        customer: "Testcompany 1",
        sender: "Stine Nilsen",
        title: "Expense Reports",
        body: "I need some help with the expense reports...",
        predicted: 13, real: 31,
    },
    {
        id: 3,
        customer: "Testcompany 1",
        sender: "Steinar Trolo",
        title: "Server Fail",
        body: "My server is failing. Please help.",
        predicted: 13, real: 31,
    },
    {
        id: 4,
        customer: "Testcompany 1",
        sender: "Steinar Trolo",
        title: "Server Fail",
        body: "My server is failing. Please help.",
        predicted: 13, real: 31,
        label: "Second"
    },
    {
        id: 5,
        customer: "Testcompany 2",
        sender: "Steinar Trolo",
        title: "Server Fail",
        body: "My server is failing. Please help.",
        predicted: 13, real: 31,
    }
]

The Select component:

<Select
  options={ERRORS}
  value={this.state.selectValue}
  onChange={this.updateValue.bind(this)}
  searchable
  labelKey="customer"
  valueKey="customer"
/>

Answer 1

If you want to offer only distinct customers, supply a list of only distinct customers, such as with Lodash:

options={_.uniqBy(ERRORS, (e) -> (e.customer))}

To avoid possible confusion, it probably would be preferable to not give a list of random objects with no duplicate customers, and just supply a list of distinct customers.