I am new to React web development, and I am curious what is the best way to handle following situation:

To simplify the problem, let's say that there is an Invoice form where user inputs basic invoice data like number, date, payment type, shipping method etc..., and amongst other, user needs to choose an invoice customer. If the customer is not present in database, user needs to input a new customer through separate Customer form component.

Two solutions come to my mind:

First is to open a popup/dialog within the Invoice form, which contains all the customer details, so that user actually never leaves the Invoice form and keeps all user input data, and after the new customer data has been submitted through popup, user can choose that particular customer.

Second solution that comes to mind is to redirect the user to customer form url, but then all of invoice data needs to be put somewhere temporarily, presumably in redux store or local storage, and after the customer has been submitted, user is redirected back to invoice form, and all of initial input data is retrieved from storage and present to user.

It seems to me that both solutions have pros and cons, I am not a very big fan of popups and dialogs, but the second solution seems like a lot of work for something that simple. I've seen both of them implemented on other websites. Is there any third option that I haven't considered, or what do you suggest between these two?