make web submit when action done by user

This commit is contained in:
Robin Olsen
2026-03-19 21:12:28 +01:00
parent ef649c9ac4
commit 35114a3e0f
9 changed files with 52 additions and 17 deletions

View File

@@ -46,7 +46,13 @@ templ Modal(props ModalProps) {
}
templ ModalContainer() {
<div id="modal-container"></div>
<div
id="modal-container"
hx-get="/status/modal"
hx-trigger="task-status-success from:body"
hx-target="#modal-container"
hx-swap="innerHTML"
></div>
}
type ConfirmModalProps struct {

View File

@@ -143,7 +143,7 @@ func ModalContainer() templ.Component {
templ_7745c5c3_Var7 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "<div id=\"modal-container\"></div>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "<div id=\"modal-container\" hx-get=\"/status/modal\" hx-trigger=\"task-status-success from:body\" hx-target=\"#modal-container\" hx-swap=\"innerHTML\"></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@@ -189,7 +189,7 @@ func ConfirmModal(props ConfirmModalProps) templ.Component {
var templ_7745c5c3_Var9 string
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.Title)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 76, Col: 73}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 82, Col: 73}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
if templ_7745c5c3_Err != nil {
@@ -202,7 +202,7 @@ func ConfirmModal(props ConfirmModalProps) templ.Component {
var templ_7745c5c3_Var10 string
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.Message)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 80, Col: 52}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 86, Col: 52}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
if templ_7745c5c3_Err != nil {
@@ -216,7 +216,7 @@ func ConfirmModal(props ConfirmModalProps) templ.Component {
var templ_7745c5c3_Var11 string
templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.CancelText)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 89, Col: 25}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 95, Col: 25}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
if templ_7745c5c3_Err != nil {
@@ -257,7 +257,7 @@ func ConfirmModal(props ConfirmModalProps) templ.Component {
var templ_7745c5c3_Var14 string
templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(props.ConfirmAction)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 97, Col: 37}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 103, Col: 37}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
if templ_7745c5c3_Err != nil {
@@ -271,7 +271,7 @@ func ConfirmModal(props ConfirmModalProps) templ.Component {
var templ_7745c5c3_Var15 string
templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(props.ConfirmText)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 102, Col: 26}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/modal.templ`, Line: 108, Col: 26}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
if templ_7745c5c3_Err != nil {

View File

@@ -1,7 +1,7 @@
package components
templ Status() {
<div id="status" hx-get="/status" hx-trigger="click" hx-target="#status" hx-swap="outerHTML">
<button type="button" class="btn btn-outline btn-sm" hx-get="/status/modal" hx-target="#modal-container" hx-swap="innerHTML">Show Task Status</button>
templ Status(msg string) {
<div id="status" hx-get="/status" hx-trigger="load, click" hx-target="#status" hx-swap="outerHTML">
<button type="button" class="btn btn-outline btn-sm" hx-get="/status/modal" hx-target="#modal-container" hx-swap="innerHTML">{ msg }</button>
</div>
}

View File

@@ -8,7 +8,7 @@ package components
import "github.com/a-h/templ"
import templruntime "github.com/a-h/templ/runtime"
func Status() templ.Component {
func Status(msg string) templ.Component {
return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
@@ -29,7 +29,20 @@ func Status() templ.Component {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div id=\"status\" hx-get=\"/status\" hx-trigger=\"click\" hx-target=\"#status\" hx-swap=\"outerHTML\"><button type=\"button\" class=\"btn btn-outline btn-sm\" hx-get=\"/status/modal\" hx-target=\"#modal-container\" hx-swap=\"innerHTML\">Show Task Status</button></div>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<div id=\"status\" hx-get=\"/status\" hx-trigger=\"load, click\" hx-target=\"#status\" hx-swap=\"outerHTML\"><button type=\"button\" class=\"btn btn-outline btn-sm\" hx-get=\"/status/modal\" hx-target=\"#modal-container\" hx-swap=\"innerHTML\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var2 string
templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(msg)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/status.templ`, Line: 5, Col: 132}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "</button></div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

View File

@@ -30,11 +30,15 @@ func HandleTaskStatus(w http.ResponseWriter, r *http.Request) {
hx := HTMX(r)
if hx.IsHxRequest() {
hx.WriteString(`
if taskFeedback.Success {
w.Header().Set("HX-Trigger", "task-status-success")
w.WriteHeader(http.StatusOK)
} else {
hx.WriteString(`
<div id="status" type="button" hx-get="/status" hx-target="#status" hx-swap="outerHTML">
<button class="btn btn-error btn-sm" hx-get="/status/modal" hx-target="#modal-container" hx-swap="innerHTML">` + taskFeedback.Message + `</button>
</div>`)
}
return
}

View File

@@ -30,7 +30,7 @@ var baseLayout = components.LayoutProps{
},
Header: components.HeaderProps{
Title: "LazyPM",
NavbarEnd: components.Status(),
NavbarEnd: components.Status(""),
},
Modal: components.ModalContainer(),
}

View File

@@ -38,7 +38,7 @@ var baseLayout = components.LayoutProps{
},
Header: components.HeaderProps{
Title: "LazyPM",
NavbarEnd: components.Status(),
NavbarEnd: components.Status(""),
},
Modal: components.ModalContainer(),
}