From e59849c78742ebdbcc6f221a7ed2db69619a4cca Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Fri, 26 Jan 2024 23:20:23 +0200 Subject: [PATCH 1/9] refact: user Activity on Task --- apps/web/app/[locale]/task/[id]/page.tsx | 2 +- .../task/activity/user-task-activity.tsx | 44 +++++++++++++++++ apps/web/lib/features/task/task-activity.tsx | 49 ++++--------------- 3 files changed, 54 insertions(+), 41 deletions(-) create mode 100644 apps/web/lib/features/task/activity/user-task-activity.tsx diff --git a/apps/web/app/[locale]/task/[id]/page.tsx b/apps/web/app/[locale]/task/[id]/page.tsx index b2e0dd908..ac2cf1be3 100644 --- a/apps/web/app/[locale]/task/[id]/page.tsx +++ b/apps/web/app/[locale]/task/[id]/page.tsx @@ -85,7 +85,7 @@ const TaskDetails = () => { {/* */} {/* */} - + {task && }
diff --git a/apps/web/lib/features/task/activity/user-task-activity.tsx b/apps/web/lib/features/task/activity/user-task-activity.tsx new file mode 100644 index 000000000..97cf47f23 --- /dev/null +++ b/apps/web/lib/features/task/activity/user-task-activity.tsx @@ -0,0 +1,44 @@ +import { clsxm } from '@app/utils'; +import { Tab } from '@headlessui/react'; +import { ActivityFilters } from '@app/constants'; + +export const UserTaskActivity = () => { + // get slots related to Task Id + // get apps visited related to Task Id + // get visited Sites related to Task Id + return ( +
+
+

{'Cedric medium'}

+ {'05:30'} +
+ + + {Object.values(ActivityFilters) + .filter((filter) => filter !== 'Tasks') + .map((filter: string) => ( + + clsxm( + 'w-full rounded-lg py-2.5 text-sm font-medium leading-5', + ' focus:outline-none focus:ring-2', + selected + ? 'bg-white dark:bg-dark text-blue-700 shadow' + : ' hover:bg-white/[0.50]' + ) + } + > + {filter} + + ))} + + + {'Screenshoot Team Tab'} + {'Apps Tab'} + {'VisitedSites Tab'} + + +
+ ); +}; diff --git a/apps/web/lib/features/task/task-activity.tsx b/apps/web/lib/features/task/task-activity.tsx index 110df0e89..8d45d8358 100644 --- a/apps/web/lib/features/task/task-activity.tsx +++ b/apps/web/lib/features/task/task-activity.tsx @@ -1,10 +1,15 @@ -import { clsxm } from '@app/utils'; -import { Tab } from '@headlessui/react'; import { Card } from 'lib/components'; -import { ActivityFilters } from '@app/constants'; import React from 'react'; +import { UserTaskActivity } from './activity/user-task-activity'; +import { ITeamTask } from '@app/interfaces'; -export function TaskActivity() { +export function TaskActivity({ task }: { task: ITeamTask }) { + // get users tasks + const users = task.members; + console.log(users); + // filters user Task and get This one + // push to activity arr + // order activity arr by Time return ( ); } - -const UserTaskActivity = () => { - return ( -
-
-

{'Cedric medium'}

- {'05:30'} -
- - - {Object.values(ActivityFilters).filter(filter => filter !== 'Tasks').map((filter: string) => ( - - clsxm( - 'w-full rounded-lg py-2.5 text-sm font-medium leading-5', - ' focus:outline-none focus:ring-2', - selected - ? 'bg-white dark:bg-dark text-blue-700 shadow' - : ' hover:bg-white/[0.50]' - ) - } - > - {filter} - - ))} - - - {'Screenshoot Team Tab'} - {'Apps Tab'} - {'VisitedSites Tab'} - - -
- ); -}; From 423c36be6a74728a31e4c4a85a14955a66e869e9 Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sat, 27 Jan 2024 14:50:06 +0200 Subject: [PATCH 2/9] feat: add route to fecth activity for task --- apps/web/app/api/timer/timesheet/route.ts | 23 +++++++++++- .../app/services/client/api/activity/index.ts | 37 +++++++++++++++++++ .../app/services/server/requests/timesheet.ts | 19 ++++++++++ .../components/pages/maintenance/index.tsx | 4 +- .../blocks/task-estimations-info.tsx | 2 +- apps/web/lib/features/task/task-activity.tsx | 2 +- 6 files changed, 81 insertions(+), 6 deletions(-) create mode 100644 apps/web/app/services/client/api/activity/index.ts diff --git a/apps/web/app/api/timer/timesheet/route.ts b/apps/web/app/api/timer/timesheet/route.ts index 4ab1a8c61..b014675d5 100644 --- a/apps/web/app/api/timer/timesheet/route.ts +++ b/apps/web/app/api/timer/timesheet/route.ts @@ -1,8 +1,27 @@ import { authenticatedGuard } from '@app/services/server/guards/authenticated-guard-app'; +import { taskActivityRequest } from '@app/services/server/requests'; import { NextResponse } from 'next/server'; export async function GET(req: Request) { const res = new NextResponse(); - const { $res, user } = await authenticatedGuard(req, res); - if (!user) return $res('unauthorized'); + const { $res, user, tenantId, organizationId, access_token } = await authenticatedGuard(req, res); + if (!user) return $res('Unauthorized'); + + const { searchParams } = new URL(req.url); + + const { taskId } = searchParams as unknown as { + taskId: string; + }; + + const { data } = await taskActivityRequest( + { + 'taskIds[0]': taskId, + tenantId, + organizationId, + defaultRange: 'false' + }, + access_token + ); + + return $res(data); } diff --git a/apps/web/app/services/client/api/activity/index.ts b/apps/web/app/services/client/api/activity/index.ts new file mode 100644 index 000000000..aa448ae15 --- /dev/null +++ b/apps/web/app/services/client/api/activity/index.ts @@ -0,0 +1,37 @@ +import { get } from '@app/services/client/axios'; +import { GAUZY_API_BASE_SERVER_URL } from '@app/constants'; +import { ITimerApps } from '@app/interfaces/timer/ITimerApp'; + +export async function getTimerDailyRequestAPI({ + taskId, + tenantId, + organizationId, + defaultRange, + unitOfTime +}: { + tenantId: string; + organizationId: string; + defaultRange?: string; + taskId?: string; + unitOfTime?: 'day'; +}) { + const params: { + tenantId: string; + organizationId: string; + defaultRange?: string; + 'taskIds[0]'?: string; + unitOfTime?: 'day'; + } = { + 'taskIds[0]': taskId, + tenantId, + organizationId, + defaultRange, + unitOfTime + }; + const query = new URLSearchParams(params); + const endpoint = GAUZY_API_BASE_SERVER_URL.value + ? `/timesheet/activity?${query.toString()}` + : `/timer/timesheet?${query.toString()}`; + + return get(endpoint); +} diff --git a/apps/web/app/services/server/requests/timesheet.ts b/apps/web/app/services/server/requests/timesheet.ts index 7b17116a2..4dfda5ce6 100644 --- a/apps/web/app/services/server/requests/timesheet.ts +++ b/apps/web/app/services/server/requests/timesheet.ts @@ -32,3 +32,22 @@ export function tasksTimesheetStatisticsRequest(params: TTasksTimesheetStatistic tenantId: params.tenantId }); } + +export type TTaskActivityParams = { + tenantId: string; + organizationId: string; + defaultRange?: string; + 'taskIds[0]'?: string; + unitOfTime?: 'day'; +}; + +export function taskActivityRequest(params: TTaskActivityParams, bearer_token: string) { + const queries = new URLSearchParams(params); + + return serverFetch({ + path: `/timesheet/activity?${queries.toString()}`, + method: 'GET', + bearer_token, + tenantId: params.tenantId + }); +} diff --git a/apps/web/components/pages/maintenance/index.tsx b/apps/web/components/pages/maintenance/index.tsx index 86eadab68..a23461fd9 100644 --- a/apps/web/components/pages/maintenance/index.tsx +++ b/apps/web/components/pages/maintenance/index.tsx @@ -6,8 +6,8 @@ function Maintenance() { const t = useTranslations(); return (
- -
+
+ Maintenance
diff --git a/apps/web/components/pages/task/details-section/blocks/task-estimations-info.tsx b/apps/web/components/pages/task/details-section/blocks/task-estimations-info.tsx index 7c7be7f80..60a17cec9 100644 --- a/apps/web/components/pages/task/details-section/blocks/task-estimations-info.tsx +++ b/apps/web/components/pages/task/details-section/blocks/task-estimations-info.tsx @@ -40,7 +40,7 @@ const TaskEstimationsInfo = () => {
- {task?.members.map((member) => { + {task?.members?.map((member) => { // TODO // Enable other users estimations in v2 return ( diff --git a/apps/web/lib/features/task/task-activity.tsx b/apps/web/lib/features/task/task-activity.tsx index 8d45d8358..d96d5c21d 100644 --- a/apps/web/lib/features/task/task-activity.tsx +++ b/apps/web/lib/features/task/task-activity.tsx @@ -5,7 +5,7 @@ import { ITeamTask } from '@app/interfaces'; export function TaskActivity({ task }: { task: ITeamTask }) { // get users tasks - const users = task.members; + const users = task ? task.members : []; console.log(users); // filters user Task and get This one // push to activity arr From 06b33e74ff89b58429ebecf98eb72517da15324b Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sat, 27 Jan 2024 16:03:38 +0200 Subject: [PATCH 3/9] feat: add hook to fetch task timesheets --- .../web/app/hooks/features/useTaskActivity.ts | 45 +++++++++++++++++++ .../app/services/client/api/activity/index.ts | 2 +- apps/web/app/services/client/api/index.ts | 1 + apps/web/app/stores/task-timesheet.ts | 6 +++ 4 files changed, 53 insertions(+), 1 deletion(-) create mode 100644 apps/web/app/hooks/features/useTaskActivity.ts create mode 100644 apps/web/app/stores/task-timesheet.ts diff --git a/apps/web/app/hooks/features/useTaskActivity.ts b/apps/web/app/hooks/features/useTaskActivity.ts new file mode 100644 index 000000000..3114d2d0c --- /dev/null +++ b/apps/web/app/hooks/features/useTaskActivity.ts @@ -0,0 +1,45 @@ +'use client'; + +import { useCallback, useEffect } from 'react'; +import { useQuery } from '../useQuery'; +import { useRecoilState, useRecoilValue } from 'recoil'; + +import { useAuthenticateUser } from './useAuthenticateUser'; +import { useUserProfilePage } from './useUserProfilePage'; +import { activityTypeState } from '@app/stores/activity-type'; +import { taskTimesheetState } from '@app/stores/task-timesheet'; +import { getTaskTimesheetRequestAPI } from '@app/services/client/api'; + +export function useTaskTimeSheets() { + const { user } = useAuthenticateUser(); + const [taskTimesheets, setTaskTimesheets] = useRecoilState(taskTimesheetState); + const activityFilter = useRecoilValue(activityTypeState); + const profile = useUserProfilePage(); + + const { loading, queryCall } = useQuery(getTaskTimesheetRequestAPI); + const getTaskTimesheets = useCallback(() => { + if (activityFilter.member?.employeeId === user?.employee.id || user?.role?.name?.toUpperCase() == 'MANAGER') { + queryCall({ + tenantId: user?.tenantId ?? '', + organizationId: user?.employee.organizationId ?? '', + taskId: '' + }).then((response) => { + if (response.data) { + console.log(response.data); + setTaskTimesheets(response.data); + } + }); + } else setTaskTimesheets([]); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [activityFilter.member?.employeeId, profile.member?.employeeId, user?.id, queryCall, setTaskTimesheets]); + + useEffect(() => { + getTaskTimesheets(); + }, [getTaskTimesheets]); + + return { + taskTimesheets, + getTaskTimesheets, + loading + }; +} diff --git a/apps/web/app/services/client/api/activity/index.ts b/apps/web/app/services/client/api/activity/index.ts index aa448ae15..73e044a6c 100644 --- a/apps/web/app/services/client/api/activity/index.ts +++ b/apps/web/app/services/client/api/activity/index.ts @@ -2,7 +2,7 @@ import { get } from '@app/services/client/axios'; import { GAUZY_API_BASE_SERVER_URL } from '@app/constants'; import { ITimerApps } from '@app/interfaces/timer/ITimerApp'; -export async function getTimerDailyRequestAPI({ +export async function getTaskTimesheetRequestAPI({ taskId, tenantId, organizationId, diff --git a/apps/web/app/services/client/api/index.ts b/apps/web/app/services/client/api/index.ts index b98e1c2f1..ad476ddbe 100644 --- a/apps/web/app/services/client/api/index.ts +++ b/apps/web/app/services/client/api/index.ts @@ -32,4 +32,5 @@ export * from './organization-projects'; export * from './activity/time-slots'; export * from './activity/activity'; +export * from './activity'; export * from './default'; diff --git a/apps/web/app/stores/task-timesheet.ts b/apps/web/app/stores/task-timesheet.ts new file mode 100644 index 000000000..ac8e2c498 --- /dev/null +++ b/apps/web/app/stores/task-timesheet.ts @@ -0,0 +1,6 @@ +import { atom } from 'recoil'; + +export const taskTimesheetState = atom({ + key: 'taskTimesheetState', + default: [] +}); From 987475f178766fe32600230bed05b564d08f913b Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sat, 27 Jan 2024 21:41:54 +0200 Subject: [PATCH 4/9] feat: fetch task timesheets --- apps/web/app/hooks/features/useTaskActivity.ts | 5 +++-- apps/web/lib/features/task/task-activity.tsx | 11 ++++++++++- 2 files changed, 13 insertions(+), 3 deletions(-) diff --git a/apps/web/app/hooks/features/useTaskActivity.ts b/apps/web/app/hooks/features/useTaskActivity.ts index 3114d2d0c..0645f8104 100644 --- a/apps/web/app/hooks/features/useTaskActivity.ts +++ b/apps/web/app/hooks/features/useTaskActivity.ts @@ -10,7 +10,7 @@ import { activityTypeState } from '@app/stores/activity-type'; import { taskTimesheetState } from '@app/stores/task-timesheet'; import { getTaskTimesheetRequestAPI } from '@app/services/client/api'; -export function useTaskTimeSheets() { +export function useTaskTimeSheets(id: string) { const { user } = useAuthenticateUser(); const [taskTimesheets, setTaskTimesheets] = useRecoilState(taskTimesheetState); const activityFilter = useRecoilValue(activityTypeState); @@ -22,8 +22,9 @@ export function useTaskTimeSheets() { queryCall({ tenantId: user?.tenantId ?? '', organizationId: user?.employee.organizationId ?? '', - taskId: '' + taskId: id }).then((response) => { + console.log(response); if (response.data) { console.log(response.data); setTaskTimesheets(response.data); diff --git a/apps/web/lib/features/task/task-activity.tsx b/apps/web/lib/features/task/task-activity.tsx index d96d5c21d..21977b7c4 100644 --- a/apps/web/lib/features/task/task-activity.tsx +++ b/apps/web/lib/features/task/task-activity.tsx @@ -1,15 +1,24 @@ +'use client'; + import { Card } from 'lib/components'; import React from 'react'; import { UserTaskActivity } from './activity/user-task-activity'; import { ITeamTask } from '@app/interfaces'; +import { useTaskTimeSheets } from '@app/hooks/features/useTaskActivity'; export function TaskActivity({ task }: { task: ITeamTask }) { // get users tasks + const { getTaskTimesheets, taskTimesheets } = useTaskTimeSheets(task?.id); const users = task ? task.members : []; - console.log(users); + console.log(users, taskTimesheets); // filters user Task and get This one // push to activity arr // order activity arr by Time + + React.useEffect(() => { + console.log('FETCH TIMESHEETS'); + getTaskTimesheets(); + }, [task, getTaskTimesheets]); return ( Date: Sat, 27 Jan 2024 21:53:57 +0200 Subject: [PATCH 5/9] fix: Cspell and DeepScans errors --- .cspell.json | 3 ++- apps/web/app/services/client/api/organization-team.ts | 2 +- apps/web/app/services/server/requests/organization-team.ts | 2 +- apps/web/lib/features/task/task-activity.tsx | 1 - 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/.cspell.json b/.cspell.json index f35fdc724..140cce74b 100644 --- a/.cspell.json +++ b/.cspell.json @@ -326,7 +326,8 @@ "Screenshoot", "screenshoots", "tota", - "Intervall" + "Intervall", + "Timesheets" ], "useGitignore": true, "ignorePaths": [ diff --git a/apps/web/app/services/client/api/organization-team.ts b/apps/web/app/services/client/api/organization-team.ts index 26ad6c2d3..fc8308c8f 100644 --- a/apps/web/app/services/client/api/organization-team.ts +++ b/apps/web/app/services/client/api/organization-team.ts @@ -70,7 +70,7 @@ export async function getOrganizationTeamAPI(teamId: string, organizationId: str params[`relations[${i}]`] = rl; }); - const queries = new URLSearchParams(params || {}); + const queries = new URLSearchParams(params); const endpoint = `/organization-team/${teamId}?${queries.toString()}`; diff --git a/apps/web/app/services/server/requests/organization-team.ts b/apps/web/app/services/server/requests/organization-team.ts index a615da8bf..cb7f4b2e7 100644 --- a/apps/web/app/services/server/requests/organization-team.ts +++ b/apps/web/app/services/server/requests/organization-team.ts @@ -102,7 +102,7 @@ export function getOrganizationTeamRequest( params[`relations[${i}]`] = rl; }); - const queries = new URLSearchParams(params || {}); + const queries = new URLSearchParams(params); return serverFetch({ path: `/organization-team/${teamId}?${queries.toString()}`, method: 'GET', diff --git a/apps/web/lib/features/task/task-activity.tsx b/apps/web/lib/features/task/task-activity.tsx index 21977b7c4..bd4a5d219 100644 --- a/apps/web/lib/features/task/task-activity.tsx +++ b/apps/web/lib/features/task/task-activity.tsx @@ -16,7 +16,6 @@ export function TaskActivity({ task }: { task: ITeamTask }) { // order activity arr by Time React.useEffect(() => { - console.log('FETCH TIMESHEETS'); getTaskTimesheets(); }, [task, getTaskTimesheets]); return ( From 5017419082feb765a33b2323cd584dcbed7cd804 Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sat, 27 Jan 2024 22:35:34 +0200 Subject: [PATCH 6/9] feat: add Task TimeSheet Type --- apps/web/app/interfaces/ITaskTimesheet.ts | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 apps/web/app/interfaces/ITaskTimesheet.ts diff --git a/apps/web/app/interfaces/ITaskTimesheet.ts b/apps/web/app/interfaces/ITaskTimesheet.ts new file mode 100644 index 000000000..e382d42ca --- /dev/null +++ b/apps/web/app/interfaces/ITaskTimesheet.ts @@ -0,0 +1,23 @@ +import { IEmployee } from './IEmployee'; +import { IProject } from './IProject'; +import { ITeamTask } from './ITask'; +import { ITimerSlot } from './timer/ITimerSlot'; + +export interface ITaskTimesheet { + title: string; + description?: string; + metaData?: string; + date: Date; + time: string; + duration?: number; + type?: string; + source?: string; + employee?: IEmployee; + employeeId?: IEmployee['id']; + project?: IProject; + projectId?: IProject['id']; + timeSlot?: ITimerSlot; + timeSlotId?: ITimerSlot['id']; + task?: ITeamTask; + taskId?: ITeamTask['id']; +} From 293d03ae3da33f04c1befaaacfee9e2e702fcfec Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sat, 27 Jan 2024 23:16:25 +0200 Subject: [PATCH 7/9] feat: add TaskTimeSheety type to Hooks --- apps/web/app/interfaces/index.ts | 1 + apps/web/app/services/client/api/activity/index.ts | 4 ++-- apps/web/app/stores/task-timesheet.ts | 3 ++- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/apps/web/app/interfaces/index.ts b/apps/web/app/interfaces/index.ts index 11f63ed70..f6ba725be 100644 --- a/apps/web/app/interfaces/index.ts +++ b/apps/web/app/interfaces/index.ts @@ -13,6 +13,7 @@ export * from './ITaskStatus'; export * from './ITaskVersion'; export * from './ITaskPriorities'; export * from './ITaskSizes'; +export * from './ITaskTimesheet'; export * from './ITaskLabels'; export * from './ITaskRelatedIssueType'; export * from './IColor'; diff --git a/apps/web/app/services/client/api/activity/index.ts b/apps/web/app/services/client/api/activity/index.ts index 73e044a6c..eacc92516 100644 --- a/apps/web/app/services/client/api/activity/index.ts +++ b/apps/web/app/services/client/api/activity/index.ts @@ -1,6 +1,6 @@ +import { ITaskTimesheet } from '@app/interfaces'; import { get } from '@app/services/client/axios'; import { GAUZY_API_BASE_SERVER_URL } from '@app/constants'; -import { ITimerApps } from '@app/interfaces/timer/ITimerApp'; export async function getTaskTimesheetRequestAPI({ taskId, @@ -33,5 +33,5 @@ export async function getTaskTimesheetRequestAPI({ ? `/timesheet/activity?${query.toString()}` : `/timer/timesheet?${query.toString()}`; - return get(endpoint); + return get(endpoint); } diff --git a/apps/web/app/stores/task-timesheet.ts b/apps/web/app/stores/task-timesheet.ts index ac8e2c498..8bf26567c 100644 --- a/apps/web/app/stores/task-timesheet.ts +++ b/apps/web/app/stores/task-timesheet.ts @@ -1,6 +1,7 @@ +import { ITaskTimesheet } from '@app/interfaces'; import { atom } from 'recoil'; -export const taskTimesheetState = atom({ +export const taskTimesheetState = atom({ key: 'taskTimesheetState', default: [] }); From a6cc88f1945749be21e5a9f1087504ed7d7adff8 Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sun, 28 Jan 2024 00:19:03 +0200 Subject: [PATCH 8/9] feat: group timesheets by time --- apps/web/app/helpers/array-data.ts | 21 ++++++++++++++++++++ apps/web/lib/features/task/task-activity.tsx | 7 +++---- 2 files changed, 24 insertions(+), 4 deletions(-) diff --git a/apps/web/app/helpers/array-data.ts b/apps/web/app/helpers/array-data.ts index ac0e57c77..5df9a743b 100644 --- a/apps/web/app/helpers/array-data.ts +++ b/apps/web/app/helpers/array-data.ts @@ -1,6 +1,7 @@ import { ITimerSlot } from '@app/interfaces/timer/ITimerSlot'; import { pad } from './number'; import { ITimerApps } from '@app/interfaces/timer/ITimerApp'; +import { ITaskTimesheet } from '@app/interfaces'; export function groupDataByHour(data: ITimerSlot[]) { const groupedData: { startedAt: string; stoppedAt: string; items: ITimerSlot[] }[] = []; @@ -47,6 +48,26 @@ export function groupAppsByHour(apps: ITimerApps[]) { return groupedData.sort((a, b) => (new Date(a.hour) > new Date(b.hour) ? -1 : 1)); } +export function groupByTime(data: ITaskTimesheet[]) { + const groupedData: { hour: string; items: ITaskTimesheet[] }[] = []; + + data.forEach((item) => { + const time = item.time.slice(0, 5); + + const hourDataIndex = groupedData.findIndex((el) => el.hour == time); + + if (hourDataIndex !== -1) { + groupedData[hourDataIndex].items.push(item); + } else + groupedData.push({ + hour: item.time.slice(0, 5), + items: [item] + }); + }); + + return groupedData.sort((a, b) => (new Date(a.hour) > new Date(b.hour) ? -1 : 1)); +} + const formatTime = (d: Date | string, addHour: boolean) => { d = d instanceof Date ? d : new Date(d); if (addHour) diff --git a/apps/web/lib/features/task/task-activity.tsx b/apps/web/lib/features/task/task-activity.tsx index bd4a5d219..55e53c452 100644 --- a/apps/web/lib/features/task/task-activity.tsx +++ b/apps/web/lib/features/task/task-activity.tsx @@ -5,15 +5,14 @@ import React from 'react'; import { UserTaskActivity } from './activity/user-task-activity'; import { ITeamTask } from '@app/interfaces'; import { useTaskTimeSheets } from '@app/hooks/features/useTaskActivity'; +import { groupByTime } from '@app/helpers/array-data'; export function TaskActivity({ task }: { task: ITeamTask }) { // get users tasks const { getTaskTimesheets, taskTimesheets } = useTaskTimeSheets(task?.id); - const users = task ? task.members : []; - console.log(users, taskTimesheets); - // filters user Task and get This one - // push to activity arr // order activity arr by Time + const groupedData = groupByTime(taskTimesheets); + console.log(groupedData); React.useEffect(() => { getTaskTimesheets(); From 9309b58d88890857d7bed538fbb630140f55a024 Mon Sep 17 00:00:00 2001 From: cedric karungu Date: Sun, 28 Jan 2024 00:32:30 +0200 Subject: [PATCH 9/9] feat: connect grouped Data to Component --- apps/web/app/helpers/array-data.ts | 14 +++++++------- apps/web/app/interfaces/ITaskTimesheet.ts | 1 + apps/web/lib/features/task/task-activity.tsx | 20 +++++++++++++++----- 3 files changed, 23 insertions(+), 12 deletions(-) diff --git a/apps/web/app/helpers/array-data.ts b/apps/web/app/helpers/array-data.ts index 5df9a743b..d96877bf5 100644 --- a/apps/web/app/helpers/array-data.ts +++ b/apps/web/app/helpers/array-data.ts @@ -49,23 +49,23 @@ export function groupAppsByHour(apps: ITimerApps[]) { } export function groupByTime(data: ITaskTimesheet[]) { - const groupedData: { hour: string; items: ITaskTimesheet[] }[] = []; + const groupedData: { date: string; items: ITaskTimesheet[] }[] = []; data.forEach((item) => { - const time = item.time.slice(0, 5); + const date = new Date(item.date).toDateString(); - const hourDataIndex = groupedData.findIndex((el) => el.hour == time); + const dateDataIndex = groupedData.findIndex((el) => el.date == date); - if (hourDataIndex !== -1) { - groupedData[hourDataIndex].items.push(item); + if (dateDataIndex !== -1) { + groupedData[dateDataIndex].items.push(item); } else groupedData.push({ - hour: item.time.slice(0, 5), + date, items: [item] }); }); - return groupedData.sort((a, b) => (new Date(a.hour) > new Date(b.hour) ? -1 : 1)); + return groupedData.sort((a, b) => (new Date(a.date) > new Date(b.date) ? -1 : 1)); } const formatTime = (d: Date | string, addHour: boolean) => { diff --git a/apps/web/app/interfaces/ITaskTimesheet.ts b/apps/web/app/interfaces/ITaskTimesheet.ts index e382d42ca..d0e265f94 100644 --- a/apps/web/app/interfaces/ITaskTimesheet.ts +++ b/apps/web/app/interfaces/ITaskTimesheet.ts @@ -4,6 +4,7 @@ import { ITeamTask } from './ITask'; import { ITimerSlot } from './timer/ITimerSlot'; export interface ITaskTimesheet { + id: string title: string; description?: string; metaData?: string; diff --git a/apps/web/lib/features/task/task-activity.tsx b/apps/web/lib/features/task/task-activity.tsx index 55e53c452..a325be303 100644 --- a/apps/web/lib/features/task/task-activity.tsx +++ b/apps/web/lib/features/task/task-activity.tsx @@ -22,23 +22,33 @@ export function TaskActivity({ task }: { task: ITeamTask }) { className="w-full p-4 md:px-4 dark:bg-[#25272D] flex flex-col gap-6 border border-[#00000014] dark:border-[#26272C]" shadow="bigger" > + {/* TO DELETE: start */}

{'05.01.2024'}

+ {/* TO DELETE: end */} + {groupedData.map((timesheet, i) => ( +
+

{timesheet.date}

+ {timesheet.items.map((item) => ( + + ))} +
+ ))} -
-

{'04.01.2024'}

- -
- + {/* TO DELETE: start */}

{'03.01.2024'}

+ {/* TO DELETE: end */} ); }