luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

migrating <Tabs> to <CodeTabs> in /docs/connect/observability/ui-visualization

This commit is contained in:
Krastin Krastev 2022-01-24 16:10:03 +01:00
parent 32ee4e440d
commit fcddb890c5
1 changed files with 33 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
website/content/docs/connect/observability/ui-visualization.mdx
View File

@ -66,8 +66,7 @@ service named `prometheus-server` so each Consul agent can reach it on
A full configuration to enable Prometheus is given below.
<Tabs>
<Tab heading="HCL">
<CodeTabs>
```hcl
ui_config {
@ -79,9 +78,6 @@ ui_config {
}
```
</Tab>
<Tab heading="JSON">
```json
{
"ui_config": [
@ -98,8 +94,7 @@ ui_config {
}
```
</Tab>
</Tabs>
</CodeTabs>
Similarly, to configure the UI on Kubernetes, use this [reference](/docs/k8s/connect/observability/metrics).
@ -120,27 +115,22 @@ to the relevant information.
An example with Grafana is shown below.
<Tabs>
<Tab heading="HCL">
<CodeTabs tabs={[ "HCL", "JSON", "YAML (Kubernetes)" ]}>
<CodeBlockConfig>
```hcl
ui_config {
enabled = true
dashboard_url_templates {
service = "https://grafana.example.com/d/lDlaj-NGz/
service-overview?orgId=1&var-service={{Service.Name}}&
var-namespace={{Service.Namespace}}&
var-partition={{Service.Partition}}&var-dc={{Datacenter}}"
service = "https://grafana.example.com/d/lDlaj-NGz/service-overview?orgId=1&var-service={{Service.Name}}&var-namespace={{Service.Namespace}}&var-partition={{Service.Partition}}&var-dc={{Datacenter}}"
}
}
```
-> **Note**: the URL is wrapped over multiple lines to make it easier to read
without horizontal scrolling in the example above however this needs to be a
normal single-line string value in an HCL configuration file.
</CodeBlockConfig>
</Tab>
<Tab heading="JSON">
<CodeBlockConfig>
```json
{
@ -148,10 +138,7 @@ normal single-line string value in an HCL configuration file.
{
"dashboard_url_templates": [
{
"service": "https://grafana.example.com/d/lDlaj-NGz/
service-overview?orgId=1\u0026var-service={{Service.Name}}\u0026
var-namespace={{Service.Namespace}}\u0026
var-partition={{Service.Partition}}\u0026var-dc={{Datacenter}}"
"service": "https://grafana.example.com/d/lDlaj-NGz/service-overview?orgId=1\u0026var-service={{Service.Name}}\u0026var-namespace={{Service.Namespace}}\u0026var-partition={{Service.Partition}}\u0026var-dc={{Datacenter}}"
}
],
"enabled": true
@ -160,17 +147,19 @@ normal single-line string value in an HCL configuration file.
}
```
-> **Note**: the URL is wrapped over multiple lines to make it easier to read
without horizontal scrolling in the example above however this needs to be a
normal single-line string value in a JSON configuration file.
</CodeBlockConfig>
</Tab>
<Tab heading="Kubernetes YAML">
On Kubernetes, Consul Server configuration is set in your Helm config via the
[`server.extraConfig`](/docs/k8s/helm#v-server-extraconfig) key as JSON:
<CodeBlockConfig>
```yaml
################################### Notes: ####################################
# On Kubernetes, Consul Server configuration is set in your Helm config via #
# the server.extraConfig key as JSON. #
# #
# The `{{` characters in the URL must be escaped using `{{ "{{" }}` so that #
# Helm doesn't try to template them. #
###############################################################################
# The UI is enabled by default so this stanza is not required.
ui:
enabled: true
@ -185,10 +174,9 @@ server:
}
```
-> **Note**: The `{{` characters in the URL must be escaped using `{{ "{{" }}` so that Helm doesn't try to template them.
</CodeBlockConfig>
</Tab>
</Tabs>
</CodeTabs>
![Consul UI Service Dashboard Link](/img/ui-dashboard-url-template.png)
@ -221,6 +209,8 @@ un-authenticated workloads on the network**.
With ACLs enabled, the proxy endpoint requires a valid token with read access
to all nodes and services (across all namespaces in Enterprise):
<CodeTabs>
```hcl
# Consul OSS
service_prefix "" {
@ -241,6 +231,8 @@ namespace_prefix "" {
}
```
</CodeTabs>
It's typical for most authenticated users to have this level of access in Consul
as it's required for viewing the catalog or discovering services. If you use a
[Single Sign-On integration](/docs/security/acl/auth-methods/oidc) (Consul
@ -285,8 +277,7 @@ visible to Consul operators in the configuration file while UI users can query
the metrics they need without separately obtaining a token for that provider or
having a token exposed to them that they might be able to use elsewhere.
<Tabs>
<Tab heading="HCL">
<CodeTabs>
```hcl
ui_config {
@ -304,9 +295,6 @@ ui_config {
}
```
</Tab>
<Tab heading="JSON">
```json
{
"ui_config": [
@ -329,8 +317,7 @@ ui_config {
}
```
</Tab>
</Tabs>
</CodeTabs>
## Custom Metrics Providers
@ -347,6 +334,8 @@ feedback on [GitHub](https://github.com/hashicorp/consul) or
The template for a complete provider JavaScript file is given below.
<CodeTabs>
```JavaScript
(function () {
var provider = {
@ -553,6 +542,8 @@ The template for a complete provider JavaScript file is given below.
}());
```
</CodeTabs>
Additionally, the built in [Prometheus
provider code](https://github.com/hashicorp/consul/blob/main/ui/packages/consul-ui/vendor/metrics-providers/prometheus.js)
can be used as a reference.
@ -565,8 +556,7 @@ named `example-provider`, which is defined in
have been specified in the call to `consul.registerMetricsProvider` as in the
code listing in the last section.
<Tabs>
<Tab heading="HCL">
<CodeTabs>
```hcl
ui_config {
@ -581,9 +571,6 @@ ui_config {
}
```
</Tab>
<Tab heading="JSON">
```json
{
"ui_config": {
@ -595,8 +582,7 @@ ui_config {
}
```
</Tab>
</Tabs>
</CodeTabs>
More than one JavaScript file may be specified in
[`metrics_provider_files`](/docs/agent/options#ui_config_metrics_provider_files)