luciano/htmgo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add comments loader, cache stories

Browse source
This commit is contained in:
maddalax 2024-10-10 17:59:08 -05:00
parent 78f7a68c1e
commit c2b3b439e6
2 changed files with 38 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
examples/hackernews/partials/comments.go
View file

@ -12,10 +12,14 @@ import (
func StoryComments(ctx *h.RequestContext) *h.Partial {
return h.NewPartial(
h.Div(
h.Class("flex flex-col gap-3 prose max-w-none"),
CachedStoryComments(news.MustItemId(ctx)),
))
h.Fragment(
h.OobSwap(ctx, h.Div(h.Id("comments-loader"))),
h.Div(
h.Class("flex flex-col gap-3 prose max-w-none"),
CachedStoryComments(news.MustItemId(ctx)),
),
),
)
}
var CachedStoryComments = h.CachedPerKeyT[string, int](time.Minute*3, func(itemId int) (string, h.GetElementFunc) {

40
examples/hackernews/partials/story.go
View file

@ -5,13 +5,12 @@ import (
"github.com/maddalax/htmgo/framework/h"
"hackernews/internal/news"
"hackernews/internal/timeformat"
"strconv"
"time"
)
func Story(ctx *h.RequestContext) *h.Partial {
storyId, err := strconv.ParseInt(ctx.QueryParam("item"), 10, 64)
if storyId == 0 || err != nil {
storyId := news.MustItemId(ctx)
if storyId == 0 {
return h.NewPartial(
h.Div(
h.Class("flex justify-center bg-neutral-300"),
@ -20,29 +19,42 @@ func Story(ctx *h.RequestContext) *h.Partial {
)
}
story, err := news.GetStory(int(storyId))
if ctx.IsHxRequest() {
return h.SwapManyPartialWithHeaders(
ctx,
h.PushUrlHeader(fmt.Sprintf("/?item=%d", storyId)),
StoryBody(story),
h.Div(
h.Id("story-body"),
CachedStoryBody(storyId),
),
)
}
return h.NewPartial(
StoryBody(story),
CachedStoryBody(storyId),
)
}
var CachedStoryBody = h.CachedPerKeyT[string, int](time.Minute*3, func(itemId int) (string, h.GetElementFunc) {
return fmt.Sprintf("story-%d", itemId), func() *h.Element {
story, err := news.GetStory(itemId)
if err != nil {
return h.Div(
h.Id("story-body"),
h.Text("Failed to load story"),
)
}
return StoryBody(story)
}
})
func StoryBody(story *news.Story) *h.Element {
return h.Div(
h.Class("min-w-3xl"),
h.Id("story-body"),
h.Div(
h.Class("prose prose-2xl bg-white border-b border-gray-200 pb-3 min-w-3xl max-w-3xl"),
h.H5(
h.Class("flex gap-2 items-center font-bold"),
h.Class("flex gap-2 items-left font-bold"),
h.UnsafeRaw(story.Title),
),
h.A(
@ -63,6 +75,14 @@ func StoryBody(story *news.Story) *h.Element {
h.TextF(" %s", timeformat.RelativeTime(story.Time)),
),
),
h.TriggerChildren(),
h.Div(
h.Id("comments-loader"),
h.Class("flex justify-center items-center h-24"),
h.Div(
h.Class("animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-rose-500"),
),
),
h.Div(
h.Class("mt-2 min-w-3xl max-w-3xl"),
h.GetPartial(StoryComments, "load"),