Feature(1015421): UG documentation for Volume 1 Features 2026 for SfAIAssistView, SfChat and SfTreeView controls

MAUI/AIAssistView/history.md

@@ -0,0 +1,275 @@
+---
+layout: post
+title: History in .NET MAUI AI AssistView Control | Syncfusion
+description: Learn here all about History support in Syncfusion .NET MAUI AI AssistView (SfAIAssistView) control, its elements, and more.
+platform: MAUI
+control: SfAIAssistView
+documentation: ug
+---
+
+# History in .NET MAUI AI AssistView (SfAIAssistView)
+
+This section explains how to define and customize the history in the [SfAIAssistView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.html).
+
+## Conversation history
+
+The [SfAIAssistView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.SfAIAssistView.html) control provides a `History` feature that allows you to display the conversation history from interactions with real-time AI. To disable this feature, set the `EnableConversationHistory` property to `false`.
+
+### Binding data into conversation history
+
+The `SfAIAssistView` control provides the `ConversationItemsSource` API to manually set the conversation history items source. This source also updates at runtime when new requests are made in the conversation. 
+
+#### View model
+Create a simple view model as shown in the following code example, and save it as `GettingStartedViewModel.cs` file.
+
+{% tabs %}
+{% highlight c# tabtitle="ViewModel.cs" %}
+
+using Syncfusion.Maui.AIAssistView;
+public class GettingStartedViewModel : INotifyPropertyChanged
+{
+    ...
+    private ObservableCollection<AssistConversationItem> conversationItems;
+    ...
+
+    public AIAssistViewModel()
+    {
+        ...
+        this.conversationItems = new ObservableCollection<AssistConversationItem>();
+        this.InitializeConversationHistory();
+        ...
+    }
+
+    ...
+    public ObservableCollection<AssistConversationItem> ConversationItems 
+    { 
+        get { return this.conversationItems; }
+        set 
+        {
+            this.conversationItems = value;
+            this.RaisePropertyChanged(nameof(ConversationItems));
+        }
+    }
+    ...
+
+    public void InitializeConversationHistory()
+    {
+        DateTime baseTime = DateTime.Now;
+
+        string[] topics = new string[]
+        {
+            "listening",
+            "Hey AI, can you tell me what Maui is?",
+        };
+
+        string[] responses = new string[]
+        {
+            "Types of Listening : For a good communication, it is not only enough to convey the information efficiently, but it also needs to include good listening skill. Common types of Listening are Active listening and Passive listening.",
+            "MAUI stands for .NET Multi-platform APP UI. It's is a framework that allowws you to create cross-platform applications using a single codebase.",
+        };
+
+        for (int i = 0; i < 2; i++)
+        {
+            var dateTime = baseTime.AddDays(-i);
+            var request = new AssistItem
+            {
+                Text = topics[i],
+                IsRequested = true,
+                DateTime = dateTime,
+            };
+
+            var response = new AssistItem
+            {
+                Text = responses[i],
+                IsRequested = false,
+                DateTime = dateTime,
+                RequestItem = request,
+            };
+
+            var title = topics[i];
+            var conversationItem = new AssistConversationItem
+            {
+                Title = title,
+                DateTime = baseTime.AddDays(-i),
+                AssistItems = new ObservableCollection<IAssistItem>
+                {
+                    request,
+                    response,
+                }
+            };
+
+            this.ConversationItems.Add(conversationItem);
+        }
+    }
+    ...
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+#### Binding conversation items to SfAIAssistView
+To populate the conversation items, bind the item collection from its BindingContext to `SfAIAssistView.ConversationItemsSource` property.
+
+{% tabs %}
+{% highlight xaml hl_lines="15" %}
+
+<?xml version="1.0" encoding="utf-8" ?>
+<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
+             xmlns:syncfusion="clr-namespace:Syncfusion.Maui.AIAssistView;assembly=Syncfusion.Maui.AIAssistView"
+             xmlns:local="clr-namespace:GettingStarted.ViewModel"            
+             x:Class="GettingStarted.MainPage">
+
+    <ContentPage.BindingContext>
+        <local:GettingStartedViewModal/>
+    </ContentPage.BindingContext>
+
+    <ContentPage.Content>
+        <syncfusion:SfAIAssistView x:Name="sfAIAssistView"
+                                   AssistItems="{Binding AssistItems}"
+                                   ConversationItemsSource="{Binding ConversationItems}"/>
+    </ContentPage.Content>
+
+</ContentPage>
+
+{% endhighlight %}
+{% highlight c# hl_lines="10" %}
+
+public partial class MainPage : ContentPage 
+{
+    SfAIAssistView sfAIAssistView;
+    public MainPage()
+    {
+        InitializeComponent();
+        this.sfAIAssistView = new SfAIAssistView();
+        GettingStartedViewModel viewModel = new GettingStartedViewModel();
+        this.sfAIAssistView.AssistItems = viewModel.AssistItems;
+        this.sfAIAssistView.ConversationItemsSource = viewModel.ConversationItems;
+        this.Content = sfAIAssistView;
+    }
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+### Conversation header text
+
+The `SfAIAssistView` control provides the `ConversationHeaderText` API to set the header text for the conversation view. By default, this property is set to `string.Empty`.
+
+{% tabs %}
+{% highlight xaml hl_lines="2" %}
+
+<syncfusion:SfAIAssistView x:Name="aiAssistView"
+                     ConversationHeaderText="Chat History" />
+
+{% endhighlight %}
+{% highlight c# hl_lines="6" %}
+
+SfAIAssistView sfAIAssistView; 
+public MainPage() 
+{ 
+    InitializeComponent(); 
+    this.sfAIAssistView = new SfAIAssistView();
+    this.sfAIAssistView.ConversationHeaderText = "Chat History";
+    this.Content = sfAIAssistView;
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+### Conversation empty view
+
+The `ConversationEmptyView` property can be set to a string or a custom view, which will be displayed when no conversation items are available in the control.
+
+{% tabs %}
+{% highlight xaml hl_lines="5" %}
+
+<ContentPage xmlns:syncfusion="clr-namespace:Syncfusion.Maui.AIAssistView;assembly=Syncfusion.Maui.AIAssistView">
+
+   <syncfusion:SfAIAssistView x:Name="sfAIAssistView"  
+                              AssistItems="{Binding AssistItems}"
+                              ConversationEmptyView="No conversations available">
+    </syncfusion:SfAIAssistView>
+</ContentPage>
+
+{% endhighlight %}
+{% highlight c# hl_lines="10" %}
+public partial class MainPage : ContentPage
+{
+    SfAIAssistView sfAIAssistView;
+    public MainPage()
+    { 
+        InitializeComponent();
+        sfAIAssistView = new SfAIAssistView();
+        GettingStartedViewModel viewModel = new GettingStartedViewModel();
+        sfAIAssistView.AssistItems = viewModel.AssistItems;
+        sfAIAssistView.ConversationEmptyView = "No conversations available";
+        Content = sfAIAssistView;
+   }
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+## Events and commands
+
+When a user selects a conversation item, the `ConversationItemTapped` event and `ConversationItemTappedCommand` are triggered, providing `ConversationItemTappedEventArgs ` as arguments. This arguments contains the following details about the selected suggestion item.
+
+ * `ConversationItem` : The conversation item selected by the user.
+ * `Handled` : A boolean indicating whether the selected conversation item is automatically visible in view. The default value is false.
+
+### ConversationItemTapped event
+
+{% tabs %}
+{% highlight xaml hl_lines="2" %}
+
+<syncfusion:SfAIAssistView x:Name="aiAssistView"
+                     ConversationItemTapped="OnConversationItemTapped"/>
+
+{% endhighlight %}
+{% highlight c# hl_lines="1" %}
+
+aiAssistView.ConversationItemTapped += OnConversationItemTapped;
+
+private void OnConversationItemTapped(object sender, ConversationItemTappedEventArgs e)
+{
+    // Handle the conversation item action
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+### ConversationItemTappedCommand
+
+{% tabs %}
+{% highlight xaml hl_lines="2" %}
+
+<syncfusion:SfAIAssistView x:Name="aiAssistView"
+                     ConversationItemTappedCommand="{Binding ConversationItemTappedCommand}"/>
+
+{% endhighlight %}
+{% highlight c# hl_lines="4,7" %}
+
+public class AIAssistViewModel : INotifyPropertyChanged
+{
+    ...
+    public ICommand ConversationItemTappedCommand { get; }
+    ...
+
+    public AIAssistViewModel()
+    {
+        ...
+        this.ConversationItemTappedCommand = new Command<object>(OnConversationItemTapped);
+        ...
+    }
+
+    ...
+    private void OnConversationItemTapped(object obj)
+    {
+        // Handle the conversation item action
+    }
+    ...
+}
+
+{% endhighlight %}
+{% endtabs %} 

MAUI/AIAssistView/items.md

@@ -428,6 +428,121 @@ The `SfAIAssistView` control includes a built-in event called [CardTapped](https
 {% endhighlight %}
 {% endtabs %}
 
+## Attachment item
+
+The [AssistAttachmentItem](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.AssistAttachmentItem.html) is used to display the preview for a file or an image as a item. Using the [Attachments](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.SfAIAssistView.html#Syncfusion_Maui_AIAssistView_SfAIAssistView_Attachments) property, you can display the desired attachments as item in the AI AssistView control.
+
+{% tabs %}
+{% highlight c# tabtitle="ViewModel.cs" hl_lines="8" %}
+
+public class ViewModel : INotifyPropertyChanged
+{
+    ...
+
+    private async void GenerateAssistItems()
+    {
+        // Adding a user request as attachments 
+        var requestItem = new AssistAttachmentItem()
+        {
+            Text = "Read the following documents",
+            IsRequested = true,
+            Attachments = new List<IAttachment> { staticAttachment1, staticAttachment2, staticAttachment3 }
+        };
+
+        AssistItems.Add(requestItem);
+
+        // Generating response item
+        await GetResult(requestItem);
+    }
+
+    private async Task GetResult(AssistItem requestItem)
+    {
+        await Task.Delay(1000).ConfigureAwait(true);
+
+        AssistItem responseItem = new AssistItem()
+        {
+            // Adding a text item as a response from the AI service
+            Text = "Thank you for sharing the documents. I will review the text file, the Excel sheet, and the PDF to provide you with a summary or any insights you need. Please let me know if you have any specific questions about these files.",
+            IsRequested = false,
+        };
+
+        // Add the response item to the collection
+        this.AssistItems.Add(responseItem);
+    }
+
+    ...
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+## AttachmentTapped Event and Command
+
+The `SfAIAssistView` control includes a built-in event and command to listen for tap interactions in the attachment preview. The tapped attachment item can be accessed through the [AttachmentTappedEventArgs](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.AttachmentTappedEventArgs.html). The `AttachmentTappedEventArgs` has the following member:
+
+ * [Attachment]() : Refers to the tapped attachment item.
+
+### AttachmentTapped Event
+
+The [AttachmentTapped](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.SfAIAssistView.html#Syncfusion_Maui_AIAssistView_SfAIAssistView_AttachmentTapped) event is triggered when a preview attachment item is tapped.
+
+{% tabs %}
+{% highlight xaml tabtitle="MainPage.xaml" hl_lines="2" %}
+
+<syncfusion:SfAIAssistView x:Name="sfAIAssistView"
+                        AttachmentTapped="sfAIAssistView_AttachmentTapped" />
+
+{% endhighlight %}
+{% highlight c# tabtitle="MainPage.xaml.cs" hl_lines="1" %}
+
+sfAIAssistView.AttachmentTapped += SfAIAssistView_AttachmentTapped;
+
+private void SfAIAssistView_AttachmentTapped(object sender, AttachmentTappedEventArgs e)
+{  
+    DisplayAlert("Attachment", " Tapped on attachment :" + e.Attachment.FileName, "Ok");                  
+}
+
+{% endhighlight %}
+{% endtabs %}
+
+### AttachmentTapped Command
+
+The [AttachmentTappedCommand](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.SfAIAssistView.html#Syncfusion_Maui_AIAssistView_SfAIAssistView_AttachmentTappedCommand) is triggered when a preview attachment item is tapped.
+
+{% tabs %}
+{% highlight xaml tabtitle="MainPage.xaml" hl_lines="2" %}   
+
+<syncfusion:SfAIAssistView x:Name="sfAIAssistView"  
+                            AttachmentTappedCommand="{Binding TappedCommand}" />
+
+{% endhighlight %}
+{% highlight c# tabtitle="ViewModel.cs" hl_lines="16" %}
+
+public class ViewModel : INotifyPropertyChanged
+{
+    public Command<object> tappedCommand;
+
+    public ViewModel()
+    {
+        TappedCommand = new Command<object>(AttachmentTapped);
+    }
+
+    public Command<object> TappedCommand
+    {
+        get { return tappedCommand; }
+        set { tappedCommand = value; }
+    }
+
+    private void AttachmentTapped(object obj)
+    {
+        var AttachmentTappedArgs = obj as AttachmentTappedEventArgs;
+        DisplayAlert("Attachment", " Tapped on Attachment item :" + AttachmentTappedArgs.Attachment.FileName, "Ok");                  
+    }      
+}
+
+{% endhighlight %}
+{% endtabs %}
+
 ## Show error response
 
 The `SfAIAssistView` allows to display error responses by setting the error text to the [AssistItem.ErrorMessage](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.AIAssistView.IAssistItem.html#Syncfusion_Maui_AIAssistView_IAssistItem_ErrorMessage) property, ensuring clear notification when an error occurs during AI interactions.