style: init chat component

foxminchan · Jun 9, 2024 · c67f887 · c67f887
1 parent 1551bfe
commit c67f887
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 3 deletions.
diff --git a/src/RookieShop.StoreFront/Components/Chatbot/ChatState.cs b/src/RookieShop.StoreFront/Components/Chatbot/ChatState.cs
@@ -20,7 +20,9 @@ public sealed class ChatState
     private readonly IHttpContextAccessor _httpContextAccessor;
 
     private readonly OpenAIPromptExecutionSettings _aiSettings = new()
-        { ToolCallBehavior = ToolCallBehavior.AutoInvokeKernelFunctions };
+    {
+        ToolCallBehavior = ToolCallBehavior.AutoInvokeKernelFunctions
+    };
 
     public ChatState(
         IProductService productService,

diff --git a/src/RookieShop.StoreFront/Components/Chatbot/Chatbot.razor b/src/RookieShop.StoreFront/Components/Chatbot/Chatbot.razor
@@ -0,0 +1,28 @@
+@using Microsoft.SemanticKernel
+@using RookieShop.Storefront.Areas.Basket.Services
+@using RookieShop.Storefront.Areas.Product.Services
+@inject IProductService ProductService
+@inject IBasketService BasketService
+@inject IHttpContextAccessor HttpContextAccessor
+@inject ILoggerFactory LoggerFactory
+@inject IServiceProvider ServiceProvider
+
+<h3>Chatbot</h3>
+
+@code {
+    ChatState? _chatState;
+    bool _missingConfiguration;
+
+    protected override async Task OnInitializedAsync()
+    {
+        var kernel = ServiceProvider.GetService<Kernel>();
+        if (kernel is not null)
+        {
+            _chatState = new(ProductService, BasketService, HttpContextAccessor, kernel, LoggerFactory);
+        }
+        else
+        {
+            _missingConfiguration = true;
+        }
+    }
+}
diff --git a/src/RookieShop.StoreFront/Components/Chatbot/ShowChatbotButton.razor b/src/RookieShop.StoreFront/Components/Chatbot/ShowChatbotButton.razor
@@ -0,0 +1,5 @@
+<div class="fixed bottom-0 right-0 mb-4 mr-4">
+    <button id="open-chat" class="text-white bg-blue-700 hover:bg-blue-800 rounded-lg focus:ring-4 py-2 px-4 transition duration-300 flex items-center">
+        Chat with Bot
+    </button>
+</div>
diff --git a/src/RookieShop.StoreFront/Views/Shared/_Layout.cshtml b/src/RookieShop.StoreFront/Views/Shared/_Layout.cshtml
@@ -1,4 +1,5 @@
-<!DOCTYPE html>
+@using RookieShop.Storefront.Components.Chatbot
+<!DOCTYPE html>
 <html lang="en">
 <head>
     <base href="~/"/>
@@ -130,7 +131,7 @@
         @RenderBody()
     </main>
 </div>
-
+<component type="typeof(ShowChatbotButton)" render-mode="ServerPrerendered"/>
 <cache expires-after="@TimeSpan.FromSeconds(300)">
     <script src="~/js/site.js" asp-append-version="true"></script>
     <environment names="Development,Docker">