github.com/grafana/pyroscope@v1.18.0/pkg/operations/v2/tool.blocks.dataset.index.gohtml (about) 1 <!DOCTYPE html> 2 <html class="h-100" data-bs-theme="dark"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 8 <title>Bucket Blocks Explorer (v2): TSDB Index</title> 9 10 <link rel="stylesheet" href="/static/bootstrap-5.3.3.min.css"> 11 <link rel="stylesheet" href="/static/bootstrap-icons-1.8.1.css"> 12 <link rel="stylesheet" href="/static/pyroscope-styles.css"> 13 <script src="/static/bootstrap-5.3.3.bundle.min.js"></script> 14 15 <style> 16 .info-card { 17 margin-bottom: 20px; 18 } 19 .label-value-set { 20 margin-bottom: 15px; 21 padding: 10px; 22 border: 1px solid #495057; 23 border-radius: 4px; 24 } 25 .label-name-header { 26 font-weight: 600; 27 color: #0dcaf0; 28 margin-bottom: 5px; 29 } 30 .value-list { 31 margin-left: 20px; 32 font-family: 'Courier New', Courier, monospace; 33 font-size: 13px; 34 color: #adb5bd; 35 } 36 .symbol-list { 37 font-family: 'Courier New', Courier, monospace; 38 font-size: 13px; 39 color: #adb5bd; 40 max-height: 400px; 41 overflow-y: auto; 42 } 43 .count-badge { 44 background-color: #198754; 45 color: white; 46 padding: 2px 8px; 47 border-radius: 3px; 48 font-size: 12px; 49 margin-left: 10px; 50 } 51 </style> 52 </head> 53 <body class="d-flex flex-column h-100"> 54 <main class="flex-shrink-0"> 55 <div class="container"> 56 <div class="header row border-bottom py-3 flex-column-reverse flex-sm-row"> 57 <div class="col-12 col-sm-9 text-center text-sm-start"> 58 <h3>Bucket Blocks Explorer (v2): TSDB Index</h3> 59 </div> 60 <div class="col-12 col-sm-3 text-center text-sm-end mb-3 mb-sm-0"> 61 <a href="/ops/object-store/tenants"> 62 <img alt="Pyroscope logo" class="pyroscope-brand" src="/static/pyroscope-logo.png"> 63 </a> 64 </div> 65 </div> 66 <div class="row my-3"> 67 <p> 68 <a href="/ops/object-store/tenants/{{ .User }}/blocks/{{ .BlockID }}/datasets?dataset={{ if .Dataset.Name }}{{ .Dataset.Name }}{{ else }}_empty{{ end }}&shard={{ .Shard }}&block_tenant={{ .BlockTenant }}">Back to dataset</a> 69 </p> 70 71 <div class="card bg-dark border-secondary info-card"> 72 <div class="card-header"> 73 <h5 class="mb-0">Dataset Information</h5> 74 </div> 75 <div class="card-body"> 76 <ul> 77 <li>Dataset Name: {{ if .Dataset.Name }}{{ .Dataset.Name }}{{ else }}<em>(empty)</em>{{ end }}</li> 78 <li>Dataset Tenant: {{ .Dataset.Tenant }}</li> 79 <li>Block ID: {{ .BlockID }}</li> 80 <li>Shard: {{ .Shard }}</li> 81 </ul> 82 </div> 83 </div> 84 85 {{ if .TSDBIndex }} 86 <div class="card bg-dark border-secondary info-card"> 87 <div class="card-header"> 88 <h5 class="mb-0">Index Summary</h5> 89 </div> 90 <div class="card-body"> 91 <div class="row"> 92 <div class="col-md-6"> 93 <p><strong>Time Range:</strong></p> 94 <ul> 95 <li>From: {{ .TSDBIndex.From }}</li> 96 <li>Through: {{ .TSDBIndex.Through }}</li> 97 </ul> 98 </div> 99 <div class="col-md-6"> 100 <p><strong>Statistics:</strong></p> 101 <ul> 102 <li>Number of Series: {{ len .TSDBIndex.Series }}</li> 103 <li>Number of Labels: {{ len .TSDBIndex.LabelValueSets }}</li> 104 <li>Number of Symbols: {{ len .TSDBIndex.Symbols }}</li> 105 <li>Checksum: {{ printf "%08x" .TSDBIndex.Checksum }}</li> 106 </ul> 107 </div> 108 </div> 109 </div> 110 </div> 111 112 <div class="card bg-dark border-secondary info-card"> 113 <div class="card-header"> 114 <h5 class="mb-0">Series</h5> 115 </div> 116 <div class="card-body"> 117 {{ if .TSDBIndex.Series }} 118 <div class="table-responsive"> 119 <table class="table table-striped table-sm table-dark"> 120 <thead> 121 <tr> 122 <th>Series Index</th> 123 <th>Series Ref</th> 124 <th>Labels</th> 125 </tr> 126 </thead> 127 <tbody> 128 {{ range .TSDBIndex.Series }} 129 <tr> 130 <td><code>{{ .SeriesIndex }}</code></td> 131 <td><code class="text-muted small">{{ .SeriesRef }}</code></td> 132 <td> 133 {{ if .Labels }} 134 {{ range $i, $label := .Labels }} 135 {{ if $i }}, {{ end }}<span class="font-monospace small">{{ $label.Key }}={{ $label.Value }}</span> 136 {{ end }} 137 {{ else }} 138 <span class="text-muted">-</span> 139 {{ end }} 140 </td> 141 </tr> 142 {{ end }} 143 </tbody> 144 </table> 145 </div> 146 {{ else }} 147 <div class="alert alert-info" role="alert"> 148 No series found. 149 </div> 150 {{ end }} 151 </div> 152 </div> 153 154 <div class="card bg-dark border-secondary info-card"> 155 <div class="card-header"> 156 <h5 class="mb-0">Labels</h5> 157 </div> 158 <div class="card-body"> 159 {{ if .TSDBIndex.LabelValueSets }} 160 {{ range .TSDBIndex.LabelValueSets }} 161 <div class="label-value-set"> 162 <div class="label-name-header"> 163 {{ .LabelName }} 164 <span class="count-badge">{{ len .LabelValues }} values</span> 165 </div> 166 <div class="value-list"> 167 {{ range .LabelValues }} 168 <div>{{ . }}</div> 169 {{ end }} 170 </div> 171 </div> 172 {{ end }} 173 {{ else }} 174 <div class="alert alert-info" role="alert"> 175 No labels found. 176 </div> 177 {{ end }} 178 </div> 179 </div> 180 181 <div class="card bg-dark border-secondary info-card"> 182 <div class="card-header"> 183 <h5 class="mb-0">Symbol Table</h5> 184 </div> 185 <div class="card-body"> 186 {{ if .TSDBIndex.Symbols }} 187 <div class="symbol-list"> 188 {{ range .TSDBIndex.Symbols }} 189 <div>{{ . }}</div> 190 {{ end }} 191 </div> 192 {{ else }} 193 <div class="alert alert-info" role="alert"> 194 No symbols found. 195 </div> 196 {{ end }} 197 </div> 198 </div> 199 {{ else }} 200 <div class="alert alert-warning" role="alert"> 201 No index information available. 202 </div> 203 {{ end }} 204 </div> 205 </div> 206 </main> 207 <footer class="footer mt-auto py-3 bg-dark"> 208 <div class="container"> 209 <small class="text-white-50">Status @ {{ .Now }}</small> 210 </div> 211 </footer> 212 </body> 213 </html>