Skip to content

Commit

Permalink
Fix tx links (#31)
Browse files Browse the repository at this point in the history
  • Loading branch information
@heppu
heppu committed Jun 3, 2024
1 parent 601992e commit 3c39196
Show file tree
Hide file tree
Showing 4 changed files with 64 additions and 19 deletions.
9 changes: 9 additions & 0 deletions api/assets/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,10 @@
font-family: Inter;
}

a {
all: unset;
}

body {
text-transform: uppercase;
margin: 0;
Expand Down Expand Up @@ -106,6 +110,7 @@ body.dark {
width: 50%;
max-height: 18px;
margin-bottom: 12px;
cursor: pointer;
}

#live {
Expand Down Expand Up @@ -1030,6 +1035,10 @@ body.dark .tx-id-block-copy svg path {
min-width: 0px;
}

.tr>.end {
display: none;
}

.tx-id-block-value {
margin-bottom: 10px;
}
Expand Down
26 changes: 18 additions & 8 deletions api/templates/index.templ
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,8 +99,8 @@ templ Table(events []model.Event, query url.Values) {
}

templ Row(e model.Event) {
<div id={ e.TxID } class="tr" hx-get={ "/tx/" + e.TxID } hx-trigger="click" sse-swap={ e.TxID } hx-swap="outerHTML">
<div class="left">
<div id={ e.TxID } class="tr" sse-swap={ e.TxID } hx-swap="outerHTML">
<a class="left" { txLinkAttrs(e.TxID)... }>
<div class="td">
<div class="mobile-label">State</div>
<div>
Expand All @@ -111,8 +111,8 @@ templ Row(e model.Event) {
<div class="mobile-label">Transaction ID</div>
<div>{ e.TxID }</div>
</div>
</div>
<div class="right">
</a>
<a class="right" { txLinkAttrs(e.TxID)... }>
<div class="td">
<div class="mobile-label">Prover ID</div>
<div>
Expand All @@ -128,10 +128,10 @@ templ Row(e model.Event) {
<span class="datetime">{ e.Timestamp.Format("03:04 PM, 02/01/06") }</span>
</div>
</div>
</div>
<div class="end">
</a>
<a class="end" { txLinkAttrs(e.TxID)... }>
<span class="arrow">→</span>
</div>
</a>
</div>
}

Expand Down Expand Up @@ -245,7 +245,7 @@ templ head() {

templ header() {
<div id="header">
<div id="logo">Gevulot</div>
<a id="logo" href="/">Gevulot</a>
<div id="live">Live<span class="dot"></span></div>
<div id="range">
<form
Expand Down Expand Up @@ -332,3 +332,13 @@ func formatDuration(d time.Duration) string {
second := int(d.Seconds()) % 60
return fmt.Sprintf("%02dH:%02dM:%02dS", hour, minute, second)
}

func txLinkAttrs(txID string) templ.Attributes {
return templ.Attributes{
"href": "/tx/" + txID,
"hx-trigger": "click",
"hx-get": "/tx/" + txID,
"hx-swap": "outerHTML",
"hx-target": "#table",
}
}
42 changes: 34 additions & 8 deletions api/templates/index_templ.go
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 3 additions & 3 deletions integrationtests/integration_test.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ func receiveFirstEvent(t *testing.T) {

select {
case e := <-events:
expected := `<div id="0" class="tr" hx-get="/tx/0" hx-trigger="click" sse-swap="0" hx-swap="outerHTML"><div class="left"><div class="td"><div class="mobile-label">State</div><div><span class="tag submitted">submitted</span></div></div><div class="td"><div class="mobile-label">Transaction ID</div><div>0</div></div></div><div class="right"><div class="td"><div class="mobile-label">Prover ID</div><div><span>5678</span></div></div><div class="td"><div class="mobile-label">Time</div><div><span class="datetime">03:04 PM, 02/01/06</span></div></div></div><div class="end"><span class="arrow">→</span></div></div>`
expected := `<div id="0" class="tr" sse-swap="0" hx-swap="outerHTML"><a class="left" href="/tx/0" hx-get="/tx/0" hx-swap="outerHTML" hx-target="#table" hx-trigger="click"><div class="td"><div class="mobile-label">State</div><div><span class="tag submitted">submitted</span></div></div><div class="td"><div class="mobile-label">Transaction ID</div><div>0</div></div></a> <a class="right" href="/tx/0" hx-get="/tx/0" hx-swap="outerHTML" hx-target="#table" hx-trigger="click"><div class="td"><div class="mobile-label">Prover ID</div><div><span>5678</span></div></div><div class="td"><div class="mobile-label">Time</div><div><span class="datetime">03:04 PM, 02/01/06</span></div></div></a> <a class="end" href="/tx/0" hx-get="/tx/0" hx-swap="outerHTML" hx-target="#table" hx-trigger="click"><span class="arrow">→</span></a></div>`
require.Equal(t, expected, string(e.Data))
case <-time.After(time.Second * 5):
t.Fatal("timeout")
Expand Down Expand Up @@ -103,8 +103,8 @@ func receiveEventsFromBuffer(t *testing.T) {
for i := 0; i < expectedEvents; i++ {
select {
case e := <-events:
expected := `<div id="%d" class="tr" hx-get="/tx/%d" hx-trigger="click" sse-swap="%d" hx-swap="outerHTML"><div class="left"><div class="td"><div class="mobile-label">State</div><div><span class="tag submitted">submitted</span></div></div><div class="td"><div class="mobile-label">Transaction ID</div><div>%d</div></div></div><div class="right"><div class="td"><div class="mobile-label">Prover ID</div><div><span>5678</span></div></div><div class="td"><div class="mobile-label">Time</div><div><span class="datetime">03:04 PM, 02/01/06</span></div></div></div><div class="end"><span class="arrow">→</span></div></div>`
assert.Equal(t, fmt.Sprintf(expected, i, i, i, i), string(e.Data))
expected := `<div id="%d" class="tr" sse-swap="%d" hx-swap="outerHTML"><a class="left" href="/tx/%d" hx-get="/tx/%d" hx-swap="outerHTML" hx-target="#table" hx-trigger="click"><div class="td"><div class="mobile-label">State</div><div><span class="tag submitted">submitted</span></div></div><div class="td"><div class="mobile-label">Transaction ID</div><div>%d</div></div></a> <a class="right" href="/tx/%d" hx-get="/tx/%d" hx-swap="outerHTML" hx-target="#table" hx-trigger="click"><div class="td"><div class="mobile-label">Prover ID</div><div><span>5678</span></div></div><div class="td"><div class="mobile-label">Time</div><div><span class="datetime">03:04 PM, 02/01/06</span></div></div></a> <a class="end" href="/tx/%d" hx-get="/tx/%d" hx-swap="outerHTML" hx-target="#table" hx-trigger="click"><span class="arrow">→</span></a></div>`
assert.Equal(t, fmt.Sprintf(expected, i, i, i, i, i, i, i, i, i), string(e.Data))
case <-time.After(time.Second * 5):
t.Fatal("timeout")
}
Expand Down

0 comments on commit 3c39196

Please sign in to comment.