tigor/Redmage
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

subreddit-details: uses proper pagination component

Browse source
This commit is contained in:
Tigor Hutasuhut 2024-05-13 10:38:14 +07:00
parent b36a2f828a
commit af2a35d20f
1 changed files with 14 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
views/subredditsview/detailsview/detailsview.templ
View file

@ -58,7 +58,14 @@ templ DetailsContent(c *views.Context, data Data) {
</div> </div>
<div class="divider"></div> <div class="divider"></div>
@FilterBar(c, data) @FilterBar(c, data)
@paginationButtons(c, data) <div class="grid justify-center my-4">
@components.Pagination(c, components.PaginationData{
Offset: data.Params.Offset,
Limit: data.Params.Limit,
BaseURL: fmt.Sprintf("/subreddits/details/%s", data.Subreddit.Name),
Total: data.TotalImages,
})
</div>
@showingImageFromTo(data) @showingImageFromTo(data)
<div class="flex flex-wrap gap-4 my-8 justify-around"> <div class="flex flex-wrap gap-4 my-8 justify-around">
for _, image := range data.Images { for _, image := range data.Images {
@ -66,7 +73,12 @@ templ DetailsContent(c *views.Context, data Data) {
} }
</div> </div>
<div class="flex w-full justify-center"> <div class="flex w-full justify-center">
@paginationButtons(c, data) @components.Pagination(c, components.PaginationData{
Offset: data.Params.Offset,
Limit: data.Params.Limit,
BaseURL: fmt.Sprintf("/subreddits/details/%s", data.Subreddit.Name),
Total: data.TotalImages,
})
</div> </div>
} }
} }
@ -127,28 +139,6 @@ templ FilterBar(c *views.Context, data Data) {
</div> </div>
} }
templ paginationButtons(_ *views.Context, data Data) {
if data.TotalImages > data.Params.Limit {
<div class="flex justify-center my-4">
<div class="join">
for i, count := 1, int64(0); count < data.TotalImages; i, count = i+1, count+data.Params.Limit {
if data.Params.Offset <= count && data.Params.Offset > count-data.Params.Limit {
<a href={ buildURL(data.Subreddit.Name, data.Params, "offset", strconv.FormatInt(count, 10)) } class="join-item btn btn-active no-underline">{ strconv.Itoa(i) }</a>
} else {
<a href={ buildURL(data.Subreddit.Name, data.Params, "offset", strconv.FormatInt(count, 10)) } class="join-item btn no-underline">{ strconv.Itoa(i) }</a>
}
}
</div>
</div>
}
}
func buildURL(subreddit string, params api.SubredditGetByNameImageParams, extraQueries ...string) templ.SafeURL {
queries := params.IntoQueryWith(extraQueries...)
return templ.SafeURL(fmt.Sprintf("/subreddits/details/%s?%s", subreddit, queries.Encode()))
}
templ limitOption(params api.SubredditGetByNameImageParams, value int) { templ limitOption(params api.SubredditGetByNameImageParams, value int) {
if int(params.Limit) == value { if int(params.Limit) == value {
<option selected>{ strconv.Itoa(value) }</option> <option selected>{ strconv.Itoa(value) }</option>