cartaid/shopping-assistant-web-client
0
0
Fork 0
mirror of https://github.com/Shchoholiev/shopping-assistant-web-client.git synced 2025-06-29 18:21:09 +00:00
Code

Revert "SA-195 fix initial message freeze"

Browse Source 
This reverts commit fb92899ce8.
This commit is contained in:
Mykhailo Bilodid 2023-11-22 15:48:13 +02:00
parent ba962be0d7
commit 1b25cd368f
5 changed files with 154 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
ShoppingAssistantWebClient.Web/Pages/Chat.razor
View File

@ -85,7 +85,7 @@
<div class="chat_input"> <div class="chat_input">
<input @bind="inputValue" @onkeydown="Enter" class="input_messages" type="text" id="chatInput" <input @bind="inputValue" @onkeydown="Enter" class="input_messages" type="text" id="chatInput"
placeholder="Describe what you are looking for...."> placeholder="Describe what you are looking for....">
<img @onclick="() => AddNewMessage(inputValue)" class="button_sende" src="/images/send.svg" alt="Send message"> <img @onclick="AddNewMessage" class="button_sende" src="/images/send.svg" alt="Send message">
</div> </div>
</div> </div>
@ -101,12 +101,6 @@
} }
}; };
function myJavaScriptFunction(wishlistId) {
UpdateMenu(wishlistId);
}
document.getElementById('button_open').addEventListener('click', changetyle); document.getElementById('button_open').addEventListener('click', changetyle);
</script> </script>
@ -123,7 +117,7 @@
{ {
if (e.Code == "Enter" || e.Code == "NumpadEnter") if (e.Code == "Enter" || e.Code == "NumpadEnter")
{ {
AddNewMessage(inputValue); AddNewMessage();
} }
} }
@ -140,11 +134,4 @@
inputValue = item; inputValue = item;
} }
private async Task UpdateSideMenu(string wishlistId)
{
await JSRuntime.InvokeVoidAsync("myJavaScriptFunction", wishlistId);
}
} }

125
ShoppingAssistantWebClient.Web/Pages/Chat.razor.cs
View File

