Do I understand correctly why the <select> value doesn't change?

Here’s the sandbox

It doesn’t change because the array options stays the same even though indexOf gets a new argument value?

>Solution :

The main reason your select won’t show the selected value is because you’re setting the value to the index of the array, not the value itself.

For example, value needs to be high, not index 0, so simply change the select to:

<select
    value={value.metrics}
    onChange={(e) => setValue({ ...value, metrics: e.target.value })}
>

Updated CodeSandBox