diff --git a/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoEntry.cs b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoEntry.cs new file mode 100644 index 0000000000..3375fea2b0 --- /dev/null +++ b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoEntry.cs @@ -0,0 +1,144 @@ +using System.Collections.Immutable; +using MeshWeaver.Todo.Domain; + +namespace MeshWeaver.Todo.LayoutAreas; + +/// +/// One row of a Todo view's bound list — the PROJECTION every Todo area feeds into its template +/// (Doc/GUI/DataBinding → "Templates first, data later"). A row is either a heading line (a section +/// title, a summary line, an empty state), optionally with a group action, or a todo item with its +/// per-item actions; the parts a row does not have are hidden by their bound style, so the template's +/// shape never depends on data. +/// +/// Its actions are ROW-SCOPED (Doc/GUI/DataBinding → "Row-scoped actions"): the template's +/// buttons exist once, and each click reads the row it was raised from with +/// ctx.RowAs<TodoEntry>() — the row as the person saw it. A group action therefore acts +/// on exactly as it was rendered, and an item action on . +/// +public record TodoEntry +{ + /// A key unique within the list (diagnostics and test identity). + public string Key { get; init; } = string.Empty; + + /// Markdown for the heading part; empty for an item row. + public string Heading { get; init; } = string.Empty; + + /// The heading part's style — on an item row. + public string HeadingStyle { get; init; } = TodoStyles.Hidden; + + /// The group action's label. + public string GroupTitle { get; init; } = string.Empty; + + /// The group action's icon. + public string GroupIcon { get; init; } = string.Empty; + + /// The group action's style — hidden when the row has no group action. + public string GroupStyle { get; init; } = TodoStyles.Hidden; + + /// What the group action does — a value. + public string GroupAction { get; init; } = string.Empty; + + /// The todos the group action acts on, as rendered. + public ImmutableList Group { get; init; } = []; + + /// The person a assigns to. + public string? Person { get; init; } + + /// The todo of an item row, as rendered; null on a heading row. + public TodoItem? Item { get; init; } + + /// The item card's style — on a heading row. + public string ItemStyle { get; init; } = TodoStyles.Hidden; + + /// The status glyph shown on the card. + public string Icon { get; init; } = string.Empty; + + /// The card's markdown (title, category, responsible person, due date, description). + public string Content { get; init; } = string.Empty; + + /// The item action menu's style — hidden on heading rows and on assignment rows. + public string ActionsStyle { get; init; } = TodoStyles.Hidden; + + /// The primary action's label (depends on the item's status). + public string PrimaryTitle { get; init; } = string.Empty; + + /// The primary action's icon. + public string PrimaryIcon { get; init; } = string.Empty; + + /// Style of the "Complete" secondary action (shown while pending). + public string CompleteStyle { get; init; } = TodoStyles.Hidden; + + /// Style of the "Cancel" secondary action (shown while pending or in progress). + public string CancelStyle { get; init; } = TodoStyles.Hidden; + + /// Style of the "Pause" secondary action (shown while in progress). + public string PauseStyle { get; init; } = TodoStyles.Hidden; + + /// Style of the "Send Reminder" secondary action (shown while overdue and open). + public string ReminderStyle { get; init; } = TodoStyles.Hidden; + + /// The assignment menu's style — shown on rows that offer assignment instead of actions. + public string AssignStyle { get; init; } = TodoStyles.Hidden; +} + +/// +/// What a heading row's group action does. An OPEN set of string constants +/// (Doc/Architecture/OpenVocabulariesAsStringConstants): an unknown value is logged, never defaulted. +/// +public static class TodoGroupActions +{ + /// Moves the group to In Progress. + public const string Start = "start"; + + /// Moves the group to Completed. + public const string Complete = "complete"; + + /// Deletes the group (archive / delete). + public const string Delete = "delete"; + + /// Assigns the group round-robin over the team. + public const string AutoAssign = "autoAssign"; + + /// Assigns the group's first todo to . + public const string AssignFirst = "assignFirst"; +} + +/// The inline styles the Todo template binds — a part is shown with its style, or hidden. +public static class TodoStyles +{ + /// Hides a part the row does not have. + public const string Hidden = "display: none;"; + + /// A menu button aligned to the right of its grid cell. + public const string Menu = "display: flex; align-items: center; justify-content: flex-end; height: 100%; padding-top: 20px;"; + + /// A secondary menu entry that is offered. + public const string Shown = ""; + + /// The todo card. + public const string Card = "display: flex; flex-direction: row; align-items: flex-start; gap: 12px; padding: 12px; margin-bottom: 8px; " + + "border: 1px solid var(--color-border-default); border-radius: 6px; background-color: var(--color-canvas-subtle); " + + "box-shadow: 0 1px 2px var(--color-shadow-small);"; + + /// A todo card indented under its section. + public const string IndentedCard = Card + " margin-left: 10px;"; + + /// A compact one-line todo (the planning backlog). + public const string Line = "padding-left: 20px; margin-bottom: 5px;"; + + /// The cell holding a row's action menu. + public const string Actions = "display: flex; justify-content: center; align-items: center; padding: 12px; margin-bottom: 8px;"; + + /// A section heading in . + public static string Heading(string color, string marginTop = "16px") + => $"margin-top: {marginTop}; margin-bottom: 6px; color: {color};"; + + /// An indented statistics line. + public const string Stat = "padding-left: 20px; margin-bottom: 5px;"; + + /// A muted hint. + public const string Muted = "color: var(--color-fg-muted);"; + + /// A centred "all caught up" message. + public const string Success = "color: var(--color-success-fg); text-align: center; margin-top: 40px;"; +} diff --git a/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs index bdb922529b..cee365cebb 100644 --- a/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs +++ b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs @@ -1,1774 +1,252 @@ -using System.ComponentModel.DataAnnotations; +using System.Collections.Immutable; +using System.ComponentModel.DataAnnotations; +using System.Globalization; using System.Reactive.Linq; -using System.Text; using MeshWeaver.Data; using MeshWeaver.Layout; using MeshWeaver.Layout.Composition; -using MeshWeaver.ShortGuid; using MeshWeaver.Todo.Domain; namespace MeshWeaver.Todo.LayoutAreas; /// -/// Layout areas for the Todo application +/// Layout areas for the Todo application. +/// +/// Every area is a TEMPLATE (Doc/GUI/DataBinding → "Templates first, data later"): it returns +/// its whole control tree on the first render — a title, the "Add New Todo" action, and ONE bound +/// list — and the todos arrive later, as rows () a pure projection computes +/// from the data source. Nothing on the hub waits for the todos before the page renders. +/// +/// Each row's buttons are declared once in the row template and are ROW-SCOPED +/// (Doc/GUI/DataBinding → "Row-scoped actions"): a click carries the row it was raised from, so +/// clicking "Start" in row k starts the todo shown in row k — also after the list has changed +/// underneath (). /// public static class TodoLayoutAreas { + /// The data id of every Todo area's bound row list. + public const string EntriesId = "todoEntries"; + /// - /// Creates a AllItems layout area that subscribes to a stream of todo items - /// and displays them in an interactive format with action buttons + /// All todos, grouped by status, with per-item and per-group actions. /// /// The layout area host /// The rendering context - /// An observable UI control that updates when todo items change + /// The area's template; its rows bind to the live todo list. [Display(GroupName = "2. Team Overview", Order = 2)] - public static IObservable AllItems(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - // Subscribe to the stream of TodoItem entities from the data source - return host.Workspace - .GetStream()! - .Select(todoItems => CreateInteractiveTodoListStack(todoItems!, host)) - .StartWith(Controls.Markdown("# Todo List\n\n*Loading todo items...*")); - } + public static UiControl AllItems(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.allItems.title"), Typography.H4, withAdd: true, + Feed(host, TodoProjections.AllItems)); /// - /// Creates a TodosByCategory layout area that groups todos by category with interactive controls + /// Todos grouped by category, with category-level and item-level actions. /// /// The layout area host /// The rendering context - /// An observable UI control showing todos grouped by category with action buttons + /// The area's template; its rows bind to the live todo list. [Display(GroupName = "2. Team Overview", Order = 3)] - public static IObservable TodosByCategory(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - return host.Workspace - .GetStream()! - .Select(todoItems => CreateInteractiveTodosByCategory(todoItems!, host)) - .StartWith(Controls.Markdown("# 📂 Todos by Category\n\n*Loading todo items...*")); - } + public static UiControl TodosByCategory(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.byCategory.title"), Typography.H2, withAdd: true, + Feed(host, TodoProjections.ByCategory)); /// - /// Creates a Summary layout area that shows interactive summary statistics with action buttons + /// Summary statistics. /// /// The layout area host /// The rendering context - /// An observable UI control showing interactive todo summary statistics + /// The area's template; its lines bind to the live todo list. [Display(GroupName = "2. Team Overview", Order = 1)] - public static IObservable Summary(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - return host.Workspace - .GetStream()! - .Select(todoItems => CreateInteractiveTodoSummary(todoItems!, host)) - .StartWith(Controls.Markdown("# 📊 Todo Summary\n\n*Loading todo statistics...*")); - } + public static UiControl Summary(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.summary.title"), Typography.H4, withAdd: false, + Feed(host, TodoProjections.Summary)); /// - /// Creates a Planning View for task assignment and workload management + /// Team workload and task assignment. /// /// The layout area host /// The rendering context - /// An observable UI control showing team workload and assignment interface + /// The area's template; its rows bind to the live todo list. [Display(GroupName = "3. Planning")] - public static IObservable Planning(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - return host.Workspace - .GetStream()! - .Select(todoItems => CreatePlanningView(todoItems!, host)) - .StartWith(Controls.Markdown("# 🎯 Planning & Assignment\n\n*Loading team workload...*")); - } + public static UiControl Planning(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.planning.title"), Typography.H2, withAdd: true, + Feed(host, TodoProjections.Planning)); /// - /// Creates a view showing only the current user's active tasks + /// The current user's active tasks, by urgency. /// /// The layout area host /// The rendering context - /// An observable UI control showing current user's active tasks + /// The area's template; its rows bind to the live todo list. [Display(GroupName = "1. My Overview")] - public static IObservable MyTasks(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - return host.Workspace - .GetStream()! - .Select(todoItems => CreateMyActiveTasks(todoItems!, host)) - .StartWith(Controls.Markdown("# 🟢 My Active Tasks\n\n*Loading your tasks...*")); - } + public static UiControl MyTasks(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.myTasks.title", ResponsiblePersons.GetCurrentUser()), Typography.H2, withAdd: true, + Feed(host, TodoProjections.MyTasks)); /// - /// Creates a view showing all unassigned tasks + /// Open tasks nobody is assigned to. /// /// The layout area host /// The rendering context - /// An observable UI control showing unassigned tasks + /// The area's template; its rows bind to the live todo list. [Display(GroupName = "3. Planning")] - public static IObservable Backlog(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - return host.Workspace - .GetStream()! - .Select(todoItems => CreateUnassignedTasks(todoItems!, host)) - .StartWith(Controls.Markdown("# 📋 Unassigned Tasks\n\n*Loading unassigned tasks...*")); - } + public static UiControl Backlog(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.backlog.title"), Typography.H2, withAdd: true, + Feed(host, TodoProjections.Backlog)); /// - /// Creates a Today's Focus view showing all items due today + /// Overdue, due-today and ongoing work. /// /// The layout area host /// The rendering context - /// An observable UI control showing today's focus items + /// The area's template; its rows bind to the live todo list. [Display(GroupName = "2. Team Overview", Order = 0)] - public static IObservable TodaysFocus(LayoutAreaHost host, RenderingContext context) - { - _ = context; // Unused parameter but required by interface - return host.Workspace - .GetStream()! - .Select(todoItems => CreateTodaysFocus(todoItems!, host)) - .StartWith(Controls.Markdown("# 🎯 Today's Focus\n\n*Loading today's priorities...*")); - } - - /// - /// Creates clean summary statistics without dummy buttons - /// - /// The collection of todo items - /// The layout area host (unused parameter) - /// A clean LayoutGrid control with summary statistics only - private static UiControl? CreateInteractiveTodoSummary(IReadOnlyCollection todoItems, LayoutAreaHost _) - { - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // Simple header - mainGrid = mainGrid - .WithView(Controls.H4("📊 Todo Dashboard") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12)); - - if (!todoItems.Any()) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("*No todo items found.*") - .WithStyle(style => style.WithColor("var(--color-fg-muted)")), - skin => skin.WithXs(12)); - return mainGrid; - } - - // Overall statistics - var totalCount = todoItems.Count; - mainGrid = mainGrid - .WithView(Controls.Markdown($"**Total Items:** {totalCount}") - .WithStyle(style => style.WithMarginTop("20px").WithMarginBottom("8px")), - skin => skin.WithXs(12)); - - // Status breakdown - mainGrid = mainGrid - .WithView(Controls.H5("📈 Status Overview") - .WithStyle(style => style.WithMarginTop("12px").WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12)); - - var statusGroups = todoItems.GroupBy(t => t.Status); - foreach (var group in statusGroups.OrderBy(g => (int)g.Key)) - { - var statusIcon = GetStatusIcon(group.Key); - var percentage = (group.Count() * 100.0 / totalCount).ToString("F1"); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"{statusIcon} **{group.Key}**: {group.Count()} ({percentage}%)") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - } - - // Due date analysis - var now = DateTime.Now.Date; - var overdue = todoItems.Where(t => t.DueDate.HasValue && t.DueDate.Value.Date < now && t.Status != TodoStatus.Completed).ToList(); - var dueToday = todoItems.Where(t => t.DueDate.HasValue && t.DueDate.Value.Date == now && t.Status != TodoStatus.Completed).ToList(); - var dueSoon = todoItems.Where(t => t.DueDate.HasValue && t.DueDate.Value.Date > now && t.DueDate.Value.Date <= now.AddDays(7) && t.Status != TodoStatus.Completed).ToList(); - - mainGrid = mainGrid - .WithView(Controls.H5("⏰ Due Date Insights") - .WithStyle(style => style.WithMarginTop("16px").WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12)); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"🚨 **Overdue**: {overdue.Count}") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"⏰ **Due Today**: {dueToday.Count}") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"📅 **Due This Week**: {dueSoon.Count}") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - - // Responsible person breakdown - var currentUser = ResponsiblePersons.GetCurrentUser(); - var myTodos = todoItems.Where(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson)).ToList(); - var otherTodos = todoItems.Where(t => !ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson)).ToList(); - - var unassignedTodos = todoItems.Where(t => t.ResponsiblePerson == "Unassigned").ToList(); - - mainGrid = mainGrid - .WithView(Controls.H5("🟢 Responsibility Overview") - .WithStyle(style => style.WithMarginTop("16px").WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12)); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"🟢 **My Tasks ({currentUser})**: {myTodos.Count}") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"🫂 **Others' Tasks**: {otherTodos.Count}") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"📋 **Unassigned Tasks**: {unassignedTodos.Count}") - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12)); - - return mainGrid; - } - - /// - /// Creates summary statistics for todo items in markdown format (legacy method) - /// - /// The collection of todo items - /// A markdown control with summary statistics - private static UiControl? CreateTodoSummaryMarkdown(IReadOnlyCollection todoItems) - { - var sb = new StringBuilder(); - sb.AppendLine("# 📊 Todo Summary"); - sb.AppendLine(); - - if (!todoItems.Any()) - { - sb.AppendLine("*No todo items found.*"); - return Controls.Markdown(sb.ToString()); - } - - // Overall statistics - sb.AppendLine($"**Total Items:** {todoItems.Count}"); - sb.AppendLine(); - - // Status breakdown - sb.AppendLine("## Status Breakdown"); - var statusGroups = todoItems.GroupBy(t => t.Status); - foreach (var group in statusGroups.OrderBy(g => (int)g.Key)) - { - var statusIcon = GetStatusIcon(group.Key); - var percentage = (group.Count() * 100.0 / todoItems.Count).ToString("F1"); - sb.AppendLine($"- {statusIcon} **{group.Key}**: {group.Count()} ({percentage}%)"); - } - sb.AppendLine(); - - // Category breakdown - sb.AppendLine("## Category Breakdown"); - var categoryGroups = todoItems.GroupBy(t => string.IsNullOrEmpty(t.Category) ? "Uncategorized" : t.Category); - foreach (var group in categoryGroups.OrderByDescending(g => g.Count())) - { - sb.AppendLine($"- **{group.Key}**: {group.Count()}"); - } - sb.AppendLine(); - - // Due date analysis - var now = DateTime.Now.Date; - var overdue = todoItems.Count(t => t.DueDate.HasValue && t.DueDate.Value.Date < now && t.Status != TodoStatus.Completed); - var dueToday = todoItems.Count(t => t.DueDate.HasValue && t.DueDate.Value.Date == now && t.Status != TodoStatus.Completed); - var dueSoon = todoItems.Count(t => t.DueDate.HasValue && t.DueDate.Value.Date > now && t.DueDate.Value.Date <= now.AddDays(7) && t.Status != TodoStatus.Completed); - - sb.AppendLine("## Due Date Analysis"); - sb.AppendLine($"- 🚨 **Overdue**: {overdue}"); - sb.AppendLine($"- ⏰ **Due Today**: {dueToday}"); - sb.AppendLine($"- 📅 **Due This Week**: {dueSoon}"); - sb.AppendLine(); - - // Responsible person breakdown - sb.AppendLine("## Responsibility Breakdown"); - var currentUser = ResponsiblePersons.GetCurrentUser(); - var myTodos = todoItems.Where(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson)).ToList(); - var otherTodos = todoItems.Where(t => !ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson)).ToList(); - - sb.AppendLine($"- 🟢 **My Tasks ({currentUser})**: {myTodos.Count}"); - sb.AppendLine($"- 🫂 **Others' Tasks**: {otherTodos.Count}"); - - // Show top responsible persons - var personGroups = todoItems.GroupBy(t => t.ResponsiblePerson) - .OrderByDescending(g => g.Count()) - .Take(5); - - sb.AppendLine(); - sb.AppendLine("## Top Contributors"); - foreach (var group in personGroups) - { - var indicator = ResponsiblePersons.GetCurrentUserIndicator(group.Key); - sb.AppendLine($"- {indicator}**{group.Key}**: {group.Count()}"); - } - - return Controls.Markdown(sb.ToString()); - } - - /// - /// Creates interactive todos grouped by category with category-level and item-level actions - /// - /// The collection of todo items - /// The layout area host for submitting changes - /// An interactive LayoutGrid control with categorized todos and actions - private static UiControl? CreateInteractiveTodosByCategory(IReadOnlyCollection todoItems, LayoutAreaHost host) - { - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // Header with title and global actions - mainGrid = mainGrid - .WithView(Controls.H2("📂 Todo Categories") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.MenuItem("➕ Add New Todo", "plus") - .WithClickAction(_ => { SubmitNewTodo(host); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - if (!todoItems.Any()) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("*No todo items found. Click 'Add New Todo' to get started!*") - .WithStyle(style => style.WithColor("var(--color-fg-muted)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.Html(""), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - return mainGrid; - } - - var categoryGroups = todoItems - .GroupBy(t => string.IsNullOrEmpty(t.Category) ? "Uncategorized" : t.Category) - .OrderBy(g => g.Key); - - foreach (var categoryGroup in categoryGroups) - { - var categoryTodos = categoryGroup.ToList(); - var completedCount = categoryTodos.Count(t => t.Status == TodoStatus.Completed); - var pendingCount = categoryTodos.Count(t => t.Status == TodoStatus.Pending); - var inProgressCount = categoryTodos.Count(t => t.Status == TodoStatus.InProgress); - - // Category header with actions - var categoryActionButton = CreateCategoryActionButton(categoryTodos, host); - - mainGrid = mainGrid - .WithView(Controls.H5($"📁 {categoryGroup.Key} ({categoryGroup.Count()}) - {completedCount}✅ {inProgressCount}🔄 {pendingCount}⏳") - .WithStyle(style => style.WithMarginTop("16px").WithMarginBottom("8px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(categoryActionButton, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - // Group todos by status within this category for better organization - var statusGroups = categoryTodos.GroupBy(t => t.Status).OrderBy(g => (int)g.Key); - - foreach (var statusGroup in statusGroups) - { - var sortedTodos = statusGroup - .OrderBy(t => t.DueDate ?? DateTime.MaxValue) - .ThenBy(t => t.CreatedAt); - - foreach (var todo in sortedTodos) - { - var (todoContent, todoActions) = CreateTodoItemContentAndActions(todo, host); - - mainGrid = mainGrid - .WithView(todoContent, - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(todoActions, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - } - } - - return mainGrid; - } - - /// - /// Creates todos grouped by category in markdown format (legacy method) - /// - /// The collection of todo items - /// A markdown control with todos grouped by category - private static UiControl? CreateTodosByCategoryMarkdown(IReadOnlyCollection todoItems) - { - var sb = new StringBuilder(); - sb.AppendLine("# 📂 Todos by Category"); - sb.AppendLine(); - - if (!todoItems.Any()) - { - sb.AppendLine("*No todo items found.*"); - return Controls.Markdown(sb.ToString()); - } - - var categoryGroups = todoItems - .GroupBy(t => string.IsNullOrEmpty(t.Category) ? "Uncategorized" : t.Category) - .OrderBy(g => g.Key); - - foreach (var categoryGroup in categoryGroups) - { - sb.AppendLine($"## {categoryGroup.Key} ({categoryGroup.Count()})"); - sb.AppendLine(); - - var sortedTodos = categoryGroup - .OrderBy(t => t.DueDate ?? DateTime.MaxValue) - .ThenBy(t => t.CreatedAt); - - foreach (var todo in sortedTodos) - { - sb.AppendLine(FormatTodoItem(todo)); - sb.AppendLine(); - } - } - - return Controls.Markdown(sb.ToString()); - } - - /// - /// Formats a single todo item for markdown display - /// - /// The todo item to format - /// Formatted markdown string for the todo item - private static string FormatTodoItem(TodoItem todo) - { - var sb = new StringBuilder(); - - var statusIcon = GetStatusIcon(todo.Status); - sb.AppendLine($"### {statusIcon} {todo.Title}"); - - if (!string.IsNullOrEmpty(todo.Description)) - { - sb.AppendLine($"*{todo.Description}*"); - } - - sb.AppendLine($"**Status:** {todo.Status}"); - sb.AppendLine($"**Category:** {todo.Category}"); - - var currentUserIndicator = ResponsiblePersons.GetCurrentUserIndicator(todo.ResponsiblePerson); - sb.AppendLine($"**Responsible:** {currentUserIndicator}{todo.ResponsiblePerson}"); - - if (todo.DueDate.HasValue) - { - var dueDateStr = todo.DueDate.Value.ToString("yyyy-MM-dd"); - var isOverdue = todo.DueDate.Value.Date < DateTime.Now.Date && todo.Status != TodoStatus.Completed; - var isDueToday = todo.DueDate.Value.Date == DateTime.Now.Date && todo.Status != TodoStatus.Completed; - - if (isOverdue) - sb.AppendLine($"**Due Date:** 🚨 {dueDateStr} *(Overdue)*"); - else if (isDueToday) - sb.AppendLine($"**Due Date:** ⏰ {dueDateStr} *(Due Today)*"); - else - sb.AppendLine($"**Due Date:** {dueDateStr}"); - } - - sb.AppendLine($"**Created:** {todo.CreatedAt:yyyy-MM-dd HH:mm}"); - - if (todo.UpdatedAt != todo.CreatedAt) - { - sb.AppendLine($"**Updated:** {todo.UpdatedAt:yyyy-MM-dd HH:mm}"); - } - - return sb.ToString(); - } - - /// - /// Gets the appropriate icon for a todo status - /// - /// The todo status - /// An emoji icon representing the status - private static string GetStatusIcon(TodoStatus status) => status switch - { - TodoStatus.Pending => "⏳", - TodoStatus.InProgress => "🔄", - TodoStatus.Completed => "✅", - TodoStatus.Cancelled => "❌", - _ => "❓" - }; - - /// - /// Gets the appropriate color for a todo status - /// - /// The todo status - /// A CSS color variable for the status - private static string GetStatusColor(TodoStatus status) => status switch - { - TodoStatus.Pending => "var(--color-warning-fg)", - TodoStatus.InProgress => "var(--color-accent-fg)", - TodoStatus.Completed => "var(--color-success-fg)", - TodoStatus.Cancelled => "var(--color-danger-fg)", - _ => "var(--color-fg-default)" - }; - - /// - /// Creates an interactive todo list with a clean layout grid structure and vertically aligned action buttons - /// - /// The collection of todo items - /// The layout area host for submitting changes - /// A LayoutGrid control with structured todo items - private static UiControl? CreateInteractiveTodoListStack(IReadOnlyCollection todoItems, LayoutAreaHost host) - { - // Create main LayoutGrid with minimal spacing - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // First row: Title and Add New Todo button - smaller heading with reduced spacing - mainGrid = mainGrid - .WithView(Controls.H4("📝 Todo List with Actions") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.MenuItem("➕ Add New Todo", "plus") - .WithClickAction(_ => { SubmitNewTodo(host); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - if (!todoItems.Any()) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("*No todo items found. Click 'Add New Todo' to get started!*") - .WithStyle(style => style.WithColor("var(--color-fg-muted)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.Html(""), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - return mainGrid; - } - - // Order by due date (nulls last), then by created date - var orderedTodos = todoItems - .OrderBy(t => t.DueDate ?? DateTime.MaxValue) - .ThenBy(t => t.CreatedAt) - .ToList(); - - // Group by status for better organization, but separate unassigned tasks - var assignedTodos = orderedTodos.Where(t => t.ResponsiblePerson != "Unassigned").ToList(); - var unassignedTodos = orderedTodos.Where(t => t.ResponsiblePerson == "Unassigned").ToList(); - - var assignedStatusGroups = assignedTodos.GroupBy(t => t.Status).ToList(); - var unassignedStatusGroups = unassignedTodos.GroupBy(t => t.Status).ToList(); - - // First show assigned todos in collapsible status sections - foreach (var statusGroup in assignedStatusGroups.OrderBy(g => (int)g.Key)) - { - var statusIcon = GetStatusIcon(statusGroup.Key); - var statusName = statusGroup.Key.ToString(); - var statusColor = GetStatusColor(statusGroup.Key); - var defaultOpen = statusGroup.Key == TodoStatus.Pending || statusGroup.Key == TodoStatus.InProgress; - - // Create hierarchical action menu for status header - var statusActionButton = statusGroup.Key switch - { - TodoStatus.Pending => CreateStatusGroupMenuItem("▶️ Start All", "play", - (host, todos) => UpdateAllTodosInGroup(host, todos, TodoStatus.InProgress), - host, statusGroup), - TodoStatus.InProgress => CreateStatusGroupMenuItem("⏸️ Close All", "pause", - (host, todos) => UpdateAllTodosInGroup(host, todos, TodoStatus.Completed), - host, statusGroup), - TodoStatus.Completed => CreateStatusGroupMenuItem("📦 Archive All", "archive", - DeleteAllTodosInGroup, - host, statusGroup), - TodoStatus.Cancelled => CreateStatusGroupMenuItem("🗑️ Delete All", "trash", - DeleteAllTodosInGroup, - host, statusGroup), - _ => Controls.Html("") // Empty placeholder for other statuses - }; - - mainGrid = AddCollapsibleStatusSection(mainGrid, host, statusGroup.ToList(), - $"{statusIcon} {statusName}", statusColor, statusActionButton, defaultOpen); - } - - // Then show unassigned todos after all assigned todos - if (unassignedTodos.Any()) - { - foreach (var statusGroup in unassignedStatusGroups.OrderBy(g => (int)g.Key)) - { - var statusIcon = GetStatusIcon(statusGroup.Key); - var statusName = $"Unassigned {statusGroup.Key}"; - - // Create action button for unassigned group - focus on assignment - var assignmentActionButton = CreateStatusGroupMenuItem("👥 Auto-Assign All", "user-plus", - (host, todos) => AutoAssignTasks(host, todos.ToList()), - host, statusGroup); - - mainGrid = AddCollapsibleUnassignedSection(mainGrid, host, statusGroup.ToList(), - $"{statusIcon} {statusName}", "var(--color-warning-fg)", assignmentActionButton, true); - } - } - - return mainGrid; - } - - - private const string MenuWidth = "150px"; - /// - /// Creates hierarchical menu item action controls with primary action and expandable secondary actions - /// - /// The todo item - /// The layout area host for submitting changes - /// A hierarchical menu item control with actions - private static UiControl CreateActionControls(TodoItem todo, LayoutAreaHost host) - { - var primaryAction = GetPrimaryActionData(todo); - var menuItem = Controls.MenuItem(primaryAction.Title, primaryAction.Icon) - .WithClickAction(_ => { primaryAction.Action(host, todo); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - - // Add secondary actions as sub-views - var secondaryActions = GetSecondaryActionData(todo); - foreach (var action in secondaryActions) - { - var subMenuItem = Controls.MenuItem(action.Title, action.Icon) - .WithClickAction(_ => { action.Action(host, todo); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - menuItem = menuItem.WithView(subMenuItem); - } - - // Add overdue reminder button if task is overdue - if (todo.DueDate.HasValue && todo.DueDate.Value.Date < DateTime.Now.Date && - todo.Status != TodoStatus.Completed && todo.Status != TodoStatus.Cancelled) - { - var reminderButton = CreateOverdueReminderButton(todo, host); - menuItem = menuItem.WithView(reminderButton); - } - - return menuItem; - } - - - - /// - /// Updates the status of a todo item - /// - /// The layout area host - /// The todo item to update - /// The new status - private static void UpdateTodoStatus(LayoutAreaHost host, TodoItem todo, TodoStatus newStatus) - { - var updatedTodo = todo with - { - Status = newStatus, - UpdatedAt = DateTime.UtcNow - }; - SubmitTodoUpdate(host, updatedTodo); - } - - /// - /// Submits an update request for a todo item - /// - /// The layout area host - /// The updated todo item - private static void SubmitTodoUpdate(LayoutAreaHost host, TodoItem updatedTodo) - { - var changeRequest = new DataChangeRequest() - .WithUpdates(updatedTodo); - - host.Hub.Post(changeRequest, o => o.WithTarget(TodoApplicationAttribute.Address)); - } - - /// - /// Submits a delete request for a todo item - /// - /// The layout area host - /// The todo item to delete - private static void SubmitTodoDelete(LayoutAreaHost host, TodoItem todoToDelete) - { - var changeRequest = new DataChangeRequest() - .WithDeletions(todoToDelete); - - host.Hub.Post(changeRequest, o => o.WithTarget(TodoApplicationAttribute.Address)); - } - - /// - /// Submits a request to create a new todo item using a dialog - /// - /// The layout area host - private static void SubmitNewTodo(LayoutAreaHost host) - { - // Create a new empty todo item for editing - var newTodo = new TodoItem - { - Id = Guid.NewGuid().AsString(), - Title = "", - Description = "", - Status = TodoStatus.Pending, - Category = "General", - ResponsiblePerson = ResponsiblePersons.GetCurrentUser(), // Default to current user - DueDate = DateTime.Now.AddDays(7), - CreatedAt = DateTime.UtcNow, - UpdatedAt = DateTime.UtcNow - }; - - // Define the area ID for the new todo data - const string newTodoDataId = "NewTodoData"; - - // Create an edit form for the new todo item with proper data binding - var editForm = Controls.Stack - .WithView(Controls.H5("Create New Todo") - .WithStyle(style => style.WithWidth("100%").WithTextAlign("center"))) - .WithView(host.Edit(newTodo, newTodoDataId)? - .WithStyle(style => style.WithWidth("100%").WithDisplay("block")), newTodoDataId) - .WithView(Controls.Stack - .WithView(Controls.Button("💾 Save Todo") - .WithClickAction(_ => - { - // Changes are saved immediately ==> just - // Close the dialog by clearing the dialog area - host.UpdateArea(DialogControl.DialogArea, null!); - return Task.CompletedTask; - })) - .WithView(Controls.Button("❌ Cancel") - .WithClickAction(_ => - { - // since we have saved immediately, we need to now delete the entity. - host.Hub.Post(new DataChangeRequest() { Deletions = [newTodo] }, o => o.WithTarget(TodoApplicationAttribute.Address)); - - // Close the dialog by clearing the dialog area - host.UpdateArea(DialogControl.DialogArea, null!); - return Task.CompletedTask; - })) - .WithOrientation(Orientation.Horizontal) - .WithHorizontalGap(10) - .WithStyle(style => style.WithJustifyContent("center").WithWidth("100%"))) - .WithVerticalGap(15) - .WithStyle(style => style.WithWidth("100%").WithDisplay("block").WithMargin("0 auto")); - - // Create a dialog with the edit form content - DialogControl.Render() will handle the UiControl rendering - var dialog = Controls.Dialog(editForm, "Create New Todo") - .WithSize("M") - .WithClosable(false); // Disable the X button - only Save/Cancel buttons should close the dialog - - // Update the dialog area to show the dialog - host.UpdateArea(DialogControl.DialogArea, dialog); - } - - /// - /// Updates all todos in a status group to a new status - /// - /// The layout area host - /// The todos to update - /// The new status - private static void UpdateAllTodosInGroup(LayoutAreaHost host, IEnumerable todos, TodoStatus newStatus) - { - var updatedTodos = todos.Select(todo => todo with - { - Status = newStatus, - UpdatedAt = DateTime.UtcNow - }); - - var changeRequest = new DataChangeRequest() - .WithUpdates(updatedTodos); - - host.Hub.Post(changeRequest, o => o.WithTarget(TodoApplicationAttribute.Address)); - } - - /// - /// Deletes all todos in a group - /// - /// The layout area host - /// The todos to delete - private static void DeleteAllTodosInGroup(LayoutAreaHost host, IEnumerable todos) - { - var changeRequest = new DataChangeRequest() - .WithDeletions(todos.ToArray()); - - host.Hub.Post(changeRequest, o => o.WithTarget(TodoApplicationAttribute.Address)); - } - - /// - /// Creates compact content for a todo item (single line with key details) - /// - /// The todo item - /// Formatted content string - private static string CreateCompactTodoContent(TodoItem todo) - { - var sb = new StringBuilder(); - - // Title with emphasis - sb.Append($"**{todo.Title}**"); - - // Category badge if not default - if (todo.Category != "General") - { - sb.Append($" `{todo.Category}`"); - } - - // Responsible person with current user indicator - var displayName = ResponsiblePersons.GetDisplayName(todo.ResponsiblePerson); - sb.Append($" {displayName}"); - - // Due date with urgency indicators - if (todo.DueDate.HasValue) - { - var dueDateStr = todo.DueDate.Value.ToString("MMM dd"); - var isOverdue = todo.DueDate.Value.Date < DateTime.Now.Date && todo.Status != TodoStatus.Completed; - var isDueToday = todo.DueDate.Value.Date == DateTime.Now.Date && todo.Status != TodoStatus.Completed; - - if (isOverdue) - sb.Append($" 🚨 *{dueDateStr} (Overdue)*"); - else if (isDueToday) - sb.Append($" ⏰ *Due {dueDateStr}*"); - else - sb.Append($" 📅 *{dueDateStr}*"); - } - - // Description on new line if present - if (!string.IsNullOrEmpty(todo.Description)) - { - sb.AppendLine(); - sb.Append($"*{todo.Description}*"); - } - - return sb.ToString(); - } + public static UiControl TodaysFocus(LayoutAreaHost host, RenderingContext context) + => Page(host, host.Localize("todo.focus.title"), Typography.H4, withAdd: false, + Feed(host, TodoProjections.TodaysFocus)); - /// - /// Creates todo item content and actions as separate controls for layout grid - /// - /// The todo item - /// The layout area host for submitting changes - /// A tuple containing the content control and actions control - private static (UiControl content, UiControl actions) CreateTodoItemContentAndActions(TodoItem todo, LayoutAreaHost host) - { - var statusIcon = GetStatusIcon(todo.Status); - var contentMarkdown = CreateCompactTodoContent(todo); - var actionControls = CreateActionControls(todo, host); - - // Create content control with icon and text - more compact design - var content = Controls.Stack - .WithView(Controls.Markdown($"{statusIcon}")) - .WithView(Controls.Markdown(contentMarkdown)) - .WithOrientation(Orientation.Horizontal) - .WithHorizontalGap(12) - .WithStyle(style => style - .WithDisplay("flex") - .WithFlexDirection("row") - .WithAlignItems("flex-start") - .WithPadding("12px") - .WithMarginBottom("8px") - .WithBorder("1px solid var(--color-border-default)") - .WithBorderRadius("6px") - .WithBackgroundColor("var(--color-canvas-subtle)") - .WithBoxShadow("0 1px 2px var(--color-shadow-small)")); - - // Create actions control - centered and compact - var actions = Controls.Stack - .WithView(actionControls) - .WithStyle(style => style - .WithDisplay("flex") - .WithJustifyContent("center") - .WithAlignItems("center") - .WithPadding("12px") - .WithMarginBottom("8px")); - - return (content, actions); - } - - /// - /// Represents an action with its display information and handler - /// - /// The display title for the action - /// The icon for the action - /// The action handler - private record ActionData(string Title, string Icon, Action Action); - - /// - /// Gets the primary action data for a todo item - /// - /// The todo item - /// Primary action data - private static ActionData GetPrimaryActionData(TodoItem todo) - { - return todo.Status switch - { - TodoStatus.Pending => new ActionData("▶️ Start", "play", (host, item) => UpdateTodoStatus(host, item, TodoStatus.InProgress)), - TodoStatus.InProgress => new ActionData("✅ Done", "check", (host, item) => UpdateTodoStatus(host, item, TodoStatus.Completed)), - TodoStatus.Completed => new ActionData("🔄 Reopen", "refresh", (host, item) => UpdateTodoStatus(host, item, TodoStatus.InProgress)), - TodoStatus.Cancelled => new ActionData("🔄 Restore", "refresh", (host, item) => UpdateTodoStatus(host, item, TodoStatus.Pending)), - _ => new ActionData("❓ Unknown", "help", (host, item) => { }) - }; - } - - /// - /// Gets the secondary action data for a todo item - /// - /// The todo item - /// List of secondary action data - private static List GetSecondaryActionData(TodoItem todo) - { - var actions = new List(); - - // Always add Edit action - actions.Add(new ActionData("✏️ Edit", "edit", (host, item) => SubmitEditTodo(host, item))); - - // Status-specific secondary actions - switch (todo.Status) - { - case TodoStatus.Pending: - actions.Add(new ActionData("✅ Complete", "check", (host, item) => UpdateTodoStatus(host, item, TodoStatus.Completed))); - actions.Add(new ActionData("❌ Cancel", "close", (host, item) => UpdateTodoStatus(host, item, TodoStatus.Cancelled))); - break; - case TodoStatus.InProgress: - actions.Add(new ActionData("⏸️ Pause", "pause", (host, item) => UpdateTodoStatus(host, item, TodoStatus.Pending))); - actions.Add(new ActionData("❌ Cancel", "close", (host, item) => UpdateTodoStatus(host, item, TodoStatus.Cancelled))); - break; - case TodoStatus.Completed: - case TodoStatus.Cancelled: - // No additional status actions for completed/cancelled items - break; - } - - // Always add Delete action - actions.Add(new ActionData("🗑️ Delete", "trash", (host, item) => SubmitTodoDelete(host, item))); - - return actions; - } - - /// - /// Submits a request to edit an existing todo item using a dialog - /// - /// The layout area host - /// The todo item to edit - private static void SubmitEditTodo(LayoutAreaHost host, TodoItem todoToEdit) - { - // Define the area ID for the edit todo data - var editTodoDataId = $"EditTodoData_{todoToEdit.Id}"; - - // Create an edit form for the todo item with proper data binding - var editForm = Controls.Stack - .WithView(Controls.H5("Edit Todo") - .WithStyle(style => style.WithWidth("100%").WithTextAlign("center"))) - .WithView(host.Edit(todoToEdit, editTodoDataId)? - .WithStyle(style => style.WithWidth("100%").WithDisplay("block")), editTodoDataId) - .WithView(Controls.Stack - .WithView(Controls.Button("💾 Done") - .WithClickAction(_ => - { - // is updated on the fly, so we just need to close the dialog - // Close the dialog by clearing the dialog area - host.UpdateArea(DialogControl.DialogArea, null!); - return Task.CompletedTask; - })) - .WithOrientation(Orientation.Horizontal) - .WithHorizontalGap(10) - .WithStyle(style => style.WithJustifyContent("center").WithWidth("100%"))) - .WithVerticalGap(15) - .WithStyle(style => style.WithWidth("100%").WithDisplay("block").WithMargin("0 auto")); - - // Create a dialog with the edit form content - var dialog = Controls.Dialog(editForm, "Edit Todo") - .WithSize("M") - .WithClosable(false); // Disable the X button - only Save/Cancel buttons should close the dialog - - // Update the dialog area to show the dialog - host.UpdateArea(DialogControl.DialogArea, dialog); - } + // ── Template ─────────────────────────────────────────────────────────────────────────────── /// - /// Creates a hierarchical menu item for status group operations + /// The page every Todo area renders AT ONCE: its title, the "Add New Todo" action, and the row + /// list bound to . Reads nothing. /// - /// The primary action title - /// The primary action icon - /// The primary action to execute - /// The layout area host - /// The group of todos - /// A hierarchical menu item with group actions - private static UiControl CreateStatusGroupMenuItem(string title, string icon, - Action> primaryAction, - LayoutAreaHost host, IGrouping statusGroup) + internal static LayoutGridControl Page(LayoutAreaHost host, string title, Typography typo, bool withAdd, + IObservable> entries) { - // Create simple button with only primary action - no submenus for headings - var menuItem = Controls.MenuItem(title, icon) - .WithClickAction(_ => { primaryAction(host, statusGroup); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - - return menuItem; - } - - private static readonly Func HeadingButtonStyle = style => - style.WithDisplay("flex").WithAlignItems("center").WithJustifyContent("flex-end").WithHeight("100%") - .WithPaddingTop("20px"); - - /// - /// Creates the Planning View showing team workload and assignment interface - /// - /// The collection of todo items - /// The layout area host for submitting changes - /// An interactive LayoutGrid control for task planning - private static UiControl? CreatePlanningView(IReadOnlyCollection todoItems, LayoutAreaHost host) - { - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // Header - mainGrid = mainGrid - .WithView(Controls.H2("🎯 Task Planning & Assignment") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.MenuItem("➕ Add New Todo", "plus") - .WithClickAction(_ => { SubmitNewTodo(host); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - if (!todoItems.Any()) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("*No tasks found. Create some tasks to start planning!*") - .WithStyle(style => style.WithColor("var(--color-fg-muted)")), - skin => skin.WithXs(12)); - return mainGrid; - } - - // Team workload overview - var teamWorkload = todoItems - .Where(t => t.ResponsiblePerson != "Unassigned") - .GroupBy(t => t.ResponsiblePerson) - .OrderByDescending(g => g.Count()); - - var unassignedTasks = todoItems.Where(t => t.ResponsiblePerson == "Unassigned").ToList(); - - // Team Workload Section - mainGrid = mainGrid - .WithView(Controls.H5($"👥 Team Workload ({todoItems.Count(t => t.ResponsiblePerson != "Unassigned")} assigned)") - .WithStyle(style => style.WithMarginTop("20px").WithMarginBottom("8px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.Html(""), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - foreach (var personGroup in teamWorkload.Take(6)) // Show top 6 team members - { - var activeCount = personGroup.Count(t => t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled); - var overdueCount = personGroup.Count(t => t.DueDate.HasValue && t.DueDate.Value.Date < DateTime.Now.Date && t.Status != TodoStatus.Completed); - var isCurrentUser = ResponsiblePersons.IsCurrentUser(personGroup.Key); - var displayName = ResponsiblePersons.GetDisplayName(personGroup.Key); - - var workloadColor = activeCount switch - { - <= 2 => "🟢", // Light workload - <= 4 => "🟡", // Medium workload - _ => "🔴" // Heavy workload - }; - - var assignButton = unassignedTasks.Any() - ? Controls.MenuItem("📥 Assign", "user-plus") - .WithClickAction(_ => - { - // Assign the first unassigned task to this person - var taskToAssign = unassignedTasks.First(); - var updatedTask = taskToAssign with - { - ResponsiblePerson = personGroup.Key, - UpdatedAt = DateTime.UtcNow - }; - SubmitTodoUpdate(host, updatedTask); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) + var grid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)) + .WithView(Controls.Label(title).WithTypo(typo).WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), + skin => withAdd ? skin.WithXs(12).WithSm(9).WithMd(10) : skin.WithXs(12)); + if (withAdd) + grid = grid.WithView(Controls.MenuItem(host.Localize("todo.addNew"), "plus") + .WithClickAction(_ => { TodoRowActions.ShowNewTodoDialog(host); return Task.CompletedTask; }) + .WithWidth(TodoRowActions.MenuWidth) .WithAppearance(Appearance.Neutral) - .WithStyle(style => style.WithDisplay("flex").WithAlignItems("center").WithJustifyContent("flex-end")) - : (UiControl)Controls.Html(""); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"{workloadColor} **{displayName}**: {activeCount} active" + - (overdueCount > 0 ? $" 🚨 {overdueCount} overdue" : "")) - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(assignButton, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - - // Unassigned Tasks Section - if (unassignedTasks.Any()) - { - mainGrid = mainGrid - .WithView(Controls.H5($"📋 Unassigned Tasks ({unassignedTasks.Count})") - .WithStyle(style => style.WithMarginTop("16px").WithMarginBottom("8px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(unassignedTasks.Any(t => t.Status != TodoStatus.Completed) - ? Controls.MenuItem("🎯 Auto-Assign", "shuffle") - .WithClickAction(_ => - { - AutoAssignTasks(host, unassignedTasks.Where(t => t.Status != TodoStatus.Completed)); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)) - : (UiControl)Controls.Html(""), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - foreach (var task in unassignedTasks.Where(t => t.Status != TodoStatus.Completed).OrderBy(t => t.DueDate ?? DateTime.MaxValue).Take(8)) - { - var urgencyIndicator = task.DueDate.HasValue && task.DueDate.Value.Date <= DateTime.Now.Date ? "🚨" : - task.DueDate.HasValue && task.DueDate.Value.Date <= DateTime.Now.Date.AddDays(1) ? "⏰" : "📅"; - - var assignmentButton = CreateTaskAssignmentButton(task, host); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"{urgencyIndicator} **{task.Title}** - `{task.Category}`" + - (task.DueDate.HasValue ? $" *Due: {task.DueDate.Value:MMM dd}*" : "")) - .WithStyle(style => style.WithPaddingLeft("20px").WithMarginBottom("5px")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(assignmentButton, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - } - - return mainGrid; - } - - /// - /// Creates the My Active Tasks view for personal productivity - /// - /// The collection of todo items - /// The layout area host for submitting changes - /// An interactive control showing current user's active tasks - private static UiControl? CreateMyActiveTasks(IReadOnlyCollection todoItems, LayoutAreaHost host) - { - var currentUser = ResponsiblePersons.GetCurrentUser(); - var myActiveTasks = todoItems - .Where(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson) && - (t.Status == TodoStatus.Pending || t.Status == TodoStatus.InProgress)) - .OrderBy(t => t.DueDate ?? DateTime.MaxValue) - .ThenBy(t => t.CreatedAt) - .ToList(); - - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // Header - mainGrid = mainGrid - .WithView(Controls.H2($"🟢 My Active Tasks ({currentUser})") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.MenuItem("➕ Add New Todo", "plus") - .WithClickAction(_ => { SubmitNewTodo(host); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)), + .WithStyle(TodoStyles.Menu), skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - if (!myActiveTasks.Any()) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("🎉 **All caught up!** You have no active tasks assigned.") - .WithStyle(style => style.WithColor("var(--color-success-fg)").WithTextAlign("center").WithMarginTop("40px")), - skin => skin.WithXs(12)); - return mainGrid; - } - - // Summary stats - var overdueCount = myActiveTasks.Count(t => t.DueDate.HasValue && t.DueDate.Value.Date < DateTime.Now.Date); - var dueTodayCount = myActiveTasks.Count(t => t.DueDate.HasValue && t.DueDate.Value.Date == DateTime.Now.Date); - var inProgressCount = myActiveTasks.Count(t => t.Status == TodoStatus.InProgress); - - mainGrid = mainGrid - .WithView(Controls.Markdown($"**{myActiveTasks.Count} active tasks** • {inProgressCount} in progress" + - (overdueCount > 0 ? $" • 🚨 {overdueCount} overdue" : "") + - (dueTodayCount > 0 ? $" • ⏰ {dueTodayCount} due today" : "")) - .WithStyle(style => style.WithMarginBottom("12px")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(myActiveTasks.Any(t => t.Status == TodoStatus.Pending) - ? Controls.MenuItem("▶️ Start All", "play-circle") - .WithClickAction(_ => - { - var pendingTasks = myActiveTasks.Where(t => t.Status == TodoStatus.Pending); - UpdateAllTodosInGroup(host, pendingTasks, TodoStatus.InProgress); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)) - : (UiControl)Controls.Html(""), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - // Tasks organized by urgency - var urgentTasks = myActiveTasks.Where(t => t.DueDate.HasValue && t.DueDate.Value.Date <= DateTime.Now.Date).ToList(); - var todayTasks = myActiveTasks.Where(t => t.DueDate.HasValue && t.DueDate.Value.Date == DateTime.Now.Date.AddDays(1)).ToList(); - var upcomingTasks = myActiveTasks.Where(t => !t.DueDate.HasValue || t.DueDate.Value.Date > DateTime.Now.Date.AddDays(1)).ToList(); - - if (urgentTasks.Any()) - { - mainGrid = mainGrid - .WithView(Controls.H5("🚨 Urgent (Overdue/Due Today)") - .WithStyle(style => style.WithMarginTop("20px").WithMarginBottom("6px").WithColor("var(--color-danger-fg)")), - skin => skin.WithXs(12)); - - foreach (var task in urgentTasks) - { - var (todoContent, todoActions) = CreateTodoItemContentAndActions(task, host); - mainGrid = mainGrid - .WithView(todoContent, skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(todoActions, skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - } - - if (todayTasks.Any()) - { - mainGrid = mainGrid - .WithView(Controls.H5("⏰ Due Tomorrow") - .WithStyle(style => style.WithMarginTop("20px").WithMarginBottom("6px").WithColor("var(--color-warning-fg)")), - skin => skin.WithXs(12)); - - foreach (var task in todayTasks) - { - var (todoContent, todoActions) = CreateTodoItemContentAndActions(task, host); - mainGrid = mainGrid - .WithView(todoContent, skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(todoActions, skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - } - - if (upcomingTasks.Any()) - { - mainGrid = mainGrid - .WithView(Controls.H5("📅 Upcoming") - .WithStyle(style => style.WithMarginTop("20px").WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12)); - - foreach (var task in upcomingTasks.Take(10)) // Limit to 10 upcoming tasks - { - var (todoContent, todoActions) = CreateTodoItemContentAndActions(task, host); - mainGrid = mainGrid - .WithView(todoContent, skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(todoActions, skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - } - - return mainGrid; + var rowView = RowView(host); + return grid.WithView(entries.BindMany(EntriesId, _ => rowView), skin => skin.WithXs(12)); } /// - /// Creates the Unassigned Tasks view for task assignment + /// The ONE row template: a heading part (markdown + group action) and an item part (card + + /// action menu, or assignment menu). Every value is a relative pointer into the row; every + /// button is row-scoped. /// - /// The collection of todo items - /// The layout area host for submitting changes - /// An interactive control for managing unassigned tasks - private static UiControl? CreateUnassignedTasks(IReadOnlyCollection todoItems, LayoutAreaHost host) + internal static LayoutGridControl RowView(LayoutAreaHost host) { - var unassignedTasks = todoItems - .Where(t => t.ResponsiblePerson == "Unassigned" && t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled) - .OrderBy(t => t.DueDate ?? DateTime.MaxValue) - .ThenBy(t => t.CreatedAt) - .ToList(); + var actions = Styled(Controls.Stack.WithView(ItemMenu(host)), nameof(TodoEntry.ActionsStyle)); + var assign = Styled(Controls.Stack.WithView(AssignMenu(host)), nameof(TodoEntry.AssignStyle)); - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // Header - mainGrid = mainGrid - .WithView(Controls.H2($"📋 Unassigned Tasks ({unassignedTasks.Count})") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), + return Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)) + .WithView(Styled(Controls.Markdown(P(nameof(TodoEntry.Heading))), nameof(TodoEntry.HeadingStyle)), skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(unassignedTasks.Any() - ? Controls.MenuItem("🎯 Auto-Assign All", "shuffle") - .WithClickAction(_ => - { - AutoAssignTasks(host, unassignedTasks); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)) - : Controls.MenuItem("➕ Add New Todo", "plus") - .WithClickAction(_ => { SubmitNewTodo(host); return Task.CompletedTask; }) - .WithWidth(MenuWidth) + .WithView(Controls.MenuItem(P(nameof(TodoEntry.GroupTitle)), P(nameof(TodoEntry.GroupIcon))) + .WithClickAction(ctx => TodoRowActions.OnGroup(ctx, host)) + .WithWidth(TodoRowActions.MenuWidth) .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - if (!unassignedTasks.Any()) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("🎉 **All tasks are assigned!** No unassigned tasks found.") - .WithStyle(style => style.WithColor("var(--color-success-fg)").WithTextAlign("center").WithMarginTop("40px")), - skin => skin.WithXs(12)); - return mainGrid; - } - - // Show unassigned tasks with assignment buttons - foreach (var task in unassignedTasks) - { - var urgencyIndicator = task.DueDate.HasValue && task.DueDate.Value.Date < DateTime.Now.Date ? "🚨" : - task.DueDate.HasValue && task.DueDate.Value.Date <= DateTime.Now.Date.AddDays(1) ? "⏰" : "📅"; - - var (todoContent, _) = CreateTodoItemContentAndActions(task, host); - var assignmentButton = CreateTaskAssignmentButton(task, host); - - mainGrid = mainGrid - .WithView(todoContent, - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(assignmentButton, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - - return mainGrid; - } - - /// - /// Creates Today's Focus view showing items due today - /// - /// The collection of todo items - /// The layout area host for submitting changes - /// An interactive control for today's priorities - private static UiControl? CreateTodaysFocus(IReadOnlyCollection todoItems, LayoutAreaHost host) - { - var today = DateTime.Now.Date; - - // Categorize tasks by timeline - var overdueTasks = todoItems - .Where(t => t.DueDate.HasValue && t.DueDate.Value.Date < today && - t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled) - .OrderBy(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson) ? 0 : 1) - .ThenBy(t => t.Status) - .ThenBy(t => t.CreatedAt) - .ToList(); - - var dueTodayTasks = todoItems - .Where(t => t.DueDate.HasValue && t.DueDate.Value.Date == today && - t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled) - .OrderBy(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson) ? 0 : 1) - .ThenBy(t => t.Status) - .ThenBy(t => t.CreatedAt) - .ToList(); - - var ongoingTasks = todoItems - .Where(t => t.ResponsiblePerson != "Unassigned" && - t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled && - (!t.DueDate.HasValue || t.DueDate.Value.Date > today)) // Only future or no due date - .OrderBy(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson) ? 0 : 1) - .ThenBy(t => t.Status) - .ThenBy(t => t.DueDate ?? DateTime.MaxValue) - .ThenBy(t => t.CreatedAt) - .ToList(); - - var totalUrgentTasks = overdueTasks.Count + dueTodayTasks.Count; - var mainGrid = Controls.LayoutGrid.WithSkin(skin => skin.WithSpacing(-1)); - - // Header with overall summary - var myUrgentTasks = overdueTasks.Concat(dueTodayTasks).Count(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson)); - var teamUrgentTasks = totalUrgentTasks - myUrgentTasks; - var myOngoingTasks = ongoingTasks.Count(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson)); - - var summaryText = $"**Overdue**: {overdueTasks.Count} • **Due today**: {dueTodayTasks.Count} • **Ongoing**: {ongoingTasks.Count}"; - - mainGrid = mainGrid - .WithView(Controls.H4("🎯 Today's Focus") - .WithStyle(style => style.WithMarginBottom("6px").WithColor("var(--color-fg-default)")), - skin => skin.WithXs(12)) - .WithView(Controls.Markdown(summaryText) - .WithStyle(style => style.WithMarginBottom("12px")), - skin => skin.WithXs(12)); - - if (totalUrgentTasks == 0 && ongoingTasks.Count == 0) - { - mainGrid = mainGrid - .WithView(Controls.Markdown("🎉 **All caught up!** No urgent tasks or active work.") - .WithStyle(style => style.WithColor("var(--color-success-fg)").WithTextAlign("center").WithMarginTop("40px")), - skin => skin.WithXs(12)); - return mainGrid; - } - - // Section 1: 🚨 Overdue Tasks (highest priority) - if (overdueTasks.Any()) - { - mainGrid = AddTimelineSection(mainGrid, host, overdueTasks, - "🚨 Overdue", "var(--color-danger-fg)", - "▶️ Start All Overdue", "Start all overdue tasks"); - } - - // Section 2: ⏰ Due Today Tasks - if (dueTodayTasks.Any()) - { - mainGrid = AddTimelineSection(mainGrid, host, dueTodayTasks, - "⏰ Due Today", "var(--color-warning-fg)", - "▶️ Start All Today", "Start all due today tasks"); - } - - // Section 3: 📋 Ongoing Tasks (all assigned work not urgent) - if (ongoingTasks.Any()) - { - mainGrid = AddTimelineSection(mainGrid, host, ongoingTasks, - "📋 Ongoing", "var(--color-accent-fg)", - "✅ Complete All", "Complete all ongoing tasks"); - } - - return mainGrid; - } - - /// - /// Adds a timeline section to the Today's Focus view - /// - private static LayoutGridControl AddTimelineSection(LayoutGridControl mainGrid, LayoutAreaHost host, List tasks, - string sectionTitle, string sectionColor, string actionText, string actionDescription) - { - // Section header with action button - smaller heading with reduced spacing - mainGrid = mainGrid - .WithView(Controls.H5($"{sectionTitle} ({tasks.Count})") - .WithStyle(style => style.WithMarginTop("12px").WithMarginBottom("6px").WithColor(sectionColor)), + .WithStyle(P(nameof(TodoEntry.GroupStyle))), + skin => skin.WithXs(12).WithSm(3).WithMd(2)) + .WithView(Styled(Controls.Stack + .WithView(Controls.Markdown(P(nameof(TodoEntry.Icon)))) + .WithView(Controls.Markdown(P(nameof(TodoEntry.Content)))) + .WithOrientation(Orientation.Horizontal) + .WithHorizontalGap(12), nameof(TodoEntry.ItemStyle)), skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.MenuItem(actionText, GetActionIcon(actionText)) - .WithClickAction(_ => - { - var targetStatus = actionText.Contains("Complete") ? TodoStatus.Completed : TodoStatus.InProgress; - UpdateAllTodosInGroup(host, tasks, targetStatus); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)), + .WithView(Controls.Stack.WithView(actions).WithView(assign), skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - // Show all tasks directly without person grouping headers - foreach (var task in tasks) - { - var (todoContent, todoActions) = CreateTodoItemContentAndActions(task, host); - mainGrid = mainGrid - .WithView(todoContent, skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(todoActions, skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - - return mainGrid; - } - - - /// - /// Adds a collapsible status section for assigned todos in the AllItems - /// - private static LayoutGridControl AddCollapsibleStatusSection(LayoutGridControl mainGrid, LayoutAreaHost host, List tasks, - string sectionTitle, string sectionColor, UiControl actionButton, bool defaultOpen) - { - // Add collapsible section header with action button - var summaryHtml = $"" + - $"" + - $"{sectionTitle} ({tasks.Count})" + - "" + - "
"; - - mainGrid = mainGrid - .WithView(Controls.Html(summaryHtml), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(actionButton, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - // Add each task with its action buttons inside the collapsible section - foreach (var task in tasks) - { - var (todoContent, todoActions) = CreateTodoItemContentAndActions(task, host); - mainGrid = mainGrid - .WithView(todoContent.WithStyle(style => style.WithMarginLeft("10px")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(todoActions, skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - - // Close the details section - mainGrid = mainGrid - .WithView(Controls.Html("
"), - skin => skin.WithXs(12)); - - return mainGrid; - } - - /// - /// Adds a collapsible status section for unassigned todos in the AllItems - /// - private static LayoutGridControl AddCollapsibleUnassignedSection(LayoutGridControl mainGrid, LayoutAreaHost host, List tasks, - string sectionTitle, string sectionColor, UiControl actionButton, bool defaultOpen) - { - // Add collapsible section header with action button - var summaryHtml = $"" + - $"" + - $"{sectionTitle} ({tasks.Count})" + - "" + - "
"; - - mainGrid = mainGrid - .WithView(Controls.Html(summaryHtml), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(actionButton, - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - - // Add each unassigned task with assignment button - foreach (var task in tasks) - { - var (todoContent, _) = CreateTodoItemContentAndActions(task, host); - var assignmentButton = CreateTaskAssignmentButton(task, host); - - mainGrid = mainGrid - .WithView(todoContent.WithStyle(style => style.WithMarginLeft("10px")), - skin => skin.WithXs(12).WithSm(9).WithMd(10)) - .WithView(Controls.Stack - .WithView(assignmentButton) - .WithStyle(style => style - .WithDisplay("flex") - .WithJustifyContent("center") - .WithAlignItems("center") - .WithPadding("12px") - .WithMarginBottom("8px")), - skin => skin.WithXs(12).WithSm(3).WithMd(2)); - } - - // Close the details section - mainGrid = mainGrid - .WithView(Controls.Html("
"), - skin => skin.WithXs(12)); - - return mainGrid; - } - - /// - /// Gets the appropriate icon for an action text - /// - private static string GetActionIcon(string actionText) - { - return actionText.Contains("Complete") ? "check" : "play"; - } - - /// - /// Creates a task assignment button with dropdown for team members - /// - /// The task to assign - /// The layout area host - /// A menu item with assignment options - private static UiControl CreateTaskAssignmentButton(TodoItem task, LayoutAreaHost host) - { - var assignButton = Controls.MenuItem("👥 Assign", "user-plus") - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - - // Add assignment options for each team member - foreach (var person in ResponsiblePersons.AvailablePersons.Take(5)) // Show top 5 for space - { - var displayName = ResponsiblePersons.GetDisplayName(person); - var assignToPerson = Controls.MenuItem(displayName, "user") - .WithClickAction(_ => - { - var updatedTask = task with - { - ResponsiblePerson = person, - UpdatedAt = DateTime.UtcNow - }; - SubmitTodoUpdate(host, updatedTask); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - - assignButton = assignButton.WithView(assignToPerson); - } - - return assignButton; } - /// - /// Auto-assigns tasks to team members using load balancing - /// - /// The layout area host - /// Tasks to assign - private static void AutoAssignTasks(LayoutAreaHost host, IEnumerable tasksToAssign) - { - var availablePersons = ResponsiblePersons.AvailablePersons.ToList(); - var personIndex = 0; - var updatedTasks = new List(); - - foreach (var task in tasksToAssign) - { - var assignedPerson = availablePersons[personIndex % availablePersons.Count]; - var updatedTask = task with - { - ResponsiblePerson = assignedPerson, - UpdatedAt = DateTime.UtcNow - }; - updatedTasks.Add(updatedTask); - personIndex++; - } - - if (updatedTasks.Any()) - { - var changeRequest = new DataChangeRequest() - .WithUpdates(updatedTasks); - - host.Hub.Post(changeRequest, o => o.WithTarget(TodoApplicationAttribute.Address)); - } - } - - /// - /// Creates an action button for status groups in the summary view - /// - /// The todo status - /// The group of todos with this status - /// The layout area host - /// An action button for the status group - private static UiControl CreateStatusSummaryButton(TodoStatus status, IGrouping statusGroup, LayoutAreaHost host) - { - return status switch - { - TodoStatus.Pending => Controls.MenuItem("▶️ Start All", "play") - .WithClickAction(_ => { UpdateAllTodosInGroup(host, statusGroup, TodoStatus.InProgress); return Task.CompletedTask; }) - .WithWidth(MenuWidth) + /// The item action menu: the status-dependent primary action, and the secondary + /// actions, each shown only where its bound style says so. + private static MenuItemControl ItemMenu(LayoutAreaHost host) + => Menu(Controls.MenuItem(P(nameof(TodoEntry.PrimaryTitle)), P(nameof(TodoEntry.PrimaryIcon))), + ctx => TodoRowActions.OnPrimary(ctx, host), TodoStyles.Menu) + .WithView(Menu(Controls.MenuItem(host.Localize("todo.action.edit"), "edit"), + ctx => TodoRowActions.OnEdit(ctx, host), TodoStyles.Menu)) + .WithView(Menu(Controls.MenuItem(host.Localize("todo.action.complete"), "check"), + ctx => TodoRowActions.OnSetStatus(ctx, host, TodoStatus.Completed), P(nameof(TodoEntry.CompleteStyle)))) + .WithView(Menu(Controls.MenuItem(host.Localize("todo.action.pause"), "pause"), + ctx => TodoRowActions.OnSetStatus(ctx, host, TodoStatus.Pending), P(nameof(TodoEntry.PauseStyle)))) + .WithView(Menu(Controls.MenuItem(host.Localize("todo.action.cancel"), "close"), + ctx => TodoRowActions.OnSetStatus(ctx, host, TodoStatus.Cancelled), P(nameof(TodoEntry.CancelStyle)))) + .WithView(Menu(Controls.MenuItem(host.Localize("todo.action.delete"), "trash"), + ctx => TodoRowActions.OnDelete(ctx, host), TodoStyles.Menu)) + .WithView(Menu(Controls.MenuItem(host.Localize("todo.action.sendReminder"), "send"), + ctx => TodoRowActions.OnReminder(ctx, host), P(nameof(TodoEntry.ReminderStyle)))); + + /// The assignment menu: one entry per team member, each assigning the row's todo. + private static MenuItemControl AssignMenu(LayoutAreaHost host) + => ResponsiblePersons.AvailablePersons.Take(5).Aggregate( + Controls.MenuItem(host.Localize("todo.action.assign"), "user-plus") + .WithWidth(TodoRowActions.MenuWidth) .WithAppearance(Appearance.Neutral) - .WithStyle(style => style.WithDisplay("flex").WithAlignItems("center").WithJustifyContent("flex-end")), + .WithStyle(TodoStyles.Menu), + (menu, person) => menu.WithView(Menu( + Controls.MenuItem(TodoProjections.DisplayName(person, host.Localize), "user"), + ctx => TodoRowActions.OnAssign(ctx, host, person), TodoStyles.Menu))); + + private static MenuItemControl Menu(MenuItemControl item, Func onClick, object style) + => item.WithClickAction(onClick) + .WithWidth(TodoRowActions.MenuWidth) + .WithAppearance(Appearance.Neutral) + .WithStyle(style); - TodoStatus.InProgress => Controls.MenuItem("✅ Complete All", "check-circle") - .WithClickAction(_ => { UpdateAllTodosInGroup(host, statusGroup, TodoStatus.Completed); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => style.WithDisplay("flex").WithAlignItems("center").WithJustifyContent("flex-end")), + /// with its style BOUND to a row property: a part the row + /// does not have is hidden by it, so the template's shape never depends on data. + private static T Styled(T control, string styleProperty) where T : UiControl + => (T)(control with { Style = P(styleProperty) }); - TodoStatus.Completed => Controls.MenuItem("📦 Archive All", "archive") - .WithClickAction(_ => { DeleteAllTodosInGroup(host, statusGroup); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => style.WithDisplay("flex").WithAlignItems("center").WithJustifyContent("flex-end")), + /// A relative pointer to a property (camelCase, as the data + /// section stores it). + private static Data.JsonPointerReference P(string property) + => new(System.Text.Json.JsonNamingPolicy.CamelCase.ConvertName(property)); - TodoStatus.Cancelled => Controls.MenuItem("🔄 Restore All", "refresh-cw") - .WithClickAction(_ => { UpdateAllTodosInGroup(host, statusGroup, TodoStatus.Pending); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => style.WithDisplay("flex").WithAlignItems("center").WithJustifyContent("flex-end")), - - _ => Controls.Html("") - }; - } + // ── Feed ─────────────────────────────────────────────────────────────────────────────────── /// - /// Creates an action button for category groups + /// The feed half: the live todos, projected into rows by in the + /// viewer's language. Builds no control. /// - /// The todos in this category - /// The layout area host - /// An action button for the category - private static UiControl CreateCategoryActionButton(List categoryTodos, LayoutAreaHost host) + internal static IObservable> Feed(LayoutAreaHost host, + Func, TodoViewText, IEnumerable> project) { - var incompleteTodos = categoryTodos.Where(t => t.Status != TodoStatus.Completed).ToList(); - var pendingTodos = categoryTodos.Where(t => t.Status == TodoStatus.Pending).ToList(); - - // Determine the primary action based on category state - if (incompleteTodos.Any()) - { - if (pendingTodos.Count == incompleteTodos.Count) - { - // All incomplete todos are pending - offer to start all - return Controls.MenuItem("▶️ Start All", "play") - .WithClickAction(_ => { UpdateAllTodosInGroup(host, pendingTodos, TodoStatus.InProgress); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - } - else - { - // Mixed status - offer to complete all incomplete - return Controls.MenuItem("✅ Complete All", "check-circle") - .WithClickAction(_ => { UpdateAllTodosInGroup(host, incompleteTodos, TodoStatus.Completed); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - } - } - else - { - // All todos are completed - offer to archive category - return Controls.MenuItem("📦 Archive All", "archive") - .WithClickAction(_ => { DeleteAllTodosInGroup(host, categoryTodos); return Task.CompletedTask; }) - .WithWidth(MenuWidth) - .WithAppearance(Appearance.Neutral) - .WithStyle(style => HeadingButtonStyle(style)); - } + var text = TodoViewText.For(host); + var todos = host.Workspace.GetStream() + ?? throw new InvalidOperationException($"No data source for {nameof(TodoItem)} on {host.Hub.Address}."); + return todos.Select(items => project((IReadOnlyCollection?)items ?? [], text)); } - /// - /// Shows overdue reminder dialog for a todo item - /// - /// The overdue todo item - /// The layout area host - private static void ShowOverdueReminderDialog(TodoItem todo, LayoutAreaHost host) - { - var defaultEmailText = $"Hi {todo.ResponsiblePerson},\n\n" + - $"This is a reminder that the following task is overdue:\n\n" + - $"Task: {todo.Title}\n" + - $"Description: {todo.Description}\n" + - $"Due Date: {todo.DueDate:yyyy-MM-dd}\n\n" + - $"Please complete this task as soon as possible.\n\n" + - $"Thanks!"; - - // Create the dialog content - var reminderForm = Controls.Stack - .WithView(Controls.H5("Send Overdue Reminder") - .WithStyle(style => style.WithWidth("100%").WithTextAlign("center"))) - .WithView(Controls.Markdown($"**Task:** {todo.Title}") - .WithStyle(style => style.WithMarginBottom("5px"))) - .WithView(Controls.Markdown($"**Assigned to:** {ResponsiblePersons.GetDisplayName(todo.ResponsiblePerson)}") - .WithStyle(style => style.WithMarginBottom("5px"))) - .WithView(Controls.Markdown($"**Due:** {todo.DueDate:yyyy-MM-dd} ({Math.Abs((DateTime.Now - todo.DueDate!.Value).Days)} days overdue)") - .WithStyle(style => style.WithMarginBottom("8px").WithColor("var(--color-danger-fg)"))) - .WithView(Controls.Markdown("**Email Text:**") - .WithStyle(style => style.WithMarginBottom("5px"))) - .WithView(Controls.Html($"") - .WithStyle(style => style.WithMarginBottom("8px"))) - .WithView(Controls.Stack - .WithView(Controls.Button("📧 Send Reminder") - .WithClickAction(_ => - { - // In a real implementation, this would send an email - System.Console.WriteLine($"OVERDUE REMINDER SENT:"); - System.Console.WriteLine($"To: {todo.ResponsiblePerson}"); - System.Console.WriteLine($"Subject: Overdue Task Reminder - {todo.Title}"); - System.Console.WriteLine($"Body:\n{defaultEmailText}"); - System.Console.WriteLine("=".PadRight(50, '=')); + // ── Writes ───────────────────────────────────────────────────────────────────────────────── + // The ONLY two places the sample names the data-plane change message. Todos are data-source + // entities of this hub, not mesh nodes, so there is no node stream to Update; the change is + // POSTED to the owning hub rather than applied on its workspace directly, so it passes the + // hub's delivery gate and change validators as the clicking user. - // Close the dialog - host.UpdateArea(DialogControl.DialogArea, null!); - return Task.CompletedTask; - })) - .WithView(Controls.Button("❌ Cancel") - .WithClickAction(_ => - { - // Close the dialog without action - host.UpdateArea(DialogControl.DialogArea, null!); - return Task.CompletedTask; - })) - .WithOrientation(Orientation.Horizontal) - .WithHorizontalGap(10) - .WithStyle(style => style.WithJustifyContent("center").WithWidth("100%"))) - .WithStyle(style => style.WithWidth("100%").WithDisplay("block").WithMargin("0 auto")); + /// Writes to the hub that owns the todo data source. + /// The area host; its hub owns the data source. + /// The todos as they should be stored. + internal static void Update(LayoutAreaHost host, IEnumerable todos) + => host.Hub.Post(new DataChangeRequest().WithUpdates(todos), o => o.WithTarget(host.Hub.Address)); - // Create the dialog - var dialog = Controls.Dialog(reminderForm, "Overdue Reminder") - .WithSize("M") - .WithClosable(false); + /// Deletes on the hub that owns the todo data source. + /// The area host; its hub owns the data source. + /// The todos to delete. + internal static void Delete(LayoutAreaHost host, IEnumerable todos) + => host.Hub.Post(new DataChangeRequest().WithDeletions(todos), o => o.WithTarget(host.Hub.Address)); +} - // Show the dialog - host.UpdateArea(DialogControl.DialogArea, dialog); - } +/// +/// The viewer's language for the Todo projections: resolves a catalog key, and +/// formats dates — never the ambient culture (Doc/Architecture/Localization). +/// +/// Resolves a key with positional arguments. +/// The viewer's culture for date formatting. +public sealed record TodoViewText(Func Localize, CultureInfo Culture) +{ + /// The text for in the viewer's language. + public string T(string key, params object?[] args) => Localize(key, args); - /// - /// Creates a menu button for overdue reminder functionality - /// - /// The overdue todo item - /// The layout area host - /// Menu item for sending overdue reminders - private static UiControl CreateOverdueReminderButton(TodoItem todo, LayoutAreaHost host) - { - return Controls.MenuItem("📧 Send Reminder", "send") - .WithAppearance(Appearance.Neutral) - .WithClickAction(_ => - { - // Show the overdue reminder dialog - ShowOverdueReminderDialog(todo, host); - return Task.CompletedTask; - }) - .WithWidth(MenuWidth) - .WithStyle(style => HeadingButtonStyle(style)); - } + /// The viewer's text for . + public static TodoViewText For(LayoutAreaHost host) + => new(host.Localize, CultureInfo.GetCultureInfo(host.ViewerLocale())); } diff --git a/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoProjections.cs b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoProjections.cs new file mode 100644 index 0000000000..d16d58f68d --- /dev/null +++ b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoProjections.cs @@ -0,0 +1,412 @@ +using System.Collections.Immutable; +using MeshWeaver.Todo.Domain; + +namespace MeshWeaver.Todo.LayoutAreas; + +/// +/// The pure projections behind the Todo areas: todos in, the rows of the area's bound list out +/// (). They make every data-dependent decision — which sections exist, which +/// group action a section offers, which actions a todo offers — so the template stays static and +/// these are testable without a hub. +/// +public static class TodoProjections +{ + private const string Unassigned = "Unassigned"; + private const string DefaultColor = "var(--color-fg-default)"; + + // ── Areas ────────────────────────────────────────────────────────────────────────────────── + + /// All todos: assigned ones by status, then unassigned ones by status. + public static IEnumerable AllItems(IReadOnlyCollection todos, TodoViewText x) + { + if (todos.Count == 0) + { + yield return Line("empty", x.T("todo.emptyAddHint"), TodoStyles.Muted); + yield break; + } + + var ordered = todos.OrderBy(t => t.DueDate ?? DateTime.MaxValue).ThenBy(t => t.CreatedAt).ToList(); + + foreach (var group in ordered.Where(t => t.ResponsiblePerson != Unassigned) + .GroupBy(t => t.Status).OrderBy(g => (int)g.Key)) + { + var (title, icon, action) = group.Key switch + { + TodoStatus.Pending => (x.T("todo.group.startAll"), "play", TodoGroupActions.Start), + TodoStatus.InProgress => (x.T("todo.group.closeAll"), "pause", TodoGroupActions.Complete), + TodoStatus.Completed => (x.T("todo.group.archiveAll"), "archive", TodoGroupActions.Delete), + _ => (x.T("todo.group.deleteAll"), "trash", TodoGroupActions.Delete), + }; + yield return Section($"assigned-{group.Key}", + x.T("todo.sectionCount", $"{StatusIcon(group.Key)} {StatusName(group.Key, x)}", group.Count()), + StatusColor(group.Key), "20px", title, icon, action, group); + foreach (var todo in group) + yield return ItemRow(todo, x, TodoStyles.IndentedCard); + } + + foreach (var group in ordered.Where(t => t.ResponsiblePerson == Unassigned) + .GroupBy(t => t.Status).OrderBy(g => (int)g.Key)) + { + yield return Section($"unassigned-{group.Key}", + x.T("todo.sectionCount", + $"{StatusIcon(group.Key)} {x.T("todo.unassignedStatus", StatusName(group.Key, x))}", group.Count()), + "var(--color-warning-fg)", "20px", + x.T("todo.group.autoAssignAll"), "user-plus", TodoGroupActions.AutoAssign, group); + foreach (var todo in group) + yield return AssignRow(todo, x, TodoStyles.IndentedCard, Content(todo, x)); + } + } + + /// Todos grouped by category, each category with its bulk action. + public static IEnumerable ByCategory(IReadOnlyCollection todos, TodoViewText x) + { + if (todos.Count == 0) + { + yield return Line("empty", x.T("todo.emptyAddHint"), TodoStyles.Muted); + yield break; + } + + foreach (var category in todos + .GroupBy(t => string.IsNullOrEmpty(t.Category) ? x.T("todo.uncategorized") : t.Category) + .OrderBy(g => g.Key, StringComparer.Ordinal)) + { + var all = category.ToList(); + var incomplete = all.Where(t => t.Status != TodoStatus.Completed).ToList(); + var pending = all.Where(t => t.Status == TodoStatus.Pending).ToList(); + var (title, icon, action, group) = + incomplete.Count == 0 ? (x.T("todo.group.archiveAll"), "archive", TodoGroupActions.Delete, all) + : pending.Count == incomplete.Count ? (x.T("todo.group.startAll"), "play", TodoGroupActions.Start, pending) + : (x.T("todo.group.completeAll"), "check-circle", TodoGroupActions.Complete, incomplete); + + yield return Section($"category-{category.Key}", + x.T("todo.byCategory.header", category.Key, all.Count, + all.Count(t => t.Status == TodoStatus.Completed), + all.Count(t => t.Status == TodoStatus.InProgress), + pending.Count), + DefaultColor, "16px", title, icon, action, group); + + foreach (var todo in all.OrderBy(t => (int)t.Status) + .ThenBy(t => t.DueDate ?? DateTime.MaxValue).ThenBy(t => t.CreatedAt)) + yield return ItemRow(todo, x, TodoStyles.Card); + } + } + + /// Summary statistics: status breakdown, due dates, responsibility. + public static IEnumerable Summary(IReadOnlyCollection todos, TodoViewText x) + { + if (todos.Count == 0) + { + yield return Line("empty", x.T("todo.none"), TodoStyles.Muted); + yield break; + } + + var total = todos.Count; + yield return Line("total", x.T("todo.summary.total", total), "margin-top: 20px; margin-bottom: 8px;"); + + yield return Section("status", x.T("todo.summary.statusOverview"), DefaultColor, "12px"); + foreach (var group in todos.GroupBy(t => t.Status).OrderBy(g => (int)g.Key)) + yield return Line($"status-{group.Key}", x.T("todo.summary.statusLine", StatusIcon(group.Key), + StatusName(group.Key, x), group.Count(), (group.Count() * 100.0 / total).ToString("F1", x.Culture)), + TodoStyles.Stat); + + var today = DateTime.Now.Date; + bool Open(TodoItem t) => t.Status != TodoStatus.Completed; + yield return Section("due", x.T("todo.summary.dueInsights"), DefaultColor); + yield return Line("overdue", x.T("todo.summary.overdue", + todos.Count(t => t.DueDate?.Date < today && Open(t))), TodoStyles.Stat); + yield return Line("dueToday", x.T("todo.summary.dueToday", + todos.Count(t => t.DueDate?.Date == today && Open(t))), TodoStyles.Stat); + yield return Line("dueWeek", x.T("todo.summary.dueWeek", + todos.Count(t => t.DueDate?.Date > today && t.DueDate?.Date <= today.AddDays(7) && Open(t))), TodoStyles.Stat); + + yield return Section("responsibility", x.T("todo.summary.responsibility"), DefaultColor); + yield return Line("mine", x.T("todo.summary.mine", ResponsiblePersons.GetCurrentUser(), + todos.Count(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson))), TodoStyles.Stat); + yield return Line("others", x.T("todo.summary.others", + todos.Count(t => !ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson))), TodoStyles.Stat); + yield return Line("unassigned", x.T("todo.summary.unassigned", + todos.Count(t => t.ResponsiblePerson == Unassigned)), TodoStyles.Stat); + } + + /// Team workload (with "assign the next unassigned task" per member) and the + /// unassigned backlog with per-task assignment. + public static IEnumerable Planning(IReadOnlyCollection todos, TodoViewText x) + { + if (todos.Count == 0) + { + yield return Line("empty", x.T("todo.planning.empty"), TodoStyles.Muted); + yield break; + } + + var today = DateTime.Now.Date; + var unassigned = todos.Where(t => t.ResponsiblePerson == Unassigned).ToList(); + + yield return Section("workload", + x.T("todo.planning.workload", todos.Count(t => t.ResponsiblePerson != Unassigned)), DefaultColor, "20px"); + + foreach (var person in todos.Where(t => t.ResponsiblePerson != Unassigned) + .GroupBy(t => t.ResponsiblePerson).OrderByDescending(g => g.Count()).Take(6)) + { + var active = person.Count(t => t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled); + var overdue = person.Count(t => t.DueDate?.Date < today && t.Status != TodoStatus.Completed); + var load = active switch { <= 2 => "🟢", <= 4 => "🟡", _ => "🔴" }; + var line = x.T("todo.planning.member", load, DisplayName(person.Key, x.Localize), active) + + (overdue > 0 ? x.T("todo.planning.memberOverdue", overdue) : ""); + var entry = Line($"member-{person.Key}", line, TodoStyles.Stat); + yield return unassigned.Count == 0 + ? entry + : entry with + { + GroupTitle = x.T("todo.group.assignOne"), + GroupIcon = "user-plus", + GroupAction = TodoGroupActions.AssignFirst, + GroupStyle = TodoStyles.Menu, + Group = [.. unassigned], + Person = person.Key, + }; + } + + if (unassigned.Count == 0) + yield break; + + var open = unassigned.Where(t => t.Status != TodoStatus.Completed).ToList(); + yield return open.Count == 0 + ? Section("backlog", x.T("todo.planning.unassigned", unassigned.Count), DefaultColor) + : Section("backlog", x.T("todo.planning.unassigned", unassigned.Count), DefaultColor, "16px", + x.T("todo.group.autoAssign"), "shuffle", TodoGroupActions.AutoAssign, open); + + foreach (var task in open.OrderBy(t => t.DueDate ?? DateTime.MaxValue).Take(8)) + { + var urgency = task.DueDate?.Date <= today ? "🚨" : task.DueDate?.Date <= today.AddDays(1) ? "⏰" : "📅"; + var line = x.T("todo.planning.task", urgency, task.Title, task.Category) + + (task.DueDate is { } due ? x.T("todo.planning.taskDue", due.ToString("MMM dd", x.Culture)) : ""); + yield return AssignRow(task, x, TodoStyles.Line, line) with { Icon = string.Empty }; + } + } + + /// The current user's open tasks: urgent, due tomorrow, upcoming. + public static IEnumerable MyTasks(IReadOnlyCollection todos, TodoViewText x) + { + var today = DateTime.Now.Date; + var mine = todos + .Where(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson) + && t.Status is TodoStatus.Pending or TodoStatus.InProgress) + .OrderBy(t => t.DueDate ?? DateTime.MaxValue).ThenBy(t => t.CreatedAt) + .ToList(); + + if (mine.Count == 0) + { + yield return Line("empty", x.T("todo.myTasks.empty"), TodoStyles.Success); + yield break; + } + + var overdue = mine.Count(t => t.DueDate?.Date < today); + var dueToday = mine.Count(t => t.DueDate?.Date == today); + var summary = x.T("todo.myTasks.summary", mine.Count, mine.Count(t => t.Status == TodoStatus.InProgress)) + + (overdue > 0 ? x.T("todo.myTasks.overdue", overdue) : "") + + (dueToday > 0 ? x.T("todo.myTasks.dueToday", dueToday) : ""); + var pending = mine.Where(t => t.Status == TodoStatus.Pending).ToList(); + var line = Line("summary", summary, "margin-bottom: 12px;"); + yield return pending.Count == 0 + ? line + : line with + { + GroupTitle = x.T("todo.group.startAll"), + GroupIcon = "play-circle", + GroupAction = TodoGroupActions.Start, + GroupStyle = TodoStyles.Menu, + Group = [.. pending], + }; + + var sections = new[] + { + ("urgent", x.T("todo.myTasks.urgent"), "var(--color-danger-fg)", + mine.Where(t => t.DueDate?.Date <= today).ToList()), + ("tomorrow", x.T("todo.myTasks.tomorrow"), "var(--color-warning-fg)", + mine.Where(t => t.DueDate?.Date == today.AddDays(1)).ToList()), + ("upcoming", x.T("todo.myTasks.upcoming"), DefaultColor, + mine.Where(t => t.DueDate is null || t.DueDate.Value.Date > today.AddDays(1)).Take(10).ToList()), + }; + foreach (var (key, title, color, tasks) in sections.Where(s => s.Item4.Count > 0)) + { + yield return Section(key, title, color, "20px"); + foreach (var todo in tasks) + yield return ItemRow(todo, x, TodoStyles.Card); + } + } + + /// Open tasks nobody is assigned to, each with its assignment menu. + public static IEnumerable Backlog(IReadOnlyCollection todos, TodoViewText x) + { + var open = todos + .Where(t => t.ResponsiblePerson == Unassigned + && t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled) + .OrderBy(t => t.DueDate ?? DateTime.MaxValue).ThenBy(t => t.CreatedAt) + .ToList(); + + if (open.Count == 0) + { + yield return Line("empty", x.T("todo.backlog.empty"), TodoStyles.Success); + yield break; + } + + yield return Section("backlog", x.T("todo.planning.unassigned", open.Count), DefaultColor, "6px", + x.T("todo.group.autoAssignAll"), "shuffle", TodoGroupActions.AutoAssign, open); + foreach (var todo in open) + yield return AssignRow(todo, x, TodoStyles.Card, Content(todo, x)); + } + + /// Overdue, due-today and ongoing work, each section with its bulk action. + public static IEnumerable TodaysFocus(IReadOnlyCollection todos, TodoViewText x) + { + var today = DateTime.Now.Date; + bool Open(TodoItem t) => t.Status != TodoStatus.Completed && t.Status != TodoStatus.Cancelled; + IOrderedEnumerable MineFirst(IEnumerable items) + => items.OrderBy(t => ResponsiblePersons.IsCurrentUser(t.ResponsiblePerson) ? 0 : 1).ThenBy(t => t.Status); + + var overdue = MineFirst(todos.Where(t => t.DueDate?.Date < today && Open(t))).ThenBy(t => t.CreatedAt).ToList(); + var dueToday = MineFirst(todos.Where(t => t.DueDate?.Date == today && Open(t))).ThenBy(t => t.CreatedAt).ToList(); + var ongoing = MineFirst(todos.Where(t => t.ResponsiblePerson != Unassigned && Open(t) + && (t.DueDate is null || t.DueDate.Value.Date > today))) + .ThenBy(t => t.DueDate ?? DateTime.MaxValue).ThenBy(t => t.CreatedAt).ToList(); + + yield return Line("summary", x.T("todo.focus.summary", overdue.Count, dueToday.Count, ongoing.Count), + "margin-bottom: 12px;"); + + if (overdue.Count + dueToday.Count + ongoing.Count == 0) + { + yield return Line("empty", x.T("todo.focus.empty"), TodoStyles.Success); + yield break; + } + + var sections = new[] + { + ("overdue", x.T("todo.focus.overdue"), "var(--color-danger-fg)", x.T("todo.group.startAllOverdue"), + "play", TodoGroupActions.Start, overdue), + ("dueToday", x.T("todo.focus.dueToday"), "var(--color-warning-fg)", x.T("todo.group.startAllToday"), + "play", TodoGroupActions.Start, dueToday), + ("ongoing", x.T("todo.focus.ongoing"), "var(--color-accent-fg)", x.T("todo.group.completeAll"), + "check", TodoGroupActions.Complete, ongoing), + }; + foreach (var (key, title, color, action, icon, code, tasks) in sections.Where(s => s.Item7.Count > 0)) + { + yield return Section(key, x.T("todo.sectionCount", title, tasks.Count), color, "12px", + action, icon, code, tasks); + foreach (var todo in tasks) + yield return ItemRow(todo, x, TodoStyles.Card); + } + } + + // ── Rows ─────────────────────────────────────────────────────────────────────────────────── + + /// A section heading, optionally with a group action over . + public static TodoEntry Section(string key, string title, string color, string marginTop = "16px", + string? groupTitle = null, string groupIcon = "", string groupAction = "", IEnumerable? group = null) + => new() + { + Key = key, + Heading = $"##### {title}", + HeadingStyle = TodoStyles.Heading(color, marginTop), + GroupTitle = groupTitle ?? string.Empty, + GroupIcon = groupIcon, + GroupAction = groupAction, + GroupStyle = groupTitle is null ? TodoStyles.Hidden : TodoStyles.Menu, + Group = group is null ? [] : [.. group], + }; + + /// A markdown line (a statistic, a summary, an empty state). + public static TodoEntry Line(string key, string markdown, string style) + => new() { Key = key, Heading = markdown, HeadingStyle = style }; + + /// A todo card with its action menu: the primary action for its status, and the + /// secondary actions its status offers. + public static TodoEntry ItemRow(TodoItem todo, TodoViewText x, string cardStyle) + { + var (title, icon) = todo.Status switch + { + TodoStatus.Pending => (x.T("todo.action.start"), "play"), + TodoStatus.InProgress => (x.T("todo.action.done"), "check"), + TodoStatus.Completed => (x.T("todo.action.reopen"), "refresh"), + _ => (x.T("todo.action.restore"), "refresh"), + }; + var overdue = todo.DueDate?.Date < DateTime.Now.Date + && todo.Status is not (TodoStatus.Completed or TodoStatus.Cancelled); + return Card(todo, x, cardStyle, Content(todo, x)) with + { + ActionsStyle = TodoStyles.Actions, + PrimaryTitle = title, + PrimaryIcon = icon, + CompleteStyle = todo.Status == TodoStatus.Pending ? TodoStyles.Menu : TodoStyles.Hidden, + PauseStyle = todo.Status == TodoStatus.InProgress ? TodoStyles.Menu : TodoStyles.Hidden, + CancelStyle = todo.Status is TodoStatus.Pending or TodoStatus.InProgress ? TodoStyles.Menu : TodoStyles.Hidden, + ReminderStyle = overdue ? TodoStyles.Menu : TodoStyles.Hidden, + }; + } + + /// A todo with the assignment menu instead of its actions. + public static TodoEntry AssignRow(TodoItem todo, TodoViewText x, string cardStyle, string content) + => Card(todo, x, cardStyle, content) with { AssignStyle = TodoStyles.Actions }; + + private static TodoEntry Card(TodoItem todo, TodoViewText x, string cardStyle, string content) + => new() + { + Key = $"todo-{todo.Id}", + Item = todo, + ItemStyle = cardStyle, + Icon = StatusIcon(todo.Status), + Content = content, + }; + + /// The compact card text: title, category, responsible person, due date, description. + public static string Content(TodoItem todo, TodoViewText x) + { + var text = $"**{todo.Title}**"; + if (todo.Category != "General") + text += $" `{todo.Category}`"; + text += $" {DisplayName(todo.ResponsiblePerson, x.Localize)}"; + if (todo.DueDate is { } due) + { + var date = due.ToString("MMM dd", x.Culture); + var open = todo.Status != TodoStatus.Completed; + text += " " + (due.Date < DateTime.Now.Date && open ? x.T("todo.due.overdue", date) + : due.Date == DateTime.Now.Date && open ? x.T("todo.due.today", date) + : x.T("todo.due.on", date)); + } + if (!string.IsNullOrEmpty(todo.Description)) + text += $"\n*{todo.Description}*"; + return text; + } + + /// A person's name, marked when it is the current user. + public static string DisplayName(string person, Func localize) + => ResponsiblePersons.IsCurrentUser(person) ? localize("todo.you", [person]) : person; + + /// The status glyph. + public static string StatusIcon(TodoStatus status) => status switch + { + TodoStatus.Pending => "⏳", + TodoStatus.InProgress => "🔄", + TodoStatus.Completed => "✅", + TodoStatus.Cancelled => "❌", + _ => "❓" + }; + + /// The status name in the viewer's language. + public static string StatusName(TodoStatus status, TodoViewText x) => status switch + { + TodoStatus.Pending => x.T("todo.status.pending"), + TodoStatus.InProgress => x.T("todo.status.inProgress"), + TodoStatus.Completed => x.T("todo.status.completed"), + TodoStatus.Cancelled => x.T("todo.status.cancelled"), + _ => status.ToString() + }; + + private static string StatusColor(TodoStatus status) => status switch + { + TodoStatus.Pending => "var(--color-warning-fg)", + TodoStatus.InProgress => "var(--color-accent-fg)", + TodoStatus.Completed => "var(--color-success-fg)", + TodoStatus.Cancelled => "var(--color-danger-fg)", + _ => DefaultColor + }; +} diff --git a/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoRowActions.cs b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoRowActions.cs new file mode 100644 index 0000000000..bbe095a651 --- /dev/null +++ b/samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoRowActions.cs @@ -0,0 +1,241 @@ +using MeshWeaver.Data; +using MeshWeaver.Layout; +using MeshWeaver.Layout.Composition; +using MeshWeaver.Mesh; +using MeshWeaver.ShortGuid; +using MeshWeaver.Todo.Domain; +using Microsoft.Extensions.DependencyInjection; +using Microsoft.Extensions.Logging; + +namespace MeshWeaver.Todo.LayoutAreas; + +/// +/// The actions of the Todo row template — ROW-SCOPED (Doc/GUI/DataBinding → "Row-scoped actions"): +/// each button is declared once, and each click reads the row it was raised from with +/// ctx.RowAs<TodoEntry>() — the row as the person saw it, never one re-read by +/// position. A click with no row acts on nothing. +/// +/// Writes go to the hub that owns the todo data source (the area's own hub) through the two +/// write helpers on (, +/// ) — todos are data-source entities, not mesh nodes. +/// +public static class TodoRowActions +{ + /// The width of every Todo menu button. + public const string MenuWidth = "150px"; + + /// The primary action of the clicked row's todo, chosen by its status as rendered. + public static Task OnPrimary(UiActionContext ctx, LayoutAreaHost host) + { + if (ctx.RowAs() is { Item: { } todo }) + SetStatus(host, todo, todo.Status switch + { + TodoStatus.Pending => TodoStatus.InProgress, + TodoStatus.InProgress => TodoStatus.Completed, + TodoStatus.Completed => TodoStatus.InProgress, + _ => TodoStatus.Pending, + }); + return Task.CompletedTask; + } + + /// Moves the clicked row's todo to . + public static Task OnSetStatus(UiActionContext ctx, LayoutAreaHost host, TodoStatus status) + { + if (ctx.RowAs() is { Item: { } todo }) + SetStatus(host, todo, status); + return Task.CompletedTask; + } + + /// Deletes the clicked row's todo. + public static Task OnDelete(UiActionContext ctx, LayoutAreaHost host) + { + if (ctx.RowAs() is { Item: { } todo }) + TodoLayoutAreas.Delete(host, [todo]); + return Task.CompletedTask; + } + + /// Assigns the clicked row's todo to . + public static Task OnAssign(UiActionContext ctx, LayoutAreaHost host, string person) + { + if (ctx.RowAs() is { Item: { } todo }) + TodoLayoutAreas.Update(host, [todo with { ResponsiblePerson = person, UpdatedAt = DateTime.UtcNow }]); + return Task.CompletedTask; + } + + /// Opens the edit dialog for the clicked row's todo. + public static Task OnEdit(UiActionContext ctx, LayoutAreaHost host) + { + if (ctx.RowAs() is { Item: { } todo }) + ShowEditDialog(host, todo); + return Task.CompletedTask; + } + + /// Opens the overdue-reminder dialog for the clicked row's todo. + public static Task OnReminder(UiActionContext ctx, LayoutAreaHost host) + { + if (ctx.RowAs() is { Item: { DueDate: not null } todo }) + ShowReminderDialog(host, todo); + return Task.CompletedTask; + } + + /// + /// The clicked heading row's group action, over the group AS RENDERED (). + /// An unknown action is logged and does nothing — never a default that means something. + /// + public static Task OnGroup(UiActionContext ctx, LayoutAreaHost host) + { + if (ctx.RowAs() is not { GroupAction.Length: > 0 } row || row.Group.IsEmpty) + return Task.CompletedTask; + + switch (row.GroupAction) + { + case TodoGroupActions.Start: + SetStatus(host, row.Group, TodoStatus.InProgress); + break; + case TodoGroupActions.Complete: + SetStatus(host, row.Group, TodoStatus.Completed); + break; + case TodoGroupActions.Delete: + TodoLayoutAreas.Delete(host, row.Group); + break; + case TodoGroupActions.AutoAssign: + var team = ResponsiblePersons.AvailablePersons; + TodoLayoutAreas.Update(host, row.Group.Select((todo, i) => + todo with { ResponsiblePerson = team[i % team.Length], UpdatedAt = DateTime.UtcNow })); + break; + case TodoGroupActions.AssignFirst when row.Person is { Length: > 0 } person: + TodoLayoutAreas.Update(host, + [row.Group[0] with { ResponsiblePerson = person, UpdatedAt = DateTime.UtcNow }]); + break; + default: + host.Hub.ServiceProvider.GetRequiredService().CreateLogger(typeof(TodoRowActions)) + .LogWarning("Todo row {Key} carries group action {Action}, which no handler claims; nothing done.", + row.Key, row.GroupAction); + break; + } + return Task.CompletedTask; + } + + private static void SetStatus(LayoutAreaHost host, TodoItem todo, TodoStatus status) + => SetStatus(host, [todo], status); + + private static void SetStatus(LayoutAreaHost host, IEnumerable todos, TodoStatus status) + => TodoLayoutAreas.Update(host, + todos.Select(todo => todo with { Status = status, UpdatedAt = DateTime.UtcNow })); + + // ── Dialogs ──────────────────────────────────────────────────────────────────────────────── + + /// Creates a todo and opens the dialog editing it; Cancel deletes it again. + public static void ShowNewTodoDialog(LayoutAreaHost host) + { + var todo = new TodoItem + { + Id = Guid.NewGuid().AsString(), + Title = "", + Description = "", + Status = TodoStatus.Pending, + Category = "General", + ResponsiblePerson = ResponsiblePersons.GetCurrentUser(), + DueDate = DateTime.Now.AddDays(7), + CreatedAt = DateTime.UtcNow, + UpdatedAt = DateTime.UtcNow + }; + const string dataId = "NewTodoData"; + + var form = Controls.Stack + .WithView(Controls.H5(host.Localize("todo.dialog.create")) + .WithStyle(style => style.WithWidth("100%").WithTextAlign("center"))) + .WithView(host.Edit(todo, dataId) + .WithStyle(style => style.WithWidth("100%").WithDisplay("block")), dataId) + .WithView(Controls.Stack + .WithView(Controls.Button(host.Localize("todo.dialog.save")) + .WithClickAction(_ => + { + // The editor saves as you type — Save only closes. + host.UpdateArea(DialogControl.DialogArea, null); + return Task.CompletedTask; + })) + .WithView(Controls.Button(host.Localize("todo.dialog.cancel")) + .WithClickAction(_ => + { + TodoLayoutAreas.Delete(host, [todo]); + host.UpdateArea(DialogControl.DialogArea, null); + return Task.CompletedTask; + })) + .WithOrientation(Orientation.Horizontal) + .WithHorizontalGap(10) + .WithStyle(style => style.WithJustifyContent("center").WithWidth("100%"))) + .WithVerticalGap(15) + .WithStyle(style => style.WithWidth("100%").WithDisplay("block").WithMargin("0 auto")); + + host.UpdateArea(DialogControl.DialogArea, + Controls.Dialog(form, host.Localize("todo.dialog.create")).WithSize("M").WithClosable(false)); + } + + /// Opens the dialog editing (the editor saves as you type). + public static void ShowEditDialog(LayoutAreaHost host, TodoItem todo) + { + var dataId = $"EditTodoData_{todo.Id}"; + var form = Controls.Stack + .WithView(Controls.H5(host.Localize("todo.dialog.edit")) + .WithStyle(style => style.WithWidth("100%").WithTextAlign("center"))) + .WithView(host.Edit(todo, dataId) + .WithStyle(style => style.WithWidth("100%").WithDisplay("block")), dataId) + .WithView(Controls.Stack + .WithView(Controls.Button(host.Localize("todo.dialog.done")) + .WithClickAction(_ => + { + host.UpdateArea(DialogControl.DialogArea, null); + return Task.CompletedTask; + })) + .WithOrientation(Orientation.Horizontal) + .WithHorizontalGap(10) + .WithStyle(style => style.WithJustifyContent("center").WithWidth("100%"))) + .WithVerticalGap(15) + .WithStyle(style => style.WithWidth("100%").WithDisplay("block").WithMargin("0 auto")); + + host.UpdateArea(DialogControl.DialogArea, + Controls.Dialog(form, host.Localize("todo.dialog.edit")).WithSize("M").WithClosable(false)); + } + + /// Opens the overdue-reminder dialog for . + public static void ShowReminderDialog(LayoutAreaHost host, TodoItem todo) + { + var due = todo.DueDate ?? DateTime.Now; + var dueText = due.ToString("yyyy-MM-dd", System.Globalization.CultureInfo.InvariantCulture); + var body = host.Localize("todo.reminder.body", todo.ResponsiblePerson, todo.Title, todo.Description, dueText); + var form = Controls.Stack + .WithView(Controls.H5(host.Localize("todo.reminder.heading")) + .WithStyle(style => style.WithWidth("100%").WithTextAlign("center"))) + .WithView(Controls.Markdown(host.Localize("todo.reminder.task", todo.Title))) + .WithView(Controls.Markdown(host.Localize("todo.reminder.assigned", + TodoProjections.DisplayName(todo.ResponsiblePerson, host.Localize)))) + .WithView(Controls.Markdown(host.Localize("todo.reminder.due", dueText, Math.Abs((DateTime.Now - due).Days))) + .WithStyle(style => style.WithColor("var(--color-danger-fg)"))) + .WithView(Controls.Markdown(host.Localize("todo.reminder.emailText"))) + .WithView(Controls.Markdown(string.Join("\n", body.Split('\n').Select(l => "> " + l)))) + .WithView(Controls.Stack + .WithView(Controls.Button(host.Localize("todo.action.sendReminder")) + .WithClickAction(_ => + { + // A sample: a real application would send the reminder here. + host.Hub.ServiceProvider.GetRequiredService().CreateLogger(typeof(TodoRowActions)) + .LogInformation("Overdue reminder for todo {Id} to {Person}", todo.Id, todo.ResponsiblePerson); + host.UpdateArea(DialogControl.DialogArea, null); + return Task.CompletedTask; + })) + .WithView(Controls.Button(host.Localize("todo.dialog.cancel")) + .WithClickAction(_ => + { + host.UpdateArea(DialogControl.DialogArea, null); + return Task.CompletedTask; + })) + .WithOrientation(Orientation.Horizontal) + .WithHorizontalGap(10) + .WithStyle(style => style.WithJustifyContent("center").WithWidth("100%"))) + .WithStyle(style => style.WithWidth("100%").WithDisplay("block").WithMargin("0 auto")); + + host.UpdateArea(DialogControl.DialogArea, + Controls.Dialog(form, host.Localize("todo.reminder.title")).WithSize("M").WithClosable(false)); + } +} diff --git a/samples/Todo/MeshWeaver.Todo/MeshWeaver.Todo.csproj b/samples/Todo/MeshWeaver.Todo/MeshWeaver.Todo.csproj index d47c62b11c..549e9e8bb0 100644 --- a/samples/Todo/MeshWeaver.Todo/MeshWeaver.Todo.csproj +++ b/samples/Todo/MeshWeaver.Todo/MeshWeaver.Todo.csproj @@ -15,6 +15,11 @@ + + + + + diff --git a/samples/Todo/MeshWeaver.Todo/TodoApplicationExtensions.cs b/samples/Todo/MeshWeaver.Todo/TodoApplicationExtensions.cs index e72ed5d890..fbffa0f069 100644 --- a/samples/Todo/MeshWeaver.Todo/TodoApplicationExtensions.cs +++ b/samples/Todo/MeshWeaver.Todo/TodoApplicationExtensions.cs @@ -25,7 +25,8 @@ public static MessageHubConfiguration ConfigureTodoApplication(this MessageHubCo // /api/content/{address}/Todo/{file} — published, still gated on Read (issue #587). .AddEmbeddedResourceContentCollection("Todo", typeof(TodoApplicationAttribute).Assembly, "Content", isStatic: true) .WithTypes( - typeof(TodoStatus) + typeof(TodoStatus), + typeof(TodoEntry) ) .AddData(data => data.AddSource(dataSource => diff --git a/src/MeshWeaver.Documentation/Data/Architecture/DataPlaneMessagesAreStreamPlumbing.md b/src/MeshWeaver.Documentation/Data/Architecture/DataPlaneMessagesAreStreamPlumbing.md index 1fd8c6d9ef..5108be1bef 100644 --- a/src/MeshWeaver.Documentation/Data/Architecture/DataPlaneMessagesAreStreamPlumbing.md +++ b/src/MeshWeaver.Documentation/Data/Architecture/DataPlaneMessagesAreStreamPlumbing.md @@ -110,7 +110,7 @@ one). Measured on `main` at `39f49494eb` (core) and `e9d9283ab` (MeshWeaver.Plug |---|---:|---| | `GetDataRequest` | 18 | 9 | | `GetDataResponse` | 26 | 8 | -| `DataChangeRequest` | 11 | 5 (incl. 2 in `samples/`) | +| `DataChangeRequest` | 7 | 5 (incl. 2 in `samples/`) | | `PatchDataChangeRequest` | 0 | — | | `DataChangedEvent` | 0 | — | @@ -160,7 +160,7 @@ not a zero. | Where | Found | |---|---| -| core `samples/` | **7 code references, both in-mesh or sample C#.** `samples/Graph/Data/ACME/Project/Todo/Source/TodoLayoutAreas.cs` (1, a NodeType source compiled at runtime) and `samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs` (6, the Todo sample app writing workspace entities to its app hub). Both are in the ratchet — the guard scans `samples/` because its `Data/` trees are exactly the code `dotnet build` never sees. The rest are prose in sample `.md` files. | +| core `samples/` | **3 code references, both in-mesh or sample C#.** `samples/Graph/Data/ACME/Project/Todo/Source/TodoLayoutAreas.cs` (1, a NodeType source compiled at runtime) and `samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs` (2 — the Todo sample app's one `Update` and one `Delete` helper, through which every row action posts its workspace-entity write to the owning hub). Both are in the ratchet — the guard scans `samples/` because its `Data/` trees are exactly the code `dotnet build` never sees. The rest are prose in sample `.md` files. | | MeshWeaver.Plugins module folders (`Mail/`, `Store/`, …) | code: 0 (one doc comment in `Store/Installer/Source/DependencyInstall.cs`) | | MeshWeaver.Plugins `clients/` (TypeScript) | **`DataChangedEvent` is a WIRE CONTRACT.** The grpc-web and React clients decode `DataChangedEvent { changeType, change, streamId }` frames by their `$type` name (`clients/grpc-web/src/changeFold.ts`, `connection.test.ts`, `clients/react/docs/live-protocol.md`). Making the CLR type `internal` does not change the wire, but its NAME and its field names can never change — so it is plumbing to C# code and a published protocol to clients. | | MeshWeaver.SocialMedia | **14 in-mesh callers**: every `LinkedIn/*/Source/*Loader.cs` reads its CSV through `hub.Observe(new GetDataRequest(new FileReference("content", "archive/….csv")))` — the `FileReference` kind, which has no stream surface yet | diff --git a/src/MeshWeaver.Documentation/Data/GUI/DataBinding.md b/src/MeshWeaver.Documentation/Data/GUI/DataBinding.md index 3614e47037..d8770783cd 100644 --- a/src/MeshWeaver.Documentation/Data/GUI/DataBinding.md +++ b/src/MeshWeaver.Documentation/Data/GUI/DataBinding.md @@ -672,6 +672,8 @@ The rules: - **`MeshSearch` rows need none of this.** Each result renders through the node's OWN item area (`WithItemArea(…)`), so a button there lives on that node's hub, which already knows its path. - A `BlurEvent` carries the row the same way; inputs in a row need nothing extra, since they are bound by pointer to the row they edit. +**A worked example with sections, group actions and status-dependent menus — the Todo sample** (`samples/Todo`, `TodoLayoutAreas`). All seven areas used to wait for the todos and bake one menu per todo, its todo captured in the closure. Each is now ONE page (title, "Add New Todo", one bound list) fed by a pure projection (`TodoProjections`) into rows of ONE record, `TodoEntry`: a row is either a heading (a section title, a summary line, an empty state — optionally with a group action such as "Start All") or a todo (card + action menu, or the assignment menu). The parts a row lacks are hidden by a bound style, and so are the secondary actions its status does not offer — the template's shape never depends on data. Every button is declared once and reads `ctx.RowAs()` (`TodoRowActions`): an item action acts on the row's `Item`, and a group action on the row's `Group` exactly as rendered — what the closure used to capture now travels with the click. Pinned by `test/MeshWeaver.Layout.Test/TodoRowScopedActionsTest` (every area is a template; the page renders before any todo arrives; row k's Start / Delete / Assign act on todo k for every k, also after the list changed; a heading's group action acts on its group; a no-row negative control). + Where it is wired: core `MeshWeaver.Layout` (`RowContext`, `ClickedEvent.Row`, `UiActionContext.Row`, `DataGridControl.RenderSelf`) and `MeshWeaver.Mesh.Contract` (`RowAs`); the Blazor views in MeshWeaver.Plugins cascade the row (`ItemTemplate`, `DataGridView`) and `BlazorView` stamps it on every click and blur. Pinned by `test/MeshWeaver.Layout.Test/RowScopedClickActionTest` (N rows, row k acts on row k; a no-row negative control; the list changing between render and click; a grid template column) and, for the client half, Plugins' `RowScopedActionsFromViewsTest`. --- diff --git a/src/MeshWeaver.Messaging.Hub/Localization/strings.de.json b/src/MeshWeaver.Messaging.Hub/Localization/strings.de.json index 73e99da9ba..1f8381ab30 100644 --- a/src/MeshWeaver.Messaging.Hub/Localization/strings.de.json +++ b/src/MeshWeaver.Messaging.Hub/Localization/strings.de.json @@ -1966,5 +1966,91 @@ "serviceIdentities.noTokens": "Keine Tokens ausgestellt.", "serviceIdentities.rotate": "Erneuern", "serviceIdentities.status.active": "Aktiv", - "serviceIdentities.status.revoked": "Widerrufen" + "serviceIdentities.status.revoked": "Widerrufen", + "todo.addNew": "➕ Neue Aufgabe", + "todo.emptyAddHint": "*Keine Aufgaben gefunden. Klicken Sie auf „Neue Aufgabe“, um zu beginnen!*", + "todo.none": "*Keine Aufgaben gefunden.*", + "todo.sectionCount": "{0} ({1})", + "todo.unassignedStatus": "Nicht zugewiesen: {0}", + "todo.uncategorized": "Ohne Kategorie", + "todo.you": "🟢 {0} (Sie)", + "todo.status.pending": "Ausstehend", + "todo.status.inProgress": "In Arbeit", + "todo.status.completed": "Erledigt", + "todo.status.cancelled": "Abgebrochen", + "todo.due.overdue": "🚨 *{0} (überfällig)*", + "todo.due.today": "⏰ *Fällig {0}*", + "todo.due.on": "📅 *{0}*", + "todo.action.start": "▶️ Starten", + "todo.action.done": "✅ Fertig", + "todo.action.reopen": "🔄 Wieder öffnen", + "todo.action.restore": "🔄 Wiederherstellen", + "todo.action.edit": "✏️ Bearbeiten", + "todo.action.complete": "✅ Abschliessen", + "todo.action.pause": "⏸️ Pausieren", + "todo.action.cancel": "❌ Abbrechen", + "todo.action.delete": "🗑️ Löschen", + "todo.action.sendReminder": "📧 Erinnerung senden", + "todo.action.assign": "👥 Zuweisen", + "todo.group.startAll": "▶️ Alle starten", + "todo.group.closeAll": "⏸️ Alle schliessen", + "todo.group.archiveAll": "📦 Alle archivieren", + "todo.group.deleteAll": "🗑️ Alle löschen", + "todo.group.completeAll": "✅ Alle abschliessen", + "todo.group.autoAssignAll": "👥 Alle automatisch zuweisen", + "todo.group.autoAssign": "🎯 Automatisch zuweisen", + "todo.group.assignOne": "📥 Zuweisen", + "todo.group.startAllOverdue": "▶️ Alle überfälligen starten", + "todo.group.startAllToday": "▶️ Alle heutigen starten", + "todo.allItems.title": "📝 Aufgabenliste mit Aktionen", + "todo.byCategory.title": "📂 Aufgabenkategorien", + "todo.byCategory.header": "📁 {0} ({1}) - {2}✅ {3}🔄 {4}⏳", + "todo.summary.title": "📊 Aufgaben-Dashboard", + "todo.summary.total": "**Aufgaben insgesamt:** {0}", + "todo.summary.statusOverview": "📈 Statusübersicht", + "todo.summary.statusLine": "{0} **{1}**: {2} ({3} %)", + "todo.summary.dueInsights": "⏰ Fälligkeiten", + "todo.summary.overdue": "🚨 **Überfällig**: {0}", + "todo.summary.dueToday": "⏰ **Heute fällig**: {0}", + "todo.summary.dueWeek": "📅 **Diese Woche fällig**: {0}", + "todo.summary.responsibility": "🟢 Zuständigkeiten", + "todo.summary.mine": "🟢 **Meine Aufgaben ({0})**: {1}", + "todo.summary.others": "🫂 **Aufgaben anderer**: {0}", + "todo.summary.unassigned": "📋 **Nicht zugewiesene Aufgaben**: {0}", + "todo.planning.title": "🎯 Planung und Zuweisung", + "todo.planning.empty": "*Keine Aufgaben gefunden. Legen Sie Aufgaben an, um mit der Planung zu beginnen!*", + "todo.planning.workload": "👥 Auslastung des Teams ({0} zugewiesen)", + "todo.planning.member": "{0} **{1}**: {2} aktiv", + "todo.planning.memberOverdue": " 🚨 {0} überfällig", + "todo.planning.unassigned": "📋 Nicht zugewiesene Aufgaben ({0})", + "todo.planning.task": "{0} **{1}** - `{2}`", + "todo.planning.taskDue": " *Fällig: {0}*", + "todo.myTasks.title": "🟢 Meine aktiven Aufgaben ({0})", + "todo.myTasks.empty": "🎉 **Alles erledigt!** Ihnen sind keine aktiven Aufgaben zugewiesen.", + "todo.myTasks.summary": "**{0} aktive Aufgaben** • {1} in Arbeit", + "todo.myTasks.overdue": " • 🚨 {0} überfällig", + "todo.myTasks.dueToday": " • ⏰ {0} heute fällig", + "todo.myTasks.urgent": "🚨 Dringend (überfällig/heute fällig)", + "todo.myTasks.tomorrow": "⏰ Morgen fällig", + "todo.myTasks.upcoming": "📅 Demnächst", + "todo.backlog.title": "📋 Nicht zugewiesene Aufgaben", + "todo.backlog.empty": "🎉 **Alle Aufgaben sind zugewiesen!** Keine offenen Aufgaben ohne Zuständige.", + "todo.focus.title": "🎯 Fokus für heute", + "todo.focus.summary": "**Überfällig**: {0} • **Heute fällig**: {1} • **Laufend**: {2}", + "todo.focus.empty": "🎉 **Alles erledigt!** Keine dringenden Aufgaben und keine laufende Arbeit.", + "todo.focus.overdue": "🚨 Überfällig", + "todo.focus.dueToday": "⏰ Heute fällig", + "todo.focus.ongoing": "📋 Laufend", + "todo.dialog.create": "Neue Aufgabe anlegen", + "todo.dialog.save": "💾 Aufgabe speichern", + "todo.dialog.cancel": "❌ Abbrechen", + "todo.dialog.edit": "Aufgabe bearbeiten", + "todo.dialog.done": "💾 Fertig", + "todo.reminder.title": "Erinnerung: überfällig", + "todo.reminder.heading": "Erinnerung zur überfälligen Aufgabe senden", + "todo.reminder.task": "**Aufgabe:** {0}", + "todo.reminder.assigned": "**Zugewiesen an:** {0}", + "todo.reminder.due": "**Fällig:** {0} ({1} Tage überfällig)", + "todo.reminder.emailText": "**E-Mail-Text:**", + "todo.reminder.body": "Hallo {0}\n\nDies ist eine Erinnerung, dass die folgende Aufgabe überfällig ist:\n\nAufgabe: {1}\nBeschreibung: {2}\nFällig am: {3}\n\nBitte erledigen Sie diese Aufgabe so bald wie möglich.\n\nDanke!" } diff --git a/src/MeshWeaver.Messaging.Hub/Localization/strings.en.json b/src/MeshWeaver.Messaging.Hub/Localization/strings.en.json index ab2bd61336..0d690b371b 100644 --- a/src/MeshWeaver.Messaging.Hub/Localization/strings.en.json +++ b/src/MeshWeaver.Messaging.Hub/Localization/strings.en.json @@ -1966,5 +1966,91 @@ "serviceIdentities.noTokens": "No tokens issued.", "serviceIdentities.rotate": "Rotate", "serviceIdentities.status.active": "Active", - "serviceIdentities.status.revoked": "Revoked" + "serviceIdentities.status.revoked": "Revoked", + "todo.addNew": "➕ Add New Todo", + "todo.emptyAddHint": "*No todo items found. Click 'Add New Todo' to get started!*", + "todo.none": "*No todo items found.*", + "todo.sectionCount": "{0} ({1})", + "todo.unassignedStatus": "Unassigned {0}", + "todo.uncategorized": "Uncategorized", + "todo.you": "🟢 {0} (You)", + "todo.status.pending": "Pending", + "todo.status.inProgress": "In Progress", + "todo.status.completed": "Completed", + "todo.status.cancelled": "Cancelled", + "todo.due.overdue": "🚨 *{0} (Overdue)*", + "todo.due.today": "⏰ *Due {0}*", + "todo.due.on": "📅 *{0}*", + "todo.action.start": "▶️ Start", + "todo.action.done": "✅ Done", + "todo.action.reopen": "🔄 Reopen", + "todo.action.restore": "🔄 Restore", + "todo.action.edit": "✏️ Edit", + "todo.action.complete": "✅ Complete", + "todo.action.pause": "⏸️ Pause", + "todo.action.cancel": "❌ Cancel", + "todo.action.delete": "🗑️ Delete", + "todo.action.sendReminder": "📧 Send Reminder", + "todo.action.assign": "👥 Assign", + "todo.group.startAll": "▶️ Start All", + "todo.group.closeAll": "⏸️ Close All", + "todo.group.archiveAll": "📦 Archive All", + "todo.group.deleteAll": "🗑️ Delete All", + "todo.group.completeAll": "✅ Complete All", + "todo.group.autoAssignAll": "👥 Auto-Assign All", + "todo.group.autoAssign": "🎯 Auto-Assign", + "todo.group.assignOne": "📥 Assign", + "todo.group.startAllOverdue": "▶️ Start All Overdue", + "todo.group.startAllToday": "▶️ Start All Today", + "todo.allItems.title": "📝 Todo List with Actions", + "todo.byCategory.title": "📂 Todo Categories", + "todo.byCategory.header": "📁 {0} ({1}) - {2}✅ {3}🔄 {4}⏳", + "todo.summary.title": "📊 Todo Dashboard", + "todo.summary.total": "**Total Items:** {0}", + "todo.summary.statusOverview": "📈 Status Overview", + "todo.summary.statusLine": "{0} **{1}**: {2} ({3}%)", + "todo.summary.dueInsights": "⏰ Due Date Insights", + "todo.summary.overdue": "🚨 **Overdue**: {0}", + "todo.summary.dueToday": "⏰ **Due Today**: {0}", + "todo.summary.dueWeek": "📅 **Due This Week**: {0}", + "todo.summary.responsibility": "🟢 Responsibility Overview", + "todo.summary.mine": "🟢 **My Tasks ({0})**: {1}", + "todo.summary.others": "🫂 **Others' Tasks**: {0}", + "todo.summary.unassigned": "📋 **Unassigned Tasks**: {0}", + "todo.planning.title": "🎯 Task Planning & Assignment", + "todo.planning.empty": "*No tasks found. Create some tasks to start planning!*", + "todo.planning.workload": "👥 Team Workload ({0} assigned)", + "todo.planning.member": "{0} **{1}**: {2} active", + "todo.planning.memberOverdue": " 🚨 {0} overdue", + "todo.planning.unassigned": "📋 Unassigned Tasks ({0})", + "todo.planning.task": "{0} **{1}** - `{2}`", + "todo.planning.taskDue": " *Due: {0}*", + "todo.myTasks.title": "🟢 My Active Tasks ({0})", + "todo.myTasks.empty": "🎉 **All caught up!** You have no active tasks assigned.", + "todo.myTasks.summary": "**{0} active tasks** • {1} in progress", + "todo.myTasks.overdue": " • 🚨 {0} overdue", + "todo.myTasks.dueToday": " • ⏰ {0} due today", + "todo.myTasks.urgent": "🚨 Urgent (Overdue/Due Today)", + "todo.myTasks.tomorrow": "⏰ Due Tomorrow", + "todo.myTasks.upcoming": "📅 Upcoming", + "todo.backlog.title": "📋 Unassigned Tasks", + "todo.backlog.empty": "🎉 **All tasks are assigned!** No unassigned tasks found.", + "todo.focus.title": "🎯 Today's Focus", + "todo.focus.summary": "**Overdue**: {0} • **Due today**: {1} • **Ongoing**: {2}", + "todo.focus.empty": "🎉 **All caught up!** No urgent tasks or active work.", + "todo.focus.overdue": "🚨 Overdue", + "todo.focus.dueToday": "⏰ Due Today", + "todo.focus.ongoing": "📋 Ongoing", + "todo.dialog.create": "Create New Todo", + "todo.dialog.save": "💾 Save Todo", + "todo.dialog.cancel": "❌ Cancel", + "todo.dialog.edit": "Edit Todo", + "todo.dialog.done": "💾 Done", + "todo.reminder.title": "Overdue Reminder", + "todo.reminder.heading": "Send Overdue Reminder", + "todo.reminder.task": "**Task:** {0}", + "todo.reminder.assigned": "**Assigned to:** {0}", + "todo.reminder.due": "**Due:** {0} ({1} days overdue)", + "todo.reminder.emailText": "**Email Text:**", + "todo.reminder.body": "Hi {0},\n\nThis is a reminder that the following task is overdue:\n\nTask: {1}\nDescription: {2}\nDue Date: {3}\n\nPlease complete this task as soon as possible.\n\nThanks!" } diff --git a/test/DataPlaneMessageSites.allow b/test/DataPlaneMessageSites.allow index 349c9f06f4..20db995c87 100644 --- a/test/DataPlaneMessageSites.allow +++ b/test/DataPlaneMessageSites.allow @@ -27,7 +27,7 @@ DataChangeRequest src/MeshWeaver.Graph/VersionLayoutArea.cs 1 DataChangeRequest src/MeshWeaver.Layout/Client/LayoutClientExtensions.cs 1 DataChangeRequest src/MeshWeaver.Mesh.Contract/MeshExtensions.cs 2 DataChangeRequest samples/Graph/Data/ACME/Project/Todo/Source/TodoLayoutAreas.cs 1 -DataChangeRequest samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs 6 +DataChangeRequest samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs 2 GetDataRequest src/MeshWeaver.ContentCollections/ContentCollectionsExtensions.cs 2 GetDataRequest src/MeshWeaver.ContentCollections/ContentFileResolver.cs 1 GetDataRequest src/MeshWeaver.ContentCollections/ContentStaging.cs 1 diff --git a/test/LayoutAreaDataBakeSites.allow b/test/LayoutAreaDataBakeSites.allow index 8b332134a6..384123060c 100644 --- a/test/LayoutAreaDataBakeSites.allow +++ b/test/LayoutAreaDataBakeSites.allow @@ -12,7 +12,6 @@ memex/Memex.Portal.Shared/Settings/ServiceIdentitiesSettingsTab.cs 1 memex/Memex.Portal.Shared/Settings/UpdatePolicySettingsTab.cs 1 memex/Memex.Portal.Shared/Settings/WhatsNewSettingsTab.cs 1 samples/Graph/Data/ACME/Project/Source/ProjectLayoutAreas.cs 5 -samples/Todo/MeshWeaver.Todo/LayoutAreas/TodoLayoutAreas.cs 7 src/MeshWeaver.GitSync/GitHubSyncSettingsTab.cs 1 src/MeshWeaver.Graph/ExportLayoutArea.cs 1 src/MeshWeaver.Graph/GlobalSettingsLayoutArea.cs 1 diff --git a/test/MeshWeaver.Documentation.Test/DataPlaneMessageRatchetGuard.cs b/test/MeshWeaver.Documentation.Test/DataPlaneMessageRatchetGuard.cs index d67d64e364..159289e482 100644 --- a/test/MeshWeaver.Documentation.Test/DataPlaneMessageRatchetGuard.cs +++ b/test/MeshWeaver.Documentation.Test/DataPlaneMessageRatchetGuard.cs @@ -59,7 +59,7 @@ public class DataPlaneMessageRatchetGuard(ITestOutputHelper output) { ["GetDataRequest"] = 18, ["GetDataResponse"] = 26, - ["DataChangeRequest"] = 11, + ["DataChangeRequest"] = 7, ["PatchDataChangeRequest"] = 0, ["DataChangedEvent"] = 0, }.ToImmutableDictionary(StringComparer.Ordinal); diff --git a/test/MeshWeaver.Layout.Test/MeshWeaver.Layout.Test.csproj b/test/MeshWeaver.Layout.Test/MeshWeaver.Layout.Test.csproj index 37878711b5..5e08911024 100644 --- a/test/MeshWeaver.Layout.Test/MeshWeaver.Layout.Test.csproj +++ b/test/MeshWeaver.Layout.Test/MeshWeaver.Layout.Test.csproj @@ -10,6 +10,9 @@ + + diff --git a/test/MeshWeaver.Layout.Test/TodoRowScopedActionsTest.cs b/test/MeshWeaver.Layout.Test/TodoRowScopedActionsTest.cs new file mode 100644 index 0000000000..4dca272712 --- /dev/null +++ b/test/MeshWeaver.Layout.Test/TodoRowScopedActionsTest.cs @@ -0,0 +1,369 @@ +using System.Collections; +using System.Collections.Immutable; +using System.Reactive.Linq; +using System.Reactive.Subjects; +using System.Reflection; +using System.Text.Json; +using MeshWeaver.Data; +using MeshWeaver.Fixture; +using MeshWeaver.Layout.Composition; +using MeshWeaver.Messaging; +using MeshWeaver.Todo.Domain; +using MeshWeaver.Todo.LayoutAreas; +using Xunit; + +namespace MeshWeaver.Layout.Test; + +/// +/// The Todo sample's areas are TEMPLATES (Doc/GUI/DataBinding → "Templates first, data later") whose +/// per-row buttons are ROW-SCOPED (→ "Row-scoped actions"). Before, each area waited for the todos on +/// the hub and baked one button per todo with the todo captured in its closure; now the page renders +/// at once, the rows bind to a projection, and each button exists ONCE in the row template — the click +/// carries the row it came from. These tests pin both halves: the page renders with no data, and +/// clicking a button in row k acts on the todo of row k, for every k, also after the list has changed. +/// +public class TodoRowScopedActionsTest(ITestOutputHelper output) : HubTestBase(output) +{ + private const string NoDataArea = "NoData"; + private const string Assignee = "Jordan Smith"; + + private static TodoItem Todo(string id, string person = Assignee, TodoStatus status = TodoStatus.Pending) => new() + { + Id = id, + Title = $"Task {id}", + Category = "Work", + ResponsiblePerson = person, + Status = status, + DueDate = DateTime.Now.Date.AddDays(3), + CreatedAt = new DateTime(2026, 1, 1, 0, 0, 0, DateTimeKind.Utc).AddMinutes(id[0]), + }; + + /// Four pending todos assigned to someone, and three unassigned ones. + private static readonly ImmutableList Initial = + [ + Todo("a"), Todo("b"), Todo("c"), Todo("d"), + Todo("u", "Unassigned"), Todo("v", "Unassigned"), Todo("w", "Unassigned"), + ]; + + private static readonly string[] Areas = + [ + nameof(TodoLayoutAreas.AllItems), nameof(TodoLayoutAreas.TodosByCategory), nameof(TodoLayoutAreas.Summary), + nameof(TodoLayoutAreas.Planning), nameof(TodoLayoutAreas.MyTasks), nameof(TodoLayoutAreas.Backlog), + nameof(TodoLayoutAreas.TodaysFocus), + ]; + + /// What each area returned on its first render, captured as the area returned it. + private readonly ReplaySubject<(string Area, UiControl Control)> rendered = new(); + + /// + protected override MessageHubConfiguration ConfigureHost(MessageHubConfiguration configuration) + => base.ConfigureHost(configuration) + .WithPostingIdentity(PostingIdentity.System) + .WithRoutes(r => r.RouteAddress(ClientType, (_, d) => d.Package())) + .WithTypes(typeof(TodoStatus), typeof(TodoEntry)) + .AddData(data => data.AddSource(ds => ds.WithType(t => t + .WithKey(todo => todo.Id) + .WithInitialData(Initial)))) + .AddLayout(layout => Areas + .Aggregate(layout, (l, area) => l.WithView(area, (host, ctx) => Capture(area, Render(area, host, ctx)))) + // The template with a feed that NEVER answers: the page must still render. + .WithView(NoDataArea, (host, _) => TodoLayoutAreas.Page(host, "Todo", Typography.H4, withAdd: true, + Observable.Never>()))); + + /// + protected override MessageHubConfiguration ConfigureClient(MessageHubConfiguration configuration) + => base.ConfigureClient(configuration).AddLayoutClient(d => d); + + private static UiControl Render(string area, LayoutAreaHost host, RenderingContext ctx) => area switch + { + nameof(TodoLayoutAreas.AllItems) => TodoLayoutAreas.AllItems(host, ctx), + nameof(TodoLayoutAreas.TodosByCategory) => TodoLayoutAreas.TodosByCategory(host, ctx), + nameof(TodoLayoutAreas.Summary) => TodoLayoutAreas.Summary(host, ctx), + nameof(TodoLayoutAreas.Planning) => TodoLayoutAreas.Planning(host, ctx), + nameof(TodoLayoutAreas.MyTasks) => TodoLayoutAreas.MyTasks(host, ctx), + nameof(TodoLayoutAreas.Backlog) => TodoLayoutAreas.Backlog(host, ctx), + _ => TodoLayoutAreas.TodaysFocus(host, ctx), + }; + + private UiControl Capture(string area, UiControl control) + { + rendered.OnNext((area, control)); + return control; + } + + // ── Templates first ──────────────────────────────────────────────────────────────────────── + + /// Every Todo area returns a control tree with no deferred view: nothing in it renders + /// only once the todos have arrived; the rows are ONE bound list. + [HubFact] + public async Task EveryTodoArea_IsATemplate() + { + foreach (var area in Areas) + { + var stream = Open(area); + await stream.GetControlStream(area).Should().Within(10.Seconds()).Match( + c => c is LayoutGridControl, $"{area} renders its page", TestContext.Current.CancellationToken); + var (_, control) = await rendered.Where(r => r.Area == area).Should().Within(10.Seconds()) + .Emit($"{area} was rendered", TestContext.Current.CancellationToken); + + EveryViewIsStatic(control); + Descendants(control).OfType().Should().ContainSingle( + $"{area}'s rows are ONE bound list, not a control per todo"); + } + } + + /// The page renders — title, Add action, and the row template — while its feed has not + /// answered at all: its first emission waits on no data. + [HubFact] + public async Task ThePageRenders_BeforeAnyTodoHasArrived() + { + var stream = Open(NoDataArea); + var list = await ListArea(stream, NoDataArea); + await stream.GetControlStream($"{list}/{ItemTemplateControl.ViewArea}").Should().Within(10.Seconds()).Match( + c => c is LayoutGridControl, + "the row template is part of the page before any row exists", + TestContext.Current.CancellationToken); + } + + // ── Row-scoped actions ───────────────────────────────────────────────────────────────────── + + /// The primary action ("Start") in row k starts the todo of row k — for every k, each + /// click with the row as it was first rendered — and touches no other todo. + [HubFact] + public async Task ThePrimaryActionInRowK_StartsTodoK() + { + var area = nameof(TodoLayoutAreas.AllItems); + var stream = Open(area); + var template = await Template(stream, area); + var primary = await Child(stream, await Child(stream, await Child(stream, template, 3), 0), 0); + var rows = await ItemRows(stream, area, r => r.Item?.ResponsiblePerson == Assignee, 4); + + for (var k = 0; k < rows.Length; k++) + { + Click(stream, primary, rows[k].Row); + var started = rows.Take(k + 1).Select(r => TodoOf(r.Entry).Id).ToImmutableHashSet(); + await Todos().Should().Within(10.Seconds()).Match( + todos => todos.Where(t => t.ResponsiblePerson == Assignee) + .All(t => (t.Status == TodoStatus.InProgress) == started.Contains(t.Id)), + $"Start in row {k} starts todo {TodoOf(rows[k].Entry).Id} and no other", + TestContext.Current.CancellationToken); + } + } + + /// The list changes between the render and the click — the todo above is deleted, so + /// another todo sits in the clicked slot — and Delete still deletes the todo that was clicked. + [HubFact] + public async Task AfterTheListChanged_DeleteStillActsOnTheClickedTodo() + { + var area = nameof(TodoLayoutAreas.AllItems); + var stream = Open(area); + var template = await Template(stream, area); + var primary = await Child(stream, await Child(stream, await Child(stream, template, 3), 0), 0); + var delete = await Child(stream, primary, 4); + var rows = await ItemRows(stream, area, r => r.Item?.ResponsiblePerson == Assignee, 4); + + Click(stream, delete, rows[1].Row); // "b" + await Todos().Should().Within(10.Seconds()).Match(t => t.All(x => x.Id != "b"), + "Delete in row 1 deletes b", TestContext.Current.CancellationToken); + await ItemRows(stream, area, r => r.Item?.ResponsiblePerson == Assignee, 3); + + Click(stream, delete, rows[2].Row); // "c" as first rendered; the slot now holds "d" + await Todos().Should().Within(10.Seconds()).Match( + t => t.All(x => x.Id != "c") && t.Any(x => x.Id == "d") && t.Any(x => x.Id == "a"), + "the person clicked c; d, which moved into its slot, is not theirs to delete", + TestContext.Current.CancellationToken); + } + + /// In the Backlog, team member j's entry in row k's assignment menu assigns todo k to + /// member j — for every k. + [HubFact] + public async Task TheAssignMenuInRowK_AssignsTodoK() + { + var area = nameof(TodoLayoutAreas.Backlog); + var stream = Open(area); + var template = await Template(stream, area); + var assignMenu = await Child(stream, await Child(stream, await Child(stream, template, 3), 1), 0); + var rows = await ItemRows(stream, area, r => r.Item is not null, 3); + + for (var k = 0; k < rows.Length; k++) + { + var member = ResponsiblePersons.AvailablePersons[k + 1]; + Click(stream, await Child(stream, assignMenu, k + 1), rows[k].Row); + var id = TodoOf(rows[k].Entry).Id; + await Todos().Should().Within(10.Seconds()).Match( + todos => todos.Single(t => t.Id == id).ResponsiblePerson == member, + $"member {k + 1} in row {k}'s menu assigns {id} to {member}", + TestContext.Current.CancellationToken); + } + } + + /// A section's group action acts on the group of THAT heading row: "Start All" on the + /// pending section starts exactly the four assigned todos and none of the unassigned ones. + [HubFact] + public async Task TheGroupActionOfAHeadingRow_ActsOnItsGroup() + { + var area = nameof(TodoLayoutAreas.AllItems); + var stream = Open(area); + var template = await Template(stream, area); + var group = await Child(stream, template, 1); + var heading = (await Entries(stream, area, 1)).Single(r => r.Entry.Key == $"assigned-{TodoStatus.Pending}"); + + Click(stream, group, heading.Row); + await Todos().Should().Within(10.Seconds()).Match( + todos => todos.All(t => (t.Status == TodoStatus.InProgress) == (t.ResponsiblePerson == Assignee)), + "Start All on the assigned-pending section starts its four todos and nothing else", + TestContext.Current.CancellationToken); + } + + /// NEGATIVE CONTROL: the same buttons clicked with no row act on nothing — the todo comes + /// from the row on the click and from nothing else. + [HubFact] + public async Task AClickWithNoRow_ActsOnNothing() + { + var area = nameof(TodoLayoutAreas.AllItems); + var stream = Open(area); + var template = await Template(stream, area); + var primary = await Child(stream, await Child(stream, await Child(stream, template, 3), 0), 0); + var group = await Child(stream, template, 1); + await ItemRows(stream, area, r => r.Item is not null, Initial.Count); + + Click(stream, primary, row: null); + Click(stream, group, row: null); + + await Todos().Where(todos => todos.Any(t => t.Status != TodoStatus.Pending)).Should().NotEmit( + 500.Milliseconds(), "with no row the actions cannot know which todo, and must not guess", + TestContext.Current.CancellationToken); + } + + // ── Projection ───────────────────────────────────────────────────────────────────────────── + + /// The projection decides which secondary actions a todo offers, by its status. + [Theory] + [InlineData(TodoStatus.Pending, true, false, true)] + [InlineData(TodoStatus.InProgress, false, true, true)] + [InlineData(TodoStatus.Completed, false, false, false)] + [InlineData(TodoStatus.Cancelled, false, false, false)] + public void TheRowOffersTheActionsItsStatusAllows(TodoStatus status, bool complete, bool pause, bool cancel) + { + var row = TodoProjections.ItemRow(Todo("x", status: status), English, TodoStyles.Card); + (row.CompleteStyle != TodoStyles.Hidden).Should().Be(complete); + (row.PauseStyle != TodoStyles.Hidden).Should().Be(pause); + (row.CancelStyle != TodoStyles.Hidden).Should().Be(cancel); + row.ActionsStyle.Should().NotBe(TodoStyles.Hidden); + row.AssignStyle.Should().Be(TodoStyles.Hidden); + row.HeadingStyle.Should().Be(TodoStyles.Hidden, "an item row shows no heading"); + } + + private static readonly TodoViewText English = + new((key, args) => LocalizationCatalog.Get(key, "en", args), System.Globalization.CultureInfo.InvariantCulture); + + // ── Harness ──────────────────────────────────────────────────────────────────────────────── + + private ISynchronizationStream Open(string area) + => GetClient().GetWorkspace().GetRemoteStream( + CreateHostAddress(), new LayoutAreaReference(area)); + + /// The value, asserted present — the test fails here, by name, when it is not. + private static T Present(T? value) where T : class + { + Assert.NotNull(value); + return value; + } + + /// The todo a row carries; a heading row carries none, and a test that asks for it there fails. + private static TodoItem TodoOf(TodoEntry entry) => Present(entry.Item); + + private IObservable> Todos() + => Present(GetHost().GetWorkspace().GetStream()).Select(t => (IReadOnlyCollection)(t ?? [])); + + /// The area of the page's row list (its last child). + private static async Task ListArea(ISynchronizationStream stream, string area) + { + var page = Assert.IsType(await stream.GetControlStream(area).Should().Within(10.Seconds()).Match( + c => c is LayoutGridControl, "the page renders", TestContext.Current.CancellationToken)); + return Present(page.Areas.Last().Area.ToString()); + } + + private static async Task Template(ISynchronizationStream stream, string area) + { + var template = $"{await ListArea(stream, area)}/{ItemTemplateControl.ViewArea}"; + await stream.GetControlStream(template).Should().Within(10.Seconds()).Match( + c => c is LayoutGridControl, "the row template renders once", TestContext.Current.CancellationToken); + return template; + } + + private static async Task Child(ISynchronizationStream stream, string area, int index) + { + var container = Assert.IsAssignableFrom(await stream.GetControlStream(area).Should().Within(10.Seconds()).Match( + c => c is IContainerControl, $"{area} renders", TestContext.Current.CancellationToken)); + return Present(container.Areas.ElementAt(index).Area.ToString()); + } + + /// The rows as the client's mirror holds them, once it holds at least + /// , each with the the client posts for it. + private async Task> Entries( + ISynchronizationStream stream, string area, int min) + { + var pointer = LayoutAreaReference.GetDataPointer(TodoLayoutAreas.EntriesId); + var rows = await stream.GetDataStream(new JsonPointerReference(pointer)) + .Should().Within(10.Seconds()).Match( + r => r.ValueKind == JsonValueKind.Array && r.GetArrayLength() >= min, + $"the client mirror holds {area}'s rows", TestContext.Current.CancellationToken); + return [.. rows.EnumerateArray().Select((r, i) => ( + Present(r.Deserialize(GetClient().JsonSerializerOptions)), + new RowContext { Pointer = $"{pointer}/{i}", Index = i, Value = r.Clone() }))]; + } + + private async Task> ItemRows( + ISynchronizationStream stream, string area, Func which, int count) + { + var pointer = LayoutAreaReference.GetDataPointer(TodoLayoutAreas.EntriesId); + await stream.GetDataStream(new JsonPointerReference(pointer)) + .Should().Within(10.Seconds()).Match( + r => r.ValueKind == JsonValueKind.Array && r.EnumerateArray() + .Count(e => e.Deserialize(GetClient().JsonSerializerOptions) is { } entry && which(entry)) == count, + $"{area} shows {count} matching todo rows", TestContext.Current.CancellationToken); + return [.. (await Entries(stream, area, count)).Where(r => which(r.Entry))]; + } + + private static void Click(ISynchronizationStream stream, string area, RowContext? row) + => stream.SubmitUserAction(new ClickedEvent(area, stream.StreamId) { Row = row }, + actingUser: null, onRefused: null, onAccepted: null); + + private static void EveryViewIsStatic(UiControl root) + { + foreach (var control in Descendants(root)) + { + if (Member(control.GetType(), "Views")?.GetValue(control) is not IEnumerable views) + continue; + var deferred = views.OfType().Where(v => v is not UiControl).Select(v => v.GetType().Name).ToList(); + deferred.Should().BeEmpty( + $"{control.GetType().Name} carries {deferred.Count} deferred view(s) — a view that renders only once " + + "data has arrived. A template binds its data instead."); + } + } + + private static IEnumerable Descendants(UiControl root) + { + yield return root; + if (root is ItemTemplateControl template) + foreach (var d in Descendants(template.View)) + yield return d; + if (Member(root.GetType(), "Views")?.GetValue(root) is IEnumerable views) + foreach (var v in views) + if (v is UiControl child) + foreach (var d in Descendants(child)) + yield return d; + } + + private static PropertyInfo? Member(Type? t, string name) + { + for (; t is not null; t = t.BaseType) + { + var p = t.GetProperty(name, BindingFlags.Instance | BindingFlags.NonPublic | BindingFlags.DeclaredOnly); + if (p is not null) + return p; + } + return null; + } +}