@ -37,47 +37,12 @@ public partial class Chat : ComponentBase
private string name = ""; private string name = "";
protected override async Task OnInitializedAsync() protected override async Task OnInitializedAsync()
{ {
var input = _searchServise.firstMassage;
if (input!=null){
await LoadMessages(); await LoadMessages();
await AddNewMessage(input);
string wishlistId = chatId;
var request = new GraphQLRequest
{
Query = @"mutation GenerateNameForPersonalWishlist($wishlistId: String!) {
generateNameForPersonalWishlist(wishlistId: $wishlistId) {
id
name
}
}",
Variables = new
{
wishlistId
}
};
var response = await _apiClient.QueryAsync(request);
_searchServise.SetFirstMassage(null);
isLoading = false;
await UpdateSideMenu(wishlistId);
StateHasChanged();
}else{
await LoadMessages();
}
} }
private async Task LoadMessages() private async Task LoadMessages()
{ {
try{ try{
string wishlistId = chatId; string wishlistId = chatId;
@ -100,29 +65,29 @@ public partial class Chat : ComponentBase
name = responseData.personalWishlist.name; name = responseData.personalWishlist.name;
isLoading = true; isLoading = true;
int pageNumber = 1; int pageNumber = 1;
request = new GraphQLRequest request = new GraphQLRequest
{
Query = @"query MessagesPageFromPersonalWishlist($wishlistId: String!, $pageNumber: Int!, $pageSize: Int!) {
messagesPageFromPersonalWishlist( wishlistId: $wishlistId, pageNumber: $pageNumber, pageSize: $pageSize)
{
items {
id
text
role
createdById
}
}
}",
Variables = new
{ {
wishlistId, Query = @"query MessagesPageFromPersonalWishlist($wishlistId: String!, $pageNumber: Int!, $pageSize: Int!) {
pageNumber, messagesPageFromPersonalWishlist( wishlistId: $wishlistId, pageNumber: $pageNumber, pageSize: $pageSize)
pageSize = 200 {
} items {
}; id
text
role
createdById
}
}
}",
Variables = new
{
wishlistId,
pageNumber,
pageSize = 200
}
};
@ -137,69 +102,53 @@ public partial class Chat : ComponentBase
Console.WriteLine($"Error : {ex.Message}"); Console.WriteLine($"Error : {ex.Message}");
} }
} }
private async Task AddNewMessage(string inputMessage) private async Task AddNewMessage()
{ {
try{ try{
messageCreateDto = new MessageCreateDto { Text = inputValue };;
messageCreateDto = new MessageCreateDto { Text = inputMessage };;
Message = new Messages(); Message = new Messages();
Message.Text = inputMessage; Message.Text = inputValue;
Message.Role = "User"; Message.Role = "User";
Message.Id = ""; Message.Id = "";
Message.CreatedById = ""; Message.CreatedById = "";
inputValue = ""; inputValue = "";
Suggestion = new List<String>(); Suggestion = new List<String>();
Products = new List<String>();
Messages.Add(Message); Messages.Add(Message);
StateHasChanged(); StateHasChanged();
cancelTokenSource = new CancellationTokenSource(); cancelTokenSource = new CancellationTokenSource();
var cancellationToken = cancelTokenSource.Token; var cancellationToken = cancelTokenSource.Token;
const string animationChars = ".oOo";
int animationIndex = 0;
var serverSentEvent = _apiClient.GetServerSentEventStreamed($"ProductsSearch/search/{chatId}", messageCreateDto, cancellationToken); var serverSentEvent = _apiClient.GetServerSentEventStreamed($"ProductsSearch/search/{chatId}", messageCreateDto, cancellationToken);
bool first = true; bool first = true;
Message = new Messages();
Message.Role = "bot";
Message.Id = "";
Message.CreatedById = "";
Message.Text = "Waiting for response";
Messages.Add(Message);
StateHasChanged();
await Task.Delay(500); // Adjust delay as needed
animationIndex = (animationIndex + 1) % animationChars.Length;
await foreach (var sseEvent in serverSentEvent.WithCancellation(cancellationToken)) await foreach (var sseEvent in serverSentEvent.WithCancellation(cancellationToken))
{ {
Console.WriteLine($"Received SSE Event: {sseEvent.Event}, Data: {sseEvent.Data}"); Console.WriteLine($"Received SSE Event: {sseEvent.Event}, Data: {sseEvent.Data}");
string input = sseEvent.Data; string input = sseEvent.Data;
Regex regex = new Regex("\"(.*?)\""); Regex regex = new Regex("\"(.*?)\"");
Match match = regex.Match(input); Match match = regex.Match(input);
string result = match.Groups[1].Value; string result = match.Groups[1].Value;
if(sseEvent.Event == SearchEventType.Message){ if(sseEvent.Event == SearchEventType.Message){
Message = new Messages();
Message.Text = result;
Message.Role = "bot";
Message.Id = "";
Message.CreatedById = "";
if (first) if (first)
{ {
var lengt = Messages.Count(); Messages.Add(Message);
Messages[lengt-1].Text = result;
first = false; first = false;
} }
else else
{ {
var lengt = Messages.Count(); var lengt = Messages.Count();
Messages[lengt-1].Text += result; Messages[lengt-1].Text += Message.Text;
} }
StateHasChanged(); StateHasChanged();
@ -213,9 +162,7 @@ public partial class Chat : ComponentBase
} }
} }
if(Products != null) {
if(Products.Count!=0) {
string n = name; string n = name;
_searchServise.SetProducts(Products); _searchServise.SetProducts(Products);
var url = $"/cards/{name}/{chatId}"; var url = $"/cards/{name}/{chatId}";

18
ShoppingAssistantWebClient.Web/Pages/Index.razor
View File

@ -11,6 +11,8 @@
</a> </a>
</div> </div>
@if(isLoading == false){
<div class="new_chat"> <div class="new_chat">
<div class="chat_message"> <div class="chat_message">
<div class="title_one_frame">New chat</div> <div class="title_one_frame">New chat</div>
@ -57,6 +59,15 @@
</div> </div>
}else{
<div class="new_chat">
<img class="loading" src="/images/loading.svg" alt="Loading chat">
</div>
}
</div> </div>
@ -93,6 +104,13 @@
} }
document.getElementById('choose_gift').addEventListener('click', switchGift); document.getElementById('choose_gift').addEventListener('click', switchGift);
document.getElementById('choose_product').addEventListener('click', switchProduct); document.getElementById('choose_product').addEventListener('click', switchProduct);

67
ShoppingAssistantWebClient.Web/Pages/Index.razor.cs
View File

@ -7,7 +7,6 @@ using Newtonsoft.Json;
using ShoppingAssistantWebClient.Web.Network; using ShoppingAssistantWebClient.Web.Network;
using System; using System;
using Microsoft.JSInterop; using Microsoft.JSInterop;
using ShoppingAssistantWebClient.Web.Services;
namespace ShoppingAssistantWebClient.Web.Pages namespace ShoppingAssistantWebClient.Web.Pages
{ {
@ -21,10 +20,14 @@ namespace ShoppingAssistantWebClient.Web.Pages
private NavigationManager Navigation { get; set; } private NavigationManager Navigation { get; set; }
[Inject] [Inject]
protected IJSRuntime JSRuntime { get; set; } protected IJSRuntime JSRuntime { get; set; }
[Inject]
private SearchService _searchServise { get; set; }
private MessageCreateDto messageCreateDto;
private CancellationTokenSource cancelTokenSource;
private string inputValue = ""; private string inputValue = "";
public bool isLoading;
private async Task CreateNewChat() { private async Task CreateNewChat() {
@ -35,6 +38,9 @@ namespace ShoppingAssistantWebClient.Web.Pages
return; return;
} }
isLoading = true;
StateHasChanged();
messageCreateDto = new MessageCreateDto { Text = inputValue };
var type = selectedChoice; var type = selectedChoice;
var firstMessageText = $"What are you looking for?"; var firstMessageText = $"What are you looking for?";
@ -56,19 +62,58 @@ namespace ShoppingAssistantWebClient.Web.Pages
var response = await _apiClient.QueryAsync(request); var response = await _apiClient.QueryAsync(request);
var responseData = response.Data; var responseData = response.Data;
var chatId = responseData?.startPersonalWishlist?.id; var chatId = responseData?.startPersonalWishlist?.id;
string wishlistId1 = chatId;
var text = inputValue;
cancelTokenSource = new CancellationTokenSource();
var cancellationToken = cancelTokenSource.Token;
var serverSentEvent = _apiClient.GetServerSentEventStreamed($"ProductsSearch/search/{chatId}", messageCreateDto, cancellationToken);
await foreach (var sseEvent in serverSentEvent.WithCancellation(cancellationToken))
{
// Handle each ServerSentEvent as needed
Console.WriteLine($"Received SSE Event: {sseEvent.Event}, Data: {sseEvent.Data}");
}
string wishlistId = chatId; string wishlistId = chatId;
_searchServise.SetFirstMassage(inputValue); request = new GraphQLRequest
await UpdateSideMenu(wishlistId); {
Query = @"mutation GenerateNameForPersonalWishlist($wishlistId: String!) {
generateNameForPersonalWishlist(wishlistId: $wishlistId) {
id
name
}
}",
Variables = new
{
wishlistId
}
};
response = await _apiClient.QueryAsync(request);
isLoading = false;
StateHasChanged();
await UpdateSideMenu(wishlistId1);
var url = $"/chat/{chatId}"; var url = $"/chat/{chatId}";
Navigation.NavigateTo(url); Navigation.NavigateTo(url);
} }
catch (Exception ex){ catch (Exception ex)
{
Console.WriteLine($"Error in CreateNewChat: {ex.Message}"); // Handle exceptions appropriately
} Console.WriteLine($"Error in CreateNewChat: {ex.Message}");
}
finally
{
isLoading = false;
cancelTokenSource?.Dispose();
}
} }
} }

