feat: add configurable subtitle and explanation inputs

src/app/child-dev-project/notes/dashboard-widgets/important-notes-dashboard/important-notes-dashboard.component.html

@@ -1,7 +1,8 @@
 <app-dashboard-list-widget
   icon="exclamation-triangle"
-  subtitle="Notes needing follow-up"
-  i18n-subtitle="subtitle|dashboard showing notes that require action"
+  [subtitle]="subtitle"
+  [explanation]="explanation"
+  i18n-explanation
   theme="note"
   entityType="Note"
   [dataMapper]="dataMapper"

src/app/child-dev-project/notes/dashboard-widgets/important-notes-dashboard/important-notes-dashboard.component.ts

@@ -31,6 +31,11 @@ export class ImportantNotesDashboardComponent extends DashboardWidget {
     super();
   }
 
+  @Input() subtitle: string =
+    $localize`:dashboard widget subtitle:Notes needing follow-up`;
+  @Input() explanation: string =
+    $localize`:dashboard widget explanation:'Notes require immediate attention or follow-up actions'`;
+
   private noteIsRelevant(note: Note): boolean {
     return this.warningLevels.includes(note.warningLevel.id);
   }

src/app/core/config/config-fix.ts

@@ -98,20 +98,34 @@ export const defaultJsonConfig = {
                 link: "/public-form/test",
               },
             ],
+             subtitle: $localize`:Shortcut dashboard subtitle:Quick Actions`, 
+        explanation: $localize`:Shortcut dashboard explanation:Shortcuts to quickly navigate to common actions.`
           },
         },
         {
           component: "EntityCountDashboard",
+          config:{
+            subtitle: $localize`:Subtitle: Entity Group Counts`,
+            explanation: $localize`:Explanation: Displays counts of entities grouped by center and gender`,
+
+            entityType: "Child",  // Entity type to group by (e.g., "Child", "Teacher")
+            groupBy: ["center", "gender"],  // Fields to group by
+          }
         },
         {
           component: "ImportantNotesDashboard",
           config: {
             warningLevels: ["WARNING", "URGENT"],
+            subtitle: $localize`:Subtitle:Notes Needing Follow-Up`,
+            explanation: $localize`:Explanation:These notes require immediate attention or follow-up actions.`,
           },
         },
         {
           component: "TodosDashboard",
-          config: {},
+          config: {
+            subtitle: $localize`:Subtitle:Tasks Due`,
+            explanation: $localize`:Explanation:Tasks that are due and require completion soon.`,
+          },
         },
         {
           component: "NotesDashboard",
@@ -155,10 +169,16 @@ export const defaultJsonConfig = {
           component: "ProgressDashboard",
           config: {
             dashboardConfigId: "1",
+            subtitle: $localize`:Subtitle:Progress Overview`,
+            explanation: $localize`:Explanation:Shows the progress of different parts of project tasks. You can use this to track any kind of targets.`,
           },
         },
         {
           component: "BirthdayDashboard",
+          config:{
+            subtitle: $localize`:Subtitle:Upcoming Birthdays`,
+            explanation: $localize`:Explanation:Shows upcoming birthdays`,
+          }
         },
       ],
     },

src/app/features/dashboard-widgets/birthday-dashboard-widget/birthday-dashboard/birthday-dashboard.component.html

@@ -1,8 +1,10 @@
 <app-dashboard-list-widget
   icon="birthday-cake"
   theme="child"
-  subtitle="Upcoming Birthdays"
+  [subtitle]="subtitle"
   i18n-subtitle="Subtitle of the birthday widget"
+  [explanation]="explanation"
+  i8n-explanation
   [entries]="entries"
 >
   <div class="table-wrapper">

src/app/features/dashboard-widgets/birthday-dashboard-widget/birthday-dashboard/birthday-dashboard.component.ts

@@ -55,6 +55,10 @@ export class BirthdayDashboardComponent
 
   entries: EntityWithBirthday[];
 
