Reset Value Problem on Chakra UI's Select Component

I've a problem about Chakra UI's select component. It's somehow doesn't reset their value. Also, when I press the button, Select component doesn't render with new value

https://codesandbox.io/s/compassionate-shockley-f9chz?file=/src/app.tsx:518-863

export const App = (): JSX.Element => {
  const [value, setValue] = React.useState("in");
  const onClick = () => {
    setValue(null);
  };

  console.log("App value", value);

  return (
    <div>
      <Select options={selectionOptions} value={value} />
      <Button onClick={onClick}> click </Button>
    </div>
  );
};

  const [value, setValue] = useState(propValue);

  useEffect(() => {
    if (handleChange) {
      handleChange(value);
    }
  }, [handleChange, value, setValue]);

    <Select
      {...rest}
      value={value}
      onChange={(event) => {
        setValue(event?.target?.value);
      }}
    >
      {options.map(({ value: currentValue, name }, index) => (
        <option key={index} value={currentValue}>
          {name}
        </option>
      ))}
    </Select>