42
ShoppingAssistantWebClient.Web/wwwroot/images/loading.svg Normal file
View File

@ -0,0 +1,42 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="602.000000pt" height="597.000000pt" viewBox="0 0 602.000000 597.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,597.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M2819 5887 c-104 -30 -199 -113 -247 -215 -22 -48 -27 -71 -27 -142
0 -105 28 -173 105 -254 74 -79 150 -111 260 -111 72 0 94 4 145 28 79 37 156
114 192 191 24 52 28 74 28 146 0 71 -4 94 -27 142 -77 166 -267 261 -429 215z"/>
<path d="M4083 5579 c-203 -64 -333 -300 -279 -509 40 -155 147 -257 308 -295
252 -59 480 80 521 318 28 163 -56 334 -213 435 -110 71 -221 88 -337 51z"/>
<path d="M1493 5496 c-116 -38 -189 -113 -225 -229 -24 -80 -21 -174 7 -245
21 -51 88 -112 164 -149 81 -38 211 -44 296 -13 81 30 165 114 190 191 56 164
-20 351 -172 425 -67 33 -191 43 -260 20z"/>
<path d="M5061 4675 c-366 -103 -489 -487 -241 -758 86 -94 189 -148 315 -166
202 -29 380 72 473 266 36 76 37 81 37 188 0 131 -20 191 -94 288 -115 150
-326 228 -490 182z"/>
<path d="M532 4508 c-51 -17 -124 -89 -157 -155 -26 -50 -30 -69 -30 -138 0
-71 4 -89 33 -147 37 -75 73 -110 151 -146 46 -21 63 -24 130 -20 90 6 152 32
212 90 62 60 83 116 84 218 0 73 -4 92 -27 136 -32 61 -94 119 -157 147 -54
24 -187 32 -239 15z"/>
<path d="M5440 3389 c-145 -25 -278 -125 -344 -261 -94 -190 -59 -406 89 -554
194 -195 490 -191 683 10 66 68 105 136 127 223 83 319 -222 639 -555 582z"/>
<path d="M218 3187 c-132 -37 -217 -162 -206 -301 13 -163 137 -267 303 -254
103 9 187 64 229 151 55 112 41 216 -40 306 -81 90 -185 126 -286 98z"/>
<path d="M5085 2120 c-164 -34 -301 -145 -383 -311 -103 -208 -72 -411 85
-568 101 -101 244 -161 383 -161 228 0 444 155 516 370 27 82 25 225 -4 312
-87 253 -347 409 -597 358z"/>
<path d="M539 1877 c-72 -20 -129 -75 -166 -157 -19 -43 -22 -168 -5 -227 15
-50 82 -122 143 -155 58 -30 186 -33 239 -4 63 33 115 83 145 137 26 47 30 64
30 134 0 63 -5 89 -23 122 -30 57 -86 111 -139 135 -56 25 -164 32 -224 15z"/>
<path d="M1509 870 c-20 -11 -49 -34 -64 -52 -36 -42 -85 -146 -85 -178 0 -78
56 -161 134 -203 63 -33 166 -31 228 5 98 58 144 191 100 290 -25 58 -87 127
-129 145 -47 19 -141 16 -184 -7z"/>
<path d="M2822 537 c-49 -15 -127 -90 -147 -139 -56 -139 19 -302 159 -343 62
-19 90 -19 152 0 140 41 214 197 161 337 -22 57 -100 132 -153 147 -48 13
-128 13 -172 -2z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB