semantic ui react dropdown - updating the options and making the dropdown unselected

It seems very simple, but if the dropdown has an item selected and then I change the available options and that new set of options also happens to contain the previously selected item then that item will be automatically selected when options change.

What I want is for the dropdown to be showing its placeholder value whenever options change.

useEffect(() => {
    setSelectedReport(undefined);
  }, [availableReports]);

<Dropdown
   placeholder="Select Report"
   fluid
   selection
   onChange={(e, data) => handleSelectedReportChange(data)}
   options={availableReports}
   value={selectedReport.value }
></Dropdown>

Is it a case of maybe needing to somehow force the component to completely re-render, so it forgets about the previous options?

Solution

Very silly mistake on my part, I needed to make sure that the value property of the dropdown option is unique across the different set of options.