+  @Input() subtitle: string =
+    $localize`:dashboard widget subtitle:Upcoming Birthdays`;
+  @Input() explanation: string;
+
   constructor(private entityMapper: EntityMapperService) {
     super();
     this.today = new Date();

src/app/features/dashboard-widgets/entity-count-dashboard-widget/entity-count-dashboard/entity-count-dashboard.component.html

@@ -2,7 +2,9 @@
   [icon]="entityIcon"
   theme="child"
   [title]="totalEntities"
-  [subtitle]="label"
+  [subtitle]="subtitle ?? label"
+  [explanation]="explanation"
+  i18n-explanation
   [entries]="entityGroupCounts[groupBy[currentGroupIndex]]"
   [paginationPageSize]="4"
 >

src/app/features/dashboard-widgets/entity-count-dashboard-widget/entity-count-dashboard/entity-count-dashboard.component.ts

@@ -121,6 +121,11 @@ export class EntityCountDashboardComponent
   label: string;
   entityIcon: IconName;
 
+  @Input() subtitle: string;
+  @Input() explanation: string =
+    $localize`dashboard widget explanation : 'Counting all "active" records. If configured, you can view different disaggregations by using the arrows below.'
+  "`;
+
   constructor(
     private entityMapper: EntityMapperService,
     private router: Router,

src/app/features/dashboard-widgets/progress-dashboard-widget/progress-dashboard/progress-dashboard.component.html

@@ -2,7 +2,9 @@
   <app-dashboard-list-widget
     icon="list"
     theme="child"
-    [subtitle]="data?.title"
+    [subtitle]="subtitle ?? data.title"
+    [explanation]="explanation"
+    i8n-explanation
     [entries]="data?.parts"
   >
     <div class="table-wrapper">

src/app/features/dashboard-widgets/progress-dashboard-widget/progress-dashboard/progress-dashboard.component.ts

@@ -43,6 +43,11 @@ export class ProgressDashboardComponent
   @Input() dashboardConfigId = "";
   data: ProgressDashboardConfig;
 
+  @Input() subtitle: string =
+    $localize`:dashboard widget subtitle: Progress Overview`;
+  @Input() explanation: string =
+    $localize`:dashboard widget explanation: Shows the progress of different parts of project tasks. You can use this to track any kind of targets.`;
+
   constructor(
     private entityMapper: EntityMapperService,
     private dialog: MatDialog,

src/app/features/dashboard-widgets/shortcut-dashboard-widget/shortcut-dashboard/shortcut-dashboard.component.html

@@ -1,11 +1,13 @@
 <app-dashboard-list-widget
   icon="external-link-alt"
   theme="general"
-  subtitle="Quick actions"
+  [subtitle]="subtitle"
   i18n-subtitle="
     Title of dashboard widget that shows a list of certain actions a user can
     click on
   "
+  [explanation]="explanation"
+  i18n-explanation
   [entries]="_shortcuts"
 >
   <div class="table-container">

src/app/features/dashboard-widgets/shortcut-dashboard-widget/shortcut-dashboard/shortcut-dashboard.component.ts

@@ -44,6 +44,11 @@ export class ShortcutDashboardComponent {
   }
   _shortcuts: MenuItem[] = [];
 
+  @Input() subtitle: string =
+    $localize`dashboard widget subtitle:Quick Actions`;
+  @Input() explanation: string =
+    $localize`dashboard widget explanation:Shortcuts to quickly navigate to common actions`;
+
   constructor(
     private routePermissionsService: RoutePermissionsService,
     private locationStrategy: LocationStrategy,

src/app/features/todos/todos-dashboard/todos-dashboard.component.html

@@ -1,7 +1,8 @@
 <app-dashboard-list-widget
   icon="tasks"
-  subtitle="Tasks due"
+  [subtitle]="subtitle ?? 'Tasks due'"
   i18n-subtitle="subtitle|dashboard showing open todos"
+  [explanation]="explanation ?? 'Tasks that are due'"
   theme="note"
   entityType="Todo"
   [dataMapper]="dataMapper"

src/app/features/todos/todos-dashboard/todos-dashboard.component.ts

@@ -1,4 +1,4 @@
-import { Component } from "@angular/core";
+import { Component, Input } from "@angular/core";
 import { DynamicComponent } from "../../../core/config/dynamic-components/dynamic-component.decorator";
 import { Todo } from "../model/todo";
 import { FormDialogService } from "../../../core/form-dialog/form-dialog.service";
@@ -35,6 +35,9 @@ export class TodosDashboardComponent extends DashboardWidget {
 
   startDateLabel: string = Todo.schema.get("startDate").label;
 
+  @Input() subtitle: string;
+  @Input() explanation: string;
+
   constructor(
     private formDialog: FormDialogService,
     private currentUser: CurrentUserSubject,