bo/worklenz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(localization): add timer conflict handling and update translations

Browse Source 
- Introduced a new hook `useTaskTimerWithConflictCheck` to manage timer conflicts, prompting users when a timer is already running for a different task.
- Updated localization files for Albanian, German, English, Spanish, Portuguese, and Chinese to include new translation keys related to timer conflict handling and cancellation.
- Refactored components to utilize the new timer hook, enhancing user experience by preventing overlapping timers.
This commit is contained in:
chamikaJ
2025-07-30 10:13:08 +05:30
parent c53ab511bf
commit 5cce3bc613
17 changed files with 158 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
worklenz-frontend/public/locales/alb/common.json
View File

@@ -5,5 +5,6 @@
"signup-failed": "Regjistrimi dështoi. Ju lutemi sigurohuni që të gjitha fushat e nevojshme janë plotësuar dhe provoni përsëri.",
"reconnecting": "Jeni shkëputur nga serveri.",
"connection-lost": "Lidhja me serverin dështoi. Ju lutemi kontrolloni lidhjen tuaj me internet.",
"connection-restored": "U lidhët me serverin me sukses"
"connection-restored": "U lidhët me serverin me sukses",
"cancel": "Anulo"
}

6
worklenz-frontend/public/locales/alb/task-list-table.json
View File

@@ -136,5 +136,11 @@
"dependencies": "Detyra ka varësi",
"recurring": "Detyrë përsëritëse"
}
},
"timer": {
"conflictTitle": "Kronómetr Tashë Në Ecuri",
"conflictMessage": "Ju keni një kronómetr në ecuri për \"{{taskName}}\" në projektin \"{{projectName}}\". Dëshironi ta ndaloni atë kronómetr dhe të filloni një të ri për këtë detyrë?",
"stopAndStart": "Ndalo & Fillo Kronómetr të Ri"
}
}

3
worklenz-frontend/public/locales/de/common.json
View File

@@ -5,5 +5,6 @@
"signup-failed": "Registrierung fehlgeschlagen. Bitte füllen Sie alle erforderlichen Felder aus und versuchen Sie es erneut.",
"reconnecting": "Vom Server getrennt.",
"connection-lost": "Verbindung zum Server fehlgeschlagen. Bitte überprüfen Sie Ihre Internetverbindung.",
"connection-restored": "Erfolgreich mit dem Server verbunden"
"connection-restored": "Erfolgreich mit dem Server verbunden",
"cancel": "Abbrechen"
}

6
worklenz-frontend/public/locales/de/task-list-table.json
View File

@@ -136,5 +136,11 @@
"dependencies": "Aufgabe hat Abhängigkeiten",
"recurring": "Wiederkehrende Aufgabe"
}
},
"timer": {
"conflictTitle": "Timer läuft bereits",
"conflictMessage": "Sie haben einen Timer für \"{{taskName}}\" im Projekt \"{{projectName}}\" laufen. Möchten Sie diesen Timer stoppen und einen neuen für diese Aufgabe starten?",
"stopAndStart": "Stoppen & Neuen Timer starten"
}
}

3
worklenz-frontend/public/locales/en/common.json
View File

@@ -5,5 +5,6 @@
"signup-failed": "Signup failed. Please ensure all required fields are filled and try again.",
"reconnecting": "Disconnected from server.",
"connection-lost": "Failed to connect to server. Please check your internet connection.",
"connection-restored": "Connected to server successfully"
"connection-restored": "Connected to server successfully",
"cancel": "Cancel"
}

6
worklenz-frontend/public/locales/en/task-list-table.json
View File

@@ -136,5 +136,11 @@
"dependencies": "Task has dependencies",
"recurring": "Recurring task"
}
},
"timer": {
"conflictTitle": "Timer Already Running",
"conflictMessage": "You have a timer running for \"{{taskName}}\" in project \"{{projectName}}\". Would you like to stop that timer and start a new one for this task?",
"stopAndStart": "Stop & Start New Timer"
}
}

3
worklenz-frontend/public/locales/es/common.json
View File

@@ -5,5 +5,6 @@
"signup-failed": "Error al registrarse. Por favor asegúrate de llenar todos los campos requeridos e intenta nuevamente.",
"reconnecting": "Reconectando al servidor...",
"connection-lost": "Conexión perdida. Intentando reconectarse...",
"connection-restored": "Conexión restaurada. Reconectando al servidor..."
"connection-restored": "Conexión restaurada. Reconectando al servidor...",
"cancel": "Cancelar"
}

6
worklenz-frontend/public/locales/es/task-list-table.json
View File

@@ -136,5 +136,11 @@
"dependencies": "La tarea tiene dependencias",
"recurring": "Tarea recurrente"
}
},
"timer": {
"conflictTitle": "Temporizador Ya En Ejecución",
"conflictMessage": "Tiene un temporizador ejecutándose para \"{{taskName}}\" en el proyecto \"{{projectName}}\". ¿Le gustaría detener ese temporizador e iniciar uno nuevo para esta tarea?",
"stopAndStart": "Detener e Iniciar Nuevo Temporizador"
}
}

