Allow ${ } style interpolation for UI dashboard template URLs

Feature Description

The ui_config.dashboard_url_templates config option supports specifying URL templates that can be used to render links to external dashboards in various contexts in the UI.

The field currently supports {{ }} interpolation for placeholders such as Service.Name and Datacenter.

Unfortunately, when specifying this configuration from within a Helm chart, Helm's own {{ }} interpolation conflicts with the interpolation for this field. The only way around that conflict is to escape the interpolation characters (so they are skipped by Helm, but caught by the Consul UI). This is confusing and error-prone.

To solve that, we want to add a second interpolation format: ${ }, so that the results of the following would be equivalent:

some-url-{{ Datacenter }} => some-url-dc1
some-url-${ Datacenter }  => some-url-dc1

This task includes:

• Adding the new ${ } interpolation format to the render-template helper
• Adding tests to cover the new format to the existing render-template integration tests
  • Run the render template tests with yarn test:oss:view --filter=render-template from the ui/packages/consul-ui folder. Point your browser to the URL listed in the output of that command (e.g., http://localhost:7357/)
  • You can rerun the tests by refreshing the browser tab
  • If you need more info about running the UI tests, visit here and here
• Update the docs for https://www.consul.io/docs/agent/options#ui_config_dashboard_url_templates to reflect this new interpolation option.
  • Learn how to run the docs website locally here: https://github.com/hashicorp/consul/tree/main/website#consul-website
  • The source file for that config option is here: https://github.com/hashicorp/consul/blob/main/website/content/docs/agent/options.mdx
  • The docs should state which version the new interpolation option was added in. Show the version as "TBD" for now; we'll define the correct value during PR review.
  • Ignore that the docs mention a Service.Namespace placeholder is available. It's not currently (despite what the docs say). A separate issue was created for that: #11321.

For context, the render-template helper is used in the two places below, but that shouldn't matter assuming test cases are added to render-template-test.js:

• https://github.com/hashicorp/consul/blob/73730d356c4146178000d3ce04de28ee024b1299/ui/packages/consul-ui/app/templates/dc/services/show.hbs#L159-L161
• https://github.com/hashicorp/consul/blob/73730d356c4146178000d3ce04de28ee024b1299/ui/packages/consul-ui/app/templates/dc/services/show/topology.hbs#L143-L145

Use Case(s)

Specifying ui_config.dashboard_url_templates from a Helm chart without needing to escape characters.