Fix synthetic links not using useHref

[joshuajaco]

Closes #6347

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

🧢 Your Project:

[devongovett]

Thanks, this makes sense.

[devongovett]

This could cause issues due to a hook being called conditionally. If we're sure that there is always an href when this function is called, we could probably make href required in the type.

[joshuajaco]

I agree that this can cause issues, however I directly mirrored the implementation of useLinkProps:

react-spectrum/packages/@react-aria/utils/src/openLink.tsx

Lines 160 to 170 in 10bac54

	export function useLinkProps(props: LinkDOMProps) {
	let router = useRouter();
	return {
	href: props?.href ? router.useHref(props?.href) : undefined,
	target: props?.target,
	rel: props?.rel,
	download: props?.download,
	ping: props?.ping,
	referrerPolicy: props?.referrerPolicy
	};
	}

Also useSyntheticLinkProps is used in useGridListItem, where we do not always have an href.

If we want to prevent useHref from being called conditionally we would have to instead split up useGridListItem in to two hooks, one with href and one without. We'd also have to conditionally render between two components everywhere useGridListItem is used to swap between the two new hooks.

Alternatively we could call useHref with an empty string. After a quick search this seems to be a valid href according to this detailed stackoverflow comment.

[devongovett]

ok if it was there before I guess it's probably fine for now.