3
worklenz-frontend/public/locales/pt/common.json
View File

@@ -5,5 +5,6 @@
"signup-failed": "Falha no cadastro. Por favor, certifique-se de que todos os campos obrigatórios estão preenchidos e tente novamente.",
"reconnecting": "Reconectando ao servidor...",
"connection-lost": "Conexão perdida. Tentando reconectar...",
"connection-restored": "Conexão restaurada. Reconectando ao servidor..."
"connection-restored": "Conexão restaurada. Reconectando ao servidor...",
"cancel": "Cancelar"
}

6
worklenz-frontend/public/locales/pt/task-list-table.json
View File

@@ -136,5 +136,11 @@
"dependencies": "A tarefa tem dependências",
"recurring": "Tarefa recorrente"
}
},
"timer": {
"conflictTitle": "Temporizador Já Em Execução",
"conflictMessage": "Você tem um temporizador executando para \"{{taskName}}\" no projeto \"{{projectName}}\". Gostaria de parar esse temporizador e iniciar um novo para esta tarefa?",
"stopAndStart": "Parar e Iniciar Novo Temporizador"
}
}

3
worklenz-frontend/public/locales/zh/common.json
View File

@@ -5,5 +5,6 @@
"signup-failed": "注册失败。请确保填写所有必填字段并重试。",
"reconnecting": "与服务器断开连接。",
"connection-lost": "无法连接到服务器。请检查您的互联网连接。",
"connection-restored": "成功连接到服务器"
"connection-restored": "成功连接到服务器",
"cancel": "取消"
}

6
worklenz-frontend/public/locales/zh/task-list-table.json
View File

@@ -129,5 +129,11 @@
"dependencies": "任务有依赖项",
"recurring": "重复任务"
}
},
"timer": {
"conflictTitle": "计时器已在运行",
"conflictMessage": "您在项目\"{{projectName}}\"中的\"{{taskName}}\"任务正在运行计时器。您是否要停止该计时器并为此任务启动新的计时器？",
"stopAndStart": "停止并启动新计时器"
}
}

4
worklenz-frontend/src/components/task-drawer/shared/time-log/task-drawer-time-log.tsx
View File

