-
Notifications
You must be signed in to change notification settings - Fork 18
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
4 changed files
with
132 additions
and
74 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
87 changes: 27 additions & 60 deletions
87
src/AzureOpenAIProxy.PlaygroundApp/Components/UI/ChatWindowComponent.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,72 +1,39 @@ | ||
| @using AzureOpenAIProxy.PlaygroundApp.Clients | ||
| @inject IOpenAIApiClient Api | ||
| <FluentLayout Id="@Id"> | ||
| <FluentTextArea Style="width: 100%;" Rows="6" Placeholder="Type user query here. (Shift + Enter for new line)" @bind-Value="prompt" @onchange="UpdatePrompt"></FluentTextArea> | ||
| <FluentStack Style="width: 100%;" Orientation="Orientation.Horizontal" HorizontalAlignment="HorizontalAlignment.Start"> | ||
| <FluentStack Style="width: 50%;" Orientation="Orientation.Horizontal" HorizontalAlignment="HorizontalAlignment.Start"> | ||
| <FluentButton IconStart="@(new Icons.Regular.Size20.Broom())" OnClick="ClearChat">Clear</FluentButton> | ||
| </FluentStack> | ||
| <FluentStack Style="width: 50%;" Orientation="Orientation.Horizontal" HorizontalAlignment="HorizontalAlignment.End"> | ||
| <FluentButton IconStart="@(new Icons.Regular.Size20.Send())" OnClick="CompleteChat">Send</FluentButton> | ||
| </FluentStack> | ||
| </FluentStack> | ||
| </FluentLayout> | ||
|
|
||
| <div class="container"> | ||
| <h3>Chat Window</h3> | ||
|
|
||
| <div class="row"> | ||
| <div class="col-md-6"> | ||
| <textarea class="form-control" readonly>@userPrompt</textarea> | ||
| </div> | ||
| <div class="col-md-6"> | ||
| <textarea class="form-control" readonly>@assistantMessage</textarea> | ||
| </div> | ||
| </div> | ||
| @code { | ||
| private string? prompt; | ||
|
|
||
| <div class="row mt-3"> | ||
| <div class="col-md-6"> | ||
| <textarea class="form-control" @bind="@userInput"></textarea> | ||
| </div> | ||
| <div class="col-md-6"> | ||
| <button class="btn btn-primary" @onclick="SendAsync">Send</button> | ||
| <button class="btn btn-secondary" @onclick="ClearAsync">Clear</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| [Parameter] | ||
| public string? Id { get; set; } | ||
|
|
||
| @code { | ||
| private string? endpoint = "https://localhost:7001/"; | ||
| private string? apiKey = "abcdef"; | ||
| private string? deploymentName = "model-gpt35turbo16k-0613"; | ||
| private int? maxTokens = 4096; | ||
| private float? temperature = 0.7f; | ||
| private string? systemPrompt = "You are an AI assistant that helps people find information."; | ||
| private string? userPrompt; | ||
| private string? assistantMessage; | ||
| private string? userInput; | ||
| [Parameter] | ||
| public EventCallback<string?> OnPromptSent { get; set; } | ||
|
|
||
| private async Task SendAsync() | ||
| private async Task UpdatePrompt(ChangeEventArgs e) | ||
| { | ||
| userPrompt = userInput; | ||
|
|
||
| try | ||
| { | ||
| var options = new OpenAIApiClientOptions() | ||
| { | ||
| Endpoint = endpoint, | ||
| ApiKey = apiKey, | ||
| DeploymentName = deploymentName, | ||
| MaxTokens = maxTokens, | ||
| Temperature = temperature, | ||
| SystemPrompt = systemPrompt, | ||
| UserPrompt = userInput, | ||
| }; | ||
| var result = await Api.CompleteChatAsync(options); | ||
| assistantMessage = result; | ||
| this.prompt = e.Value!.ToString(); | ||
|
|
||
| } | ||
| catch (Exception ex) | ||
| { | ||
| assistantMessage = ex.Message; | ||
| } | ||
| await Task.CompletedTask; | ||
| } | ||
|
|
||
| private async Task ClearAsync() | ||
| private async Task CompleteChat() | ||
| { | ||
| userPrompt = string.Empty; | ||
| assistantMessage = string.Empty; | ||
| userInput = string.Empty; | ||
| await this.OnPromptSent.InvokeAsync(this.prompt); | ||
|
|
||
| await Task.CompletedTask; | ||
| } | ||
| } | ||
| private async Task ClearChat() | ||
| { | ||
| await Task.CompletedTask; | ||
| } | ||
| } |
72 changes: 72 additions & 0 deletions
72
src/AzureOpenAIProxy.PlaygroundApp/Components/UI/OldChatWindowComponent.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,72 @@ | ||
| @using AzureOpenAIProxy.PlaygroundApp.Clients | ||
| @inject IOpenAIApiClient Api | ||
|
|
||
| <div class="container"> | ||
| <h3>Chat Window</h3> | ||
|
|
||
| <div class="row"> | ||
| <div class="col-md-6"> | ||
| <textarea class="form-control" readonly>@userPrompt</textarea> | ||
| </div> | ||
| <div class="col-md-6"> | ||
| <textarea class="form-control" readonly>@assistantMessage</textarea> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="row mt-3"> | ||
| <div class="col-md-6"> | ||
| <textarea class="form-control" @bind="@userInput"></textarea> | ||
| </div> | ||
| <div class="col-md-6"> | ||
| <button class="btn btn-primary" @onclick="SendAsync">Send</button> | ||
| <button class="btn btn-secondary" @onclick="ClearAsync">Clear</button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| @code { | ||
| private string? endpoint = "https://localhost:7001/"; | ||
| private string? apiKey = "abcdef"; | ||
| private string? deploymentName = "model-gpt35turbo16k-0613"; | ||
| private int? maxTokens = 4096; | ||
| private float? temperature = 0.7f; | ||
| private string? systemPrompt = "You are an AI assistant that helps people find information."; | ||
| private string? userPrompt; | ||
| private string? assistantMessage; | ||
| private string? userInput; | ||
|
|
||
| private async Task SendAsync() | ||
| { | ||
| userPrompt = userInput; | ||
|
|
||
| try | ||
| { | ||
| var options = new OpenAIApiClientOptions() | ||
| { | ||
| Endpoint = endpoint, | ||
| ApiKey = apiKey, | ||
| DeploymentName = deploymentName, | ||
| MaxTokens = maxTokens, | ||
| Temperature = temperature, | ||
| SystemPrompt = systemPrompt, | ||
| UserPrompt = userInput, | ||
| }; | ||
| var result = await Api.CompleteChatAsync(options); | ||
| assistantMessage = result; | ||
|
|
||
| } | ||
| catch (Exception ex) | ||
| { | ||
| assistantMessage = ex.Message; | ||
| } | ||
| } | ||
|
|
||
| private async Task ClearAsync() | ||
| { | ||
| userPrompt = string.Empty; | ||
| assistantMessage = string.Empty; | ||
| userInput = string.Empty; | ||
|
|
||
| await Task.CompletedTask; | ||
| } | ||
| } |