Correctly handle link interactions on extension cards

[microbit-robert]

When using the keyboard, the "Learn More" links both open a link in a new tab and add the extension to the project when only the former should happen.

In the beta editor, the extension card "Learn More" links are now anchor tags instead of buttons. Some additional click handling is required to prevent the same keyboard error noted above also occuring when clicking these links.

This PR addresses both issues.

@microbit-matt-hillsdon

[Copilot]

PR Overview

This PR fixes an issue where using the keyboard on extension card "Learn More" links mistakenly triggers both opening a new tab and adding the extension to the project. The changes introduce dedicated click and keydown handlers to ensure that clicks on anchor tags aren’t misinterpreted as card selection events.

• Added a unified handler (handleLinkOrTriggerClick) that differentiates between anchor clicks and other interactions.
• Updated onClick and onKeyDown event bindings to use the new handlers.

Reviewed Changes

File	Description
react-common/components/controls/Card.tsx	Introduced specialized event handlers for mouse and keyboard events to prevent undesired behavior when interacting with anchor ("Learn More") links.

Copilot reviewed 1 out of 1 changed files in this pull request and generated 1 comment.

Comments suppressed due to low confidence (1)

react-common/components/controls/Card.tsx:42

• Consider using e.key instead of charCode to handle keyboard events in a more modern and readable way.

const charCode = (typeof e.which == "number") ? e.which : e.keyCode;

[Copilot]

Consider checking if the clicked element or any of its ancestors is an anchor tag to handle cases where a child element within the anchor is clicked.

Suggested change

	if (e.target && (e.target as HTMLElement).tagName == "A") {
	return;
	let target = e.target as HTMLElement;
	while (target) {
	if (target.tagName === "A") {
	return;
	}
	target = target.parentElement;