better edit form message (confirm btn not working yet)
This commit is contained in:
parent
103d6371c8
commit
11b039e127
36
Chat.go
36
Chat.go
@ -3,6 +3,7 @@ package main
|
||||
import (
|
||||
"context"
|
||||
"sort"
|
||||
"strings"
|
||||
"time"
|
||||
|
||||
"github.com/edgedb/edgedb-go"
|
||||
@ -125,6 +126,31 @@ func generateChatHTML() string {
|
||||
return htmlString
|
||||
}
|
||||
|
||||
func GetUserMessageHandler(c *fiber.Ctx) error {
|
||||
id := c.FormValue("id")
|
||||
|
||||
messageUUID, _ := edgedb.ParseUUID(id)
|
||||
|
||||
var selectedMessage Message
|
||||
err := edgeClient.QuerySingle(context.Background(), `
|
||||
SELECT Message {
|
||||
content
|
||||
}
|
||||
FILTER
|
||||
.id = <uuid>$0;
|
||||
`, &selectedMessage, messageUUID)
|
||||
if err != nil {
|
||||
panic(err)
|
||||
}
|
||||
|
||||
out, err := userTmpl.Execute(pongo2.Context{"Content": markdownToHTML(selectedMessage.Content), "ID": id})
|
||||
if err != nil {
|
||||
panic(err)
|
||||
}
|
||||
|
||||
return c.SendString(out)
|
||||
}
|
||||
|
||||
func GetMessageContentHandler(c *fiber.Ctx) error {
|
||||
messageId := c.FormValue("id")
|
||||
onlyContent := c.FormValue("onlyContent") // To init the text area of the edit message form
|
||||
@ -298,8 +324,14 @@ func GetEditMessageFormHandler(c *fiber.Ctx) error {
|
||||
panic(err)
|
||||
}
|
||||
|
||||
tmpl := pongo2.Must(pongo2.FromFile("views/partials/edit-message-form.html"))
|
||||
out, err := tmpl.Execute(pongo2.Context{"Content": message.Content, "ID": id})
|
||||
// Calculate the number of rows based on the length of the content
|
||||
rows := len(strings.Split(message.Content, "\n"))
|
||||
if rows < 10 {
|
||||
rows = 10
|
||||
}
|
||||
|
||||
tmpl := pongo2.Must(pongo2.FromFile("views/partials/message-edit-form.html"))
|
||||
out, err := tmpl.Execute(pongo2.Context{"Content": message.Content, "ID": id, "Rows": rows})
|
||||
if err != nil {
|
||||
panic(err)
|
||||
}
|
||||
|
3
main.go
3
main.go
@ -68,12 +68,13 @@ func main() {
|
||||
|
||||
// Chat routes
|
||||
app.Post("/deleteMessage", DeleteMessageHandler)
|
||||
app.Get("/generatePlaceholder", GeneratePlaceholderHandler)
|
||||
app.Post("/generatePlaceholder", GeneratePlaceholderHandler)
|
||||
app.Get("/generateMultipleMessages", GenerateMultipleMessagesHandler)
|
||||
app.Get("/messageContent", GetMessageContentHandler)
|
||||
app.Get("/editMessageForm", GetEditMessageFormHandler)
|
||||
app.Post("/redoMessage", RedoMessageHandler)
|
||||
app.Post("/clearChat", ClearChatHandler)
|
||||
app.Get("/userMessage", GetUserMessageHandler)
|
||||
|
||||
// Settings routes
|
||||
app.Post("/addKeys", addKeys)
|
||||
|
@ -68,7 +68,7 @@ html {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
#chat-input-textarea {
|
||||
width: 100%;
|
||||
padding-right: 140px;
|
||||
/* Adjust this value based on the button and dropdown width */
|
||||
|
@ -24,7 +24,7 @@
|
||||
</span>
|
||||
</button-->
|
||||
<button disabled type="submit" class="send-button button is-primary is-small"
|
||||
hx-get="/generatePlaceholder" hx-swap="beforeend settle:200ms" hx-target="#chat-messages"
|
||||
hx-post="/generatePlaceholder" hx-swap="beforeend settle:200ms" hx-target="#chat-messages"
|
||||
id="chat-input-send-btn" class="chat-input" hx-include="[name='message']"
|
||||
hx-vals="js:{selectedLLMIds: getSelectedModelsIDs()}" onclick="clearTextArea()">
|
||||
<span class="icon">
|
||||
|
@ -1,15 +0,0 @@
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<textarea class="textarea mt-2" placeholder="Enter your message here"
|
||||
style="background-color: transparent;">{{ Content }}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-grouped mb-3">
|
||||
<div class="control">
|
||||
<button hx-get="/test" class="button is-primary is-small">Submit</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button hx-get="/messageContent?id={{ ID }}&onlyContent=true" hx-target="#content-{{ ID }}"
|
||||
class="button is-light is-outlined is-small">Cancel</button>
|
||||
</div>
|
||||
</div>
|
49
views/partials/message-edit-form.html
Normal file
49
views/partials/message-edit-form.html
Normal file
@ -0,0 +1,49 @@
|
||||
<div class="message-user mt-3" id="{{ ID }}">
|
||||
<div class="columns is-mobile">
|
||||
<div class="column is-narrow" id="icon-column">
|
||||
<figure class="image is-48x48" style="flex-shrink: 0;">
|
||||
<img src="icons/bouvai2.png" alt="User Image">
|
||||
</figure>
|
||||
</div>
|
||||
|
||||
<div class="column" id="content-column">
|
||||
<div class="is-flex is-align-items-start mr-5" style="width: 100%;">
|
||||
<div class="message-content" style="width: 100%;">
|
||||
<div class="message-header">
|
||||
<p>
|
||||
You
|
||||
</p>
|
||||
</div>
|
||||
<div class="message-body" style="width: 100%;">
|
||||
<div class="content" id="content-{{ ID }}" style="width: 100%;">
|
||||
<div class="field" style="width: 100%;">
|
||||
<div class="control" style="width: 100%;">
|
||||
<textarea class="textarea is-small has-fixed-size mt-2"
|
||||
placeholder="Enter your message here" rows="{{ Rows }}"
|
||||
style="background-color: transparent; width: 100%;">{{ Content }}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-grouped is-flex is-justify-content-flex-end mb-3">
|
||||
<div class="control">
|
||||
<button hx-get="/userMessage?id={{ ID }}" hx-target="closest .message-user"
|
||||
class="button is-danger is-outlined is-small">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-xmark"></i>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button hx-get="/test" class="button is-success is-outlined is-small">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-check"></i>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@ -1,4 +1,4 @@
|
||||
<div class="message-user mt-3" id="{{ ID }}">
|
||||
<div class="message-user mt-3" id="msg-{{ ID }}">
|
||||
<div class="columns is-mobile">
|
||||
<div class="column is-narrow" id="icon-column">
|
||||
<figure class="image is-48x48" style="flex-shrink: 0;">
|
||||
@ -16,7 +16,7 @@
|
||||
</div>
|
||||
<div class="message-body">
|
||||
<div class="content" style="overflow-x: auto;" id="content-{{ ID }}">
|
||||
{{ Content|safe }}
|
||||
{{ Content | safe }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -34,8 +34,8 @@
|
||||
<i class="fa-solid fa-arrows-rotate"></i>
|
||||
</span>
|
||||
</button>
|
||||
<button hx-get="/editMessageForm?id={{ ID }}" hx-target="#content-{{ ID }}" id="edit-button-{{ ID }}"
|
||||
class="button is-small is-primary message-button is-outlined mr-5">
|
||||
<button hx-get="/editMessageForm?id={{ ID }}" hx-target="closest .message-user"
|
||||
id="edit-button-{{ ID }}" class="button is-small is-primary message-button is-outlined mr-5">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-pen"></i>
|
||||
</span>
|
||||
|
@ -42,23 +42,23 @@
|
||||
<div class="dropdown-item is-hidden" id="models-creation">
|
||||
<form id="create-model-form" hx-post="/createLLM" hx-target="#models-dropdown" hx-swap="outerHTML">
|
||||
<input class="input is-small mb-3" type="text" id="model-name-input" name="model-name-input"
|
||||
placeholder="Model name">
|
||||
placeholder="Model name" autocomplete="off">
|
||||
<div class="select is-fullwidth is-small mb-3" id="model-id-input">
|
||||
<select name="selectedLLMId">
|
||||
{% for modelInfo in ModelInfos %}
|
||||
<option value="{{ modelInfo.ModelID }}">{{ modelInfo.ModelID }}</option>
|
||||
{% endfor %}
|
||||
<option value="custom">Custom endpoint</option>
|
||||
<option value="custom">Inference Endpoints</option>
|
||||
</select>
|
||||
</div>
|
||||
<input class="input is-small mb-3 is-hidden" type="text" id="model-cid-input" name="model-cid-input"
|
||||
placeholder="Model id">
|
||||
placeholder="Model id" autocomplete="off">
|
||||
<input class="input is-small mb-3 is-hidden" type="text" id="model-url-input" name="model-url-input"
|
||||
placeholder="URL (with /v1/chat/completions)">
|
||||
placeholder="URL (with /v1/chat/completions)" autocomplete="off">
|
||||
<input class="input is-small mb-3 is-hidden" type="text" id="model-key-input" name="model-key-input"
|
||||
placeholder="Token">
|
||||
placeholder="Token" autocomplete="off">
|
||||
<p><small>Temperature:</small></p>
|
||||
<input class="slider is-small mb-3" step="0.05" min="0" max="1" value="0" type="range"
|
||||
<input class="slider is-small mb-3" step="0.05" min="0" max="2" value="0" type="range"
|
||||
id="temperature-slider" name="temperature-slider">
|
||||
<output id="temperature-slider-output">0</output>
|
||||
<p><small>System prompt:</small></p>
|
||||
|
Loading…
x
Reference in New Issue
Block a user