Add email preview and search term highlighting

Author: Knabbermann

NetMailArchiver.Web/Pages/Archive/Index.cshtml

@@ -105,7 +105,10 @@
                             ? '<i class="fas fa-flag text-danger"></i>' 
                             : '<i class="far fa-flag text-muted"></i>';
 
-                        $tableBody.append('<tr><td>' + email.date + '</td><td>' + email.from + '</td><td>' + email.subject + '</td>' +
+                        const subjectWithPreview = email.subject + 
+                            (email.preview ? '<br><small class="text-muted">' + email.preview + '</small>' : '');
+
+                        $tableBody.append('<tr><td>' + email.date + '</td><td>' + email.from + '</td><td>' + subjectWithPreview + '</td>' +
                             '<td class="text-center">' +
                             '<button class="btn btn-sm btn-link p-1 toggleFavorite" data-email-id="' + email.id + '" title="Favorite">' + favoriteIcon + '</button>' +
                             '<button class="btn btn-sm btn-link p-1 toggleFollowUp" data-email-id="' + email.id + '" title="Follow Up">' + followUpIcon + '</button>' +

NetMailArchiver.Web/Pages/Archive/Index.cshtml.cs

@@ -4,6 +4,7 @@
 using NetMailArchiver.Models;
 using NToastNotify;
 using System.IO.Compression;
+using System.Text.RegularExpressions;
 
 namespace NetMailArchiver.Web.Pages.Archive
 {
@@ -37,6 +38,7 @@ public JsonResult OnGetMails([FromQuery] Guid ImapId, [FromQuery] int page, [Fro
 
                 if (searchBody)
                 {
+                    // First, do a broad database search (includes HTML)
                     emailsQuery = emailsQuery.Where(e => 
                         (e.Subject != null && e.Subject.ToLower().Contains(searchLower)) || 
                         (e.From != null && e.From.ToLower().Contains(searchLower)) || 
@@ -50,25 +52,75 @@ public JsonResult OnGetMails([FromQuery] Guid ImapId, [FromQuery] int page, [Fro
                 }
             }
 
-            var emails = emailsQuery
-                .OrderByDescending(x => x.Date)
-                .Skip((page - 1) * pageSize)
-                .Take(pageSize)
-                .Select(x => new
+            List<dynamic> emails;
+            int fetchMultiplier = 1;
+            int maxAttempts = 5;
+
+            // Keep fetching until we have enough results after filtering
+            do
+            {
+                var fetchSize = pageSize * fetchMultiplier;
+                var skipSize = (page - 1) * pageSize;
+
+                emails = emailsQuery
+                    .OrderByDescending(x => x.Date)
+                    .Skip(skipSize)
+                    .Take(fetchSize)
+                    .Select(x => new
+                    {
+                        x.Id,
+                        Date = x.Date.ToString("yyyy-MM-dd HH:mm"),
+                        x.From,
+                        x.Subject,
+                        x.IsFavorite,
+                        x.IsFollowUp,
+                        x.HtmlBody,
+                        Attachments = x.Attachments.Select(a => new { a.Id})
+                    })
+                    .ToList<dynamic>();
+
+                // If searching in body, filter out results where the search term is only in HTML tags/CSS
+                if (!string.IsNullOrEmpty(searchQuery) && searchBody)
                 {
-                    x.Id,
-                    Date = x.Date.ToString("yyyy-MM-dd HH:mm"),
-                    x.From,
-                    x.Subject,
-                    x.IsFavorite,
-                    x.IsFollowUp,
-                    Attachments = x.Attachments.Select(a => new { a.Id})
-                }).ToList();
+                    var searchLower = searchQuery.ToLower();
+                    emails = emails.Where(x => 
+                    {
+                        // Check if term is in subject or from
+                        if ((x.Subject != null && x.Subject.ToLower().Contains(searchLower)) ||
+                            (x.From != null && x.From.ToLower().Contains(searchLower)))
+                        {
+                            return true;
+                        }
+
+                        // Check if term is in cleaned body text (not just in HTML tags)
+                        var cleanedBody = CleanHtml(x.HtmlBody);
+                        return cleanedBody.ToLower().Contains(searchLower);
+                    }).ToList();
+                }
+
+                fetchMultiplier++;
+
+            } while (emails.Count < pageSize && emails.Count < emailsQuery.Count() && fetchMultiplier <= maxAttempts);
+
+            // Take only the requested page size
+            emails = emails.Take(pageSize).ToList();
+
+            var emailsWithPreview = emails.Select(x => new
+            {
+                x.Id,
+                x.Date,
+                x.From,
+                Subject = !string.IsNullOrWhiteSpace(searchQuery) ? HighlightSearchTerm(x.Subject, searchQuery) : x.Subject,
+                x.IsFavorite,
+                x.IsFollowUp,
+                Preview = GetSearchPreview(x.HtmlBody, searchQuery, searchBody, 150),
+                x.Attachments
+            }).ToList();
 
             var totalEmails = emailsQuery.Count();
             var hasMorePages = (page * pageSize) < totalEmails;
 
-            return new JsonResult(new { emails, hasMorePages });
+            return new JsonResult(new { emails = emailsWithPreview, hasMorePages });
         }
 
         public IActionResult OnGetOpenEmail(Guid emailId)
@@ -176,6 +228,149 @@ public JsonResult OnPostToggleFollowUp([FromBody] ToggleRequest request)
             return new JsonResult(new { isFollowUp = false });
         }
 
+        private string GetTextPreview(string? htmlBody, int maxLength = 100)
+        {
+            if (string.IsNullOrWhiteSpace(htmlBody))
+                return string.Empty;
+
+            var text = htmlBody;
+
+            // Remove script tags and their content
+            text = Regex.Replace(text, @"<script[^>]*>[\s\S]*?</script>", string.Empty, RegexOptions.IgnoreCase);
+
+            // Remove style tags and their content
+            text = Regex.Replace(text, @"<style[^>]*>[\s\S]*?</style>", string.Empty, RegexOptions.IgnoreCase);
+
+            // Remove head tag and its content
+            text = Regex.Replace(text, @"<head[^>]*>[\s\S]*?</head>", string.Empty, RegexOptions.IgnoreCase);
+
+            // Remove HTML comments
+            text = Regex.Replace(text, @"<!--[\s\S]*?-->", string.Empty);
+
+            // Remove all HTML tags
+            text = Regex.Replace(text, @"<[^>]+>", string.Empty);
+
+            // Decode HTML entities
+            text = System.Net.WebUtility.HtmlDecode(text);
+
+            // Remove extra whitespace and newlines
+            text = Regex.Replace(text, @"\s+", " ").Trim();
+
+            // Truncate to maxLength
+            if (text.Length > maxLength)
+            {
+                text = text.Substring(0, maxLength) + "...";
+            }
+
+            return text;
+        }
+
+        private string GetSearchPreview(string? htmlBody, string? searchQuery, bool searchBody, int maxLength = 150)
+        {
+            if (string.IsNullOrWhiteSpace(htmlBody))
+                return string.Empty;
+
+            // Clean HTML to get plain text
+            var text = CleanHtml(htmlBody);
+
+            // If no search query, return normal preview
+            if (string.IsNullOrWhiteSpace(searchQuery))
+            {
+                return TruncateText(text, maxLength);
+            }
+
+            // If searching in body, find and show context around the search term
+            if (searchBody)
+            {
+                var index = text.IndexOf(searchQuery, StringComparison.OrdinalIgnoreCase);
+
+                if (index != -1)
+                {
+                    // Calculate context around the found term
+                    var contextBefore = 60;
+                    var contextAfter = 60;
+
+                    var start = Math.Max(0, index - contextBefore);
+                    var end = Math.Min(text.Length, index + searchQuery.Length + contextAfter);
+                    var length = end - start;
+
+                    var preview = text.Substring(start, length);
+
+                    // Add ellipsis if we're not at the start/end
+                    if (start > 0) preview = "..." + preview;
+                    if (end < text.Length) preview = preview + "...";
+
+                    // Highlight the search term
+                    preview = HighlightSearchTerm(preview, searchQuery);
+
+                    return preview;
+                }
+            }
+
+            // If not searching in body or term not found, return normal preview with highlighting
+            var normalPreview = TruncateText(text, maxLength);
+
+            // Still highlight the search term if it appears in the preview
+            return HighlightSearchTerm(normalPreview, searchQuery);
+        }
+
+        private string CleanHtml(string? htmlBody)
+        {
+            if (string.IsNullOrWhiteSpace(htmlBody))
+                return string.Empty;
+
+            var text = htmlBody;
+
+            // Remove script tags and their content
+            text = Regex.Replace(text, @"<script[^>]*>[\s\S]*?</script>", string.Empty, RegexOptions.IgnoreCase);
+
+            // Remove style tags and their content
+            text = Regex.Replace(text, @"<style[^>]*>[\s\S]*?</style>", string.Empty, RegexOptions.IgnoreCase);
+
+            // Remove head tag and its content
+            text = Regex.Replace(text, @"<head[^>]*>[\s\S]*?</head>", string.Empty, RegexOptions.IgnoreCase);
+
+            // Remove HTML comments
+            text = Regex.Replace(text, @"<!--[\s\S]*?-->", string.Empty);
+
+            // Remove all HTML tags
+            text = Regex.Replace(text, @"<[^>]+>", string.Empty);
+
+            // Decode HTML entities
+            text = System.Net.WebUtility.HtmlDecode(text);
+
+            // Remove extra whitespace and newlines
+            text = Regex.Replace(text, @"\s+", " ").Trim();
+
+            return text;
+        }
+
+        private string TruncateText(string text, int maxLength)
+        {
+            if (text.Length > maxLength)
+            {
+                return text.Substring(0, maxLength) + "...";
+            }
+            return text;
+        }
+
+        private string HighlightSearchTerm(string? text, string? searchQuery)
+        {
+            if (string.IsNullOrWhiteSpace(text) || string.IsNullOrWhiteSpace(searchQuery))
+                return text ?? string.Empty;
+
+            // Use regex for case-insensitive replacement and preserve original case
+            var pattern = Regex.Escape(searchQuery);
+            var highlighted = Regex.Replace(
+                text, 
+                pattern, 
+                match => $"<mark class='search-highlight'>{match.Value}</mark>", 
+                RegexOptions.IgnoreCase
+            );
+
+            return highlighted;
+        }
+
         public class ToggleRequest
         {
             public Guid EmailId { get; set; }

NetMailArchiver.Web/wwwroot/css/site.css

@@ -259,6 +259,16 @@ h1, h2, h3, h4, h5, h6 {
   filter: invert(1);
 }
 
+/* Search highlighting */
+.search-highlight {
+  background-color: #fff3cd;
+  color: #856404;
+  padding: 2px 4px;
+  border-radius: 3px;
+  font-weight: 600;
+  box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.3);
+}
+
 /* Accessibility improvements */
 @media (prefers-reduced-motion: reduce) {
   *,