This commit is contained in:
despiegk 2025-05-24 10:42:24 +04:00
parent c9b14730ad
commit 0b62ac9ecd

View File

@ -1,12 +1,14 @@
{{ extends "../layouts/base" }}
{{extends "../layouts/base"}}
{{ block title() }}OpenRPC UI - HeroApp UI{{ end }}
{{block title()}}
OpenRPC UI
{{end}}
{{ block css() }}
{{block css()}}
<link rel="stylesheet" href="/static/css/rpcui.css">
{{ end }}
{{end}}
{{ block body() }}
{{block body()}}
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">OpenRPC UI</h1>
</div>
@ -23,9 +25,9 @@
<label for="spec" class="form-label">Specification</label>
<select class="form-select" id="spec" name="spec" onchange="this.form.submit()">
<option value="">Select a specification</option>
{{ if .SpecList }}
{{ range .SpecList }}
<option value="{{ . }}" {{ if eq . $.SelectedSpec }}selected{{ end }}>{{ . }}</option>
{{ if SpecList }}
{{ range spec := SpecList }}
<option value="{{ spec }}" >
{{ end }}
{{ else }}
<option value="" disabled>No specifications available</option>
@ -34,7 +36,7 @@
</div>
<div class="col-md-4">
<label for="socketPath" class="form-label">Socket Path</label>
<input type="text" class="form-control" id="socketPath" name="socketPath" value="{{ .SocketPath }}" placeholder="e.g., /tmp/rpc.sock">
<input type="text" class="form-control" id="socketPath" name="socketPath" value="{{ SocketPath }}" placeholder="e.g., /tmp/rpc.sock">
</div>
<div class="col-md-4 d-flex align-items-end">
<button type="submit" class="btn btn-primary">Apply</button>
@ -49,26 +51,24 @@
<div class="col-md-12">
<div class="alert alert-info">
<p>This is the OpenRPC UI page. It allows you to interact with OpenRPC specifications.</p>
<p>Currently available specs: {{ if .SpecList }}{{ len(.SpecList) }}{{ else }}0{{ end }}</p>
<p>Currently available specs: {{ if SpecList }}{{ len(SpecList) }}{{ else }}0{{ end }}</p>
</div>
</div>
</div>
{{ if .SelectedSpec }}
{{ if SelectedSpec }}
<div class="row">
<!-- Method Tree -->
<div class="col-md-3">
<div class="card">
<div class="card-header">
<h5>Methods</h5>
</div>
<div class="card-header"><h5>Methods</h5></div>
<div class="card-body p-0">
<div class="method-tree list-group list-group-flush">
{{ if .Methods }}
{{ range .Methods }}
<a href="/rpcui?spec={{ $.SelectedSpec }}&method={{ . }}&socketPath={{ $.SocketPath }}"
class="list-group-item list-group-item-action method-item {{ if eq . $.SelectedMethod }}active{{ end }}">
{{ . }}
{{ if Methods }}
{{ range m := Methods }}
<a href="/rpcui?spec={{ SelectedSpec }}&method={{ m }}&socketPath={{ SocketPath }}"
class="list-group-item list-group-item-action method-item {{ if eq(m, SelectedMethod) }}active{{ end }}">
{{ m }}
</a>
{{ end }}
{{ else }}
@ -81,46 +81,29 @@
<!-- Method Details -->
<div class="col-md-9">
{{ if .Method }}
{{ if Method }}
<div class="card mb-4">
<div class="card-header">
<h5>{{ .Method.Name }}</h5>
{{ if .Method.Description }}
<p class="text-muted mb-0">{{ .Method.Description }}</p>
{{ end }}
<h5>{{ Method.Name }}</h5>
{{ if Method.Description }}<p class="text-muted mb-0">{{ Method.Description }}</p>{{ end }}
</div>
<div class="card-body">
<!-- Parameters -->
<h6>Parameters</h6>
<table class="table table-sm schema-table">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Required</th>
<th>Description</th>
</tr>
</thead>
<thead><tr><th>Name</th><th>Type</th><th>Required</th><th>Description</th></tr></thead>
<tbody>
{{ if .Method.Params }}
{{ range .Method.Params }}
{{ if Method.Params }}
{{ range p := Method.Params }}
<tr>
<td>{{ .Name }}</td>
<td><code>{{ .Schema.Type }}</code></td>
<td>
{{ if .Required }}
<span class="schema-required">Yes</span>
{{ else }}
<span class="schema-optional">No</span>
{{ end }}
</td>
<td>{{ .Description }}</td>
<td>{{ p.Name }}</td>
<td><code>{{ p.Schema.Type }}</code></td>
<td>{{ if p.Required }}<span class="schema-required">Yes</span>{{ else }}<span class="schema-optional">No</span>{{ end }}</td>
<td>{{ p.Description }}</td>
</tr>
{{ end }}
{{ else }}
<tr>
<td colspan="4">No parameters</td>
</tr>
<tr><td colspan="4">No parameters</td></tr>
{{ end }}
</tbody>
</table>
@ -128,18 +111,12 @@
<!-- Result -->
<h6 class="mt-4">Result</h6>
<table class="table table-sm schema-table">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<thead><tr><th>Name</th><th>Type</th><th>Description</th></tr></thead>
<tbody>
<tr>
<td>{{ .Method.Result.Name }}</td>
<td><code>{{ .Method.Result.Schema.Type }}</code></td>
<td>{{ .Method.Result.Description }}</td>
<td>{{ Method.Result.Name }}</td>
<td><code>{{ Method.Result.Schema.Type }}</code></td>
<td>{{ Method.Result.Description }}</td>
</tr>
</tbody>
</table>
@ -147,10 +124,10 @@
<!-- Try It -->
<h6 class="mt-4">Try It</h6>
<form id="rpcForm" class="mb-3">
<input type="hidden" name="selectedMethod" value="{{ .SelectedMethod }}">
<input type="hidden" name="selectedMethod" value="{{ SelectedMethod }}">
<div class="mb-3">
<label for="paramsEditor" class="form-label">Parameters:</label>
<textarea class="form-control code-editor" id="paramsEditor" rows="10">{{ .ExampleParams }}</textarea>
<textarea class="form-control code-editor" id="paramsEditor" rows="10">{{ ExampleParams }}</textarea>
</div>
<button type="submit" class="btn btn-primary">Execute</button>
</form>
@ -159,27 +136,22 @@
<h6>Result:</h6>
<pre id="resultOutput" class="bg-light p-2 rounded"></pre>
</div>
<div id="errorContainer" class="result-container d-none">
<h6>Error:</h6>
<pre id="errorOutput" class="bg-light p-2 rounded text-danger"></pre>
</div>
</div>
</div>
{{ else if .SelectedMethod }}
<div class="alert alert-warning">
Method not found: {{ .SelectedMethod }}
</div>
{{ else if SelectedMethod }}
<div class="alert alert-warning">Method not found: {{ SelectedMethod }}</div>
{{ else }}
<div class="alert alert-info">
Select a method from the list to view details.
</div>
<div class="alert alert-info">Select a method from the list to view details.</div>
{{ end }}
</div>
</div>
{{ end }}
{{ end }}
{{end}}
{{ block scripts() }}
{{block scripts()}}
<script src="/static/js/rpcui.js"></script>
{{ end }}
{{end}}