Modal menu placeholder
This commit is contained in:
parent
da6ead9ea9
commit
74e9673fc4
48
Chat.go
48
Chat.go
@ -403,9 +403,51 @@ func LoadModelSelectionHandler(c *fiber.Ctx) error {
|
||||
if !checkIfLogin() {
|
||||
return c.SendString("")
|
||||
}
|
||||
// openaiExists, anthropicExists, mistralExists, groqExists := getExistingKeys()
|
||||
// TODO: Add model selection
|
||||
return c.SendString("")
|
||||
openaiExists, anthropicExists, mistralExists, groqExists, gooseaiExists, googleExists := getExistingKeys()
|
||||
|
||||
var llms []LLM
|
||||
err := edgeClient.Query(context.Background(), `
|
||||
SELECT LLM {
|
||||
name,
|
||||
context,
|
||||
temperature,
|
||||
modelInfo : {
|
||||
modelID,
|
||||
name
|
||||
}
|
||||
}
|
||||
FILTER .user = global currentUser AND .name != 'none'
|
||||
`, &llms)
|
||||
if err != nil {
|
||||
fmt.Println("Error in edgeClient.Query: in LoadModelSelectionHandler")
|
||||
log.Fatal(err)
|
||||
}
|
||||
|
||||
for i := 0; i < len(llms); i++ {
|
||||
// If the modelID len is higher than 15, truncate it
|
||||
if len(llms[i].Model.ModelID) > 12 {
|
||||
llms[i].Model.ModelID = llms[i].Model.ModelID[0:12] + "..."
|
||||
}
|
||||
}
|
||||
|
||||
out, err := pongo2.Must(pongo2.FromFile("views/partials/popover-models.html")).Execute(pongo2.Context{
|
||||
"IsLogin": checkIfLogin(),
|
||||
"OpenaiExists": openaiExists,
|
||||
"AnthropicExists": anthropicExists,
|
||||
"MistralExists": mistralExists,
|
||||
"GroqExists": groqExists,
|
||||
"GooseaiExists": gooseaiExists,
|
||||
"GoogleExists": googleExists,
|
||||
"AnyExists": openaiExists || anthropicExists || mistralExists || groqExists || gooseaiExists || googleExists,
|
||||
"LLMs": llms,
|
||||
})
|
||||
if err != nil {
|
||||
c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
|
||||
"error": "Error rendering template",
|
||||
})
|
||||
}
|
||||
|
||||
return c.SendString(out)
|
||||
}
|
||||
|
||||
func LoadSettingsHandler(c *fiber.Ctx) error {
|
||||
|
36
LLM.go
Normal file
36
LLM.go
Normal file
@ -0,0 +1,36 @@
|
||||
package main
|
||||
|
||||
import (
|
||||
"fmt"
|
||||
|
||||
"github.com/edgedb/edgedb-go"
|
||||
"github.com/flosch/pongo2"
|
||||
"github.com/gofiber/fiber/v2"
|
||||
)
|
||||
|
||||
// LLM stuff
|
||||
func deleteLLM(c *fiber.Ctx) error {
|
||||
id := c.FormValue("id")
|
||||
idUUID, _ := edgedb.ParseUUID(id)
|
||||
|
||||
err := edgeClient.Execute(edgeCtx, `
|
||||
DELETE LLM
|
||||
FILTER .id = <uuid>$0;
|
||||
`, idUUID)
|
||||
if err != nil {
|
||||
fmt.Println("Error in edgeClient.Execute: in deleteLLM")
|
||||
fmt.Println(err)
|
||||
}
|
||||
|
||||
return c.SendString("")
|
||||
}
|
||||
|
||||
func openLlmModal(c *fiber.Ctx) error {
|
||||
out, err := pongo2.Must(pongo2.FromFile("views/partials/modal-llm-setting.html")).Execute(pongo2.Context{})
|
||||
if err != nil {
|
||||
c.Status(fiber.StatusInternalServerError).JSON(fiber.Map{
|
||||
"error": "Error rendering template",
|
||||
})
|
||||
}
|
||||
return c.SendString(out)
|
||||
}
|
4
main.go
4
main.go
@ -73,6 +73,7 @@ func main() {
|
||||
|
||||
// Settings routes
|
||||
app.Post("/addKeys", addKeys)
|
||||
app.Get("/modal", openLlmModal)
|
||||
|
||||
// Popovers
|
||||
app.Get("/loadModelSelection", LoadModelSelectionHandler)
|
||||
@ -86,6 +87,9 @@ func main() {
|
||||
app.Get("/callback", handleCallback)
|
||||
app.Get("/callbackSignup", handleCallbackSignup)
|
||||
|
||||
// LLM
|
||||
app.Get("deleteLLM", deleteLLM)
|
||||
|
||||
app.Get("/test", func(c *fiber.Ctx) error {
|
||||
fmt.Println("Hello from test")
|
||||
return c.SendString("")
|
||||
|
108
static/style.css
108
static/style.css
@ -186,4 +186,112 @@ svg text {
|
||||
|
||||
.message-bot:hover .message-button {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/***** MODAL DIALOG ****/
|
||||
#modal {
|
||||
/* Underlay covers entire screen. */
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
z-index: 1000;
|
||||
|
||||
/* Flexbox centers the .modal-content vertically and horizontally */
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
/* Animate when opening */
|
||||
animation-name: fadeIn;
|
||||
animation-duration: 150ms;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
|
||||
#modal>.modal-underlay {
|
||||
/* underlay takes up the entire viewport. This is only
|
||||
required if you want to click to dismiss the popup */
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
top: 0px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
#modal>.modal-content {
|
||||
/* Position visible dialog near the top of the window */
|
||||
margin-top: 10vh;
|
||||
|
||||
/* Sizing for visible dialog */
|
||||
width: 80%;
|
||||
max-width: 600px;
|
||||
|
||||
/* Display properties for visible dialog*/
|
||||
border: solid 1px #999;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.3);
|
||||
background-color: white;
|
||||
padding: 20px;
|
||||
|
||||
/* Animate when opening */
|
||||
animation-name: zoomIn;
|
||||
animation-duration: 150ms;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
|
||||
#modal.closing {
|
||||
/* Animate when closing */
|
||||
animation-name: fadeOut;
|
||||
animation-duration: 150ms;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
|
||||
#modal.closing>.modal-content {
|
||||
/* Animate when closing */
|
||||
animation-name: zoomOut;
|
||||
animation-duration: 150ms;
|
||||
animation-timing-function: ease;
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes zoomIn {
|
||||
0% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes zoomOut {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
}
|
@ -10,7 +10,7 @@
|
||||
<hx hx-get="/loadSettings" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
|
||||
<hx hx-get="/loadKeys" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
|
||||
<hx hx-get="/loadUsageKPI" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
|
||||
<!--hx hx-get="/loadModelSelection" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx-->
|
||||
<hx hx-get="/loadModelSelection" hx-trigger="load" hx-swap="outerHTML" hx-target="this"></hx>
|
||||
<button {% if not IsLogin or not HaveKey %}style="display: none;" {%endif%} class="button is-small"
|
||||
onclick="clearTextArea()" id="clear-button" hx-post="/clearChat" hx-swap="outerHTML"
|
||||
hx-target="#chat-container" title="Clear chat">
|
||||
|
11
views/partials/modal-llm-setting.html
Normal file
11
views/partials/modal-llm-setting.html
Normal file
@ -0,0 +1,11 @@
|
||||
<div id="modal">
|
||||
<div class="modal-underlay" hx-get="/empty" hx-target="#modal" hx-swap="outerHTML"></div>
|
||||
<div class="modal-content">
|
||||
<h1>Modal Dialog</h1>
|
||||
This is the modal content.
|
||||
You can put anything here, like text, or a form, or an image.
|
||||
<br>
|
||||
<br>
|
||||
<button hx-get="/empty" hx-target="#modal" hx-swap="outerHTML">Close</button>
|
||||
</div>
|
||||
</div>
|
@ -40,7 +40,7 @@
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="field has-addons" title="Gemini is inailable because im in Europe">
|
||||
<div class="field has-addons" title="Gemini is unavailable because of Europe">
|
||||
<p class="control has-icons-left is-expanded">
|
||||
<input class="input is-small {% if GoogleExists %}is-success{% endif %}" type="text"
|
||||
disabled placeholder="Google API key" name="google_key" autocomplete="off">
|
||||
|
@ -5,24 +5,42 @@
|
||||
</button>
|
||||
</div>
|
||||
<div class="dropdown-menu" id="dropdown-menu4" role="menu">
|
||||
<div class="dropdown-content">
|
||||
<div class="dropdown-content is-small">
|
||||
<div class="dropdown-item">
|
||||
{% for CompanyInfo in CompanyInfos %}
|
||||
<div class="content">
|
||||
<div class="block">
|
||||
{% for ModelInfo in CompanyInfo.ModelInfos %}
|
||||
<div class="field">
|
||||
<label class="custom-checkbox">
|
||||
<input {%if ModelInfo.ID in CheckedModels %}checked{% endif %} type="checkbox"
|
||||
name="model-check-{{ ModelInfo.ID }}" value="{{ ModelInfo.ID }}" />
|
||||
<span class="checkmark"></span>
|
||||
{{ ModelInfo.Name }}
|
||||
</label>
|
||||
</div>
|
||||
<table class="table is-hoverable is-fullwidth is-narrow is-small">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="is-size-7" style="width: 30%;">Name</th>
|
||||
<th class="is-size-7" style="width: 30%;">Model</th>
|
||||
<th class="is-size-7" style="width: 10%;"></th>
|
||||
<th class="is-size-7" style="width: 10%;"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for LLM in LLMs %}
|
||||
<tr>
|
||||
<td class="is-size-6">{{ LLM.Name }}</td>
|
||||
<td class="is-size-7">{{ LLM.Model.ModelID }}</td>
|
||||
<td class="is-size-6">
|
||||
<button hx-get="/modal" hx-target="body" hx-swap="beforeend"
|
||||
class="button is-primary is-small is-inline-block is-outlined">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-gear"></i>
|
||||
</span>
|
||||
</button>
|
||||
</td>
|
||||
<td class="is-size-6">
|
||||
<button class="button is-danger is-small is-inline-block is-outlined"
|
||||
style="min-width: auto;">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-xmark"></i>
|
||||
</span>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user