How do I 'await' information from a modal?

Question

I have a codesandbox for this question: https://codesandbox.io/s/chakra-modal-input-forked-jelhlr?file=/src/App.jsx

I want to get the filename via the modal, and when the user completes that action, I want to do stuff with that information, in this case I want to make an api request.

Thanks! EDIT: I have a form with the following onSubmit:

// 1. prepare data for POST request
const data=prepareData();
// 2. get title for data entry from user
onOpen();
// 3. send data via POST request
const response=await axios.post('route',{title,data})

The way things are, the modal shows at step 2 and without waiting for user input, step 3 occurs. I want to get the title name from the user and then I want step 3 to occur.

Answer 1

The value of the textbook is saved into the ref titleInputRef.

This means you can access the value of the ref/textbox with the following:

titleInputRef.current.value

To log the value to the console, for example:

console.log(titleInputRef.current.value)