Fix image upload modal cancel loop

[david-crespo]

Fixes #1745. Will make a separate issue for the remaining part of the problem.

I believe the issue is due to both the click outside and focus outside triggering onDismiss, which triggers the confirm(). My theory so far is that when you cancel out of the confirm, focus returns to the dismissable layer overlay, which triggers onFocusOutside again.

This change fixes the infinite loop of confirms that fully breaks the page, but it does not fix the double confirm when you click elsewhere (this is shown at the end of the recording). Another issue shown in the recording is that when you click the background over the inputs in the side modal, it seems to focus them. This may be directly caused by the preventDefault. In any case, it's an improvement on the current broken state.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
console	✅ Ready (Inspect)	Visit Preview	Sep 7, 2023 4:24pm

[github-actions]

license-eye has totally checked 620 files.

Valid	Invalid	Ignored	Fixed
567	1	52	0

Click to see the invalid file list

• app/forms/modal-loop.tsx

[github-actions]

Suggested change

	import { useState } from 'react'
	/*
	* This Source Code Form is subject to the terms of the Mozilla Public
	* License, v. 2.0. If a copy of the MPL was not distributed with this
	* file, you can obtain one at https://mozilla.org/MPL/2.0/.
	*
	* Copyright Oxide Computer Company
	*/
	import { useState } from 'react'

[david-crespo]

I need a break from Safari failing my E2Es before I throw my computer out the window. But I will fix it.