From 0d42ed0d1520ae88113c36d6e6e68c003ca5acd2 Mon Sep 17 00:00:00 2001
From: samuelmbabhazi <samuelmbabhazi@gmail.com>
Date: Fri, 4 Oct 2024 16:21:06 +0200
Subject: [PATCH] [Bug] Only the first task/project displayed(Group By Date)

---
 packages/contracts/src/timesheet.model.ts     |   7 +-
 .../get-time-log-group-by-date.handler.ts     |  11 +-
 .../daily-grid/daily-grid.component.html      | 124 +++++++++---------
 .../daily-grid/daily-grid.component.scss      |  96 +++++++-------
 .../report/daily-grid/daily-grid.module.ts    |   4 +-
 5 files changed, 126 insertions(+), 116 deletions(-)

diff --git a/packages/contracts/src/timesheet.model.ts b/packages/contracts/src/timesheet.model.ts
index 2d79dda174c..d34242c35c0 100644
--- a/packages/contracts/src/timesheet.model.ts
+++ b/packages/contracts/src/timesheet.model.ts
@@ -98,7 +98,8 @@ export interface IDateRange {
 export interface ITimeLog
 	extends IBasePerTenantAndOrganizationEntityModel,
 		IRelationalOrganizationProject,
-		IRelationalOrganizationTeam, ITaggable {
+		IRelationalOrganizationTeam,
+		ITaggable {
 	employee: IEmployee;
 	employeeId: ID;
 	timesheet?: ITimesheet;
@@ -397,7 +398,7 @@ export interface IReportDayGroupByDate {
 	logs: {
 		project: IOrganizationProject;
 		employeeLogs: {
-			task: ITask;
+			tasks: ITask[];
 			employee: IEmployee;
 			sum: number;
 			activity: number;
@@ -419,7 +420,7 @@ export interface IReportDayGroupByDate {
 	logs: {
 		project: IOrganizationProject;
 		employeeLogs: {
-			task: ITask;
+			tasks: ITask[];
 			employee: IEmployee;
 			sum: number;
 			activity: number;
diff --git a/packages/core/src/time-tracking/time-log/commands/handlers/get-time-log-group-by-date.handler.ts b/packages/core/src/time-tracking/time-log/commands/handlers/get-time-log-group-by-date.handler.ts
index 717ee653396..4b3030823dd 100644
--- a/packages/core/src/time-tracking/time-log/commands/handlers/get-time-log-group-by-date.handler.ts
+++ b/packages/core/src/time-tracking/time-log/commands/handlers/get-time-log-group-by-date.handler.ts
@@ -77,14 +77,17 @@ export class GetTimeLogGroupByDateHandler implements ICommandHandler<GetTimeLogG
 
 				// Retrieve employee details
 				const employee = timeLogs.length > 0 ? timeLogs[0].employee : null;
-				const task = timeLogs.length > 0 ? timeLogs[0].task : null;
-				const description = timeLogs.length > 0 ? timeLogs[0].description : null;
+
+				const tasks = timeLogs.map((log) => ({
+					task: log.task,
+					description: log.description,
+					duration: log.duration
+				}));
 
 				return {
-					description,
 					employee,
 					sum,
-					task,
+					tasks,
 					activity: parseFloat(parseFloat(avgActivity + '').toFixed(2))
 				};
 			})
diff --git a/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.html b/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.html
index 8549bd40370..5c5e011ba98 100644
--- a/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.html
+++ b/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.html
@@ -150,75 +150,77 @@
 	</ng-template>
 </div>
 <ng-template class="table-template" let-day #groupByDateCardEl>
-	<div class="cart-body project-row" *ngFor="let logs of day.logs">
-		<div class="table-row" *ngFor="let employeeLog of logs.employeeLogs">
-			<div class="table-inner-wrapper">
-				<div class="responsive-table-row employee-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.EMPLOYEE' | translate }}
-					</div>
-					<div class="responsive-table-content employee-column">
-						<ng-container *ngTemplateOutlet="employeeEl; context: { $implicit: employeeLog?.employee }">
-						</ng-container>
-					</div>
-				</div>
-				<div class="responsive-table-row project-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.CLIENT' | translate }}
-					</div>
-					<div class="responsive-table-content project-name">
-						<ng-container *ngTemplateOutlet="clientEl; context: { $implicit: logs?.client }">
-						</ng-container>
-					</div>
-				</div>
-				<div class="responsive-table-row project-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.PROJECT' | translate }}
-					</div>
-					<div class="responsive-table-content project-name">
-						<ng-container *ngTemplateOutlet="projectEl; context: { $implicit: logs?.project }">
-						</ng-container>
-					</div>
-				</div>
-				<div class="responsive-table-row todo-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.TO_DO' | translate }}
-					</div>
-					<div class="responsive-table-content day-col">
-						<ng-container *ngTemplateOutlet="taskEl; context: { $implicit: employeeLog?.task }">
-						</ng-container>
+	<ng-container *ngFor="let logs of day.logs">
+		<div class="cart-body project-row" *ngFor="let employeeLog of logs.employeeLogs">
+			<div class="table-row" *ngFor="let tasks of employeeLog.tasks">
+				<div class="table-inner-wrapper">
+					<div class="responsive-table-row employee-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.EMPLOYEE' | translate }}
+						</div>
+						<div class="responsive-table-content employee-column">
+							<ng-container *ngTemplateOutlet="employeeEl; context: { $implicit: employeeLog?.employee }">
+							</ng-container>
+						</div>
 					</div>
-				</div>
-				<div class="responsive-table-row todo-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.NOTES' | translate }}
+					<div class="responsive-table-row project-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.CLIENT' | translate }}
+						</div>
+						<div class="responsive-table-content project-name">
+							<ng-container *ngTemplateOutlet="clientEl; context: { $implicit: logs?.client }">
+							</ng-container>
+						</div>
 					</div>
-					<div class="responsive-table-content day-col">
-						{{ employeeLog?.description }}
+					<div class="responsive-table-row project-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.PROJECT' | translate }}
+						</div>
+						<div class="responsive-table-content project-name">
+							<ng-container *ngTemplateOutlet="projectEl; context: { $implicit: logs?.project }">
+							</ng-container>
+						</div>
 					</div>
-				</div>
-				<div class="responsive-table-row time-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.TIME' | translate }}
+					<div class="responsive-table-row todo-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.TO_DO' | translate }}
+						</div>
+						<div class="responsive-table-content day-col">
+							<ng-container *ngTemplateOutlet="taskEl; context: { $implicit: tasks?.task }">
+							</ng-container>
+						</div>
 					</div>
-					<div class="responsive-table-content day-col">
-						{{ employeeLog.sum | durationFormat }}
+					<div class="responsive-table-row todo-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.NOTES' | translate }}
+						</div>
+						<div class="responsive-table-content day-col" [nbTooltip]="tasks?.description">
+							{{ tasks?.description | truncate : 40 }}
+						</div>
 					</div>
-				</div>
-				<div class="responsive-table-row activity-column">
-					<div class="responsive-table-header">
-						{{ 'REPORT_PAGE.ACTIVITY' | translate }}
+					<div class="responsive-table-row time-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.TIME' | translate }}
+						</div>
+						<div class="responsive-table-content day-col">
+							{{ tasks.duration | durationFormat }}
+						</div>
 					</div>
-					<div class="responsive-table-content day-col">
-						<nb-badge
-							[status]="getStatus(employeeLog?.activity || 0)"
-							[text]="(employeeLog?.activity || 0) + '%'"
-						></nb-badge>
+					<div class="responsive-table-row activity-column">
+						<div class="responsive-table-header">
+							{{ 'REPORT_PAGE.ACTIVITY' | translate }}
+						</div>
+						<div class="responsive-table-content day-col">
+							<nb-badge
+								[status]="getStatus(employeeLog?.activity || 0)"
+								[text]="(employeeLog?.activity || 0) + '%'"
+							></nb-badge>
+						</div>
 					</div>
 				</div>
 			</div>
 		</div>
-	</div>
+	</ng-container>
 </ng-template>
 
 <ng-template class="table-template" let-employee #groupByEmployeeCardEl>
@@ -464,8 +466,8 @@
 </ng-template>
 
 <ng-template let-task #taskEl>
-	<span *ngIf="task?.title; else noTasks">
-		{{ task?.title }}
+	<span *ngIf="task?.title; else noTasks" [nbTooltip]="task?.title">
+		{{ task?.title | truncate : 40 }}
 	</span>
 	<ng-template #noTasks>
 		<span>{{ 'REPORT_PAGE.NO_TASK' | translate }}</span>
diff --git a/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.scss b/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.scss
index 89fbdda722d..10118629811 100644
--- a/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.scss
+++ b/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.component.scss
@@ -1,74 +1,76 @@
 @import 'report';
 
 .group-by-wrapper {
-	display: flex;
-	align-items: center;
-	gap: 18px;
+  display: flex;
+  align-items: center;
+  gap: 18px;
 }
 
 :host {
-    display: block;
+  display: block;
 
-    .no-data {
-		min-height: 10rem;
-		height: calc(100vh - 57.5rem) !important
-	}
+  .no-data {
+    min-height: 10rem;
+    height: calc(100vh - 57.5rem) !important;
+  }
 
-    ::ng-deep {
-        .select-button {
-            background-color: nb-theme(gauzy-card-1) !important;
-            box-shadow: var(--gauzy-shadow);
-        }
-        .names-wrapper {
-            max-width: 110px;
-        }
+  ::ng-deep {
+    .select-button {
+      background-color: nb-theme(gauzy-card-1) !important;
+      box-shadow: var(--gauzy-shadow);
+    }
+    .names-wrapper {
+      max-width: 110px;
     }
+  }
 }
 
 .employee-column {
-    width: 20%;
-    min-width: 165px;
-    max-width: 200px;
+  width: 20%;
+  min-width: 165px;
+  max-width: 200px;
 }
 .project-column {
-    width: 20%;
-    min-width: 20%;
+  width: 20%;
+  min-width: 20%;
 }
 .todo-column {
-    width: 30%;
-    &.header{
-        width: 28%;
-        &.client{
-            width: 22%;
-        }
+  width: 30%;
+  &.header {
+    width: 28%;
+    &.client {
+      width: 22%;
     }
+  }
 }
 .time-column {
-    width: 15%;
+  width: 15%;
 }
 .activity-column {
-    width: 15%;
+  width: 15%;
 }
 
-
 @include respond(lg) {
-    .employee-column {
-        min-width: auto;
-        max-width: unset;
-    }
-    .single-project-template .headers-wrapper .main-header {
-        white-space: break-spaces;
-    }
+  .employee-column {
+    min-width: auto;
+    max-width: unset;
+  }
+  .single-project-template .headers-wrapper .main-header {
+    white-space: break-spaces;
+  }
 
-    :host {
-        ::ng-deep {
-            .avatar-wrapper {
-                width: unset;
-                max-width: 100%;
-            }
-            .names-wrapper {
-                max-width: unset;
-            }
-        }
+  :host {
+    ::ng-deep {
+      .avatar-wrapper {
+        width: unset;
+        max-width: 100%;
+      }
+      .names-wrapper {
+        max-width: unset;
+      }
     }
+  }
+  .cart-body {
+    cursor: pointer;
+  }
 }
diff --git a/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.module.ts b/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.module.ts
index 34e73ad9318..55f3a7742c8 100644
--- a/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.module.ts
+++ b/packages/ui-core/shared/src/lib/report/daily-grid/daily-grid.module.ts
@@ -7,7 +7,8 @@ import {
 	NbCardModule,
 	NbIconModule,
 	NbSelectModule,
-	NbSpinnerModule
+	NbSpinnerModule,
+	NbTooltipModule
 } from '@nebular/theme';
 import { TranslateModule } from '@ngx-translate/core';
 import { SharedModule } from '../../shared.module';
@@ -26,6 +27,7 @@ import { NoDataMessageModule } from '../../smart-data-layout/no-data-message/no-
 		NbIconModule,
 		NbSelectModule,
 		NbSpinnerModule,
+		NbTooltipModule,
 		TranslateModule.forChild(),
 		SharedModule,
 		ProjectColumnViewModule,