Wp-calypso: InlineHelp: FAB should not auto-close

[jancavan]

Steps to reproduce

1. Open the FAB icon
2. Type in a query and click on one of the results (this opens up a modal)
3. Close the modal and go back to the FAB (FAB is closed/collapsed)

We should give users control by allowing them to close the FAB themselves.

I understand we have an ongoing test to compare this FAB against the Help section in Customer Home, so this can be dealt with later after that test has concluded.

cc @davemart-in

[davemart-in]

Thanks Jan. I moved this to the Janitor queue.

[retrofox]

This is a tricky one. The Popover gets closed because it detects a click outside event when the user interacts with the modal. It's possible to define the ignoreContext to do some exceptions.

[allilevine]

@pablinos and I investigated two possible solutions: 1) stop the click event from propagating from the modal, or 2) get a ref to the Dialog component and pass it to the ignoreContext prop on the Popover component.

For 1, the modal is a React portal created by a package (react-modal) so it didn't make sense to change how the modal handled click events.

For 2, we were able to add a ref to the Dialog using the useRef hook, but we determined that to pass it to the unrelated Popover component we'd need to add it to global state. It's not good practice to store refs in the store, though. It's also not possible to use a Document method like getElementById() because the dialog element isn't in the DOM when we're trying to pass in the ref (when the popover is created).

[aaronrobertshaw]

My understanding is that we haven't been able to make any further progress on this issue.

@davemart-in Do you think this one is worth continuing to pursue?

[davemart-in]

I'm going to close this one out for now. We can always re-open it down the line. Thanks for digging in @allilevine, @retrofox, and @aaronrobertshaw!