github.com/grafana/pyroscope@v1.18.0/pkg/metastore/admin/metastore.client.gohtml (about)

     1  <!DOCTYPE html>
     2  <html 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>Metastore Admin - Client Test</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          .card-detail-row {
    17              display: flex;
    18              margin-bottom: 0.5rem;
    19          }
    20  
    21          .card-detail-label {
    22              flex: 0 0 20%;
    23              font-weight: bold;
    24              text-align: right;
    25              padding-right: 1rem;
    26          }
    27  
    28          .card-detail-value {
    29              flex: 0 0 80%;
    30          }
    31  
    32          @media (max-width: 768px) {
    33              .card-detail-row {
    34                  flex-direction: column;
    35              }
    36  
    37              .card-detail-label {
    38                  text-align: left;
    39                  padding-right: 0;
    40                  margin-bottom: 0.25rem;
    41              }
    42          }
    43  
    44          .card {
    45              margin-bottom: 1rem;
    46          }
    47      </style>
    48  </head>
    49  <body>
    50  <main>
    51      <div class="container mt-5">
    52          <div class="header row border-bottom py-3 flex-column-reverse flex-sm-row">
    53              <div class="col-12 col-sm-9 text-center text-sm-start">
    54                  <h1>Metastore: Grafana Pyroscope</h1>
    55              </div>
    56              <div class="col-12 col-sm-3 text-center text-sm-end mb-3 mb-sm-0">
    57                  <a href="/">
    58                      <img alt="Pyroscope logo" class="pyroscope-brand" src="/static/pyroscope-logo.png">
    59                  </a>
    60              </div>
    61          </div>
    62          <div class="row gy-4">
    63              <h2>Nodes</h2>
    64              <form action="" method="POST">
    65                  <input type="hidden" name="current-term" value="{{ .Raft.CurrentTerm }}">
    66                  {{ $numNodes := .Raft.NumNodes }}
    67                  {{ range $index, $node := .Raft.Nodes }}
    68                      <div class="col-12">
    69                          <div class="card">
    70                              <div class="card-header">
    71                                  {{ $node.RaftServerId }}
    72                              </div>
    73                              <div class="card-body">
    74                                  <div class="card-detail-row">
    75                                      <div class="card-detail-label">Resolved Address:</div>
    76                                      <div class="card-detail-value">{{ $node.ResolvedAddress }}</div>
    77                                  </div>
    78                                  <div class="card-detail-row">
    79                                      <div class="card-detail-label">Raft Member:</div>
    80                                      <div class="card-detail-value">
    81                                          {{ if $node.Member }}
    82                                              <span class="badge text-bg-success">yes</span> ({{ $node.State }})
    83                                          {{ else }}
    84                                              <span class="badge text-bg-warning">no</span>
    85                                          {{ end }}
    86                                      </div>
    87                                  </div>
    88                                  <div class="card-detail-row">
    89                                      <div class="card-detail-label">Raft Server ID:</div>
    90                                      <div class="card-detail-value">{{ $node.RaftServerId }}</div>
    91                                  </div>
    92                                  <div class="card-detail-row">
    93                                      <div class="card-detail-label">Observed Leader:</div>
    94                                      {{ $leaderId := $node.LeaderId }}
    95                                      {{ if eq $leaderId ""}}
    96                                          {{ $leaderId = "n/a "}}
    97                                      {{ end }}
    98                                      <div class="card-detail-value">{{ $leaderId }} (term {{ $node.CurrentTerm }})</div>
    99                                  </div>
   100                              </div>
   101                          </div>
   102                      </div>
   103                  {{ end }}
   104              </form>
   105          </div>
   106  
   107          <div class="row gy-4">
   108              <h2>Client Test</h2><div class="col-12">
   109                  <div class="card">
   110                      <div class="card-header">
   111                          <form action="" method="POST">
   112                              <button class="btn btn-info me-2" name="test" type="submit">Test</button>
   113                          </form>
   114                      </div>
   115                      <div class="card-body">
   116                          <div class="card-detail-row">
   117                              <div class="card-detail-label">Response</div>
   118                              <div class="card-detail-value">{{ .TestResponse }}</div>
   119                          </div>
   120                          <div class="card-detail-row">
   121                              <div class="card-detail-label">Response Time</div>
   122                              <div class="card-detail-value">{{ .TestResponseTime }}</div>
   123                          </div>
   124                      </div>
   125                  </div>
   126              </div>
   127          </div>
   128      </div>
   129  </main>
   130  <footer class="footer mt-auto py-3">
   131      <div class="container">
   132          <small class="text-muted">Status @ {{ .Now.Format "2006-01-02 15:04:05.000" }}</small>
   133      </div>
   134  </footer>
   135  <script type="text/javascript">
   136      const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
   137      const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
   138  </script>
   139  </body>
   140  </html>