Enhance drag-and-drop with hover detection and logging

app/MindWork AI Studio/Assistants/DocumentAnalysis/DocumentAnalysisAssistant.razor

@@ -71,6 +71,6 @@ else
     </ExpansionPanel>
     
     <ExpansionPanel HeaderIcon="@Icons.Material.Filled.DocumentScanner" HeaderText="@(T("Document analysis") + $": {this.selectedPolicy?.PolicyName}")" IsExpanded="@(this.selectedPolicy?.IsProtected ?? false)">
-        <AttachDocuments @bind-DocumentPaths="@this.loadedDocumentPaths"/>
+        <AttachDocuments Name="Document Analysis Files Drop" @bind-DocumentPaths="@this.loadedDocumentPaths"/>
     </ExpansionPanel>
 </MudExpansionPanels>

app/MindWork AI Studio/Components/AttachDocuments.razor

@@ -1,15 +1,15 @@
 @inherits MSGComponentBase
 
-<MudLink OnClick="@(() => this.AddFilesManually())" Style="text-decoration: none;">
+<div @onmouseenter="@this.OnMouseEnter" @onmouseleave="@this.OnMouseLeave">
-    <MudPaper Height="20em"
+    <MudLink OnClick="@(() => this.AddFilesManually())" Style="text-decoration: none;">
-              Outlined="true"
+        <MudPaper Height="20em" Outlined="true" Class="@this.dragClass" Style="overflow-y: auto;">
-              Class="@this.dragClass">
+            <MudText Typo="Typo.h6">
-        <MudText Typo="Typo.h6">
+                @T("Drag and drop files here or click to attach documents.")
-            Drag and drop files here or click to attach documents.
+            </MudText>
-        </MudText>
+            @foreach (var fileInfo in this.DocumentPaths.Select(file => new FileInfo(file)))
-        @foreach (var fileInfo in this.DocumentPaths.Select(file => new FileInfo(file)))
+            {
-        {
+                <MudChip T="string" Color="Color.Dark" Text="@fileInfo.Name" tabindex="-1" />
-            <MudChip T="string" Color="Color.Dark" Text="@fileInfo.Name" tabindex="-1" />
+            }
-        }
+        </MudPaper>
-    </MudPaper>
+    </MudLink>
-</MudLink>
+</div>

app/MindWork AI Studio/Components/AttachDocuments.razor.cs

@@ -7,6 +7,9 @@ namespace AIStudio.Components;
 
 public partial class AttachDocuments : MSGComponentBase
 {
+    [Parameter]
+    public string Name { get; set; } = string.Empty;
+    
     [Parameter]
     public HashSet<string> DocumentPaths { get; set; } = [];
     
@@ -16,6 +19,9 @@ public partial class AttachDocuments : MSGComponentBase
     [Parameter]
     public Func<HashSet<string>, Task> OnChange { get; set; } = _ => Task.CompletedTask;
     
+    [Inject]
+    private ILogger<AttachDocuments> Logger { get; set; } = null!;
+    
     [Inject]
     private RustService RustService { get; init; } = null!;
     
@@ -32,19 +38,29 @@ public partial class AttachDocuments : MSGComponentBase
         switch (triggeredEvent)
         {
             case Event.TAURI_EVENT_RECEIVED when data is TauriEvent { EventType: TauriEventType.FILE_DROP_HOVERED }:
+                if(!this.isComponentHovered)
+                {
+                    this.Logger.LogDebug("Attach documents component '{Name}' is not hovered, ignoring file drop hovered event.", this.Name);
+                    return;
+                }
+                
                 this.SetDragClass();
+                this.StateHasChanged();
                 break;
             
             case Event.TAURI_EVENT_RECEIVED when data is TauriEvent { EventType: TauriEventType.FILE_DROP_DROPPED, Payload: var paths }:
-                this.ClearDragClass();
+                if(!this.isComponentHovered)
+                {
+                    this.Logger.LogDebug("Attach documents component '{Name}' is not hovered, ignoring file drop dropped event.", this.Name);
+                    return;
+                }
+                
+                #warning Filter unsupported files
                 foreach (var path in paths)
                     this.DocumentPaths.Add(path);
                 await this.DocumentPathsChanged.InvokeAsync(this.DocumentPaths);
                 await this.OnChange(this.DocumentPaths);
-                break;
+                this.StateHasChanged();
-            
-            case Event.TAURI_EVENT_RECEIVED when data is TauriEvent { EventType: TauriEventType.FILE_DROP_CANCELED }:
-                this.ClearDragClass();
                 break;
         }
     }
@@ -55,6 +71,8 @@ public partial class AttachDocuments : MSGComponentBase
     
     private string dragClass = DEFAULT_DRAG_CLASS;
     
+    private bool isComponentHovered;
+
     private async Task AddFilesManually()
     {
         var selectedFile = await this.RustService.SelectFile(T("Select a file to attach"));
@@ -82,7 +100,23 @@ public partial class AttachDocuments : MSGComponentBase
         await this.OnChange(this.DocumentPaths);
     }
 
-    private void SetDragClass() => this.dragClass = $"{DEFAULT_DRAG_CLASS} mud-border-primary";
+    private void SetDragClass() => this.dragClass = $"{DEFAULT_DRAG_CLASS} mud-border-primary border-4";
     
     private void ClearDragClass() => this.dragClass = DEFAULT_DRAG_CLASS;
+    
+    private void OnMouseEnter(EventArgs _)
+    {
+        this.Logger.LogDebug("Attach documents component '{Name}' is hovered.", this.Name);
+        this.isComponentHovered = true;
+        this.SetDragClass();
+        this.StateHasChanged();
+    }
+    
+    private void OnMouseLeave(EventArgs _)
+    {
+        this.Logger.LogDebug("Attach documents component '{Name}' is no longer hovered.", this.Name);
+        this.isComponentHovered = false;
+        this.ClearDragClass();
+        this.StateHasChanged();
+    }
 }

app/MindWork AI Studio/Tools/EventHandlers.cs

@@ -0,0 +1,14 @@
+using Microsoft.AspNetCore.Components;
+
+namespace AIStudio.Tools;
+
+/// <summary>
+/// Add handling for more DOM events to Blazor components.
+/// </summary>
+/// <remarks>
+/// See https://learn.microsoft.com/en-us/aspnet/core/blazor/components/event-handling. It is important
+/// that this class is named EventHandlers.
+/// </remarks>
+[EventHandler("onmouseenter", typeof(EventArgs), enableStopPropagation: true, enablePreventDefault: true)]
+[EventHandler("onmouseleave", typeof(EventArgs), enableStopPropagation: true, enablePreventDefault: true)]
+public static class EventHandlers;