+
+
+ @message.Text
+
+ @if (message.Status == MessageStatus.Streaming)
+ {
+
+
+
+ }
+
- @if (message.IsCompleted)
+ @if (message.Status == MessageStatus.Completed)
{
@@ -170,10 +180,10 @@
isAsking = true;
var userQuestion = new Question(conversationId, question!);
- var userMessage = new Message { Text = userQuestion.Text, Role = "user" };
+ var userMessage = new Message { Text = userQuestion.Text, Role = "user", Status = MessageStatus.Completed };
messages.Add(userMessage);
- var assistantMessage = new Message { Role = "assistant" };
+ var assistantMessage = new Message { Role = "assistant", Status = MessageStatus.New };
messages.Add(assistantMessage);
question = null;
@@ -193,6 +203,7 @@
{
userMessage.Text = delta.ReformulatedQuestion;
assistantMessage.TokenUsage = FormatTokenUsage(delta.TokenUsage);
+ assistantMessage.Status = MessageStatus.Streaming;
}
else if (delta.StreamState == StreamState.Append)
{
@@ -212,7 +223,7 @@
IndexOnPage = c.IndexOnPage
});
- assistantMessage.IsCompleted = true;
+ assistantMessage.Status = MessageStatus.Completed;
assistantMessage.TokenUsage += FormatTokenUsage(delta.TokenUsage);
}
@@ -225,7 +236,7 @@
catch (Exception ex)
{
assistantMessage.Text = $"There was an error while processing the question: {ex.Message}";
- assistantMessage.IsCompleted = true;
+ assistantMessage.Status = MessageStatus.Completed;
}
finally
{
@@ -299,13 +310,20 @@
await JSRuntime.InvokeVoidAsync("scrollTo", chat);
}
+ public enum MessageStatus
+ {
+ New,
+ Streaming,
+ Completed
+ }
+
public class Message
{
public string? Text { get; set; }
public required string Role { get; set; }
- public bool IsCompleted { get; set; }
+ public MessageStatus Status { get; set; } = MessageStatus.New;
public string? TokenUsage { get; set; }
diff --git a/SqlDatabaseVectorSearch/Components/Pages/Ask.razor.css b/SqlDatabaseVectorSearch/Components/Pages/Ask.razor.css
index 0299a21..88c6c81 100644
--- a/SqlDatabaseVectorSearch/Components/Pages/Ask.razor.css
+++ b/SqlDatabaseVectorSearch/Components/Pages/Ask.razor.css
@@ -77,6 +77,27 @@ input[type="checkbox"] + label {
}
}
+.message-content {
+ position: relative;
+}
+
+.streaming-content {
+ display: flex;
+ align-items: flex-end;
+ gap: 8px;
+ min-height: 1.5em;
+}
+
+.streaming-text {
+ flex: 1;
+ min-width: 0;
+}
+
+.streaming-spinner-bottom-right {
+ flex-shrink: 0;
+ align-self: flex-end;
+}
+
.btn-clipboard {
line-height: 1;
color: var(--bs-body-color);