dearwolf/LocalAI
1
0
Fork 0
mirror of https://github.com/mudler/LocalAI.git synced 2025-05-20 02:24:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 21

feat(ui): paginate model gallery (#4886)

Browse source 
Signed-off-by: Ettore Di Giacinto <mudler@localai.io>
This commit is contained in:
Ettore Di Giacinto 2025-02-22 21:38:00 +01:00 • committed by GitHub
parent 5b59b5e0c1
commit e9971b168a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 117 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

76
core/http/routes/ui.go
View file

@ -3,7 +3,9 @@ package routes
import (
"fmt"
"html/template"
"math"
"sort"
"strconv"
"strings"
"github.com/mudler/LocalAI/core/config"
@ -126,6 +128,8 @@ func RegisterUIRoutes(app *fiber.App,
// Show the Models page (all models)
app.Get("/browse", func(c *fiber.Ctx) error {
term := c.Query("term")
page := c.Query("page")
items := c.Query("items")
models, _ := gallery.AvailableGalleryModels(appConfig.Galleries, appConfig.ModelPath)
@ -164,6 +168,54 @@ func RegisterUIRoutes(app *fiber.App,
// "ApplicationConfig": appConfig,
}
if page == "" {
page = "1"
}
if page != "" {
log.Debug().Msgf("page : %+v\n", page)
// return a subset of the models
pageNum, err := strconv.Atoi(page)
if err != nil {
return c.Status(fiber.StatusBadRequest).SendString("Invalid page number")
}
if pageNum == 0 {
return c.Render("views/models", summary)
}
itemsNum, err := strconv.Atoi(items)
if err != nil {
itemsNum = 21
}
totalPages := int(math.Ceil(float64(len(models)) / float64(itemsNum)))
models = models.Paginate(pageNum, itemsNum)
log.Debug().Msgf("number of models : %+v\n", len(models))
prevPage := pageNum - 1
nextPage := pageNum + 1
if prevPage < 1 {
prevPage = 1
}
if nextPage > totalPages {
nextPage = totalPages
}
if prevPage != pageNum {
summary["PrevPage"] = prevPage
}
summary["NextPage"] = nextPage
summary["TotalPages"] = totalPages
summary["CurrentPage"] = pageNum
summary["Models"] = template.HTML(elements.ListModels(models, processingModels, galleryService))
log.Debug().Msgf("totalPages : %+v\n", totalPages)
log.Debug().Msgf("prevPage : %+v\n", prevPage)
log.Debug().Msgf("nextPage : %+v\n", nextPage)
log.Debug().Msgf("CurrentPage : %+v\n", pageNum)
}
// Render index
return c.Render("views/models", summary)
})
@ -171,6 +223,9 @@ func RegisterUIRoutes(app *fiber.App,
// Show the models, filtered from the user input
// https://htmx.org/examples/active-search/
app.Post("/browse/search/models", func(c *fiber.Ctx) error {
page := c.Query("page")
items := c.Query("items")
form := struct {
Search string `form:"search"`
}{}
@ -180,7 +235,26 @@ func RegisterUIRoutes(app *fiber.App,
models, _ := gallery.AvailableGalleryModels(appConfig.Galleries, appConfig.ModelPath)
return c.SendString(elements.ListModels(gallery.GalleryModels(models).Search(form.Search), processingModels, galleryService))
if page != "" {
// return a subset of the models
pageNum, err := strconv.Atoi(page)
if err != nil {
return c.Status(fiber.StatusBadRequest).SendString("Invalid page number")
}
itemsNum, err := strconv.Atoi(items)
if err != nil {
itemsNum = 21
}
models = models.Paginate(pageNum, itemsNum)
}
if form.Search != "" {
models = models.Search(form.Search)
}
return c.SendString(elements.ListModels(models, processingModels, galleryService))
})
/*

30
core/http/views/models.html
View file

@ -75,9 +75,37 @@
hx-indicator=".htmx-indicator">
<div id="search-results">{{.Models}}</div>
<!-- Pagination -->
<div class="flex justify-center mt-5">
<div class="flex items
-center">
<button onclick="window.location.href='browse?page={{.PrevPage}}'" class="bg-gray-800 text-gray-300 hover:bg-gray-700 hover:text-gray-200 px-3 py-1 rounded-l-md" {{if not .PrevPage}}disabled{{end}}
><i class="fas fa-arrow-left"></i></button>
<button onclick="window.location.href='browse?page={{.NextPage}}'" class="bg-gray-800 text-gray-300 hover:bg-gray-700 hover:text-gray-200 px-3 py-1 rounded-r-md" {{if not .NextPage}}disabled{{end}}
><i class="fas fa-arrow-right"></i></button>
<!--
TODO: do not refresh the page, but use htmx.
This however requires the page calculation to be here instead that in the golang backend.
<button class="bg-gray-800 text-gray-300 hover:bg-gray-700 hover:text-gray-200 px-3 py-1 rounded-l-md"
hx-post="browse/search/models?page={{.PrevPage}}"
hx-target="#search-results"
hx-indicator=".htmx-indicator"
{{if not .PrevPage}}disabled{{end}}
>
<i class="fas fa-arrow-left"></i>
</button>
<button class="bg-gray-800 text-gray-300 hover:bg-gray-700 hover:text-gray-200 px-3 py-1 rounded-r-md"
hx-post="browse/search/models?page={{.NextPage}}"
hx-target="#search-results"
hx-indicator=".htmx-indicator"
{{if not .NextPage}}disabled{{end}}
>
<i class="fas fa-arrow-right"></i>
</button>
-->
</div>
</div>
</div>
{{template "views/partials/footer" .}}
</div>