Skip to main content
Component Name: SermonSearch.razor
Version: 1.0.0 Sermon Search Conversation Screenshot

​
Dependencies

Services:
AdminSettingsService, UserService, SermonCollectionService, ConversationService, MessageService, ChatService, MarkdownService, CitationService, AuthenticationStateProvider, JS, Snackbar

​
Variables

Variable NameTypeDescription
_conversationsList<Conversation>List of conversations available to the current user
_messagesList<Message>List of messages to display in chat
_sermonCollectionsIEnumerable<SermonCollection>Sermon collections available to the current user
_messageCollectionImageSrcDictionary<string, string>Dictionary of image metadata for _sermonCollections
_messageCollectionNamesDictionary<string, string>Dictionary of name metadata for _sermonCollections
_citationsDictionary<string, List<citation>>Dictionary of current conversation’s citations, organized by message
_userInputRefMudTextField<string>Represents the user input text field element
_chatContainerMudItemRepresents the container element that wraps chat area
_chatClientChatClient?An Azure Open AI ChatClient from ChatService
_deploymentNamestringName of the Azure Open AI model deployment
_activeSermonCollectionIdstringState of currently selected sermon collection’s Id
_activeConversationIdstringState of currently selected conversation’s Id
_activeCitationIdstringState of currently selected citation’s Id
_activeCitationTitlestringState of currently selected citation’s title
_activeCitationContentstringState of currently selected citation’s content
_activeCitationUrlstringState of the currently selected citation’s source URL
_userInputValuestringState of the user input text field
_appLogoSrcstringRelative link to app logo
_activeTabPanelIndexintIndex indicating which MudTabPanel is active (Citation or Chat History)
_loadingboolIndicates when component is in a loading state
_drawerOpenboolIndicates whether the right side drawer is open or closed
_anchorAnchorPositioning anchor for right side drawer

​
Lifecycle Methods

protected override async Task OnInitializedAsync()
{
    if ( UserService.CurrentUser == null )
    {
        await UserService.InitializeCurrentUserAsync();
        await OnInitializedAsync();
    }
    else
    {
        _conversations = await ConversationService.GetConversationsByUserIdAsync( UserService.CurrentUser.Id );
        _sermonCollections = await SermonCollectionService.GetSermonCollectionsByUserIdAsync( UserService.CurrentUser.Id );
        _appLogoSrc = AdminSettingsService.CurrentAdminSettings?.AppLogoSrc ?? "";
        _deploymentName = AdminSettingsService.CurrentAdminSettings?.DeploymentName ?? "";
        _chatClient = ChatService.GetChatClient( _deploymentName );
    }
}

protected override async Task OnAfterRenderAsync( bool firstRender )
{
    if ( _messages.Count > 0 )
    {
        await ScrollToBottom();
    }
}

​
Runtime Methods

​
StartNewConversationAsync(string, bool, int)

When there is no active conversation, this method calls several other methods to start a new conversation using the inputMessage as the first message. 
private async Task StartNewConversationAsync( string inputMessage, bool isOpeningPrompt = false, int openingPromptIndex = 0 )

​
BuildNewConversation(string)

Instantiates a Conversation object using inputMessage as the Conversation.LastMessage. 
private async Task<Conversation> BuildNewConversation( string inputMessage )

​
BuildStartingMessage(Conversation, bool, int)

Instantiates a Message object using newConversation. 
private Message BuildStartingMessage( Conversation newConversation, bool isOpeningPrompt = false, int openingPromptIndex = 0 )

​
GenerateConversationTitle(string)

Uses ChatService to generate an appropriate 3-5 word title, given the first message in a conversation. 
private async Task<string> GenerateConversationTitle( string inputMessage )

​
SendMessage()

Checks if _activeSermonCollectionId is empty. If not, this method will either call StartNewConversationAsync or call several methods (including GenerateStreamingResponse) to add the message to the active conversation & stream a response. 
private async Task SendMessage()

​
BuildUserMessage()

Instantiates a new Message object from user’s input. 
private Message BuildUserMessage()

​
GenerateStreamingResponse(string, string)

Instantiates a new system Message object, prompts Azure Open AI via ChatService using userMessage & sermonCollectionId, and asynchronously fills the new system message with a streaming response. 
private async Task GenerateStreamingResponse( string userMessage, string sermonCollectionId )

​
HandleKeyDown(KeyboardEventArgs)

Monitors for user to press Enter, triggering a SendMessage call. 
private async Task HandleKeyDown( KeyboardEventArgs e )

​
SaveCitationsFromChatContext(List<ChatMessageContext>, string, string)

Asynchronous method to handle retrieving citations’ information from a streamed response & uses CitationService.AddNewCitationsAsync to save them to Cosmos DB. 
private async Task SaveCitationsFromChatContext( List<ChatMessageContext> chatContext, string messageId, string conversationId )

​
TrimCitationContent(string, string)

Used to trim excess metadata off of a citation when ShowCitation is called 
private string TrimCitationContent( string content, string title )

​
ShowCitation(Citation)

Set the state variables for displaying the active citation, given a Citation object. 
private void ShowCitation( Citation citation )

​
SetActiveConversation(string)

Sets _activeSermonCollectionId to the sermon collection of the last message & calls ConversationService.SetActiveConversationByIdAsync(). 
private async Task SetActiveConversation( string conversationId )

​
UpdateMessageDictionaries()

Sets _messageCollectionImageSrc and _messageCollectionNames. 
private async Task UpdateMessageDictionaries()

​
GetConversationClass(string)

Determines the class applied to conversations in the Conversation History MudTabPanel. 
private string GetConversationClass( string conversationId )

​
ToggleDrawer(Anchor)

Toggles the right side drawer open & closed. 
private void ToggleDrawer( Anchor anchor )

​
ShowStartScreen()

Clears _messages & sets the active conversation to null; returns the user to the start screen for a new conversation. 
private void ShowStartScreen()

​
ClearAndFocusInputAsync()

Clears _userInputValue and focuses on the user input text field _userInputRef. 
private async Task ClearAndFocusInputAsync()

​
ToggleLoading()

Toggles _loading between true and false 
private void ToggleLoading()

​
StripHtmlTags(string)

Removes all HTML tags from input string. 
private string StripHtmlTags( string input )

​
ScrollToBottom()

JS interop function to keep chat area scrolled to the conversation’s most recent message. 
private async Task ScrollToBottom()

​
copyToClipboard(string)

JS interop function to copy all HTML content from a system message onto user’s clipboard; used in the ‘Copy’ action button. 
private async Task copyToClipboard( string htmlString )