feat(fxcore): Add task grouping support to dashboard sidebar

Author: villfa

docs/modules/fxcore.md

@@ -380,6 +380,33 @@ func Register() fx.Option {
 
 Note: you can also use `AsTasks()` to register several tasks at once.
 
+#### Task grouping
+
+If you have many tasks, you can group them in the dashboard sidebar by also implementing the `GroupedTask` interface:
+
+```go title="internal/tasks/example.go"
+func (t *ExampleTask) Group() string {
+	return "my group"
+}
+```
+
+Tasks sharing the same group name will be collapsed under a single expandable entry in the sidebar, sorted alphabetically by group name alongside standalone tasks.
+
+#### Input customisation
+
+By default, each task is rendered in the dashboard with a single-row textarea and a generic placeholder. You can customise this by implementing the `TaskWithTemplateSettings` interface:
+
+```go title="internal/tasks/example.go"
+func (t *ExampleTask) TemplateSettings(settings fxcore.TaskTemplateSettings) fxcore.TaskTemplateSettings {
+	settings.Placeholder   = "Enter a user ID..."  // input placeholder text (default: "Optional input...")
+	settings.DefaultValue  = "42"                  // pre-filled input value (default: "")
+	settings.Rows          = 5                     // number of textarea rows (default: 1)
+	settings.EscapeContent = false                 // set to false to render result message as HTML (default: true)
+
+	return settings
+}
+```
+
 It'll be then available on the core dashboard for execution:
 
 ![](../../assets/images/dash-tasks-light.png#only-light)

fxcore/go.sum

@@ -20,8 +20,6 @@ github.com/ankorstore/yokai/httpserver v1.6.0 h1:Xq3Jh1UM8tMQAnCM1wwGgi+Bm9NZwzJ
 github.com/ankorstore/yokai/httpserver v1.6.0/go.mod h1:AOCL4cK2bPKrtGFULvOvc8mKHAOw2bLW30CKJra2BB0=
 github.com/ankorstore/yokai/log v1.2.0 h1:jiuDiC0dtqIGIOsFQslUHYoFJ1qjI+rOMa6dI1LBf2Y=
 github.com/ankorstore/yokai/log v1.2.0/go.mod h1:MVvUcms1AYGo0BT6l88B9KJdvtK6/qGKdgyKVXfbmyc=
-github.com/ankorstore/yokai/trace v1.3.0 h1:0ji32oymIcxTmH5h6GRWLo5ypwBbWrZkXRf9rWF9070=
-github.com/ankorstore/yokai/trace v1.3.0/go.mod h1:m7EL2MRBilgCtrly5gA4F0jkGSXR2EbG6LsotbTJ4nA=
 github.com/ankorstore/yokai/trace v1.4.0 h1:AdEQs/4TEuqOJ9p/EfsQmrtmkSG3pcmE7r/l+FQFxY8=
 github.com/ankorstore/yokai/trace v1.4.0/go.mod h1:m7EL2MRBilgCtrly5gA4F0jkGSXR2EbG6LsotbTJ4nA=
 github.com/arl/statsviz v0.6.0 h1:jbW1QJkEYQkufd//4NDYRSNBpwJNrdzPahF7ZmoGdyE=

fxcore/module.go

@@ -521,7 +521,7 @@ func withHandlers(coreServer *echo.Echo, p FxCoreParam) (*echo.Echo, error) {
 				"overviewTraceProcessorExpose": overviewTraceProcessorExpose,
 				"tasksExpose":                  tasksExpose,
 				"tasksPath":                    tasksPath,
-				"tasksNames":                   p.TaskRegistry.Names(),
+				"tasksItems":                   p.TaskRegistry.ListItems(),
 				"tasksTemplateSettings":        p.TaskRegistry.TemplateSettings(),
 				"metricsExpose":                metricsExpose,
 				"metricsPath":                  metricsPath,

fxcore/task.go

@@ -21,6 +21,10 @@ type Task interface {
 	Run(ctx context.Context, input []byte) TaskResult
 }
 
+type GroupedTask interface {
+	Group() string
+}
+
 type TaskWithTemplateSettings interface {
 	TemplateSettings(settings TaskTemplateSettings) TaskTemplateSettings
 }
@@ -77,6 +81,38 @@ func (r *TaskRegistry) Names() []string {
 	return names
 }
 
+// TaskListItem represents either a standalone task or a group of tasks in the dashboard sidebar.
+type TaskListItem struct {
+	Name    string
+	IsGroup bool
+	Tasks   []string
+}
+
+// ListItems returns the list of TaskListItem for the dashboard sidebar, sorted by name, collapsing
+// tasks that share the same group under a single group entry.
+func (r *TaskRegistry) ListItems() []TaskListItem {
+	groups := make(map[string][]string)
+	var items []TaskListItem
+
+	for _, name := range r.Names() {
+		if gt, ok := r.tasks[name].(GroupedTask); ok {
+			groups[gt.Group()] = append(groups[gt.Group()], name)
+		} else {
+			items = append(items, TaskListItem{Name: name})
+		}
+	}
+
+	for group, tasks := range groups {
+		items = append(items, TaskListItem{Name: group, IsGroup: true, Tasks: tasks})
+	}
+
+	sort.Slice(items, func(i, j int) bool {
+		return items[i].Name < items[j].Name
+	})
+
+	return items
+}
+
 func (r *TaskRegistry) TemplateSettings() map[string]TaskTemplateSettings {
 	settings := make(map[string]TaskTemplateSettings)
 

fxcore/task_test.go

@@ -110,4 +110,47 @@ func TestTaskRegistry(t *testing.T) {
 		assert.Equal(t, 5, templateSettings.Rows)
 		assert.False(t, templateSettings.EscapeContent)
 	})
+
+	t.Run("test list items without groups", func(t *testing.T) {
+		t.Parallel()
+
+		registry := createRegistry(t)
+		items := registry.ListItems()
+
+		assert.Equal(t, []fxcore.TaskListItem{
+			{Name: "error"},
+			{Name: "success"},
+			{Name: "template-settings"},
+		}, items)
+	})
+
+	t.Run("test list items with groups", func(t *testing.T) {
+		t.Parallel()
+
+		cfg, err := config.NewDefaultConfigFactory().Create(
+			config.WithFilePaths("./testdata/config"),
+		)
+		assert.NoError(t, err)
+
+		registry := fxcore.NewTaskRegistry(fxcore.TaskRegistryParams{
+			Tasks: []fxcore.Task{
+				tasks.NewSuccessTask(cfg),                    // standalone: "success"
+				tasks.NewGroupedTask("alpha", "my group"),    // group "my group"
+				tasks.NewGroupedTask("beta", "my group"),     // group "my group"
+				tasks.NewGroupedTask("gamma", "other group"), // group "other group"
+				tasks.NewErrorTask(),                         // standalone: "error"
+			},
+		})
+
+		items := registry.ListItems()
+
+		// Items sorted by name: "error", "my group", "other group", "success"
+		// Tasks within groups are in alphabetical order (from r.Names() iteration)
+		assert.Equal(t, []fxcore.TaskListItem{
+			{Name: "error"},
+			{Name: "my group", IsGroup: true, Tasks: []string{"alpha", "beta"}},
+			{Name: "other group", IsGroup: true, Tasks: []string{"gamma"}},
+			{Name: "success"},
+		}, items)
+	})
 }

fxcore/templates/dashboard.html

@@ -124,11 +124,26 @@
                             <i class="bi bi-clipboard2-check"></i>&nbsp;&nbsp;Tasks
                         </div>
                         <div class="list-group list-group-flush">
-                            {{ range $taskName := .tasksNames }}
-                            {{ $settings := index $.tasksTemplateSettings $taskName }}
-                            <a @click="loadContent" href="#" role="button" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" title="Task {{ $taskName }}" data-title='<i class="bi bi-clipboard2"></i>&nbsp;&nbsp;Task {{ $taskName }}' data-type="task" data-task="{{ $taskName }}" data-view="task" data-placeholder="{{ $settings.Placeholder }}" data-default-value="{{ $settings.DefaultValue }}" data-rows="{{ $settings.Rows }}" data-escape-content="{{ $settings.EscapeContent }}">
-                                <span><i class="bi bi-clipboard2"></i>&nbsp;&nbsp;{{ $taskName }}</span>
+                            {{ range $i, $item := .tasksItems }}
+                            {{ if $item.IsGroup }}
+                            <a class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" data-bs-toggle="collapse" href="#task-group-{{ $i }}" role="button" aria-expanded="false" aria-controls="task-group-{{ $i }}">
+                                <span><i class="bi bi-folder2"></i>&nbsp;&nbsp;{{ $item.Name }}</span>
+                                <i class="bi bi-chevron-down"></i>
                             </a>
+                            <div class="collapse" id="task-group-{{ $i }}">
+                                {{ range $taskName := $item.Tasks }}
+                                {{ $settings := index $.tasksTemplateSettings $taskName }}
+                                <a @click="loadContent" href="#" role="button" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center ps-4" title="Task {{ $taskName }}" data-title='<i class="bi bi-clipboard2"></i>&nbsp;&nbsp;Task {{ $taskName }}' data-type="task" data-task="{{ $taskName }}" data-view="task" data-placeholder="{{ $settings.Placeholder }}" data-default-value="{{ $settings.DefaultValue }}" data-rows="{{ $settings.Rows }}" data-escape-content="{{ $settings.EscapeContent }}">
+                                    <span><i class="bi bi-clipboard2"></i>&nbsp;&nbsp;{{ $taskName }}</span>
+                                </a>
+                                {{ end }}
+                            </div>
+                            {{ else }}
+                            {{ $settings := index $.tasksTemplateSettings $item.Name }}
+                            <a @click="loadContent" href="#" role="button" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center" title="Task {{ $item.Name }}" data-title='<i class="bi bi-clipboard2"></i>&nbsp;&nbsp;Task {{ $item.Name }}' data-type="task" data-task="{{ $item.Name }}" data-view="task" data-placeholder="{{ $settings.Placeholder }}" data-default-value="{{ $settings.DefaultValue }}" data-rows="{{ $settings.Rows }}" data-escape-content="{{ $settings.EscapeContent }}">
+                                <span><i class="bi bi-clipboard2"></i>&nbsp;&nbsp;{{ $item.Name }}</span>
+                            </a>
+                            {{ end }}
                             {{ else }}
                             <a class="list-group-item list-group-item-action disabled" aria-disabled="true">
                                 <i class="bi bi-slash-circle"></i>&nbsp;&nbsp;n/a

fxcore/testdata/tasks/grouped_task.go

@@ -0,0 +1,34 @@
+package tasks
+
+import (
+	"context"
+
+	"github.com/ankorstore/yokai/fxcore"
+)
+
+var _ fxcore.Task = (*GroupedTask)(nil)
+var _ fxcore.GroupedTask = (*GroupedTask)(nil)
+
+type GroupedTask struct {
+	name  string
+	group string
+}
+
+func NewGroupedTask(name, group string) *GroupedTask {
+	return &GroupedTask{name: name, group: group}
+}
+
+func (t *GroupedTask) Name() string {
+	return t.name
+}
+
+func (t *GroupedTask) Group() string {
+	return t.group
+}
+
+func (t *GroupedTask) Run(context.Context, []byte) fxcore.TaskResult {
+	return fxcore.TaskResult{
+		Success: true,
+		Message: "grouped task " + t.name,
+	}
+}