fix(hosting): use dynamic hostname for external link

[tanxan]

Fixes #1140

Type of Change

• Bug fix (non-breaking change which fixes an issue)

How Has This Been Tested?

• Manual: Verified in a container environment; the Hosting link now dynamically reflects the current hostname, maintaining origin consistency.
• Automated: Ran npm test, all tests passed successfully.

The Solution

Instead of relying on the static config.hosting.hostAndPort for external navigation, this change dynamically passes window.location.hostname into the hostAndPort helper directly within the component.

// Before
linkToExternal={config.hosting && `//${config.hosting.hostAndPort}/`}

// After
linkToExternal={
  config.hosting &&
  `//${hostAndPort(window.location.hostname, config.hosting.port)}/`
}

[google-cla]

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

[gemini-code-assist]

Code Review

This pull request updates the hosting emulator card link to dynamically construct the URL using the current window's hostname and the hosting port via the hostAndPort helper. Feedback was provided regarding IPv6 addresses, where window.location.hostname already contains square brackets, potentially leading to an invalid URL (e.g., //[[::1]]:5000/). It is recommended to strip any existing square brackets from the hostname before passing it to hostAndPort.

[wiz-9635d3485b]

Wiz Scan Summary

Scanner	Findings
Vulnerabilities	-
Sensitive Data	-
Secrets	-
IaC Misconfigurations	-
SAST Findings	2
Software Management Findings	-
Total	2

View scan details in Wiz

To detect these findings earlier in the dev lifecycle, try using Wiz Code VS Code Extension.