[DOC] Update query editor content and screenshots (#3986)

Co-authored-by: Jack Baldry <[email protected]>

README.md

@@ -10,21 +10,21 @@
 
 Grafana Tempo is an open source, easy-to-use and high-scale distributed tracing backend. Tempo is cost-efficient, requiring only object storage to operate, and is deeply integrated with Grafana, Prometheus, and Loki.
 
-Tempo is Jaeger, Zipkin, Kafka, OpenCensus and OpenTelemetry compatible.  It ingests batches in any of the mentioned formats, buffers them and then writes them to Azure, GCS, S3 or local disk.  As such it is robust, cheap and easy to operate!
+Tempo is Jaeger, Zipkin, Kafka, OpenCensus and OpenTelemetry compatible.  It ingests batches in any of the mentioned formats, buffers them and then writes them to Azure, GCS, S3 or local disk. As such, it is robust, cheap and easy to operate!
 
 Tempo implements [TraceQL](https://grafana.com/docs/tempo/latest/traceql/), a traces-first query language inspired by LogQL and PromQL. This query language allows users to very precisely and easily select spans and jump directly to the spans fulfilling the specified conditions:
 
-<p align="center"><img src="docs/sources/tempo/getting-started/assets/grafana-query.png" alt="Tempo Screenshot"></p>
+![Tempo data source query editor](/media/docs/grafana/data-sources/tempo/query-editor/tempo-ds-query-ed-example-v11-a.png)
 
-## Getting Started
+## Getting started
 
 - [Get started documentation](https://grafana.com/docs/tempo/latest/getting-started/)
 - [Deployment Examples](./example)
   - [Docker Compose](./example/docker-compose)
   - [Helm](./example/helm)
   - [Jsonnet](./example/tk)
 
-## Further Reading
+## Further reading
 
 To learn more about Tempo, consult the following documents & talks:
 
@@ -34,7 +34,7 @@ To learn more about Tempo, consult the following documents & talks:
 [tempo_20_announce]: https://grafana.com/blog/2023/02/01/new-in-grafana-tempo-2.0-apache-parquet-as-the-default-storage-format-support-for-traceql/
 [traceql-post]: https://grafana.com/blog/2023/02/07/get-to-know-traceql-a-powerful-new-query-language-for-distributed-tracing/
 
-## Getting Help
+## Getting help
 
 If you have any questions or feedback regarding Tempo:
 
@@ -49,7 +49,7 @@ Tempo's receiver layer, wire format and storage format are all based directly on
 
 Check out the [Integration Guides](https://grafana.com/docs/tempo/latest/guides/instrumentation/) to see examples of OpenTelemetry instrumentation with Tempo.
 
-## Other Components
+## Other components
 
 ### tempo-vulture
 [tempo-vulture](https://github.com/grafana/tempo/tree/main/cmd/tempo-vulture) is Tempo's bird themed consistency checking tool.  It writes traces to Tempo and then queries them back in a variety of ways.

docs/sources/tempo/configuration/_index.md

@@ -3,8 +3,6 @@ title: Configure Tempo
 menuTitle: Configure
 description: Learn about available options in Tempo and how to configure them.
 weight: 400
-aliases:
-- /docs/tempo/latest/configuration/
 ---
 
 # Configure Tempo
@@ -33,6 +31,9 @@ The Tempo configuration options include:
   - [Configuration blocks](#configuration-blocks)
     - [Block config](#block-config)
     - [Filter policy config](#filter-policy-config)
+      - [Filter policy](#filter-policy)
+      - [Policy match](#policy-match)
+      - [Examples](#examples)
     - [KVStore config](#kvstore-config)
     - [Search config](#search-config)
     - [WAL config](#wal-config)
@@ -305,7 +306,7 @@ metrics_generator:
       # 0 disables heartbeat altogether
       [heartbeat_period: <duration> | default = 5s]
 
-      # The heartbeat timeout, after which, the instance is skipped. 
+      # The heartbeat timeout, after which, the instance is skipped.
       # 0 disables timeout.
       [heartbeat_timeout: <duration> | default = 1m]
 
@@ -316,7 +317,7 @@ metrics_generator:
       [instance_interface_names: <list of string> | default = ["eth0", "en0"] ]
 
       # Our advertised IP address in the ring, (usefull if the local ip =/= the external ip)
-      # Will default to the configured `instance_id` ip address, 
+      # Will default to the configured `instance_id` ip address,
       # if unset, will fallback to ip reported by `instance_interface_names`
       # (Effected by `enable_inet6`)
       [instance_addr: <string> | default = auto(instance_id, instance_interface_names)]
@@ -445,14 +446,14 @@ metrics_generator:
             [max_live_traces: <uint64>]
 
             # Whether server spans should be filtered in or not.
-            # If enabled, only parent spans or spans with the SpanKind of `server` will be retained 
+            # If enabled, only parent spans or spans with the SpanKind of `server` will be retained
             [filter_server_spans: <bool> | default = true]
 
             # Number of blocks that are allowed to be processed concurently
             [concurrent_blocks: <uint> | default = 10]
 
             # A tuning factor that controls whether the trace-level timestamp columns are used in a metrics query.
-            # If a block overlaps the time window by less than this ratio, then we skip the columns. 
+            # If a block overlaps the time window by less than this ratio, then the columns are skipped.
             # A value of 1.0 will always load the columns, and 0.0 will never load any.
             [time_overlap_cutoff: <float64> | default = 0.2]
 
@@ -1303,7 +1304,7 @@ parquet_dedicated_columns: <list of columns>
       # type of the attribute. options: string
       [type: <string>]
 
-      # scope of the attribute. 
+      # scope of the attribute.
       # options: resource, span
       [scope: <string>]
 ```

docs/sources/tempo/getting-started/metrics-from-traces.md

@@ -28,15 +28,15 @@ Span metrics are of particular interest if your system is not monitored with met
 Metrics generation is disabled by default. Contact Grafana Support to enable metrics generation in your organization.
 {{% /admonition %}}
 
-After the metrics generator is enabled in your organization, refer to [Metrics-generator configuration]({{< relref "../configuration" >}}) for information about metrics-generator options.
+After the metrics-generator is enabled in your organization, refer to [Metrics-generator configuration]({{< relref "../configuration" >}}) for information about metrics-generator options.
 
-<p align="center"><img src="../assets/trace_service_graph.png" alt="Trace service graph"></p>
+![Trace service graph](/media/docs/grafana/data-sources/tempo/query-editor/tempo-ds-query-service-graph.png)
 
 These metrics exist in your Hosted Metrics instance and can also be easily used to generate powerful custom dashboards.
 
 <p align="center"><img src="../assets/trace_custom_metrics_dash.png" alt="Trace custom metrics dashboard"></p>
 
-The metrics generator automatically generates exemplars as well which allows easy metrics to trace linking. [Exemplars](/docs/grafana-cloud/monitor-infrastructure/traces/exemplars/) are available in Grafana Cloud so you can also push your own.
+The metrics-generator automatically generates exemplars as well which allows easy metrics to trace linking. [Exemplars](https://grafana.com/docs/grafana/<GRAFANA_VERSION>/fundamentals/exemplars/) are available in Grafana Cloud so you can also push your own.
 
 <p align="center"><img src="../assets/trace_exemplars.png" alt="Trace exemplars"></p>
 

docs/sources/tempo/getting-started/tempo-in-grafana.md

@@ -16,23 +16,29 @@ Inspired by PromQL and LogQL, TraceQL is a query language designed for selecting
 
 The default Tempo search reviews the whole trace. TraceQL provides a method for formulating precise queries so you can quickly identify the traces and spans that you need. Query results are returned faster because the queries limit what is searched.
 
-You can run a TraceQL query either by issuing it to Tempo’s `q` parameter of the [`search` API endpoint]({{< relref "../api_docs#search" >}}), or, for those using Tempo in conjunction with Grafana, by using Grafana’s [TraceQL query editor]({{< relref "../traceql/query-editor" >}}).
+You can run a TraceQL query either by issuing it to Tempo’s `q` parameter of the [`search` API endpoint]({{< relref "../api_docs#search" >}}), or, for those using Tempo in conjunction with Grafana, by using the [TraceQL query editor]({{< relref "../traceql/query-editor" >}}).
 
 For details about how queries are constructed, read the [TraceQL documentation]({{< relref "../traceql" >}}).
 
-<p align="center"><img src="../../traceql/assets/query-editor-results-span.png" alt="Query editor showing span results" /></p>
+![TraceQL query editor showing span results](/media/docs/grafana/data-sources/tempo/query-editor/tempo-ds-query-ed-example-v11-a.png)
 
 The most basic functionality is to visualize a trace using its ID. Select the TraceQL tab and enter the ID to view it. This functionality is enabled by default and is available in all versions of Grafana.
 
-## Finding traces using Loki logs
+## Finding traces using Trace to logs
 
-Traces can be discovered by searching logs for entries containing trace IDs. This is most useful when your application also logs relevant information about the trace that can also be searched, such as HTTP status code, customer ID, etc. This feature requires Grafana 7.5 or later, with a linked Loki data source, and a [traceID derived field](/docs/grafana/latest/datasources/loki/#derived-fields).
+Traces can be discovered by searching logs for entries containing trace IDs.
+This is most useful when your application also logs relevant information about the trace that can also be searched, such as HTTP status code, customer ID, etc.
+This feature requires a linked Loki data source, and a [traceID derived field](/docs/grafana/<GRAFANA_VERSION>/datasources/loki/#derived-fields).
 
-## Find traces using Tempo tags search
+For more information, refer to the  [Trace to logs](https://grafana.com/docs/grafana/<GRAFANA_VERSION>/datasources/tempo/configure-tempo-data-source/#trace-to-logs) documentation.
+
+![Trace to logs lets you link your tracing data with log data](/media/docs/grafana/data-sources/tempo/trace-to-logs-v11.png)
+
+## Find traces using Search query builder
 
 Search for traces using common dimensions such as time range, duration, span tags, service names, and more. Use the trace view to quickly diagnose errors and high-latency events in your system.
 
-<p align="center"><img src="../../traceql/assets/screenshot-explore-traceql-search.png" alt="Showing how to build queries with common dimensions using query builder" /></p>
+![Showing how to build queries with common dimensions using the query builder](/media/docs/grafana/data-sources/tempo/query-editor/tempo-ds-query-builder-v11.png)
 
 ### Non-deterministic search
 
@@ -41,7 +47,10 @@ Most search functions are deterministic: using the same search criteria results
 However, Tempo search is non-deterministic.
 If you perform the same search twice, you’ll get different lists, assuming the possible number of results for your search is greater than the number of results you have your search set to return.
 
-When performing a search, Tempo does a massively parallel search over the given time range, and takes the first N results. Even identical searches will differ due to things like machine load and network latency. This approach values speed over predictability and is quite simple; enforcing that the search results are consistent would introduce additional complexity (and increase the time the user spends waiting for results). TraceQL follows the same behavior.
+When performing a search, Tempo does a massively parallel search over the given time range, and takes the first N results.
+Even identical searches differ due to things like machine load and network latency.
+This approach values speed over predictability and is quite simple; enforcing that the search results are consistent would introduce additional complexity (and increase the time the user spends waiting for results).
+TraceQL follows the same behavior.
 
 ## Service graph view
 
@@ -51,7 +60,7 @@ Once the requirements are set up, this pre-configured view is immediately availa
 
 For more information, refer to the [service graph view]({{< relref "../metrics-generator/service-graph-view" >}}).
 
-<p align="center"><img src="../assets/apm-overview.png" alt="Service graph view overview"></p>
+![Service graph view](/media/docs/grafana/data-sources/tempo/query-editor/tempo-ds-query-service-graph.png)
 
 ## View JSON file
 

docs/sources/tempo/metrics-generator/_index.md

@@ -1,7 +1,7 @@
 ---
 aliases:
-- /docs/tempo/latest/server_side_metrics/
-- /docs/tempo/latest/metrics-generator/
+  - ./server_side_metrics # /docs/tempo/<TEMPO_VERSION>/server_side_metrics/
+  - /docs/tempo/<TEMPO_VERSION>/metrics-generator/
 title: Metrics-generator
 description: Metrics-generator is an optional Tempo component that derives metrics from ingested traces.
 weight: 500
@@ -17,7 +17,7 @@ The metrics-generator processes spans and writes metrics to a Prometheus data so
 Enabling metrics generation and remote writing them to Grafana Cloud Metrics produces extra active series that could impact your billing. For more information on billing, refer to [Billing and usage](/docs/grafana-cloud/billing-and-usage/).
 {{% /admonition %}}
 
-## Overview
+## Architecture
 
 Metrics-generator leverages the data available in the ingest path in Tempo to provide additional value by generating metrics from traces.
 
@@ -29,29 +29,29 @@ Every processor derives different metrics. Currently, the following processors a
 - Span metrics
 - Local blocks
 
-<p align="center"><img src="server-side-metrics-arch-overview.png" alt="Service metrics architecture"></p>
+<p align="center"><img src="tempo-metrics-gen-overview.svg" alt="Service metrics architecture"></p>
 
-## Service graphs
+### Service graphs
 
 Service graphs are the representations of the relationships between services within a distributed system.
 
 This service graphs processor builds a map of services by analyzing traces, with the objective to find _edges_.
 Edges are spans with a parent-child relationship, that represent a jump (e.g. a request) between two services.
 The amount of request and their duration are recorded as metrics, which are used to represent the graph.
 
-To learn more about this processor, read the [documentation]({{< relref "./service_graphs" >}}).
+To learn more about this processor, refer to the [service graph]({{< relref "./service_graphs" >}}) documentation.
 
-## Span metrics
+### Span metrics
 
-The span metrics processor derives RED (Request, Error and Duration) metrics from spans.
+The span metrics processor derives RED (Request, Error, and Duration) metrics from spans.
 
-The span metrics processor will compute the total count and the duration of spans for every unique combination of dimensions.
+The span metrics processor computes the total count and the duration of spans for every unique combination of dimensions.
 Dimensions can be the service name, the operation, the span kind, the status code and any tag or attribute present in the span.
 The more dimensions are enabled, the higher the cardinality of the generated metrics.
 
-To learn more about this processor, read the [documentation]({{< relref "./span_metrics" >}}).
+To learn more about this processor, refer to the [span metrics]({{< relref "./span_metrics" >}}) documentation.
 
-## Local blocks
+### Local blocks
 
 The local blocks processor stores spans for a set period of time and
 enables more complex APIs to perform calculations on the data. The processor must be