setting default value for select locks the field

[MrsSquatch]

Hi all! New here (and new to React) so be gentle with me. :)

The Problem
When I set a default value manually for a select element, it becomes "locked" and can't be changed.

The Backstory
I need to do the following things:

1. Retrieve data from a REST endpoint
2. Default form values to the data retrieved
3. Allow the user to update and save

I'm using axios and hooks useEffect/setState for the data retrieval. Since this code is async and hooked into component lifecycle points, I can't figure out how to retrieve data in this manner and set it in the useForm declaration as defaults. Because of that, I'm setting the defaults manually on the form elements.

Where I'm Stuck
I totally get this may have nothing to do with react-hook-form specifically but this library is awesome and integral to my code. I'm just not sure how to make this all work together.
I'm open to any refactor that allows me to:

1. Retrieve data from a REST endpoint
2. Default fields to the retrieved data
3. use react-hook-form for submitting and error handling

Sandboxes
First, the problematic one using the useEffect hook. (I removed the actual GET call since that's not the issue and added hardcoded data to simulate the process.) The dropdown is locked and won't allow selection of a new value.
https://codesandbox.io/s/react-hook-form-with-retrieved-defaults-vwju4

Here's my second sandbox setting default values as part of useForm. This works like a charm but I don't know how to do a GET and fill those values when the function loads.
https://codesandbox.io/s/react-hook-form-with-default-values-kyfl1

Thanks for your time and assistance!

[bluebill1049]

hey, I think this one is easy to fix with reset API.

[MrsSquatch]

Ah. well it's right there in the documentation, isn't it? Thank you, works perfectly!
https://codesandbox.io/s/react-hook-form-with-retrieved-defaultssolution-711i0