@@ -12,7 +12,7 @@ import TimeLogList from './time-log-list';
import { taskTimeLogsApiService } from '@/api/tasks/task-time-logs.api.service';
import { ITaskLogViewModel } from '@/types/tasks/task-log-view.types';
import TaskTimer from '@/components/taskListCommon/task-timer/task-timer';
import { useTaskTimer } from '@/hooks/useTaskTimer';
import { useTaskTimerWithConflictCheck } from '@/hooks/useTaskTimerWithConflictCheck';
import logger from '@/utils/errorLogger';
interface TaskDrawerTimeLogProps {
@@ -31,7 +31,7 @@ const TaskDrawerTimeLog = ({ t, refreshTrigger = 0 }: TaskDrawerTimeLogProps) =>
state => state.taskDrawerReducer
);
const { started, timeString, handleStartTimer, handleStopTimer } = useTaskTimer(
const { started, timeString, handleStartTimer, handleStopTimer } = useTaskTimerWithConflictCheck(
selectedTaskId || '',
taskFormViewModel?.task?.timer_start_time || null
);

4
worklenz-frontend/src/components/task-list-v2/TaskTimeTracking.tsx
View File

@@ -1,6 +1,6 @@
import React from 'react';
import TaskTimer from '@/components/taskListCommon/task-timer/task-timer';
import { useTaskTimer } from '@/hooks/useTaskTimer';
import { useTaskTimerWithConflictCheck } from '@/hooks/useTaskTimerWithConflictCheck';
interface TaskTimeTrackingProps {
taskId: string;
@@ -8,7 +8,7 @@ interface TaskTimeTrackingProps {
}
const TaskTimeTracking: React.FC<TaskTimeTrackingProps> = React.memo(({ taskId, isDarkMode }) => {
const { started, timeString, handleStartTimer, handleStopTimer } = useTaskTimer(
const { started, timeString, handleStartTimer, handleStopTimer } = useTaskTimerWithConflictCheck(
taskId,
null // The hook will get the timer start time from Redux
);

4
worklenz-frontend/src/features/navbar/navbar.tsx
View File

@@ -153,8 +153,8 @@ const Navbar = () => {
<Flex align="center">
<SwitchTeamButton />
<NotificationButton />
{/* <TimerButton /> */}
<HelpButton />
<TimerButton />
{/* <HelpButton /> */}
<ProfileButton isOwnerOrAdmin={isOwnerOrAdmin} />
</Flex>
</Flex>

25
worklenz-frontend/src/features/navbar/timers/timer-button.tsx
View File

@@ -7,7 +7,7 @@ import { useAppDispatch } from '@/hooks/useAppDispatch';
import { useSocket } from '@/socket/socketContext';
import { SocketEvents } from '@/shared/socket-events';
import { updateTaskTimeTracking } from '@/features/tasks/tasks.slice';
import moment from 'moment';
import { format, differenceInSeconds, isValid, parseISO } from 'date-fns';
const { Text } = Typography;
const { useToken } = theme;
@@ -60,17 +60,17 @@ const TimerButton = () => {
try {
if (!timer || !timer.task_id || !timer.start_time) return;
const startTime = moment(timer.start_time);
if (!startTime.isValid()) {
const startTime = parseISO(timer.start_time);
if (!isValid(startTime)) {
logError(`Invalid start time for timer ${timer.task_id}: ${timer.start_time}`);
return;
}
const now = moment();
const duration = moment.duration(now.diff(startTime));
const hours = Math.floor(duration.asHours());
const minutes = duration.minutes();
const seconds = duration.seconds();
const now = new Date();
const totalSeconds = differenceInSeconds(now, startTime);
const hours = Math.floor(totalSeconds / 3600);
const minutes = Math.floor((totalSeconds % 3600) / 60);
const seconds = totalSeconds % 60;
newTimes[timer.task_id] =
`${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
} catch (error) {
@@ -86,12 +86,7 @@ const TimerButton = () => {
useEffect(() => {
fetchRunningTimers();
// Set up polling to refresh timers every 30 seconds
const pollInterval = setInterval(() => {
fetchRunningTimers();
}, 30000);
return () => clearInterval(pollInterval);
// Removed periodic polling - rely on socket events for real-time updates
}, [fetchRunningTimers]);
useEffect(() => {
@@ -273,7 +268,7 @@ const TimerButton = () => {
<Text type="secondary" style={{ fontSize: 11 }}>
Started:{' '}
{timer.start_time
? moment(timer.start_time).format('HH:mm')
? format(parseISO(timer.start_time), 'HH:mm')
: '--:--'}
</Text>
<Text

94
worklenz-frontend/src/hooks/useTaskTimerWithConflictCheck.ts Normal file
View File

@@ -0,0 +1,94 @@
import { useState, useEffect, useCallback } from 'react';
import { Modal } from 'antd';
import { useTranslation } from 'react-i18next';
import { useSocket } from '@/socket/socketContext';
import { SocketEvents } from '@/shared/socket-events';
import { taskTimeLogsApiService } from '@/api/tasks/task-time-logs.api.service';
import { useTaskTimer } from './useTaskTimer';
interface ConflictingTimer {
task_id: string;
task_name: string;
project_name: string;
}
export const useTaskTimerWithConflictCheck = (taskId: string, timerStartTime: string | null) => {
const { socket } = useSocket();
const { t: tTable } = useTranslation('task-list-table');
const { t: tCommon } = useTranslation('common');
// Ensure timerStartTime is a number or null, as required by useTaskTimer
const parsedTimerStartTime = typeof timerStartTime === 'string' && timerStartTime !== null
? Number(timerStartTime)
: timerStartTime;
const originalHook = useTaskTimer(taskId, parsedTimerStartTime as number | null);
const [isCheckingConflict, setIsCheckingConflict] = useState(false);
const checkForConflictingTimers = useCallback(async () => {
try {
const response = await taskTimeLogsApiService.getRunningTimers();
const runningTimers = response.body || [];
// Find conflicting timer (running timer for a different task)
const conflictingTimer = runningTimers.find((timer: ConflictingTimer) =>
timer.task_id !== taskId
);
return conflictingTimer;
} catch (error) {
console.error('Error checking for conflicting timers:', error);
return null;
}
}, [taskId]);
const handleStartTimerWithConflictCheck = useCallback(async () => {
if (isCheckingConflict) return;
setIsCheckingConflict(true);
try {
const conflictingTimer = await checkForConflictingTimers();
if (conflictingTimer) {
Modal.confirm({
title: tTable('timer.conflictTitle'),
content: tTable('timer.conflictMessage', {
taskName: conflictingTimer.task_name,
projectName: conflictingTimer.project_name
}),
okText: tTable('timer.stopAndStart'),
cancelText: tCommon('cancel'),
onOk: () => {
// Stop the conflicting timer
if (socket) {
socket.emit(SocketEvents.TASK_TIMER_STOP.toString(), JSON.stringify({
task_id: conflictingTimer.task_id
}));
}
// Start the new timer after a short delay
setTimeout(() => {
originalHook.handleStartTimer();
}, 100);
},
});
} else {
// No conflict, start timer directly
originalHook.handleStartTimer();
}
} catch (error) {
console.error('Error handling timer start with conflict check:', error);
// Fallback to original behavior
originalHook.handleStartTimer();
} finally {
setIsCheckingConflict(false);
}
}, [isCheckingConflict, checkForConflictingTimers, tTable, tCommon, socket, originalHook]);
return {
...originalHook,
handleStartTimer: handleStartTimerWithConflictCheck,
isCheckingConflict,
};
};