From d54389fbcfe7ffd67e15f5a49951ae893239b216 Mon Sep 17 00:00:00 2001
From: Jacek Migdal <jacek@quesma.com>
Date: Mon, 6 May 2024 13:40:42 +0200
Subject: [PATCH] UI refactor (#39)

This is a giant change. Mostly move and rename with minor delete of
unused code.

Principle:
- replace `html_pages` and `html_panels` with filer per each tab
- reduce the amount of exposed public API using `internal` and private
name
- keep every non-test file below 300 lines

Long term goals:
- Make UI configurable (e.g. port, disable debug, limit amount of
messages)
- Be able to refactor so one UI can attach to multiple quesma consoles
- Make modular UI, so it's easy to add new tabs, even for occasional use
case

More changes will follow (e.g. more packages, configurability)
---
 quesma/quesma/ui/console_routes.go            |  57 +-
 quesma/quesma/ui/dashboard.go                 | 228 +++++
 quesma/quesma/ui/dashboard_drilldown.go       |  32 +
 quesma/quesma/ui/data_sources.go              |  80 ++
 quesma/quesma/ui/html_pages.go                | 933 ------------------
 quesma/quesma/ui/html_panels.go               | 418 --------
 quesma/quesma/ui/html_utils.go                |  95 ++
 quesma/quesma/ui/ingest.go                    |  89 ++
 .../ui/{ => internal/buffer}/html_buffer.go   |   2 +-
 .../{ => internal/buffer}/html_buffer_test.go |   2 +-
 .../quesma/ui/{ => internal}/sqlfmt/pretty.go |   0
 .../ui/{ => internal}/sqlfmt/pretty_test.go   |   0
 quesma/quesma/ui/live_tail.go                 | 284 ++++++
 quesma/quesma/ui/live_tail_drilldown.go       | 275 ++++++
 quesma/quesma/ui/management_console.go        | 150 +--
 quesma/quesma/ui/routing.go                   |  77 ++
 quesma/quesma/ui/schema.go                    | 275 ++++++
 quesma/quesma/ui/telemetry.go                 |  36 +
 quesma/quesma/ui/unsupported_queries.go       |  51 +-
 19 files changed, 1551 insertions(+), 1533 deletions(-)
 create mode 100644 quesma/quesma/ui/dashboard.go
 create mode 100644 quesma/quesma/ui/dashboard_drilldown.go
 create mode 100644 quesma/quesma/ui/data_sources.go
 delete mode 100644 quesma/quesma/ui/html_pages.go
 delete mode 100644 quesma/quesma/ui/html_panels.go
 create mode 100644 quesma/quesma/ui/html_utils.go
 create mode 100644 quesma/quesma/ui/ingest.go
 rename quesma/quesma/ui/{ => internal/buffer}/html_buffer.go (97%)
 rename quesma/quesma/ui/{ => internal/buffer}/html_buffer_test.go (96%)
 rename quesma/quesma/ui/{ => internal}/sqlfmt/pretty.go (100%)
 rename quesma/quesma/ui/{ => internal}/sqlfmt/pretty_test.go (100%)
 create mode 100644 quesma/quesma/ui/live_tail.go
 create mode 100644 quesma/quesma/ui/live_tail_drilldown.go
 create mode 100644 quesma/quesma/ui/routing.go
 create mode 100644 quesma/quesma/ui/schema.go
 create mode 100644 quesma/quesma/ui/telemetry.go

diff --git a/quesma/quesma/ui/console_routes.go b/quesma/quesma/ui/console_routes.go
index 06fa6cba3..6a5d0ace4 100644
--- a/quesma/quesma/ui/console_routes.go
+++ b/quesma/quesma/ui/console_routes.go
@@ -3,16 +3,18 @@ package ui
 import (
 	"embed"
 	"encoding/json"
+	"errors"
 	"github.com/gorilla/mux"
 	"mitmproxy/quesma/logger"
 	"mitmproxy/quesma/stats"
 	"net/http"
+	"runtime"
 )
 
 const (
+	uiTcpPort              = "9999"
 	managementInternalPath = "/_quesma"
 	healthPath             = managementInternalPath + "/health"
-	bypassPath             = managementInternalPath + "/bypass"
 )
 
 //go:embed asset/*
@@ -25,8 +27,6 @@ func (qmc *QuesmaManagementConsole) createRouting() *mux.Router {
 
 	router.HandleFunc(healthPath, qmc.checkHealth)
 
-	router.HandleFunc(bypassPath, bypassSwitch).Methods("POST")
-
 	router.PathPrefix("/debug/pprof/").Handler(http.DefaultServeMux)
 
 	router.HandleFunc("/", func(writer http.ResponseWriter, req *http.Request) {
@@ -56,7 +56,7 @@ func (qmc *QuesmaManagementConsole) createRouting() *mux.Router {
 	})
 
 	router.HandleFunc("/telemetry", func(writer http.ResponseWriter, req *http.Request) {
-		buf := qmc.generatePhoneHome()
+		buf := qmc.generateTelemetry()
 		_, _ = writer.Write(buf)
 	})
 
@@ -71,7 +71,7 @@ func (qmc *QuesmaManagementConsole) createRouting() *mux.Router {
 	})
 
 	router.HandleFunc("/ingest-statistics", func(writer http.ResponseWriter, req *http.Request) {
-		buf := qmc.generateStatisticsLiveTail()
+		buf := qmc.generateIngestStatistics()
 		_, _ = writer.Write(buf)
 	})
 
@@ -160,3 +160,50 @@ func (qmc *QuesmaManagementConsole) createRouting() *mux.Router {
 	router.PathPrefix("/static/").Handler(http.StripPrefix("/static/", http.FileServer(http.FS(uiFs))))
 	return router
 }
+
+func (qmc *QuesmaManagementConsole) newHTTPServer() *http.Server {
+	return &http.Server{
+		Addr:    ":" + uiTcpPort,
+		Handler: qmc.createRouting(),
+	}
+}
+
+func panicRecovery(h http.Handler) http.Handler {
+	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		defer func() {
+			if err := recover(); err != nil {
+				buf := make([]byte, 2048)
+				n := runtime.Stack(buf, false)
+				buf = buf[:n]
+
+				w.WriteHeader(http.StatusInternalServerError)
+				w.Header().Set("Content-Type", "text/plain")
+				w.Write([]byte("Internal Server Error\n\n"))
+
+				w.Write([]byte("Stack:\n"))
+				w.Write(buf)
+				logger.Error().Msgf("recovering from err %v\n %s", err, buf)
+			}
+		}()
+
+		h.ServeHTTP(w, r)
+	})
+}
+
+func (qmc *QuesmaManagementConsole) checkHealth(writer http.ResponseWriter, _ *http.Request) {
+	health := qmc.checkElasticsearch()
+	if health.status != "red" {
+		writer.WriteHeader(200)
+		writer.Header().Set("Content-Type", "application/json")
+		_, _ = writer.Write([]byte(`{"cluster_name": "quesma"}`))
+	} else {
+		writer.WriteHeader(503)
+		_, _ = writer.Write([]byte(`Elastic search is unavailable: ` + health.message))
+	}
+}
+
+func (qmc *QuesmaManagementConsole) listenAndServe() {
+	if err := qmc.ui.ListenAndServe(); err != nil && !errors.Is(err, http.ErrServerClosed) {
+		logger.Fatal().Msgf("Error starting server: %v", err)
+	}
+}
diff --git a/quesma/quesma/ui/dashboard.go b/quesma/quesma/ui/dashboard.go
new file mode 100644
index 000000000..5b7d1d66a
--- /dev/null
+++ b/quesma/quesma/ui/dashboard.go
@@ -0,0 +1,228 @@
+package ui
+
+import (
+	"fmt"
+	"github.com/shirou/gopsutil/v3/cpu"
+	"github.com/shirou/gopsutil/v3/host"
+	"github.com/shirou/gopsutil/v3/mem"
+	"mitmproxy/quesma/buildinfo"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
+	"mitmproxy/quesma/stats/errorstats"
+	"net/url"
+	"runtime"
+	"strings"
+	"time"
+)
+
+func (qmc *QuesmaManagementConsole) generateDashboard() []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("dashboard"))
+
+	buffer.Html(`<main id="dashboard-main">` + "\n")
+
+	// Unfortunately, we need tiny bit of javascript to pause the animation.
+	buffer.Html(`<script type="text/javascript">`)
+	buffer.Html(`var checkbox = document.getElementById("autorefresh");`)
+	buffer.Html(`var dashboard = document.getElementById("dashboard-main");`)
+	buffer.Html(`checkbox.addEventListener('change', function() {`)
+	buffer.Html(`if (this.checked) {`)
+	buffer.Html(`dashboard.classList.remove("paused");`)
+	buffer.Html(`} else {`)
+	buffer.Html(`dashboard.classList.add("paused");`)
+	buffer.Html(`}`)
+	buffer.Html(`});`)
+	buffer.Html(`</script>` + "\n")
+
+	buffer.Html(`<div id="svg-container">`)
+	buffer.Html(`<svg width="100%" height="100%" viewBox="0 0 1000 1000" preserveAspectRatio="none">` + "\n")
+	// One limitation is that, we don't update color of paths after initial draw.
+	// They rarely change, so it's not a big deal for now.
+	// Clickhouse -> Kibana
+	if qmc.config.ReadsFromClickhouse() {
+		status, _ := qmc.generateDashboardTrafficText(RequestStatisticKibana2Clickhouse)
+		buffer.Html(fmt.Sprintf(`<path d="M 0 250 L 1000 250" fill="none" stroke="%s" />`, status))
+	}
+	// Elasticsearch -> Kibana
+	if qmc.config.ReadsFromElasticsearch() {
+		status, _ := qmc.generateDashboardTrafficText(RequestStatisticKibana2Elasticsearch)
+		buffer.Html(fmt.Sprintf(`<path d="M 0 350 L 150 350 L 150 700 L 1000 700" fill="none" stroke="%s" />`, status))
+	}
+
+	// Ingest -> Clickhouse
+	if qmc.config.WritesToClickhouse() {
+		status, _ := qmc.generateDashboardTrafficText(RequestStatisticIngest2Clickhouse)
+		buffer.Html(fmt.Sprintf(`<path d="M 1000 350 L 300 350 L 300 650 L 0 650" fill="none" stroke="%s" />`, status))
+	}
+	// Ingest -> Elasticsearch
+	if qmc.config.WritesToElasticsearch() {
+		status, _ := qmc.generateDashboardTrafficText(RequestStatisticIngest2Elasticsearch)
+		buffer.Html(fmt.Sprintf(`<path d="M 1000 800 L 0 800" fill="none" stroke="%s" />`, status))
+	}
+	buffer.Html(`</svg>` + "\n")
+	buffer.Write(qmc.generateDashboardTrafficPanel())
+	buffer.Html(`</div>` + "\n")
+
+	buffer.Html(`<div id="dashboard">` + "\n")
+	buffer.Write(qmc.generateDashboardPanel())
+	buffer.Html("</div>\n")
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
+
+func (qmc *QuesmaManagementConsole) generateDashboardTrafficText(typeName string) (string, string) {
+	reqStats := qmc.requestsStore.GetRequestsStats(typeName)
+	status := "green"
+	if reqStats.ErrorRate > 0.20 {
+		status = "red"
+	}
+	return status, fmt.Sprintf("%4.1f req/s, err:%5.1f%%, p99:%3dms",
+		reqStats.RatePerMinute/60, reqStats.ErrorRate*100, reqStats.Duration99Percentile)
+}
+
+func (qmc *QuesmaManagementConsole) generateDashboardTrafficElement(typeName string, y int) string {
+	status, text := qmc.generateDashboardTrafficText(typeName)
+	return fmt.Sprintf(
+		`<div style="left: 40%%; top: %d%%" id="traffic-%s" hx-swap-oob="true" class="traffic-element %s">%s</div>`,
+		y, typeName, status, text)
+}
+
+func (qmc *QuesmaManagementConsole) generateDashboardTrafficPanel() []byte {
+	var buffer buffer.HtmlBuffer
+
+	// Clickhouse -> Kibana
+	if qmc.config.ReadsFromClickhouse() {
+		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticKibana2Clickhouse, 21))
+	}
+
+	// Elasticsearch -> Kibana
+	if qmc.config.ReadsFromElasticsearch() {
+		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticKibana2Elasticsearch, 66))
+	}
+
+	// Ingest -> Clickhouse
+	if qmc.config.WritesToClickhouse() {
+		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticIngest2Clickhouse, 31))
+	}
+
+	// Ingest -> Elasticsearch
+	if qmc.config.WritesToElasticsearch() {
+		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticIngest2Elasticsearch, 76))
+	}
+
+	return buffer.Bytes()
+}
+
+func secondsToTerseString(second uint64) string {
+	return (time.Duration(second) * time.Second).String()
+}
+
+func statusToDiv(s healthCheckStatus) string {
+	return fmt.Sprintf(`<div class="status %s" title="%s">%s</div>`, s.status, s.tooltip, s.message)
+}
+
+func (qmc *QuesmaManagementConsole) generateDashboardPanel() []byte {
+	var buffer buffer.HtmlBuffer
+
+	dashboardName := "<h3>Kibana</h3>"
+	storeName := "<h3>Elasticsearch</h3>"
+	if qmc.config.Elasticsearch.Url != nil && strings.Contains(qmc.config.Elasticsearch.Url.String(), "opensearch") {
+		dashboardName = "<h3>OpenSearch</h3><h3>Dashboards</h3>"
+		storeName = "<h3>OpenSearch</h3>"
+	}
+
+	clickhouseName := "<h3>ClickHouse</h3>"
+	if qmc.config.Hydrolix.Url != nil {
+		clickhouseName = "<h3>Hydrolix</h3>"
+	}
+
+	buffer.Html(`<div id="dashboard-kibana" class="component">`)
+	if qmc.config.Elasticsearch.AdminUrl != nil {
+		buffer.Html(fmt.Sprintf(`<a href="%s">`, qmc.config.Elasticsearch.AdminUrl.String()))
+	}
+	buffer.Html(dashboardName)
+	if qmc.config.Elasticsearch.AdminUrl != nil {
+		buffer.Html(`</a>`)
+	}
+	buffer.Html(statusToDiv(qmc.checkKibana()))
+	buffer.Html(`</div>`)
+
+	buffer.Html(`<div id="dashboard-ingest" class="component">`)
+	buffer.Html(`<h3>Ingest</h3>`)
+	buffer.Html(statusToDiv(qmc.checkIngest()))
+	buffer.Html(`</div>`)
+
+	buffer.Html(`<div id="dashboard-elasticsearch" class="component">`)
+	buffer.Html(storeName)
+	buffer.Html(statusToDiv(qmc.checkElasticsearch()))
+	buffer.Html(`</div>`)
+
+	buffer.Html(`<div id="dashboard-clickhouse" class="component">`)
+	if qmc.config.ClickHouse.AdminUrl != nil {
+		buffer.Html(fmt.Sprintf(`<a href="%s">`, qmc.config.ClickHouse.AdminUrl.String()))
+	}
+	buffer.Html(clickhouseName)
+	if qmc.config.ClickHouse.AdminUrl != nil {
+		buffer.Html(`</a>`)
+	}
+	buffer.Html(statusToDiv(qmc.checkClickhouseHealth()))
+	buffer.Html(`</div>`)
+
+	buffer.Html(`<div id="dashboard-traffic" class="component">`)
+
+	buffer.Html(`<div id="dashboard-quesma" class="component">`)
+	buffer.Html(`<h3>Quesma</h3>`)
+
+	cpuStr := ""
+	c0, err0 := cpu.Percent(0, false)
+
+	if err0 == nil {
+		cpuStr = fmt.Sprintf("Host CPU: %.1f%%", c0[0])
+	} else {
+		cpuStr = fmt.Sprintf("Host CPU: N/A (error: %s)", err0.Error())
+	}
+
+	buffer.Html(fmt.Sprintf(`<div class="status">%s</div>`, cpuStr))
+
+	var m runtime.MemStats
+	runtime.ReadMemStats(&m)
+	memStr := fmt.Sprintf("Memory used: %1.f MB", float64(m.Alloc)/1024.0/1024.0)
+	if v, errV := mem.VirtualMemory(); errV == nil {
+		total := float64(v.Total) / 1024.0 / 1024.0 / 1024.0
+		memStr += fmt.Sprintf(", avail: %.1f GB", total)
+	}
+	buffer.Html(fmt.Sprintf(`<div class="status">%s</div>`, memStr))
+
+	duration := uint64(time.Since(qmc.startedAt).Seconds())
+
+	buffer.Html(fmt.Sprintf(`<div class="status">Started: %s ago</div>`, secondsToTerseString(duration)))
+	buffer.Html(fmt.Sprintf(`<div class="status">Mode: %s</div>`, qmc.config.Mode.String()))
+
+	if h, errH := host.Info(); errH == nil {
+		buffer.Html(fmt.Sprintf(`<div class="status">Host uptime: %s</div>`, secondsToTerseString(h.Uptime)))
+	}
+
+	buffer.Html("<div>Version: ")
+	buffer.Text(buildinfo.Version)
+	buffer.Html("</div>")
+
+	buffer.Html(`</div>`)
+
+	buffer.Html(`<div id="dashboard-errors" class="component">`)
+	errors := errorstats.GlobalErrorStatistics.ReturnTopErrors(5)
+	if len(errors) > 0 {
+		buffer.Html(`<h3>Top errors:</h3>`)
+		for _, e := range errors {
+			buffer.Html(fmt.Sprintf(`<div class="status">%d: <a href="/error/%s">%s</a></div>`,
+				e.Count, url.PathEscape(e.Reason), e.Reason))
+		}
+	} else {
+		buffer.Html(`<h3>No errors</h3>`)
+	}
+	buffer.Html(`</div>`)
+	buffer.Html(`</div>`)
+
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/dashboard_drilldown.go b/quesma/quesma/ui/dashboard_drilldown.go
new file mode 100644
index 000000000..a180d3e5f
--- /dev/null
+++ b/quesma/quesma/ui/dashboard_drilldown.go
@@ -0,0 +1,32 @@
+package ui
+
+import (
+	"fmt"
+	"mitmproxy/quesma/stats/errorstats"
+)
+
+func (qmc *QuesmaManagementConsole) generateErrorForReason(reason string) []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation(fmt.Sprintf("Errors with reason '%s'", reason)))
+
+	buffer.Html(`<main id="errors">`)
+	errors := errorstats.GlobalErrorStatistics.ErrorReportsForReason(reason)
+	// TODO: Make it nicer
+	for _, errorReport := range errors {
+		buffer.Html("<p>").Text(errorReport.ReportedAt.String() + " " + errorReport.DebugMessage).Html("</p>\n")
+	}
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/">&nbsp;<input class="btn" type="submit" value="Back to dashboard" /></form>`)
+	// TODO: implement
+	// buffer.Html(`<form action="/dashboard">&nbsp;<input class="btn" type="submit" value="See requests with errors" /></form>`)
+	buffer.Html("\n</div>")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/data_sources.go b/quesma/quesma/ui/data_sources.go
new file mode 100644
index 000000000..fd80798b2
--- /dev/null
+++ b/quesma/quesma/ui/data_sources.go
@@ -0,0 +1,80 @@
+package ui
+
+import (
+	"fmt"
+	"slices"
+	"strings"
+)
+
+func (qmc *QuesmaManagementConsole) generateDatasources() []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("datasources"))
+
+	buffer.Html(`<main id="datasources">`)
+	buffer.Html(`<h2>Data sources</h2>`)
+
+	buffer.Html(`<h3>Clickhouse</h3>`)
+
+	buffer.Html(`<ul>`)
+
+	tableNames := []string{}
+	for tableName := range qmc.config.IndexConfig {
+		tableNames = append(tableNames, tableName)
+	}
+	slices.Sort(tableNames)
+	tables := qmc.logManager.GetTableDefinitions()
+	slices.Sort(tableNames)
+	for _, tableName := range tableNames {
+		if _, exist := tables.Load(tableName); exist {
+			buffer.Html(fmt.Sprintf(`<li>%s (table exists)</li>`, tableName))
+		} else {
+			buffer.Html(fmt.Sprintf(`<li>%s</li>`, tableName))
+		}
+	}
+	buffer.Html(`</ul>`)
+
+	buffer.Html(`<h3>Elasticsearch</h3>`)
+
+	buffer.Html(`<ul>`)
+
+	qmc.indexManagement.Start()
+	indexNames := []string{}
+	internalIndexNames := []string{}
+	for indexName := range qmc.indexManagement.GetSourceNames() {
+		if strings.HasPrefix(indexName, ".") {
+			internalIndexNames = append(internalIndexNames, indexName)
+		} else {
+			indexNames = append(indexNames, indexName)
+		}
+	}
+
+	slices.Sort(indexNames)
+	slices.Sort(internalIndexNames)
+	for _, indexName := range indexNames {
+		buffer.Html(fmt.Sprintf(`<li>%s</li>`, indexName))
+	}
+
+	if len(internalIndexNames) > 0 {
+		buffer.Html(`<ul>`)
+
+		for _, indexName := range internalIndexNames {
+			buffer.Html(fmt.Sprintf(`<li><small>%s</small></li>`, indexName))
+		}
+		buffer.Html(`</ul>`)
+	}
+
+	buffer.Html(`</ul>`)
+
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
+
+	buffer.Html("\n</div>")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/html_pages.go b/quesma/quesma/ui/html_pages.go
deleted file mode 100644
index 93c891ffe..000000000
--- a/quesma/quesma/ui/html_pages.go
+++ /dev/null
@@ -1,933 +0,0 @@
-package ui
-
-import (
-	"encoding/json"
-	"fmt"
-	"gopkg.in/yaml.v3"
-	"mitmproxy/quesma/buildinfo"
-	"mitmproxy/quesma/clickhouse"
-	"mitmproxy/quesma/logger"
-	"mitmproxy/quesma/stats/errorstats"
-	"mitmproxy/quesma/util"
-	"net/url"
-	"slices"
-	"sort"
-	"strings"
-)
-
-func generateSimpleTop(title string) []byte {
-	var buffer HtmlBuffer
-	buffer.Html(`<div class="topnav">` + "\n")
-	buffer.Html(`<div class="topnav-menu">` + "\n")
-	buffer.Html(`<img src="/static/asset/quesma-logo-white-full.svg" alt="Quesma logo" class="quesma-logo" />` + "\n")
-	buffer.Html(`<h3>`).Text(title).Html(`</h3>`)
-	buffer.Html("\n</div>\n</div>\n\n")
-	return buffer.Bytes()
-}
-
-func generateTopNavigation(target string) []byte {
-	var buffer HtmlBuffer
-	buffer.Html(`<div class="topnav">` + "\n")
-	buffer.Html(`<div class="topnav-menu">` + "\n")
-	buffer.Html(`<img src="/static/asset/quesma-logo-white-full.svg" alt="Quesma logo" class="quesma-logo" />` + "\n")
-	buffer.Html("<ul>\n")
-	buffer.Html("<li")
-	if target == "dashboard" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/">Dashboard</a></li>`)
-	buffer.Html("<li")
-
-	if target == "queries" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/live">Live tail</a></li>`)
-	buffer.Html("<li")
-
-	if target == "statistics" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/ingest-statistics">Ingest</a></li>`)
-	buffer.Html("<li")
-	if target == "routing-statistics" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/routing-statistics">Routing</a></li>`)
-
-	buffer.Html("<li")
-	if target == "schema" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/schema">Schema</a></li>`)
-
-	buffer.Html("<li")
-	if target == "phone-home" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/telemetry">Telemetry</a></li>`)
-
-	buffer.Html("<li")
-	if target == "datasources" {
-		buffer.Html(` class="active"`)
-	}
-	buffer.Html(`><a href="/data-sources">Data sources</a></li>`)
-
-	buffer.Html("\n</ul>\n")
-	buffer.Html("\n</div>\n")
-
-	if target != "schema" && target != "telemetry" {
-		buffer.Html(`<div class="autorefresh-box">` + "\n")
-		buffer.Html(`<div class="autorefresh">`)
-		buffer.Html(fmt.Sprintf(
-			`<input type="checkbox" Id="autorefresh" name="autorefresh" hx-target="#%s" hx-get="/panel/%s"
-				hx-trigger="every 1s [htmx.find('#autorefresh').checked]" checked />`,
-			url.PathEscape(target), url.PathEscape(target)))
-		buffer.Html(`<label for="autorefresh">Autorefresh every 1s</label>`)
-		buffer.Html("\n</div>")
-		buffer.Html("\n</div>\n")
-	}
-	buffer.Html("\n</div>\n\n")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateSchema() []byte {
-	type menuEntry struct {
-		label  string
-		target string
-	}
-
-	var menuEntries []menuEntry
-
-	type tableColumn struct {
-		name             string
-		typeName         string
-		isAttribute      bool
-		isFullTextSearch bool
-		warning          *string
-	}
-
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("schema"))
-	buffer.Html(`<main id="schema">`)
-
-	if qmc.logManager != nil {
-
-		// Not sure if we should read directly from the TableMap or we should use the Snapshot of it.
-		// Let's leave it as is for now.
-		schema := qmc.logManager.GetTableDefinitions()
-
-		tableNames := schema.Keys()
-		sort.Strings(tableNames)
-
-		buffer.Html("\n<table>")
-
-		for i, tableName := range tableNames {
-			table, ok := schema.Load(tableName)
-			if !ok {
-				continue
-			}
-
-			id := fmt.Sprintf("schema-table-%d", i)
-			var menu menuEntry
-			menu.label = table.Name
-			menu.target = fmt.Sprintf("#%s", id)
-			menuEntries = append(menuEntries, menu)
-
-			buffer.Html(`<tr class="tableName"`)
-			buffer.Html(fmt.Sprintf(` id="%s"`, id))
-			buffer.Html(`>`)
-			buffer.Html(`<th colspan=2><h2>`)
-			buffer.Html(`Table: `)
-			buffer.Text(table.Name)
-
-			if table.Comment != "" {
-				buffer.Text(" (")
-				buffer.Text(table.Comment)
-				buffer.Text(")")
-			}
-
-			buffer.Html(`</h2></th>`)
-			buffer.Html(`</tr>`)
-
-			buffer.Html(`<tr>`)
-			buffer.Html(`<th>`)
-			buffer.Html(`Name`)
-			buffer.Html(`</th>`)
-			buffer.Html(`<th>`)
-			buffer.Html(`Type`)
-			buffer.Html(`</th>`)
-			buffer.Html(`</tr>`)
-
-			var columnNames []string
-			var columnMap = make(map[string]tableColumn)
-
-			// standard columns, visible for the user
-			for k := range table.Cols {
-				c := tableColumn{}
-
-				c.name = k
-				if table.Cols[k].Type != nil {
-					c.typeName = table.Cols[k].Type.StringWithNullable()
-				} else {
-					c.typeName = "n/a"
-				}
-
-				c.isAttribute = false
-				c.isFullTextSearch = table.Cols[k].IsFullTextMatch
-
-				columnNames = append(columnNames, k)
-				columnMap[k] = c
-			}
-
-			for _, a := range qmc.config.AliasFields(table.Name) {
-
-				// check for collisions
-				if field, collide := columnMap[a.SourceFieldName]; collide {
-					field.warning = util.Pointer("alias declared with the same name")
-					columnMap[a.SourceFieldName] = field
-					continue
-				}
-
-				// check if target exists
-				c := tableColumn{}
-				c.name = a.SourceFieldName
-				if aliasedField, ok := columnMap[a.TargetFieldName]; ok {
-					c.typeName = fmt.Sprintf("alias of '%s', %s", a.TargetFieldName, aliasedField.typeName)
-					c.isFullTextSearch = aliasedField.isFullTextSearch
-					c.isAttribute = aliasedField.isAttribute
-				} else {
-					c.warning = util.Pointer("alias points to non-existing field '" + a.TargetFieldName + "'")
-					c.typeName = "dangling alias"
-				}
-
-				columnNames = append(columnNames, a.SourceFieldName)
-				columnMap[a.SourceFieldName] = c
-			}
-
-			// columns added by Quesma, not visible for the user
-			//
-			// this part is based on addOurFieldsToCreateTableQuery in log_manager.go
-			attributes := table.Config.GetAttributes()
-			if len(attributes) > 0 {
-				for _, a := range attributes {
-					_, ok := table.Cols[a.KeysArrayName]
-					if !ok {
-						c := tableColumn{}
-						c.name = a.KeysArrayName
-						c.typeName = clickhouse.CompoundType{Name: "Array", BaseType: clickhouse.NewBaseType("String")}.StringWithNullable()
-						c.isAttribute = true
-						columnNames = append(columnNames, c.name)
-						columnMap[c.name] = c
-					}
-					_, ok = table.Cols[a.ValuesArrayName]
-					if !ok {
-						c := tableColumn{}
-						c.name = a.ValuesArrayName
-						c.typeName = clickhouse.CompoundType{Name: "Array", BaseType: a.Type}.StringWithNullable()
-						c.isAttribute = true
-						columnNames = append(columnNames, c.name)
-						columnMap[c.name] = c
-					}
-				}
-			}
-
-			sort.Strings(columnNames)
-
-			for _, columnName := range columnNames {
-				column, ok := columnMap[columnName]
-				if !ok {
-					continue
-				}
-
-				buffer.Html(`<tr class="`)
-
-				if column.isAttribute {
-					buffer.Html(`columnAttribute `)
-				}
-				if column.warning != nil {
-					buffer.Html(`columnWarning `)
-				}
-				buffer.Html(`column`)
-
-				buffer.Html(`">`)
-				buffer.Html(`<td class="columnName">`)
-
-				buffer.Text(column.name)
-				buffer.Html(`</td>`)
-				buffer.Html(`<td class="columnType">`)
-
-				buffer.Text(column.typeName)
-				if column.isFullTextSearch {
-					buffer.Html(` <i>(Full text match)</i>`)
-				}
-
-				if column.warning != nil {
-					buffer.Html(` <span class="columnWarningText">WARNING: `)
-					buffer.Text(*column.warning)
-					buffer.Html(`</span>`)
-				}
-
-				buffer.Html(`</td>`)
-				buffer.Html(`</tr>`)
-			}
-
-		}
-
-		buffer.Html("\n</table>")
-
-	} else {
-		buffer.Html(`<p>Schema is not available</p>`)
-	}
-
-	buffer.Html("\n<table>")
-	buffer.Html(`<tr class="tableName" id="quesma-config">`)
-	buffer.Html(`<th colspan=3><h2>`)
-	buffer.Html(`Quesma Config`)
-	buffer.Html(`</h2></th>`)
-	buffer.Html(`</tr>`)
-
-	buffer.Html(`<tr>`)
-	buffer.Html(`<th>`)
-	buffer.Html(`Name Pattern`)
-	buffer.Html(`</th>`)
-	buffer.Html(`<th>`)
-	buffer.Html(`Enabled?`)
-	buffer.Html(`</th>`)
-	buffer.Html(`<th>`)
-	buffer.Html(`Full Text Search Fields`)
-	buffer.Html(`</th>`)
-
-	buffer.Html(`</tr>`)
-
-	for _, cfg := range qmc.config.IndexConfig {
-		buffer.Html(`<tr>`)
-		buffer.Html(`<td>`)
-		buffer.Text(cfg.Name)
-		buffer.Html(`</td>`)
-		buffer.Html(`<td>`)
-		if cfg.Enabled {
-			buffer.Text("true")
-		} else {
-			buffer.Text("false")
-		}
-		buffer.Html(`</td>`)
-
-		buffer.Html(`<td>`)
-		buffer.Text(strings.Join(cfg.FullTextFields, ", "))
-		buffer.Html(`</td>`)
-
-		buffer.Html(`</tr>`)
-	}
-
-	buffer.Html("\n</table>")
-
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<h3>Admin actions</h3>`)
-	buffer.Html(`<ul>`)
-
-	buffer.Html(`<li><button hx-post="/schema/reload" hx-target="body">Reload Schemas</button></li>`)
-
-	buffer.Html(`</ul>`)
-
-	buffer.Html(`<h3>Tables:</h3>`)
-
-	buffer.Html("<ol>")
-
-	for _, menu := range menuEntries {
-		buffer.Html(`<li><a href="`)
-		buffer.Text(menu.target)
-		buffer.Html(`">`)
-		buffer.Text(menu.label)
-		buffer.Html(`</a></li>`)
-	}
-
-	buffer.Html("</ol>")
-
-	buffer.Html(`<h3><a href="#quesma-config">Jump to Quesma Config</a></h3>`)
-
-	buffer.Html("\n</div>")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generatePhoneHome() []byte {
-
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("telemetry"))
-	buffer.Html(`<main id="telemetry">`)
-
-	buffer.Html(`<h2>Telemetry</h2>`)
-	buffer.Html("<pre>")
-
-	stats, available := qmc.phoneHomeAgent.RecentStats()
-	if available {
-		asBytes, err := json.MarshalIndent(stats, "", "  ")
-
-		if err != nil {
-			logger.Error().Err(err).Msg("Error marshalling phone home stats")
-			buffer.Html("Telemetry Stats are unable to be displayed. This is a bug.")
-		} else {
-			buffer.Html(string(asBytes))
-		}
-
-	} else {
-		buffer.Html("Telemetry Stats are not available yet.")
-	}
-
-	buffer.Html("</pre>")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateDatasources() []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("datasources"))
-
-	buffer.Html(`<main id="datasources">`)
-	buffer.Html(`<h2>Data sources</h2>`)
-
-	buffer.Html(`<h3>Clickhouse</h3>`)
-
-	buffer.Html(`<ul>`)
-
-	tableNames := []string{}
-	for tableName := range qmc.config.IndexConfig {
-		tableNames = append(tableNames, tableName)
-	}
-	slices.Sort(tableNames)
-	tables := qmc.logManager.GetTableDefinitions()
-	slices.Sort(tableNames)
-	for _, tableName := range tableNames {
-		if _, exist := tables.Load(tableName); exist {
-			buffer.Html(fmt.Sprintf(`<li>%s (table exists)</li>`, tableName))
-		} else {
-			buffer.Html(fmt.Sprintf(`<li>%s</li>`, tableName))
-		}
-	}
-	buffer.Html(`</ul>`)
-
-	buffer.Html(`<h3>Elasticsearch</h3>`)
-
-	buffer.Html(`<ul>`)
-
-	qmc.indexManagement.Start()
-	indexNames := []string{}
-	internalIndexNames := []string{}
-	for indexName := range qmc.indexManagement.GetSourceNames() {
-		if strings.HasPrefix(indexName, ".") {
-			internalIndexNames = append(internalIndexNames, indexName)
-		} else {
-			indexNames = append(indexNames, indexName)
-		}
-	}
-
-	slices.Sort(indexNames)
-	slices.Sort(internalIndexNames)
-	for _, indexName := range indexNames {
-		buffer.Html(fmt.Sprintf(`<li>%s</li>`, indexName))
-	}
-
-	if len(internalIndexNames) > 0 {
-		buffer.Html(`<ul>`)
-
-		for _, indexName := range internalIndexNames {
-			buffer.Html(fmt.Sprintf(`<li><small>%s</small></li>`, indexName))
-		}
-		buffer.Html(`</ul>`)
-	}
-
-	buffer.Html(`</ul>`)
-
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
-
-	buffer.Html("\n</div>")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateRouterStatisticsLiveTail() []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("routing-statistics"))
-
-	buffer.Html(`<main id="routing-statistics">`)
-	buffer.Write(qmc.generateRouterStatistics())
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/">&nbsp;<input class="btn" type="submit" value="Back to dashboard" /></form>`)
-
-	buffer.Html("\n</div>")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateStatisticsLiveTail() []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("statistics"))
-
-	buffer.Html(`<main id="statistics">`)
-	buffer.Write(qmc.generateStatistics())
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/">&nbsp;<input class="btn" type="submit" value="Back to dashboard" /></form>`)
-
-	buffer.Html("\n</div>")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateLiveTail() []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("queries"))
-
-	// This preserves scrolling, but does not work if new queries appear.
-	buffer.Html(`<script>
-let containerNames = ["query-left", "query-right", "query-bottom-left", "query-bottom-right"];
-let scrollPosition = [false, false, false, false];
-
-document.body.addEventListener('htmx:beforeSwap', function(event) {
-	if (event.target.id == 'queries') {
-		for (let i = 0; i < containerNames.length; i++) {
-			let container = document.getElementById(containerNames[i]);
-			if (container.matches(":hover")) {
-				scrollPosition[i] = {
-					top: container.scrollTop,
-					left: container.scrollLeft,
-					behavior: 'instant'
-				};
-			} else {
-				scrollPosition[i] = false;
-			}
-		}
-	}
-});
-document.body.addEventListener('htmx:afterSwap', function(event) {
-	if (event.target.id == 'queries') {
-		for (let i = 0; i < containerNames.length; i++) {
-			if (scrollPosition[i]) {
-				let container = document.getElementById(containerNames[i]);
-				container.scrollTo(scrollPosition[i]);
-			}
-		}
-	}
-});
-</script>`)
-
-	buffer.Html(`<main id="queries">`)
-	buffer.Write(qmc.generateQueries())
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-	buffer.Html("\n<h3>Find query</h3><br>\n")
-
-	buffer.Html(`<form onsubmit="location.href = '/request-Id/' + find_query_by_id_input.value; return false;">`)
-	buffer.Html("\n")
-	buffer.Html(`&nbsp;<input Id="find_query_by_id_button" type="submit" class="btn" value="By Id" /><br>`)
-	buffer.Html(`&nbsp;<input type="text" Id="find_query_by_id_input" class="input" name="find_query_by_id_input" value="" required size="32"><br><br>`)
-	buffer.Html("</form>")
-
-	buffer.Html(`<form onsubmit="location.href = '/requests-by-str/' + find_query_by_str_input.value; return false;">`)
-	buffer.Html(`&nbsp;<input Id="find_query_by_str_button" type="submit" class="btn" value="By keyword in request" /><br>`)
-	buffer.Html(`&nbsp;<input type="text" Id="find_query_by_str_input" class="input" name="find_query_by_str_input" value="" required size="32"><br><br>`)
-	buffer.Html("</form>")
-
-	buffer.Html(`<h3>Queries with problems</h3>`)
-	buffer.Write(qmc.generateQueriesStatsPanel())
-	buffer.Html(`<h3>Unsupported queries</h3>`)
-	buffer.Write(qmc.generateUnsupportedQuerySidePanel())
-
-	// Don't get foiled by warning, this detects whether it's our development Quesma
-	if buildinfo.LicenseKey == buildinfo.DevelopmentLicenseKey || buildinfo.LicenseKey == "" {
-		buffer.Html(`<h3>Useful links</h3>`)
-		buffer.Html(`<ul>`)
-		buffer.Html(`<li><a href="http://localhost:5601/app/observability-log-explorer/">Kibana Log Explorer</a></li>`)
-		buffer.Html(`<li><a href="http://localhost:8081">mitmproxy</a></li>`)
-		buffer.Html(`<li><a href="http://localhost:8123/play">Clickhouse</a></li>`)
-		buffer.Html(`</ul>`)
-	}
-
-	buffer.Html(`<h3>Details</h3>`)
-	buffer.Html(`<ul>`)
-	buffer.Html("<li><small>Mode: ").Text(qmc.config.Mode.String()).Html("</small></li>")
-	buffer.Html(`</ul>`)
-
-	buffer.Html("\n</div>")
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateDashboard() []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation("dashboard"))
-
-	buffer.Html(`<main id="dashboard-main">` + "\n")
-
-	// Unfortunately, we need tiny bit of javascript to pause the animation.
-	buffer.Html(`<script type="text/javascript">`)
-	buffer.Html(`var checkbox = document.getElementById("autorefresh");`)
-	buffer.Html(`var dashboard = document.getElementById("dashboard-main");`)
-	buffer.Html(`checkbox.addEventListener('change', function() {`)
-	buffer.Html(`if (this.checked) {`)
-	buffer.Html(`dashboard.classList.remove("paused");`)
-	buffer.Html(`} else {`)
-	buffer.Html(`dashboard.classList.add("paused");`)
-	buffer.Html(`}`)
-	buffer.Html(`});`)
-	buffer.Html(`</script>` + "\n")
-
-	buffer.Html(`<div id="svg-container">`)
-	buffer.Html(`<svg width="100%" height="100%" viewBox="0 0 1000 1000" preserveAspectRatio="none">` + "\n")
-	// One limitation is that, we don't update color of paths after initial draw.
-	// They rarely change, so it's not a big deal for now.
-	// Clickhouse -> Kibana
-	if qmc.config.ReadsFromClickhouse() {
-		status, _ := qmc.generateDashboardTrafficText(RequestStatisticKibana2Clickhouse)
-		buffer.Html(fmt.Sprintf(`<path d="M 0 250 L 1000 250" fill="none" stroke="%s" />`, status))
-	}
-	// Elasticsearch -> Kibana
-	if qmc.config.ReadsFromElasticsearch() {
-		status, _ := qmc.generateDashboardTrafficText(RequestStatisticKibana2Elasticsearch)
-		buffer.Html(fmt.Sprintf(`<path d="M 0 350 L 150 350 L 150 700 L 1000 700" fill="none" stroke="%s" />`, status))
-	}
-
-	// Ingest -> Clickhouse
-	if qmc.config.WritesToClickhouse() {
-		status, _ := qmc.generateDashboardTrafficText(RequestStatisticIngest2Clickhouse)
-		buffer.Html(fmt.Sprintf(`<path d="M 1000 350 L 300 350 L 300 650 L 0 650" fill="none" stroke="%s" />`, status))
-	}
-	// Ingest -> Elasticsearch
-	if qmc.config.WritesToElasticsearch() {
-		status, _ := qmc.generateDashboardTrafficText(RequestStatisticIngest2Elasticsearch)
-		buffer.Html(fmt.Sprintf(`<path d="M 1000 800 L 0 800" fill="none" stroke="%s" />`, status))
-	}
-	buffer.Html(`</svg>` + "\n")
-	buffer.Write(qmc.generateDashboardTrafficPanel())
-	buffer.Html(`</div>` + "\n")
-
-	buffer.Html(`<div id="dashboard">` + "\n")
-	buffer.Write(qmc.generateDashboardPanel())
-	buffer.Html("</div>\n")
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateReportForRequestId(requestId string) []byte {
-	qmc.mutex.Lock()
-	request, requestFound := qmc.debugInfoMessages[requestId]
-	qmc.mutex.Unlock()
-
-	buffer := newBufferWithHead()
-	if requestFound {
-		buffer.Write(generateSimpleTop("Report for request UUID " + requestId))
-	} else {
-		buffer.Write(generateSimpleTop("Report not found for request UUID " + requestId))
-	}
-
-	buffer.Html(`<main id="queries">`)
-
-	debugKeyValueSlice := []DebugKeyValue{}
-	if requestFound {
-		debugKeyValueSlice = append(debugKeyValueSlice, DebugKeyValue{requestId, request})
-	}
-
-	buffer.Write(generateQueries(debugKeyValueSlice, false))
-
-	buffer.Html("\n</main>\n")
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
-	if requestFound {
-		buffer.Html(`<ul>`)
-		if request.errorLogCount > 0 {
-			buffer.Html(fmt.Sprintf(`<li class="debug-error-log">%d error logs</li>`, request.errorLogCount))
-		} else {
-			buffer.Html(`<li>0 error logs</li>`)
-		}
-		if request.warnLogCount > 0 {
-			buffer.Html(fmt.Sprintf(`<li class="debug-warn-log">%d warn logs</li>`, request.warnLogCount))
-		} else {
-			buffer.Html(`<li>0 warn logs</li>`)
-		}
-
-		buffer.Html(`</ul>`)
-	}
-	buffer.Html(`<form action="/log/`).Text(requestId).Html(`">&nbsp;<input class="btn" type="submit" value="Go to log" /></form>`)
-
-	buffer.Html("\n</div>")
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateLogForRequestId(requestId string) []byte {
-	qmc.mutex.Lock()
-	request, requestFound := qmc.debugInfoMessages[requestId]
-	qmc.mutex.Unlock()
-
-	logMessages, optAsyncId := generateLogMessages(request.logMessages, []string{})
-
-	buffer := newBufferWithHead()
-	if requestFound {
-		if optAsyncId != nil {
-			buffer.Write(generateSimpleTop("Log for request id " + requestId + " and async id " + *optAsyncId))
-		} else {
-			buffer.Write(generateSimpleTop("Log for request id " + requestId))
-		}
-	} else {
-		buffer.Write(generateSimpleTop("Log not found for request id " + requestId))
-	}
-
-	buffer.Html(`<main class="center" id="request-log-messages">`)
-	buffer.Html("\n\n")
-	buffer.Html(`<div class="debug-body">`)
-
-	buffer.Write(logMessages)
-
-	buffer.Html("\n</div>\n")
-	buffer.Html("\n</main>\n")
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
-	buffer.Html(`<br>`)
-	buffer.Html(`<form action="/request-id/`).Text(requestId).Html(`">&nbsp;<input class="btn" type="submit" value="Back to request info" /></form>`)
-
-	buffer.Html("\n</div>")
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-	return buffer.Bytes()
-}
-
-// links might be empty, then table won't have any links within.
-// if i < len(logMessages) && i < len(links) then logMessages[i] will have link links[i]
-func generateLogMessages(logMessages []string, links []string) ([]byte, *string) {
-	// adds a link to the table row if there is a link for it
-	addOpeningLink := func(row, column int) string {
-		if row < len(links) {
-			link := `<a href="` + links[row] + `" class="row-link"`
-			if column != 0 {
-				link += ` tabindex="-1"` // some way to make links in table prettier, see https://robertcooper.me/post/table-row-links
-			}
-			return link + ">"
-		}
-		return ""
-	}
-	addClosingLink := func(i int) string {
-		if i < len(links) {
-			return "</a>"
-		}
-		return ""
-	}
-
-	var buffer HtmlBuffer
-	buffer.Html("<table>\n")
-	buffer.Html("<thead>\n")
-	buffer.Html("<tr>\n")
-	buffer.Html(`<th class="time">Time</th>`)
-	buffer.Html(`<th class="level">Level</th>`)
-	buffer.Html(`<th class="message">Message</th>`)
-	buffer.Html(`<th class="fields">Fields</th>`)
-	buffer.Html("</tr>\n")
-
-	buffer.Html("</thead>\n")
-	buffer.Html("<tbody>\n")
-
-	var asyncId *string
-
-	for i, logMessage := range logMessages {
-		buffer.Html("<tr>\n")
-
-		var fields map[string]interface{}
-
-		if err := json.Unmarshal([]byte(logMessage), &fields); err != nil {
-			// error print
-			buffer.Html("<td></td><td>error</td><td></td>").Text(err.Error()).Html("<td>")
-			continue
-		}
-		// time
-		buffer.Html(`<td class="time">` + addOpeningLink(i, 0))
-		if _, ok := fields["time"]; ok {
-			time := fields["time"].(string)
-			time = strings.Replace(time, "T", " ", 1)
-			time = strings.Replace(time, ".", " ", 1)
-			buffer.Text(time)
-			delete(fields, "time")
-		} else {
-			buffer.Html("missing time")
-		}
-		buffer.Html(addClosingLink(i) + "</td>")
-
-		// get rid of request_id and async_id
-		delete(fields, "request_id")
-		if id, ok := fields["async_id"].(string); ok {
-			asyncId = &id
-			delete(fields, "async_id")
-		}
-
-		// level
-		buffer.Html(`<td class="level">` + addOpeningLink(i, 1))
-		if level, ok := fields["level"].(string); ok {
-			if level == "error" {
-				buffer.Html(`<span class="debug-error-log">`)
-			} else if level == "warn" {
-				buffer.Html(`<span class="debug-warn-log">`)
-			} else {
-				buffer.Html(`<span>`)
-			}
-			buffer.Text(level).Html("</span></td>")
-			delete(fields, "level")
-		} else {
-			buffer.Html("missing level")
-		}
-		buffer.Html(addClosingLink(i) + "</td>")
-
-		// message
-		buffer.Html(`<td class="message">` + addOpeningLink(i, 2))
-		if message, ok := fields["message"].(string); ok {
-			buffer.Text(message)
-			delete(fields, "message")
-		}
-		buffer.Html(addClosingLink(i) + "</td>")
-
-		// fields
-		buffer.Html(`<td class="fields">` + addOpeningLink(i, 3))
-		if rest, err := yaml.Marshal(&fields); err == nil {
-			buffer.Text(string(rest))
-		}
-		buffer.Html(addClosingLink(i) + "</td></tr>\n")
-	}
-
-	buffer.Html("</tbody>\n")
-	buffer.Html("</table>\n")
-	return buffer.Bytes(), asyncId
-}
-
-func (qmc *QuesmaManagementConsole) generateReportForRequestsWithStr(requestStr string) []byte {
-	var debugKeyValueSlice []DebugKeyValue
-
-	qmc.mutex.Lock()
-	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
-		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
-		if debugInfo.requestContains(requestStr) && len(debugKeyValueSlice) < maxLastMessages {
-			debugKeyValueSlice = append(debugKeyValueSlice,
-				DebugKeyValue{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
-		}
-	}
-	qmc.mutex.Unlock()
-
-	title := fmt.Sprintf("Report for str '%s' with %d results", requestStr, len(debugKeyValueSlice))
-	return qmc.generateReportForRequests(title, debugKeyValueSlice, []byte{})
-}
-
-func (qmc *QuesmaManagementConsole) generateReportForRequestsWithError() []byte {
-	var debugKeyValueSlice []DebugKeyValue
-
-	qmc.mutex.Lock()
-	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
-		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
-		if debugInfo.errorLogCount > 0 && len(debugKeyValueSlice) < maxLastMessages {
-			debugKeyValueSlice = append(debugKeyValueSlice,
-				DebugKeyValue{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
-		}
-	}
-	qmc.mutex.Unlock()
-
-	return qmc.generateReportForRequests("Report for requests with errors", debugKeyValueSlice, []byte{})
-}
-
-func (qmc *QuesmaManagementConsole) generateReportForRequestsWithWarning() []byte {
-	var debugKeyValueSlice []DebugKeyValue
-
-	qmc.mutex.Lock()
-	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
-		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
-		if debugInfo.warnLogCount > 0 && len(debugKeyValueSlice) < maxLastMessages {
-			debugKeyValueSlice = append(debugKeyValueSlice,
-				DebugKeyValue{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
-		}
-	}
-	qmc.mutex.Unlock()
-
-	return qmc.generateReportForRequests("Report for requests with warnings", debugKeyValueSlice, []byte{})
-}
-
-func (qmc *QuesmaManagementConsole) generateReportForRequests(title string, requests []DebugKeyValue, sidebar []byte) []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateSimpleTop(title))
-
-	buffer.Html("\n</div>\n\n")
-
-	buffer.Html(`<main id="queries">`)
-
-	buffer.Write(generateQueries(requests, true))
-
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
-	buffer.Write(sidebar)
-
-	buffer.Html("\n</div>")
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateErrorForReason(reason string) []byte {
-	buffer := newBufferWithHead()
-	buffer.Write(generateTopNavigation(fmt.Sprintf("Errors with reason '%s'", reason)))
-
-	buffer.Html(`<main id="errors">`)
-	errors := errorstats.GlobalErrorStatistics.ErrorReportsForReason(reason)
-	// TODO: Make it nicer
-	for _, errorReport := range errors {
-		buffer.Html("<p>").Text(errorReport.ReportedAt.String() + " " + errorReport.DebugMessage).Html("</p>\n")
-	}
-	buffer.Html("\n</main>\n\n")
-
-	buffer.Html(`<div class="menu">`)
-	buffer.Html("\n<h2>Menu</h2>")
-
-	buffer.Html(`<form action="/">&nbsp;<input class="btn" type="submit" value="Back to dashboard" /></form>`)
-	// TODO: implement
-	// buffer.Html(`<form action="/dashboard">&nbsp;<input class="btn" type="submit" value="See requests with errors" /></form>`)
-	buffer.Html("\n</div>")
-
-	buffer.Html("\n</body>")
-	buffer.Html("\n</html>")
-
-	return buffer.Bytes()
-}
diff --git a/quesma/quesma/ui/html_panels.go b/quesma/quesma/ui/html_panels.go
deleted file mode 100644
index ba8f1ee65..000000000
--- a/quesma/quesma/ui/html_panels.go
+++ /dev/null
@@ -1,418 +0,0 @@
-package ui
-
-import (
-	"fmt"
-	"github.com/shirou/gopsutil/v3/cpu"
-	"github.com/shirou/gopsutil/v3/host"
-	"github.com/shirou/gopsutil/v3/mem"
-	"mitmproxy/quesma/buildinfo"
-	"mitmproxy/quesma/quesma/mux"
-	"mitmproxy/quesma/quesma/ui/sqlfmt"
-	"mitmproxy/quesma/stats"
-	"mitmproxy/quesma/stats/errorstats"
-	"net/url"
-	"runtime"
-	"strings"
-	"time"
-)
-
-func generateQueries(debugKeyValueSlice []DebugKeyValue, withLinks bool) []byte {
-	var buffer HtmlBuffer
-
-	buffer.Html("\n" + `<div class="left" id="query-left">` + "\n")
-	buffer.Html(`<div class="title-bar">Query`)
-	buffer.Html("\n</div>\n")
-	buffer.Html(`<div class="debug-body">`)
-	for _, v := range debugKeyValueSlice {
-		if withLinks {
-			buffer.Html(`<a href="/request-Id/`).Text(v.Key).Html(`">`)
-		}
-		buffer.Html("<p>UUID:").Text(v.Key).Html(" Path: ").Text(v.Value.Path).Html("</p>\n")
-		buffer.Html(`<pre Id="query`).Text(v.Key).Html(`">`)
-		buffer.Text(string(v.Value.IncomingQueryBody))
-		buffer.Html("\n</pre>")
-		if withLinks {
-			buffer.Html("\n</a>")
-		}
-	}
-	buffer.Html("\n</div>")
-	buffer.Html("\n</div>\n")
-
-	buffer.Html(`<div class="right" id="query-right">` + "\n")
-	buffer.Html(`<div class="title-bar">Elasticsearch response` + "\n" + `</div>`)
-	buffer.Html(`<div class="debug-body">`)
-	for _, v := range debugKeyValueSlice {
-		if withLinks {
-			buffer.Html(`<a href="/request-Id/`).Text(v.Key).Html(`">`)
-		}
-		tookStr := fmt.Sprintf(" took %d ms", v.Value.PrimaryTook.Milliseconds())
-		buffer.Html("<p>UUID:").Text(v.Key).Text(tookStr).Html("</p>\n")
-		buffer.Html(`<pre Id="response`).Text(v.Key).Html(`">`)
-		if len(v.Value.QueryResp) > 0 {
-			buffer.Text(string(v.Value.QueryResp))
-		} else {
-			buffer.Text("(empty, request was not sent to Elasticsearch)")
-		}
-		buffer.Html("\n</pre>")
-		if withLinks {
-			buffer.Html("\n</a>")
-		}
-	}
-	buffer.Html("\n</div>")
-	buffer.Html("\n</div>\n")
-
-	buffer.Html(`<div class="bottom_left" id="query-bottom-left">` + "\n")
-	buffer.Html(`<div class="title-bar">Clickhouse translated query` + "\n" + `</div>`)
-	buffer.Html(`<div class="debug-body">`)
-	for _, v := range debugKeyValueSlice {
-		if withLinks {
-			buffer.Html(`<a href="/request-Id/`).Text(v.Key).Html(`">`)
-		}
-		tookStr := fmt.Sprintf(" took %d ms", v.Value.SecondaryTook.Milliseconds())
-		buffer.Html("<p>UUID:").Text(v.Key).Text(tookStr).Html(errorBanner(v.Value)).Html("</p>\n")
-		buffer.Html(`<pre Id="second_query`).Text(v.Key).Html(`">`)
-		buffer.Text(sqlfmt.SqlPrettyPrint(v.Value.QueryBodyTranslated))
-		buffer.Html("\n</pre>")
-		if withLinks {
-			buffer.Html("\n</a>")
-		}
-	}
-	buffer.Html("\n</div>")
-	buffer.Html("\n</div>\n")
-
-	buffer.Html(`<div class="bottom_right" id="query-bottom-right">` + "\n")
-	buffer.Html(`<div class="title-bar">Clickhouse response` + "\n" + `</div>`)
-	buffer.Html(`<div class="debug-body">`)
-	for _, v := range debugKeyValueSlice {
-		if withLinks {
-			buffer.Html(`<a href="/request-Id/`).Text(v.Key).Html(`">`)
-		}
-		buffer.Html("<p>UUID:").Text(v.Key).Html(errorBanner(v.Value)).Html("</p>\n")
-		buffer.Html(`<pre Id="second_response`).Text(v.Key).Html(`">`)
-		if len(v.Value.QueryTranslatedResults) > 0 {
-			buffer.Text(string(v.Value.QueryTranslatedResults))
-		} else {
-			buffer.Text("(empty, request was not sent to Clickhouse)")
-		}
-		buffer.Html("\n\nThere are more results ...")
-		buffer.Html("\n</pre>")
-		if withLinks {
-			buffer.Html("\n</a>")
-		}
-	}
-	buffer.Html("\n</div>")
-	buffer.Html("\n</div>\n")
-
-	return buffer.Bytes()
-}
-
-func dropFirstSegment(path string) string {
-	segments := strings.SplitN(path, "/", 3)
-	if len(segments) > 2 {
-		return "/" + segments[2]
-	}
-	return path
-}
-
-func (qmc *QuesmaManagementConsole) generateRouterStatistics() []byte {
-	var buffer HtmlBuffer
-
-	matchedKeys, matched, unmatchedKeys, unmatched := mux.MatchStatistics().GroupByFirstSegment()
-
-	buffer.Html("\n<h2>Matched URLs</h2>\n<ul>")
-	for _, segment := range matchedKeys {
-		paths := matched[segment]
-		if len(paths) > 1 {
-			buffer.Html("<li>").Text(segment).Html("</li>")
-
-			buffer.Html("<ul>\n")
-			for _, path := range paths {
-				buffer.Html("<li><small>").Text(dropFirstSegment(path)).Html("</small></li>")
-			}
-			buffer.Html("</ul>\n")
-		} else {
-			buffer.Html("<li>").Text(paths[0]).Html("</li>\n")
-		}
-	}
-
-	buffer.Html("</ul>\n")
-	buffer.Html("\n<h2>Not matched URLs</h2>\n<ul>")
-	for _, segment := range unmatchedKeys {
-		paths := unmatched[segment]
-		if len(paths) > 1 {
-			buffer.Html("<li>").Text(segment).Html("</li>")
-
-			buffer.Html("<ul>\n")
-			for _, path := range paths {
-				buffer.Html("<li><small>").Text(dropFirstSegment(path)).Html("</small></li>")
-			}
-			buffer.Html("</ul>\n")
-		} else {
-			buffer.Html("<li>").Text(paths[0]).Html("</li>\n")
-		}
-	}
-	buffer.Html("</ul>\n")
-
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateStatistics() []byte {
-	var buffer HtmlBuffer
-	const maxTopValues = 5
-
-	if !qmc.config.IngestStatistics {
-		buffer.Html("<h2>Statistics are disabled.</h2>\n")
-		buffer.Html("<p>&nbsp;You can enable them by changing ingest_statistics setting to true.</p>\n")
-		return buffer.Bytes()
-	}
-
-	statistics := stats.GlobalStatistics
-
-	for _, index := range statistics.SortedIndexNames() {
-		buffer.Html("\n<h2> Stats for \"").Text(index.IndexName).
-			Html(fmt.Sprintf("\" <small>from %d requests</small></h2>\n", index.Requests))
-
-		buffer.Html("<table>\n")
-
-		buffer.Html("<thead>\n")
-		buffer.Html(`<tr>` + "\n")
-		buffer.Html(`<th class="key">Key</th>` + "\n")
-		buffer.Html(`<th class="key-count">Count</th>` + "\n")
-		buffer.Html(`<th class="value">Value</th>` + "\n")
-		buffer.Html(`<th class="value-count">Count</th>` + "\n")
-		buffer.Html(`<th class="value-count">Percentage</th>` + "\n")
-		buffer.Html(`<th class="types">Potential type</th>` + "\n")
-		buffer.Html("</tr>\n")
-		buffer.Html("</thead>\n")
-		buffer.Html("<tbody>\n")
-
-		for _, keyStats := range index.SortedKeyStatistics() {
-			topValuesCount := maxTopValues
-			if len(keyStats.Values) < maxTopValues {
-				topValuesCount = len(keyStats.Values)
-			}
-
-			buffer.Html(`<tr class="group-divider">` + "\n")
-			buffer.Html(fmt.Sprintf(`<td class="key" rowspan="%d">`, topValuesCount)).Text(keyStats.KeyName).Html("</td>\n")
-			buffer.Html(fmt.Sprintf(`<td class="key-count" rowspan="%d">%d</td>`+"\n", topValuesCount, keyStats.Occurrences))
-
-			for i, value := range keyStats.TopNValues(topValuesCount) {
-				if i > 0 {
-					buffer.Html("</tr>\n<tr>\n")
-				}
-
-				buffer.Html(`<td class="value">`).Text(value.ValueName).Html(`</td>`)
-				buffer.Html(fmt.Sprintf(`<td class="value-count">%d</td>`, value.Occurrences))
-				buffer.Html(fmt.Sprintf(`<td class="value-count">%.1f%%</td>`, 100*float32(value.Occurrences)/float32(keyStats.Occurrences)))
-				buffer.Html(fmt.Sprintf(`<td class="types">%s</td>`, strings.Join(value.Types, ", ")))
-			}
-			buffer.Html("</tr>\n")
-		}
-
-		buffer.Html("</tbody>\n")
-
-		buffer.Html("</table>\n")
-	}
-
-	return buffer.Bytes()
-}
-
-func errorBanner(debugInfo QueryDebugInfo) string {
-	result := ""
-	if debugInfo.errorLogCount > 0 {
-		result += fmt.Sprintf(` <span class="debug-error-log">%d errors</span>`, debugInfo.errorLogCount)
-	}
-	if debugInfo.warnLogCount > 0 {
-		result += fmt.Sprintf(` <span class="debug-warn-log">%d warnings</span>`, debugInfo.warnLogCount)
-	}
-	return result
-}
-
-func secondsToTerseString(second uint64) string {
-	return (time.Duration(second) * time.Second).String()
-}
-
-func statusToDiv(s healthCheckStatus) string {
-	return fmt.Sprintf(`<div class="status %s" title="%s">%s</div>`, s.status, s.tooltip, s.message)
-}
-
-func (qmc *QuesmaManagementConsole) generateDashboardPanel() []byte {
-	var buffer HtmlBuffer
-
-	dashboardName := "<h3>Kibana</h3>"
-	storeName := "<h3>Elasticsearch</h3>"
-	if qmc.config.Elasticsearch.Url != nil && strings.Contains(qmc.config.Elasticsearch.Url.String(), "opensearch") {
-		dashboardName = "<h3>OpenSearch</h3><h3>Dashboards</h3>"
-		storeName = "<h3>OpenSearch</h3>"
-	}
-
-	clickhouseName := "<h3>ClickHouse</h3>"
-	if qmc.config.Hydrolix.Url != nil {
-		clickhouseName = "<h3>Hydrolix</h3>"
-	}
-
-	buffer.Html(`<div id="dashboard-kibana" class="component">`)
-	if qmc.config.Elasticsearch.AdminUrl != nil {
-		buffer.Html(fmt.Sprintf(`<a href="%s">`, qmc.config.Elasticsearch.AdminUrl.String()))
-	}
-	buffer.Html(dashboardName)
-	if qmc.config.Elasticsearch.AdminUrl != nil {
-		buffer.Html(`</a>`)
-	}
-	buffer.Html(statusToDiv(qmc.checkKibana()))
-	buffer.Html(`</div>`)
-
-	buffer.Html(`<div id="dashboard-ingest" class="component">`)
-	buffer.Html(`<h3>Ingest</h3>`)
-	buffer.Html(statusToDiv(qmc.checkIngest()))
-	buffer.Html(`</div>`)
-
-	buffer.Html(`<div id="dashboard-elasticsearch" class="component">`)
-	buffer.Html(storeName)
-	buffer.Html(statusToDiv(qmc.checkElasticsearch()))
-	buffer.Html(`</div>`)
-
-	buffer.Html(`<div id="dashboard-clickhouse" class="component">`)
-	if qmc.config.ClickHouse.AdminUrl != nil {
-		buffer.Html(fmt.Sprintf(`<a href="%s">`, qmc.config.ClickHouse.AdminUrl.String()))
-	}
-	buffer.Html(clickhouseName)
-	if qmc.config.ClickHouse.AdminUrl != nil {
-		buffer.Html(`</a>`)
-	}
-	buffer.Html(statusToDiv(qmc.checkClickhouseHealth()))
-	buffer.Html(`</div>`)
-
-	buffer.Html(`<div id="dashboard-traffic" class="component">`)
-
-	buffer.Html(`<div id="dashboard-quesma" class="component">`)
-	buffer.Html(`<h3>Quesma</h3>`)
-
-	cpuStr := ""
-	c0, err0 := cpu.Percent(0, false)
-
-	if err0 == nil {
-		cpuStr = fmt.Sprintf("Host CPU: %.1f%%", c0[0])
-	} else {
-		cpuStr = fmt.Sprintf("Host CPU: N/A (error: %s)", err0.Error())
-	}
-
-	buffer.Html(fmt.Sprintf(`<div class="status">%s</div>`, cpuStr))
-
-	var m runtime.MemStats
-	runtime.ReadMemStats(&m)
-	memStr := fmt.Sprintf("Memory used: %1.f MB", float64(m.Alloc)/1024.0/1024.0)
-	if v, errV := mem.VirtualMemory(); errV == nil {
-		total := float64(v.Total) / 1024.0 / 1024.0 / 1024.0
-		memStr += fmt.Sprintf(", avail: %.1f GB", total)
-	}
-	buffer.Html(fmt.Sprintf(`<div class="status">%s</div>`, memStr))
-
-	duration := uint64(time.Since(qmc.startedAt).Seconds())
-
-	buffer.Html(fmt.Sprintf(`<div class="status">Started: %s ago</div>`, secondsToTerseString(duration)))
-	buffer.Html(fmt.Sprintf(`<div class="status">Mode: %s</div>`, qmc.config.Mode.String()))
-
-	if h, errH := host.Info(); errH == nil {
-		buffer.Html(fmt.Sprintf(`<div class="status">Host uptime: %s</div>`, secondsToTerseString(h.Uptime)))
-	}
-
-	buffer.Html("<div>Version: ")
-	buffer.Text(buildinfo.Version)
-	buffer.Html("</div>")
-
-	buffer.Html(`</div>`)
-
-	buffer.Html(`<div id="dashboard-errors" class="component">`)
-	errors := errorstats.GlobalErrorStatistics.ReturnTopErrors(5)
-	if len(errors) > 0 {
-		buffer.Html(`<h3>Top errors:</h3>`)
-		for _, e := range errors {
-			buffer.Html(fmt.Sprintf(`<div class="status">%d: <a href="/error/%s">%s</a></div>`,
-				e.Count, url.PathEscape(e.Reason), e.Reason))
-		}
-	} else {
-		buffer.Html(`<h3>No errors</h3>`)
-	}
-	buffer.Html(`</div>`)
-	buffer.Html(`</div>`)
-
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateDashboardTrafficText(typeName string) (string, string) {
-	reqStats := qmc.requestsStore.GetRequestsStats(typeName)
-	status := "green"
-	if reqStats.ErrorRate > 0.20 {
-		status = "red"
-	}
-	return status, fmt.Sprintf("%4.1f req/s, err:%5.1f%%, p99:%3dms",
-		reqStats.RatePerMinute/60, reqStats.ErrorRate*100, reqStats.Duration99Percentile)
-}
-
-func (qmc *QuesmaManagementConsole) generateDashboardTrafficElement(typeName string, y int) string {
-	status, text := qmc.generateDashboardTrafficText(typeName)
-	return fmt.Sprintf(
-		`<div style="left: 40%%; top: %d%%" id="traffic-%s" hx-swap-oob="true" class="traffic-element %s">%s</div>`,
-		y, typeName, status, text)
-}
-
-func (qmc *QuesmaManagementConsole) generateDashboardTrafficPanel() []byte {
-	var buffer HtmlBuffer
-
-	// Clickhouse -> Kibana
-	if qmc.config.ReadsFromClickhouse() {
-		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticKibana2Clickhouse, 21))
-	}
-
-	// Elasticsearch -> Kibana
-	if qmc.config.ReadsFromElasticsearch() {
-		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticKibana2Elasticsearch, 66))
-	}
-
-	// Ingest -> Clickhouse
-	if qmc.config.WritesToClickhouse() {
-		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticIngest2Clickhouse, 31))
-	}
-
-	// Ingest -> Elasticsearch
-	if qmc.config.WritesToElasticsearch() {
-		buffer.Html(qmc.generateDashboardTrafficElement(RequestStatisticIngest2Elasticsearch, 76))
-	}
-
-	return buffer.Bytes()
-}
-
-func (qmc *QuesmaManagementConsole) generateQueriesStatsPanel() []byte {
-	qmc.mutex.Lock()
-	errorCount := 0
-	warnCount := 0
-	for _, msg := range qmc.debugInfoMessages {
-		if msg.errorLogCount > 0 {
-			errorCount++
-		}
-		if msg.warnLogCount > 0 {
-			warnCount++
-		}
-	}
-	qmc.mutex.Unlock()
-
-	var buffer HtmlBuffer
-
-	buffer.Html(`<ul id="queries-stats" hx-swap-oob="true">`)
-	buffer.Html(`<li><a href="/requests-with-error/"`)
-	if errorCount > 0 {
-		buffer.Html(fmt.Sprintf(` class="debug-error-log"">%d with errors</a></li>`, errorCount))
-	} else {
-		buffer.Html(`>0 with errors</a></li>`)
-	}
-	buffer.Html(`<li><a href="/requests-with-warning/"`)
-	if warnCount > 0 {
-		buffer.Html(fmt.Sprintf(` class="debug-warn-log"">%d with warnings</a></li>`, warnCount))
-	} else {
-		buffer.Html(`>0 with warnings</a></li>`)
-	}
-	buffer.Html(`</ul>`)
-
-	return buffer.Bytes()
-}
diff --git a/quesma/quesma/ui/html_utils.go b/quesma/quesma/ui/html_utils.go
new file mode 100644
index 000000000..328b55a31
--- /dev/null
+++ b/quesma/quesma/ui/html_utils.go
@@ -0,0 +1,95 @@
+package ui
+
+import (
+	"fmt"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
+	"net/url"
+)
+
+func generateSimpleTop(title string) []byte {
+	var buffer buffer.HtmlBuffer
+	buffer.Html(`<div class="topnav">` + "\n")
+	buffer.Html(`<div class="topnav-menu">` + "\n")
+	buffer.Html(`<img src="/static/asset/quesma-logo-white-full.svg" alt="Quesma logo" class="quesma-logo" />` + "\n")
+	buffer.Html(`<h3>`).Text(title).Html(`</h3>`)
+	buffer.Html("\n</div>\n</div>\n\n")
+	return buffer.Bytes()
+}
+
+func generateTopNavigation(target string) []byte {
+	var buffer buffer.HtmlBuffer
+	buffer.Html(`<div class="topnav">` + "\n")
+	buffer.Html(`<div class="topnav-menu">` + "\n")
+	buffer.Html(`<img src="/static/asset/quesma-logo-white-full.svg" alt="Quesma logo" class="quesma-logo" />` + "\n")
+	buffer.Html("<ul>\n")
+	buffer.Html("<li")
+	if target == "dashboard" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/">Dashboard</a></li>`)
+	buffer.Html("<li")
+
+	if target == "queries" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/live">Live tail</a></li>`)
+	buffer.Html("<li")
+
+	if target == "statistics" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/ingest-statistics">Ingest</a></li>`)
+	buffer.Html("<li")
+	if target == "routing-statistics" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/routing-statistics">Routing</a></li>`)
+
+	buffer.Html("<li")
+	if target == "schema" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/schema">Schema</a></li>`)
+
+	buffer.Html("<li")
+	if target == "phone-home" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/telemetry">Telemetry</a></li>`)
+
+	buffer.Html("<li")
+	if target == "datasources" {
+		buffer.Html(` class="active"`)
+	}
+	buffer.Html(`><a href="/data-sources">Data sources</a></li>`)
+
+	buffer.Html("\n</ul>\n")
+	buffer.Html("\n</div>\n")
+
+	if target != "schema" && target != "telemetry" {
+		buffer.Html(`<div class="autorefresh-box">` + "\n")
+		buffer.Html(`<div class="autorefresh">`)
+		buffer.Html(fmt.Sprintf(
+			`<input type="checkbox" Id="autorefresh" name="autorefresh" hx-target="#%s" hx-get="/panel/%s"
+				hx-trigger="every 1s [htmx.find('#autorefresh').checked]" checked />`,
+			url.PathEscape(target), url.PathEscape(target)))
+		buffer.Html(`<label for="autorefresh">Autorefresh every 1s</label>`)
+		buffer.Html("\n</div>")
+		buffer.Html("\n</div>\n")
+	}
+	buffer.Html("\n</div>\n\n")
+	return buffer.Bytes()
+}
+
+func newBufferWithHead() buffer.HtmlBuffer {
+	const bufferSize = 4 * 1024 // size of ui/head.html
+	var buffer buffer.HtmlBuffer
+	buffer.Grow(bufferSize)
+	head, err := uiFs.ReadFile("asset/head.html")
+	buffer.Write(head)
+	if err != nil {
+		buffer.Text(err.Error())
+	}
+	buffer.Html("\n")
+	return buffer
+}
diff --git a/quesma/quesma/ui/ingest.go b/quesma/quesma/ui/ingest.go
new file mode 100644
index 000000000..ff659ed42
--- /dev/null
+++ b/quesma/quesma/ui/ingest.go
@@ -0,0 +1,89 @@
+package ui
+
+import (
+	"fmt"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
+	"mitmproxy/quesma/stats"
+	"strings"
+)
+
+func (qmc *QuesmaManagementConsole) generateIngestStatistics() []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("statistics"))
+
+	buffer.Html(`<main id="statistics">`)
+	buffer.Write(qmc.generateStatistics())
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/">&nbsp;<input class="btn" type="submit" value="Back to dashboard" /></form>`)
+
+	buffer.Html("\n</div>")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
+
+func (qmc *QuesmaManagementConsole) generateStatistics() []byte {
+	var buffer buffer.HtmlBuffer
+	const maxTopValues = 5
+
+	if !qmc.config.IngestStatistics {
+		buffer.Html("<h2>Statistics are disabled.</h2>\n")
+		buffer.Html("<p>&nbsp;You can enable them by changing ingest_statistics setting to true.</p>\n")
+		return buffer.Bytes()
+	}
+
+	statistics := stats.GlobalStatistics
+
+	for _, index := range statistics.SortedIndexNames() {
+		buffer.Html("\n<h2> Stats for \"").Text(index.IndexName).
+			Html(fmt.Sprintf("\" <small>from %d requests</small></h2>\n", index.Requests))
+
+		buffer.Html("<table>\n")
+
+		buffer.Html("<thead>\n")
+		buffer.Html(`<tr>` + "\n")
+		buffer.Html(`<th class="key">Key</th>` + "\n")
+		buffer.Html(`<th class="key-count">Count</th>` + "\n")
+		buffer.Html(`<th class="value">Value</th>` + "\n")
+		buffer.Html(`<th class="value-count">Count</th>` + "\n")
+		buffer.Html(`<th class="value-count">Percentage</th>` + "\n")
+		buffer.Html(`<th class="types">Potential type</th>` + "\n")
+		buffer.Html("</tr>\n")
+		buffer.Html("</thead>\n")
+		buffer.Html("<tbody>\n")
+
+		for _, keyStats := range index.SortedKeyStatistics() {
+			topValuesCount := maxTopValues
+			if len(keyStats.Values) < maxTopValues {
+				topValuesCount = len(keyStats.Values)
+			}
+
+			buffer.Html(`<tr class="group-divider">` + "\n")
+			buffer.Html(fmt.Sprintf(`<td class="key" rowspan="%d">`, topValuesCount)).Text(keyStats.KeyName).Html("</td>\n")
+			buffer.Html(fmt.Sprintf(`<td class="key-count" rowspan="%d">%d</td>`+"\n", topValuesCount, keyStats.Occurrences))
+
+			for i, value := range keyStats.TopNValues(topValuesCount) {
+				if i > 0 {
+					buffer.Html("</tr>\n<tr>\n")
+				}
+
+				buffer.Html(`<td class="value">`).Text(value.ValueName).Html(`</td>`)
+				buffer.Html(fmt.Sprintf(`<td class="value-count">%d</td>`, value.Occurrences))
+				buffer.Html(fmt.Sprintf(`<td class="value-count">%.1f%%</td>`, 100*float32(value.Occurrences)/float32(keyStats.Occurrences)))
+				buffer.Html(fmt.Sprintf(`<td class="types">%s</td>`, strings.Join(value.Types, ", ")))
+			}
+			buffer.Html("</tr>\n")
+		}
+
+		buffer.Html("</tbody>\n")
+
+		buffer.Html("</table>\n")
+	}
+
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/html_buffer.go b/quesma/quesma/ui/internal/buffer/html_buffer.go
similarity index 97%
rename from quesma/quesma/ui/html_buffer.go
rename to quesma/quesma/ui/internal/buffer/html_buffer.go
index b0a8df937..fee3d02ca 100644
--- a/quesma/quesma/ui/html_buffer.go
+++ b/quesma/quesma/ui/internal/buffer/html_buffer.go
@@ -1,4 +1,4 @@
-package ui
+package buffer
 
 import (
 	"bytes"
diff --git a/quesma/quesma/ui/html_buffer_test.go b/quesma/quesma/ui/internal/buffer/html_buffer_test.go
similarity index 96%
rename from quesma/quesma/ui/html_buffer_test.go
rename to quesma/quesma/ui/internal/buffer/html_buffer_test.go
index 780265e34..42b9678af 100644
--- a/quesma/quesma/ui/html_buffer_test.go
+++ b/quesma/quesma/ui/internal/buffer/html_buffer_test.go
@@ -1,4 +1,4 @@
-package ui
+package buffer
 
 import (
 	"github.com/stretchr/testify/assert"
diff --git a/quesma/quesma/ui/sqlfmt/pretty.go b/quesma/quesma/ui/internal/sqlfmt/pretty.go
similarity index 100%
rename from quesma/quesma/ui/sqlfmt/pretty.go
rename to quesma/quesma/ui/internal/sqlfmt/pretty.go
diff --git a/quesma/quesma/ui/sqlfmt/pretty_test.go b/quesma/quesma/ui/internal/sqlfmt/pretty_test.go
similarity index 100%
rename from quesma/quesma/ui/sqlfmt/pretty_test.go
rename to quesma/quesma/ui/internal/sqlfmt/pretty_test.go
diff --git a/quesma/quesma/ui/live_tail.go b/quesma/quesma/ui/live_tail.go
new file mode 100644
index 000000000..26415a8ea
--- /dev/null
+++ b/quesma/quesma/ui/live_tail.go
@@ -0,0 +1,284 @@
+package ui
+
+import (
+	"fmt"
+	"mitmproxy/quesma/buildinfo"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
+	"mitmproxy/quesma/quesma/ui/internal/sqlfmt"
+)
+
+func (qmc *QuesmaManagementConsole) generateLiveTail() []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("queries"))
+
+	// This preserves scrolling, but does not work if new queries appear.
+	buffer.Html(`<script>
+let containerNames = ["query-left", "query-right", "query-bottom-left", "query-bottom-right"];
+let scrollPosition = [false, false, false, false];
+
+document.body.addEventListener('htmx:beforeSwap', function(event) {
+	if (event.target.id == 'queries') {
+		for (let i = 0; i < containerNames.length; i++) {
+			let container = document.getElementById(containerNames[i]);
+			if (container.matches(":hover")) {
+				scrollPosition[i] = {
+					top: container.scrollTop,
+					left: container.scrollLeft,
+					behavior: 'instant'
+				};
+			} else {
+				scrollPosition[i] = false;
+			}
+		}
+	}
+});
+document.body.addEventListener('htmx:afterSwap', function(event) {
+	if (event.target.id == 'queries') {
+		for (let i = 0; i < containerNames.length; i++) {
+			if (scrollPosition[i]) {
+				let container = document.getElementById(containerNames[i]);
+				container.scrollTo(scrollPosition[i]);
+			}
+		}
+	}
+});
+</script>`)
+
+	buffer.Html(`<main id="queries">`)
+	buffer.Write(qmc.generateQueries())
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+	buffer.Html("\n<h3>Find query</h3><br>\n")
+
+	buffer.Html(`<form onsubmit="location.href = '/request-Id/' + find_query_by_id_input.value; return false;">`)
+	buffer.Html("\n")
+	buffer.Html(`&nbsp;<input Id="find_query_by_id_button" type="submit" class="btn" value="By Id" /><br>`)
+	buffer.Html(`&nbsp;<input type="text" Id="find_query_by_id_input" class="input" name="find_query_by_id_input" value="" required size="32"><br><br>`)
+	buffer.Html("</form>")
+
+	buffer.Html(`<form onsubmit="location.href = '/requests-by-str/' + find_query_by_str_input.value; return false;">`)
+	buffer.Html(`&nbsp;<input Id="find_query_by_str_button" type="submit" class="btn" value="By keyword in request" /><br>`)
+	buffer.Html(`&nbsp;<input type="text" Id="find_query_by_str_input" class="input" name="find_query_by_str_input" value="" required size="32"><br><br>`)
+	buffer.Html("</form>")
+
+	buffer.Html(`<h3>Queries with problems</h3>`)
+	buffer.Write(qmc.generateQueriesStatsPanel())
+	buffer.Html(`<h3>Unsupported queries</h3>`)
+	buffer.Write(qmc.generateUnsupportedQuerySidePanel())
+
+	// Don't get foiled by warning, this detects whether it's our development Quesma
+	if buildinfo.LicenseKey == buildinfo.DevelopmentLicenseKey || buildinfo.LicenseKey == "" {
+		buffer.Html(`<h3>Useful links</h3>`)
+		buffer.Html(`<ul>`)
+		buffer.Html(`<li><a href="http://localhost:5601/app/observability-log-explorer/">Kibana Log Explorer</a></li>`)
+		buffer.Html(`<li><a href="http://localhost:8081">mitmproxy</a></li>`)
+		buffer.Html(`<li><a href="http://localhost:8123/play">Clickhouse</a></li>`)
+		buffer.Html(`</ul>`)
+	}
+
+	buffer.Html(`<h3>Details</h3>`)
+	buffer.Html(`<ul>`)
+	buffer.Html("<li><small>Mode: ").Text(qmc.config.Mode.String()).Html("</small></li>")
+	buffer.Html(`</ul>`)
+
+	buffer.Html("\n</div>")
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
+
+func (qmc *QuesmaManagementConsole) generateQueries() []byte {
+	// Take last MAX_LAST_MESSAGES to display, e.g. 100 out of potentially 10m000
+	qmc.mutex.Lock()
+	lastMessages := qmc.debugLastMessages
+	debugKeyValueSlice := []queryDebugInfoWithId{}
+	count := 0
+	for i := len(lastMessages) - 1; i >= 0 && count < maxLastMessages; i-- {
+		debugInfoMessage := qmc.debugInfoMessages[lastMessages[i]]
+		if len(debugInfoMessage.QueryDebugSecondarySource.IncomingQueryBody) > 0 {
+			debugKeyValueSlice = append(debugKeyValueSlice, queryDebugInfoWithId{lastMessages[i], debugInfoMessage})
+			count++
+		}
+	}
+	qmc.mutex.Unlock()
+
+	queriesBytes := generateQueries(debugKeyValueSlice, true)
+	queriesStats := qmc.generateQueriesStatsPanel()
+	unsupportedQueriesStats := qmc.generateUnsupportedQuerySidePanel()
+	return append(queriesBytes, append(queriesStats, unsupportedQueriesStats...)...)
+}
+
+func (qmc *QuesmaManagementConsole) generateUnsupportedQuerySidePanel() []byte {
+	qmc.mutex.Lock()
+	totalErrorsCount := qmc.totalUnsupportedQueries
+	qmc.mutex.Unlock()
+
+	typesCount := qmc.GetUnsupportedTypesWithCount()
+	savedErrorsCount := 0
+	for _, count := range typesCount {
+		savedErrorsCount += count
+	}
+	typesSeenCount := len(typesCount)
+	unknownTypeCount := 0
+	if value, ok := typesCount[UnrecognizedQueryType]; ok {
+		unknownTypeCount = value
+	}
+
+	var buffer buffer.HtmlBuffer
+	linkToMainView := `<li><a href="/unsupported-requests"`
+	buffer.Html(`<ul id="unsupported-queries-stats" hx-swap-oob="true">`)
+	if totalErrorsCount > 0 {
+		buffer.Html(fmt.Sprintf(`%s class="debug-warn-log"">%d total (%d recent)</a></li>`, linkToMainView, totalErrorsCount, savedErrorsCount))
+		plural := "s"
+		if typesSeenCount == 1 {
+			plural = ""
+		}
+		buffer.Html(fmt.Sprintf(`%s class="debug-warn-log"">%d different type%s</a></li>`, linkToMainView, typesSeenCount, plural))
+		if unknownTypeCount > 0 {
+			buffer.Html(fmt.Sprintf(`<li><a href="/unsupported-requests/%s"" class="debug-error-log">`, UnrecognizedQueryType))
+			buffer.Html(fmt.Sprintf(`%d of unrecognized type</a></li>`, unknownTypeCount))
+		}
+	} else {
+		buffer.Html(`<li>None!</a></li>`)
+	}
+	buffer.Html(`</ul>`)
+
+	return buffer.Bytes()
+}
+
+func (qmc *QuesmaManagementConsole) generateQueriesStatsPanel() []byte {
+	qmc.mutex.Lock()
+	errorCount := 0
+	warnCount := 0
+	for _, msg := range qmc.debugInfoMessages {
+		if msg.errorLogCount > 0 {
+			errorCount++
+		}
+		if msg.warnLogCount > 0 {
+			warnCount++
+		}
+	}
+	qmc.mutex.Unlock()
+
+	var buffer buffer.HtmlBuffer
+
+	buffer.Html(`<ul id="queries-stats" hx-swap-oob="true">`)
+	buffer.Html(`<li><a href="/requests-with-error/"`)
+	if errorCount > 0 {
+		buffer.Html(fmt.Sprintf(` class="debug-error-log"">%d with errors</a></li>`, errorCount))
+	} else {
+		buffer.Html(`>0 with errors</a></li>`)
+	}
+	buffer.Html(`<li><a href="/requests-with-warning/"`)
+	if warnCount > 0 {
+		buffer.Html(fmt.Sprintf(` class="debug-warn-log"">%d with warnings</a></li>`, warnCount))
+	} else {
+		buffer.Html(`>0 with warnings</a></li>`)
+	}
+	buffer.Html(`</ul>`)
+
+	return buffer.Bytes()
+}
+
+func generateQueries(debugKeyValueSlice []queryDebugInfoWithId, withLinks bool) []byte {
+	var buffer buffer.HtmlBuffer
+
+	buffer.Html("\n" + `<div class="left" id="query-left">` + "\n")
+	buffer.Html(`<div class="title-bar">Query`)
+	buffer.Html("\n</div>\n")
+	buffer.Html(`<div class="debug-body">`)
+	for _, v := range debugKeyValueSlice {
+		if withLinks {
+			buffer.Html(`<a href="/request-Id/`).Text(v.id).Html(`">`)
+		}
+		buffer.Html("<p>UUID:").Text(v.id).Html(" Path: ").Text(v.query.Path).Html("</p>\n")
+		buffer.Html(`<pre Id="query`).Text(v.id).Html(`">`)
+		buffer.Text(string(v.query.IncomingQueryBody))
+		buffer.Html("\n</pre>")
+		if withLinks {
+			buffer.Html("\n</a>")
+		}
+	}
+	buffer.Html("\n</div>")
+	buffer.Html("\n</div>\n")
+
+	buffer.Html(`<div class="right" id="query-right">` + "\n")
+	buffer.Html(`<div class="title-bar">Elasticsearch response` + "\n" + `</div>`)
+	buffer.Html(`<div class="debug-body">`)
+	for _, v := range debugKeyValueSlice {
+		if withLinks {
+			buffer.Html(`<a href="/request-Id/`).Text(v.id).Html(`">`)
+		}
+		tookStr := fmt.Sprintf(" took %d ms", v.query.PrimaryTook.Milliseconds())
+		buffer.Html("<p>UUID:").Text(v.id).Text(tookStr).Html("</p>\n")
+		buffer.Html(`<pre Id="response`).Text(v.id).Html(`">`)
+		if len(v.query.QueryResp) > 0 {
+			buffer.Text(string(v.query.QueryResp))
+		} else {
+			buffer.Text("(empty, request was not sent to Elasticsearch)")
+		}
+		buffer.Html("\n</pre>")
+		if withLinks {
+			buffer.Html("\n</a>")
+		}
+	}
+	buffer.Html("\n</div>")
+	buffer.Html("\n</div>\n")
+
+	buffer.Html(`<div class="bottom_left" id="query-bottom-left">` + "\n")
+	buffer.Html(`<div class="title-bar">Clickhouse translated query` + "\n" + `</div>`)
+	buffer.Html(`<div class="debug-body">`)
+	for _, v := range debugKeyValueSlice {
+		if withLinks {
+			buffer.Html(`<a href="/request-Id/`).Text(v.id).Html(`">`)
+		}
+		tookStr := fmt.Sprintf(" took %d ms", v.query.SecondaryTook.Milliseconds())
+		buffer.Html("<p>UUID:").Text(v.id).Text(tookStr).Html(errorBanner(v.query)).Html("</p>\n")
+		buffer.Html(`<pre Id="second_query`).Text(v.id).Html(`">`)
+		buffer.Text(sqlfmt.SqlPrettyPrint(v.query.QueryBodyTranslated))
+		buffer.Html("\n</pre>")
+		if withLinks {
+			buffer.Html("\n</a>")
+		}
+	}
+	buffer.Html("\n</div>")
+	buffer.Html("\n</div>\n")
+
+	buffer.Html(`<div class="bottom_right" id="query-bottom-right">` + "\n")
+	buffer.Html(`<div class="title-bar">Clickhouse response` + "\n" + `</div>`)
+	buffer.Html(`<div class="debug-body">`)
+	for _, v := range debugKeyValueSlice {
+		if withLinks {
+			buffer.Html(`<a href="/request-Id/`).Text(v.id).Html(`">`)
+		}
+		buffer.Html("<p>UUID:").Text(v.id).Html(errorBanner(v.query)).Html("</p>\n")
+		buffer.Html(`<pre Id="second_response`).Text(v.id).Html(`">`)
+		if len(v.query.QueryTranslatedResults) > 0 {
+			buffer.Text(string(v.query.QueryTranslatedResults))
+		} else {
+			buffer.Text("(empty, request was not sent to Clickhouse)")
+		}
+		buffer.Html("\n\nThere are more results ...")
+		buffer.Html("\n</pre>")
+		if withLinks {
+			buffer.Html("\n</a>")
+		}
+	}
+	buffer.Html("\n</div>")
+	buffer.Html("\n</div>\n")
+
+	return buffer.Bytes()
+}
+
+func errorBanner(debugInfo queryDebugInfo) string {
+	result := ""
+	if debugInfo.errorLogCount > 0 {
+		result += fmt.Sprintf(` <span class="debug-error-log">%d errors</span>`, debugInfo.errorLogCount)
+	}
+	if debugInfo.warnLogCount > 0 {
+		result += fmt.Sprintf(` <span class="debug-warn-log">%d warnings</span>`, debugInfo.warnLogCount)
+	}
+	return result
+}
diff --git a/quesma/quesma/ui/live_tail_drilldown.go b/quesma/quesma/ui/live_tail_drilldown.go
new file mode 100644
index 000000000..89374d792
--- /dev/null
+++ b/quesma/quesma/ui/live_tail_drilldown.go
@@ -0,0 +1,275 @@
+package ui
+
+import (
+	"encoding/json"
+	"fmt"
+	"gopkg.in/yaml.v3"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
+	"strings"
+)
+
+func (qmc *QuesmaManagementConsole) generateReportForRequestId(requestId string) []byte {
+	qmc.mutex.Lock()
+	request, requestFound := qmc.debugInfoMessages[requestId]
+	qmc.mutex.Unlock()
+
+	buffer := newBufferWithHead()
+	if requestFound {
+		buffer.Write(generateSimpleTop("Report for request UUID " + requestId))
+	} else {
+		buffer.Write(generateSimpleTop("Report not found for request UUID " + requestId))
+	}
+
+	buffer.Html(`<main id="queries">`)
+
+	debugKeyValueSlice := []queryDebugInfoWithId{}
+	if requestFound {
+		debugKeyValueSlice = append(debugKeyValueSlice, queryDebugInfoWithId{requestId, request})
+	}
+
+	buffer.Write(generateQueries(debugKeyValueSlice, false))
+
+	buffer.Html("\n</main>\n")
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
+	if requestFound {
+		buffer.Html(`<ul>`)
+		if request.errorLogCount > 0 {
+			buffer.Html(fmt.Sprintf(`<li class="debug-error-log">%d error logs</li>`, request.errorLogCount))
+		} else {
+			buffer.Html(`<li>0 error logs</li>`)
+		}
+		if request.warnLogCount > 0 {
+			buffer.Html(fmt.Sprintf(`<li class="debug-warn-log">%d warn logs</li>`, request.warnLogCount))
+		} else {
+			buffer.Html(`<li>0 warn logs</li>`)
+		}
+
+		buffer.Html(`</ul>`)
+	}
+	buffer.Html(`<form action="/log/`).Text(requestId).Html(`">&nbsp;<input class="btn" type="submit" value="Go to log" /></form>`)
+
+	buffer.Html("\n</div>")
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
+
+func (qmc *QuesmaManagementConsole) generateLogForRequestId(requestId string) []byte {
+	qmc.mutex.Lock()
+	request, requestFound := qmc.debugInfoMessages[requestId]
+	qmc.mutex.Unlock()
+
+	logMessages, optAsyncId := generateLogMessages(request.logMessages, []string{})
+
+	buffer := newBufferWithHead()
+	if requestFound {
+		if optAsyncId != nil {
+			buffer.Write(generateSimpleTop("Log for request id " + requestId + " and async id " + *optAsyncId))
+		} else {
+			buffer.Write(generateSimpleTop("Log for request id " + requestId))
+		}
+	} else {
+		buffer.Write(generateSimpleTop("Log not found for request id " + requestId))
+	}
+
+	buffer.Html(`<main class="center" id="request-log-messages">`)
+	buffer.Html("\n\n")
+	buffer.Html(`<div class="debug-body">`)
+
+	buffer.Write(logMessages)
+
+	buffer.Html("\n</div>\n")
+	buffer.Html("\n</main>\n")
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
+	buffer.Html(`<br>`)
+	buffer.Html(`<form action="/request-id/`).Text(requestId).Html(`">&nbsp;<input class="btn" type="submit" value="Back to request info" /></form>`)
+
+	buffer.Html("\n</div>")
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
+
+// links might be empty, then table won't have any links within.
+// if i < len(logMessages) && i < len(links) then logMessages[i] will have link links[i]
+func generateLogMessages(logMessages []string, links []string) ([]byte, *string) {
+	// adds a link to the table row if there is a link for it
+	addOpeningLink := func(row, column int) string {
+		if row < len(links) {
+			link := `<a href="` + links[row] + `" class="row-link"`
+			if column != 0 {
+				link += ` tabindex="-1"` // some way to make links in table prettier, see https://robertcooper.me/post/table-row-links
+			}
+			return link + ">"
+		}
+		return ""
+	}
+	addClosingLink := func(i int) string {
+		if i < len(links) {
+			return "</a>"
+		}
+		return ""
+	}
+
+	var buffer buffer.HtmlBuffer
+	buffer.Html("<table>\n")
+	buffer.Html("<thead>\n")
+	buffer.Html("<tr>\n")
+	buffer.Html(`<th class="time">Time</th>`)
+	buffer.Html(`<th class="level">Level</th>`)
+	buffer.Html(`<th class="message">Message</th>`)
+	buffer.Html(`<th class="fields">Fields</th>`)
+	buffer.Html("</tr>\n")
+
+	buffer.Html("</thead>\n")
+	buffer.Html("<tbody>\n")
+
+	var asyncId *string
+
+	for i, logMessage := range logMessages {
+		buffer.Html("<tr>\n")
+
+		var fields map[string]interface{}
+
+		if err := json.Unmarshal([]byte(logMessage), &fields); err != nil {
+			// error print
+			buffer.Html("<td></td><td>error</td><td></td>").Text(err.Error()).Html("<td>")
+			continue
+		}
+		// time
+		buffer.Html(`<td class="time">` + addOpeningLink(i, 0))
+		if _, ok := fields["time"]; ok {
+			time := fields["time"].(string)
+			time = strings.Replace(time, "T", " ", 1)
+			time = strings.Replace(time, ".", " ", 1)
+			buffer.Text(time)
+			delete(fields, "time")
+		} else {
+			buffer.Html("missing time")
+		}
+		buffer.Html(addClosingLink(i) + "</td>")
+
+		// get rid of request_id and async_id
+		delete(fields, "request_id")
+		if id, ok := fields["async_id"].(string); ok {
+			asyncId = &id
+			delete(fields, "async_id")
+		}
+
+		// level
+		buffer.Html(`<td class="level">` + addOpeningLink(i, 1))
+		if level, ok := fields["level"].(string); ok {
+			if level == "error" {
+				buffer.Html(`<span class="debug-error-log">`)
+			} else if level == "warn" {
+				buffer.Html(`<span class="debug-warn-log">`)
+			} else {
+				buffer.Html(`<span>`)
+			}
+			buffer.Text(level).Html("</span></td>")
+			delete(fields, "level")
+		} else {
+			buffer.Html("missing level")
+		}
+		buffer.Html(addClosingLink(i) + "</td>")
+
+		// message
+		buffer.Html(`<td class="message">` + addOpeningLink(i, 2))
+		if message, ok := fields["message"].(string); ok {
+			buffer.Text(message)
+			delete(fields, "message")
+		}
+		buffer.Html(addClosingLink(i) + "</td>")
+
+		// fields
+		buffer.Html(`<td class="fields">` + addOpeningLink(i, 3))
+		if rest, err := yaml.Marshal(&fields); err == nil {
+			buffer.Text(string(rest))
+		}
+		buffer.Html(addClosingLink(i) + "</td></tr>\n")
+	}
+
+	buffer.Html("</tbody>\n")
+	buffer.Html("</table>\n")
+	return buffer.Bytes(), asyncId
+}
+
+func (qmc *QuesmaManagementConsole) generateReportForRequestsWithStr(requestStr string) []byte {
+	var debugKeyValueSlice []queryDebugInfoWithId
+
+	qmc.mutex.Lock()
+	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
+		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
+		if debugInfo.requestContains(requestStr) && len(debugKeyValueSlice) < maxLastMessages {
+			debugKeyValueSlice = append(debugKeyValueSlice,
+				queryDebugInfoWithId{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
+		}
+	}
+	qmc.mutex.Unlock()
+
+	title := fmt.Sprintf("Report for str '%s' with %d results", requestStr, len(debugKeyValueSlice))
+	return qmc.generateReportForRequests(title, debugKeyValueSlice, []byte{})
+}
+
+func (qmc *QuesmaManagementConsole) generateReportForRequestsWithError() []byte {
+	var debugKeyValueSlice []queryDebugInfoWithId
+
+	qmc.mutex.Lock()
+	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
+		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
+		if debugInfo.errorLogCount > 0 && len(debugKeyValueSlice) < maxLastMessages {
+			debugKeyValueSlice = append(debugKeyValueSlice,
+				queryDebugInfoWithId{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
+		}
+	}
+	qmc.mutex.Unlock()
+
+	return qmc.generateReportForRequests("Report for requests with errors", debugKeyValueSlice, []byte{})
+}
+
+func (qmc *QuesmaManagementConsole) generateReportForRequestsWithWarning() []byte {
+	var debugKeyValueSlice []queryDebugInfoWithId
+
+	qmc.mutex.Lock()
+	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
+		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
+		if debugInfo.warnLogCount > 0 && len(debugKeyValueSlice) < maxLastMessages {
+			debugKeyValueSlice = append(debugKeyValueSlice,
+				queryDebugInfoWithId{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
+		}
+	}
+	qmc.mutex.Unlock()
+
+	return qmc.generateReportForRequests("Report for requests with warnings", debugKeyValueSlice, []byte{})
+}
+
+func (qmc *QuesmaManagementConsole) generateReportForRequests(title string, requests []queryDebugInfoWithId, sidebar []byte) []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateSimpleTop(title))
+
+	buffer.Html("\n</div>\n\n")
+
+	buffer.Html(`<main id="queries">`)
+
+	buffer.Write(generateQueries(requests, true))
+
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/live">&nbsp;<input class="btn" type="submit" value="Back to live tail" /></form>`)
+	buffer.Write(sidebar)
+
+	buffer.Html("\n</div>")
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/management_console.go b/quesma/quesma/ui/management_console.go
index 3559977aa..3de41f598 100644
--- a/quesma/quesma/ui/management_console.go
+++ b/quesma/quesma/ui/management_console.go
@@ -5,27 +5,21 @@ import (
 	"mitmproxy/quesma/elasticsearch"
 	"mitmproxy/quesma/telemetry"
 	"mitmproxy/quesma/tracing"
-	_ "net/http/pprof"
+	"mitmproxy/quesma/util"
 
-	"encoding/json"
-	"errors"
-	"io"
 	"mitmproxy/quesma/clickhouse"
 	"mitmproxy/quesma/logger"
 	"mitmproxy/quesma/quesma/config"
 	"mitmproxy/quesma/stats"
-	"mitmproxy/quesma/util"
 	"net/http"
 	"reflect"
 	"regexp"
-	"runtime"
 	"strings"
 	"sync"
 	"time"
 )
 
 const (
-	uiTcpPort       = "9999"
 	maxLastMessages = 10000
 )
 
@@ -55,7 +49,7 @@ type QueryDebugSecondarySource struct {
 	SecondaryTook          time.Duration
 }
 
-type QueryDebugInfo struct {
+type queryDebugInfo struct {
 	QueryDebugPrimarySource
 	QueryDebugSecondarySource
 	logMessages   []string
@@ -64,6 +58,11 @@ type QueryDebugInfo struct {
 	unsupported   *string
 }
 
+type queryDebugInfoWithId struct {
+	id    string
+	query queryDebugInfo
+}
+
 type recordRequests struct {
 	typeName string
 	took     time.Duration
@@ -76,9 +75,9 @@ type QuesmaManagementConsole struct {
 	queryDebugLogs            <-chan tracing.LogWithLevel
 	ui                        *http.Server
 	mutex                     sync.Mutex
-	debugInfoMessages         map[string]QueryDebugInfo
+	debugInfoMessages         map[string]queryDebugInfo
 	debugLastMessages         []string
-	responseMatcherChannel    chan QueryDebugInfo
+	responseMatcherChannel    chan queryDebugInfo
 	config                    config.QuesmaConfiguration
 	requestsStore             *stats.RequestStatisticStore
 	requestsSource            chan *recordRequests
@@ -96,9 +95,9 @@ func NewQuesmaManagementConsole(config config.QuesmaConfiguration, logManager *c
 		queryDebugPrimarySource:   make(chan *QueryDebugPrimarySource, 10),
 		queryDebugSecondarySource: make(chan *QueryDebugSecondarySource, 10),
 		queryDebugLogs:            logChan,
-		debugInfoMessages:         make(map[string]QueryDebugInfo),
+		debugInfoMessages:         make(map[string]queryDebugInfo),
 		debugLastMessages:         make([]string, 0),
-		responseMatcherChannel:    make(chan QueryDebugInfo, 5),
+		responseMatcherChannel:    make(chan queryDebugInfo, 5),
 		config:                    config,
 		requestsStore:             stats.NewRequestStatisticStore(),
 		requestsSource:            make(chan *recordRequests, 100),
@@ -123,7 +122,7 @@ func (qmc *QuesmaManagementConsole) RecordRequest(typeName string, took time.Dur
 	qmc.requestsSource <- &recordRequests{typeName, took, error}
 }
 
-func (qdi *QueryDebugInfo) requestContains(queryStr string) bool {
+func (qdi *queryDebugInfo) requestContains(queryStr string) bool {
 	potentialPlaces := [][]byte{qdi.QueryDebugSecondarySource.IncomingQueryBody,
 		qdi.QueryDebugSecondarySource.QueryBodyTranslated}
 	for _, potentialPlace := range potentialPlaces {
@@ -134,80 +133,6 @@ func (qdi *QueryDebugInfo) requestContains(queryStr string) bool {
 	return false
 }
 
-func (qmc *QuesmaManagementConsole) newHTTPServer() *http.Server {
-	return &http.Server{
-		Addr:    ":" + uiTcpPort,
-		Handler: qmc.createRouting(),
-	}
-}
-
-func panicRecovery(h http.Handler) http.Handler {
-	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		defer func() {
-			if err := recover(); err != nil {
-				buf := make([]byte, 2048)
-				n := runtime.Stack(buf, false)
-				buf = buf[:n]
-
-				w.WriteHeader(http.StatusInternalServerError)
-				w.Header().Set("Content-Type", "text/plain")
-				w.Write([]byte("Internal Server Error\n\n"))
-
-				w.Write([]byte("Stack:\n"))
-				w.Write(buf)
-				logger.Error().Msgf("recovering from err %v\n %s", err, buf)
-			}
-		}()
-
-		h.ServeHTTP(w, r)
-	})
-}
-
-func (qmc *QuesmaManagementConsole) listenAndServe() {
-	if err := qmc.ui.ListenAndServe(); err != nil && !errors.Is(err, http.ErrServerClosed) {
-		logger.Fatal().Msgf("Error starting server: %v", err)
-	}
-}
-
-type DebugKeyValue struct {
-	Key   string
-	Value QueryDebugInfo
-}
-
-func (qmc *QuesmaManagementConsole) generateQueries() []byte {
-	// Take last MAX_LAST_MESSAGES to display, e.g. 100 out of potentially 10m000
-	qmc.mutex.Lock()
-	lastMessages := qmc.debugLastMessages
-	debugKeyValueSlice := []DebugKeyValue{}
-	count := 0
-	for i := len(lastMessages) - 1; i >= 0 && count < maxLastMessages; i-- {
-		debugInfoMessage := qmc.debugInfoMessages[lastMessages[i]]
-		if len(debugInfoMessage.QueryDebugSecondarySource.IncomingQueryBody) > 0 {
-			debugKeyValueSlice = append(debugKeyValueSlice, DebugKeyValue{lastMessages[i], debugInfoMessage})
-			count++
-		}
-	}
-	qmc.mutex.Unlock()
-
-	queriesBytes := generateQueries(debugKeyValueSlice, true)
-	queriesStats := qmc.generateQueriesStatsPanel()
-	unsupportedQueriesStats := qmc.generateUnsupportedQuerySidePanel()
-	return append(queriesBytes, append(queriesStats, unsupportedQueriesStats...)...)
-}
-
-func newBufferWithHead() HtmlBuffer {
-	const bufferSize = 4 * 1024 // size of ui/head.html
-	var buffer HtmlBuffer
-	buffer.Grow(bufferSize)
-	head, err := uiFs.ReadFile("asset/head.html")
-	buffer.Write(head)
-	if err != nil {
-		buffer.Text(err.Error())
-	}
-	buffer.Html("\n")
-	return buffer
-}
-
 func (qmc *QuesmaManagementConsole) addNewMessageId(messageId string) {
 	qmc.debugLastMessages = append(qmc.debugLastMessages, messageId)
 	if len(qmc.debugLastMessages) > maxLastMessages {
@@ -224,14 +149,14 @@ func (qmc *QuesmaManagementConsole) processChannelMessage() {
 			[]byte(util.JsonPrettify(string(msg.QueryResp), true)), msg.PrimaryTook}
 		qmc.mutex.Lock()
 		if value, ok := qmc.debugInfoMessages[msg.Id]; !ok {
-			qmc.debugInfoMessages[msg.Id] = QueryDebugInfo{
+			qmc.debugInfoMessages[msg.Id] = queryDebugInfo{
 				QueryDebugPrimarySource: debugPrimaryInfo,
 			}
 			qmc.addNewMessageId(msg.Id)
 		} else {
 			value.QueryDebugPrimarySource = debugPrimaryInfo
 			qmc.debugInfoMessages[msg.Id] = value
-			// That's the point where QueryDebugInfo is
+			// That's the point where queryDebugInfo is
 			// complete and we can compare results
 			if isComplete(value) {
 				qmc.responseMatcherChannel <- value
@@ -251,13 +176,13 @@ func (qmc *QuesmaManagementConsole) processChannelMessage() {
 		}
 		qmc.mutex.Lock()
 		if value, ok := qmc.debugInfoMessages[msg.Id]; !ok {
-			qmc.debugInfoMessages[msg.Id] = QueryDebugInfo{
+			qmc.debugInfoMessages[msg.Id] = queryDebugInfo{
 				QueryDebugSecondarySource: secondaryDebugInfo,
 			}
 			qmc.addNewMessageId(msg.Id)
 		} else {
 			value.QueryDebugSecondarySource = secondaryDebugInfo
-			// That's the point where QueryDebugInfo is
+			// That's the point where queryDebugInfo is
 			// complete and we can compare results
 			qmc.debugInfoMessages[msg.Id] = value
 			if isComplete(value) {
@@ -274,10 +199,10 @@ func (qmc *QuesmaManagementConsole) processChannelMessage() {
 		requestId := match[1]
 
 		qmc.mutex.Lock()
-		var value QueryDebugInfo
+		var value queryDebugInfo
 		var ok bool
 		if value, ok = qmc.debugInfoMessages[requestId]; !ok {
-			value = QueryDebugInfo{
+			value = queryDebugInfo{
 				logMessages: []string{log.Msg},
 			}
 			qmc.addNewMessageId(requestId)
@@ -301,7 +226,7 @@ func (qmc *QuesmaManagementConsole) processChannelMessage() {
 	}
 }
 
-func isComplete(value QueryDebugInfo) bool {
+func isComplete(value queryDebugInfo) bool {
 	return !reflect.DeepEqual(value.QueryDebugPrimarySource, QueryDebugPrimarySource{}) && !reflect.DeepEqual(value.QueryDebugSecondarySource, QueryDebugSecondarySource{})
 }
 
@@ -324,43 +249,6 @@ func (qmc *QuesmaManagementConsole) RunOnlyChannelProcessor() {
 	}
 }
 
-func (qmc *QuesmaManagementConsole) checkHealth(writer http.ResponseWriter, _ *http.Request) {
-	health := qmc.checkElasticsearch()
-	if health.status != "red" {
-		writer.WriteHeader(200)
-		writer.Header().Set("Content-Type", "application/json")
-		_, _ = writer.Write([]byte(`{"cluster_name": "quesma"}`))
-	} else {
-		writer.WriteHeader(503)
-		_, _ = writer.Write([]byte(`Elastic search is unavailable: ` + health.message))
-	}
-}
-
-// curl -X POST localhost:9999/_quesma/bypass -d '{"bypass": true}'
-func bypassSwitch(writer http.ResponseWriter, r *http.Request) {
-	bodyString, err := io.ReadAll(r.Body)
-	if err != nil {
-		logger.Error().Msgf("Error reading body: %v", err)
-		writer.WriteHeader(400)
-		_, _ = writer.Write([]byte("Error reading body: " + err.Error()))
-		return
-	}
-	body := make(map[string]interface{})
-	err = json.Unmarshal(bodyString, &body)
-	if err != nil {
-		logger.Fatal().Msg(err.Error())
-	}
-
-	if body["bypass"] != nil {
-		val := body["bypass"].(bool)
-		config.SetTrafficAnalysis(val)
-		logger.Info().Msgf("global bypass set to %t\n", val)
-		writer.WriteHeader(200)
-	} else {
-		writer.WriteHeader(400)
-	}
-}
-
 func (qmc *QuesmaManagementConsole) comparePipelines() {
 	for {
 		queryDebugInfo, ok := <-qmc.responseMatcherChannel
diff --git a/quesma/quesma/ui/routing.go b/quesma/quesma/ui/routing.go
new file mode 100644
index 000000000..305fc1400
--- /dev/null
+++ b/quesma/quesma/ui/routing.go
@@ -0,0 +1,77 @@
+package ui
+
+import (
+	"mitmproxy/quesma/quesma/mux"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
+	"strings"
+)
+
+func (qmc *QuesmaManagementConsole) generateRouterStatisticsLiveTail() []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("routing-statistics"))
+
+	buffer.Html(`<main id="routing-statistics">`)
+	buffer.Write(qmc.generateRouterStatistics())
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<form action="/">&nbsp;<input class="btn" type="submit" value="Back to dashboard" /></form>`)
+
+	buffer.Html("\n</div>")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
+
+func dropFirstSegment(path string) string {
+	segments := strings.SplitN(path, "/", 3)
+	if len(segments) > 2 {
+		return "/" + segments[2]
+	}
+	return path
+}
+
+func (qmc *QuesmaManagementConsole) generateRouterStatistics() []byte {
+	var buffer buffer.HtmlBuffer
+
+	matchedKeys, matched, unmatchedKeys, unmatched := mux.MatchStatistics().GroupByFirstSegment()
+
+	buffer.Html("\n<h2>Matched URLs</h2>\n<ul>")
+	for _, segment := range matchedKeys {
+		paths := matched[segment]
+		if len(paths) > 1 {
+			buffer.Html("<li>").Text(segment).Html("</li>")
+
+			buffer.Html("<ul>\n")
+			for _, path := range paths {
+				buffer.Html("<li><small>").Text(dropFirstSegment(path)).Html("</small></li>")
+			}
+			buffer.Html("</ul>\n")
+		} else {
+			buffer.Html("<li>").Text(paths[0]).Html("</li>\n")
+		}
+	}
+
+	buffer.Html("</ul>\n")
+	buffer.Html("\n<h2>Not matched URLs</h2>\n<ul>")
+	for _, segment := range unmatchedKeys {
+		paths := unmatched[segment]
+		if len(paths) > 1 {
+			buffer.Html("<li>").Text(segment).Html("</li>")
+
+			buffer.Html("<ul>\n")
+			for _, path := range paths {
+				buffer.Html("<li><small>").Text(dropFirstSegment(path)).Html("</small></li>")
+			}
+			buffer.Html("</ul>\n")
+		} else {
+			buffer.Html("<li>").Text(paths[0]).Html("</li>\n")
+		}
+	}
+	buffer.Html("</ul>\n")
+
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/schema.go b/quesma/quesma/ui/schema.go
new file mode 100644
index 000000000..30b9ae4bc
--- /dev/null
+++ b/quesma/quesma/ui/schema.go
@@ -0,0 +1,275 @@
+package ui
+
+import (
+	"fmt"
+	"mitmproxy/quesma/clickhouse"
+	"mitmproxy/quesma/util"
+	"sort"
+	"strings"
+)
+
+func (qmc *QuesmaManagementConsole) generateSchema() []byte {
+	type menuEntry struct {
+		label  string
+		target string
+	}
+
+	var menuEntries []menuEntry
+
+	type tableColumn struct {
+		name             string
+		typeName         string
+		isAttribute      bool
+		isFullTextSearch bool
+		warning          *string
+	}
+
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("schema"))
+	buffer.Html(`<main id="schema">`)
+
+	if qmc.logManager != nil {
+
+		// Not sure if we should read directly from the TableMap or we should use the Snapshot of it.
+		// Let's leave it as is for now.
+		schema := qmc.logManager.GetTableDefinitions()
+
+		tableNames := schema.Keys()
+		sort.Strings(tableNames)
+
+		buffer.Html("\n<table>")
+
+		for i, tableName := range tableNames {
+			table, ok := schema.Load(tableName)
+			if !ok {
+				continue
+			}
+
+			id := fmt.Sprintf("schema-table-%d", i)
+			var menu menuEntry
+			menu.label = table.Name
+			menu.target = fmt.Sprintf("#%s", id)
+			menuEntries = append(menuEntries, menu)
+
+			buffer.Html(`<tr class="tableName"`)
+			buffer.Html(fmt.Sprintf(` id="%s"`, id))
+			buffer.Html(`>`)
+			buffer.Html(`<th colspan=2><h2>`)
+			buffer.Html(`Table: `)
+			buffer.Text(table.Name)
+
+			if table.Comment != "" {
+				buffer.Text(" (")
+				buffer.Text(table.Comment)
+				buffer.Text(")")
+			}
+
+			buffer.Html(`</h2></th>`)
+			buffer.Html(`</tr>`)
+
+			buffer.Html(`<tr>`)
+			buffer.Html(`<th>`)
+			buffer.Html(`Name`)
+			buffer.Html(`</th>`)
+			buffer.Html(`<th>`)
+			buffer.Html(`Type`)
+			buffer.Html(`</th>`)
+			buffer.Html(`</tr>`)
+
+			var columnNames []string
+			var columnMap = make(map[string]tableColumn)
+
+			// standard columns, visible for the user
+			for k := range table.Cols {
+				c := tableColumn{}
+
+				c.name = k
+				if table.Cols[k].Type != nil {
+					c.typeName = table.Cols[k].Type.StringWithNullable()
+				} else {
+					c.typeName = "n/a"
+				}
+
+				c.isAttribute = false
+				c.isFullTextSearch = table.Cols[k].IsFullTextMatch
+
+				columnNames = append(columnNames, k)
+				columnMap[k] = c
+			}
+
+			for _, a := range qmc.config.AliasFields(table.Name) {
+
+				// check for collisions
+				if field, collide := columnMap[a.SourceFieldName]; collide {
+					field.warning = util.Pointer("alias declared with the same name")
+					columnMap[a.SourceFieldName] = field
+					continue
+				}
+
+				// check if target exists
+				c := tableColumn{}
+				c.name = a.SourceFieldName
+				if aliasedField, ok := columnMap[a.TargetFieldName]; ok {
+					c.typeName = fmt.Sprintf("alias of '%s', %s", a.TargetFieldName, aliasedField.typeName)
+					c.isFullTextSearch = aliasedField.isFullTextSearch
+					c.isAttribute = aliasedField.isAttribute
+				} else {
+					c.warning = util.Pointer("alias points to non-existing field '" + a.TargetFieldName + "'")
+					c.typeName = "dangling alias"
+				}
+
+				columnNames = append(columnNames, a.SourceFieldName)
+				columnMap[a.SourceFieldName] = c
+			}
+
+			// columns added by Quesma, not visible for the user
+			//
+			// this part is based on addOurFieldsToCreateTableQuery in log_manager.go
+			attributes := table.Config.GetAttributes()
+			if len(attributes) > 0 {
+				for _, a := range attributes {
+					_, ok := table.Cols[a.KeysArrayName]
+					if !ok {
+						c := tableColumn{}
+						c.name = a.KeysArrayName
+						c.typeName = clickhouse.CompoundType{Name: "Array", BaseType: clickhouse.NewBaseType("String")}.StringWithNullable()
+						c.isAttribute = true
+						columnNames = append(columnNames, c.name)
+						columnMap[c.name] = c
+					}
+					_, ok = table.Cols[a.ValuesArrayName]
+					if !ok {
+						c := tableColumn{}
+						c.name = a.ValuesArrayName
+						c.typeName = clickhouse.CompoundType{Name: "Array", BaseType: a.Type}.StringWithNullable()
+						c.isAttribute = true
+						columnNames = append(columnNames, c.name)
+						columnMap[c.name] = c
+					}
+				}
+			}
+
+			sort.Strings(columnNames)
+
+			for _, columnName := range columnNames {
+				column, ok := columnMap[columnName]
+				if !ok {
+					continue
+				}
+
+				buffer.Html(`<tr class="`)
+
+				if column.isAttribute {
+					buffer.Html(`columnAttribute `)
+				}
+				if column.warning != nil {
+					buffer.Html(`columnWarning `)
+				}
+				buffer.Html(`column`)
+
+				buffer.Html(`">`)
+				buffer.Html(`<td class="columnName">`)
+
+				buffer.Text(column.name)
+				buffer.Html(`</td>`)
+				buffer.Html(`<td class="columnType">`)
+
+				buffer.Text(column.typeName)
+				if column.isFullTextSearch {
+					buffer.Html(` <i>(Full text match)</i>`)
+				}
+
+				if column.warning != nil {
+					buffer.Html(` <span class="columnWarningText">WARNING: `)
+					buffer.Text(*column.warning)
+					buffer.Html(`</span>`)
+				}
+
+				buffer.Html(`</td>`)
+				buffer.Html(`</tr>`)
+			}
+
+		}
+
+		buffer.Html("\n</table>")
+
+	} else {
+		buffer.Html(`<p>Schema is not available</p>`)
+	}
+
+	buffer.Html("\n<table>")
+	buffer.Html(`<tr class="tableName" id="quesma-config">`)
+	buffer.Html(`<th colspan=3><h2>`)
+	buffer.Html(`Quesma Config`)
+	buffer.Html(`</h2></th>`)
+	buffer.Html(`</tr>`)
+
+	buffer.Html(`<tr>`)
+	buffer.Html(`<th>`)
+	buffer.Html(`Name Pattern`)
+	buffer.Html(`</th>`)
+	buffer.Html(`<th>`)
+	buffer.Html(`Enabled?`)
+	buffer.Html(`</th>`)
+	buffer.Html(`<th>`)
+	buffer.Html(`Full Text Search Fields`)
+	buffer.Html(`</th>`)
+
+	buffer.Html(`</tr>`)
+
+	for _, cfg := range qmc.config.IndexConfig {
+		buffer.Html(`<tr>`)
+		buffer.Html(`<td>`)
+		buffer.Text(cfg.Name)
+		buffer.Html(`</td>`)
+		buffer.Html(`<td>`)
+		if cfg.Enabled {
+			buffer.Text("true")
+		} else {
+			buffer.Text("false")
+		}
+		buffer.Html(`</td>`)
+
+		buffer.Html(`<td>`)
+		buffer.Text(strings.Join(cfg.FullTextFields, ", "))
+		buffer.Html(`</td>`)
+
+		buffer.Html(`</tr>`)
+	}
+
+	buffer.Html("\n</table>")
+
+	buffer.Html("\n</main>\n\n")
+
+	buffer.Html(`<div class="menu">`)
+	buffer.Html("\n<h2>Menu</h2>")
+
+	buffer.Html(`<h3>Admin actions</h3>`)
+	buffer.Html(`<ul>`)
+
+	buffer.Html(`<li><button hx-post="/schema/reload" hx-target="body">Reload Schemas</button></li>`)
+
+	buffer.Html(`</ul>`)
+
+	buffer.Html(`<h3>Tables:</h3>`)
+
+	buffer.Html("<ol>")
+
+	for _, menu := range menuEntries {
+		buffer.Html(`<li><a href="`)
+		buffer.Text(menu.target)
+		buffer.Html(`">`)
+		buffer.Text(menu.label)
+		buffer.Html(`</a></li>`)
+	}
+
+	buffer.Html("</ol>")
+
+	buffer.Html(`<h3><a href="#quesma-config">Jump to Quesma Config</a></h3>`)
+
+	buffer.Html("\n</div>")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/telemetry.go b/quesma/quesma/ui/telemetry.go
new file mode 100644
index 000000000..a59a5ed93
--- /dev/null
+++ b/quesma/quesma/ui/telemetry.go
@@ -0,0 +1,36 @@
+package ui
+
+import (
+	"encoding/json"
+	"mitmproxy/quesma/logger"
+)
+
+func (qmc *QuesmaManagementConsole) generateTelemetry() []byte {
+	buffer := newBufferWithHead()
+	buffer.Write(generateTopNavigation("telemetry"))
+	buffer.Html(`<main id="telemetry">`)
+
+	buffer.Html(`<h2>Telemetry</h2>`)
+	buffer.Html("<pre>")
+
+	stats, available := qmc.phoneHomeAgent.RecentStats()
+	if available {
+		asBytes, err := json.MarshalIndent(stats, "", "  ")
+
+		if err != nil {
+			logger.Error().Err(err).Msg("Error marshalling phone home stats")
+			buffer.Html("Telemetry Stats are unable to be displayed. This is a bug.")
+		} else {
+			buffer.Html(string(asBytes))
+		}
+
+	} else {
+		buffer.Html("Telemetry Stats are not available yet.")
+	}
+
+	buffer.Html("</pre>")
+
+	buffer.Html("\n</body>")
+	buffer.Html("\n</html>")
+	return buffer.Bytes()
+}
diff --git a/quesma/quesma/ui/unsupported_queries.go b/quesma/quesma/ui/unsupported_queries.go
index f206889ed..35cc9cf0b 100644
--- a/quesma/quesma/ui/unsupported_queries.go
+++ b/quesma/quesma/ui/unsupported_queries.go
@@ -5,6 +5,7 @@ import (
 	"github.com/rs/zerolog"
 	"mitmproxy/quesma/logger"
 	"mitmproxy/quesma/model"
+	"mitmproxy/quesma/quesma/ui/internal/buffer"
 	"mitmproxy/quesma/tracing"
 	"regexp"
 	"sort"
@@ -42,14 +43,14 @@ func processUnsupportedLogMessage(log tracing.LogWithLevel) *string {
 }
 
 func (qmc *QuesmaManagementConsole) generateReportForUnsupportedRequests() []byte {
-	var debugKeyValueSlice []DebugKeyValue
+	var debugKeyValueSlice []queryDebugInfoWithId
 
 	qmc.mutex.Lock()
 	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
 		debugInfo := qmc.debugInfoMessages[qmc.debugLastMessages[i]]
 		if debugInfo.unsupported != nil && len(debugKeyValueSlice) < maxLastMessages {
 			debugKeyValueSlice = append(debugKeyValueSlice,
-				DebugKeyValue{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
+				queryDebugInfoWithId{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
 		}
 	}
 	qmc.mutex.Unlock()
@@ -68,7 +69,7 @@ func (qmc *QuesmaManagementConsole) generateReportForUnsupportedRequests() []byt
 		return slice[i].count > slice[j].count
 	})
 
-	var buffer HtmlBuffer
+	var buffer buffer.HtmlBuffer
 	buffer.Html("<br />")
 	buffer.Html(`<h3>Unsupported queries by type</h3>`)
 	buffer.Html(`<ul id="unsupported-queries-stats">`)
@@ -82,44 +83,6 @@ func (qmc *QuesmaManagementConsole) generateReportForUnsupportedRequests() []byt
 	return qmc.generateReportForRequests("Unsupported requests", debugKeyValueSlice, buffer.Bytes())
 }
 
-func (qmc *QuesmaManagementConsole) generateUnsupportedQuerySidePanel() []byte {
-	qmc.mutex.Lock()
-	totalErrorsCount := qmc.totalUnsupportedQueries
-	qmc.mutex.Unlock()
-
-	typesCount := qmc.GetUnsupportedTypesWithCount()
-	savedErrorsCount := 0
-	for _, count := range typesCount {
-		savedErrorsCount += count
-	}
-	typesSeenCount := len(typesCount)
-	unknownTypeCount := 0
-	if value, ok := typesCount[UnrecognizedQueryType]; ok {
-		unknownTypeCount = value
-	}
-
-	var buffer HtmlBuffer
-	linkToMainView := `<li><a href="/unsupported-requests"`
-	buffer.Html(`<ul id="unsupported-queries-stats" hx-swap-oob="true">`)
-	if totalErrorsCount > 0 {
-		buffer.Html(fmt.Sprintf(`%s class="debug-warn-log"">%d total (%d recent)</a></li>`, linkToMainView, totalErrorsCount, savedErrorsCount))
-		plural := "s"
-		if typesSeenCount == 1 {
-			plural = ""
-		}
-		buffer.Html(fmt.Sprintf(`%s class="debug-warn-log"">%d different type%s</a></li>`, linkToMainView, typesSeenCount, plural))
-		if unknownTypeCount > 0 {
-			buffer.Html(fmt.Sprintf(`<li><a href="/unsupported-requests/%s"" class="debug-error-log">`, UnrecognizedQueryType))
-			buffer.Html(fmt.Sprintf(`%d of unrecognized type</a></li>`, unknownTypeCount))
-		}
-	} else {
-		buffer.Html(`<li>None!</a></li>`)
-	}
-	buffer.Html(`</ul>`)
-
-	return buffer.Bytes()
-}
-
 func (qmc *QuesmaManagementConsole) GetTotalUnsupportedQueries() int {
 	qmc.mutex.Lock()
 	defer qmc.mutex.Unlock()
@@ -160,8 +123,8 @@ func (qmc *QuesmaManagementConsole) GetUnsupportedTypesWithCount() map[string]in
 	return types
 }
 
-func (qmc *QuesmaManagementConsole) QueriesWithUnsupportedType(typeName string) []DebugKeyValue {
-	var debugKeyValueSlice []DebugKeyValue
+func (qmc *QuesmaManagementConsole) QueriesWithUnsupportedType(typeName string) []queryDebugInfoWithId {
+	var debugKeyValueSlice []queryDebugInfoWithId
 
 	qmc.mutex.Lock()
 	for i := len(qmc.debugLastMessages) - 1; i >= 0; i-- {
@@ -169,7 +132,7 @@ func (qmc *QuesmaManagementConsole) QueriesWithUnsupportedType(typeName string)
 		if debugInfo.unsupported != nil && len(debugKeyValueSlice) < maxLastMessages {
 			if *debugInfo.unsupported == typeName {
 				debugKeyValueSlice = append(debugKeyValueSlice,
-					DebugKeyValue{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
+					queryDebugInfoWithId{qmc.debugLastMessages[i], qmc.debugInfoMessages[qmc.debugLastMessages[i]]})
 			}
 		}
 	}