From 92e20f8b4c36d71dfbbbeb272f0eb47b383de12e Mon Sep 17 00:00:00 2001 From: Innocent-akim Date: Sat, 28 Dec 2024 22:34:09 +0200 Subject: [PATCH] feat: update offline screen for network interruption --- apps/web/app/[locale]/page-component.tsx | 6 +- apps/web/app/interfaces/hooks.ts | 1 + apps/web/components/pages/offline/index.tsx | 24 +++- apps/web/lib/features/timer/timer.tsx | 123 ++++++++++---------- apps/web/locales/ar.json | 6 +- apps/web/locales/bg.json | 4 +- apps/web/locales/de.json | 4 +- apps/web/locales/en.json | 4 +- apps/web/locales/es.json | 6 +- apps/web/locales/fr.json | 4 +- apps/web/locales/he.json | 6 +- apps/web/locales/it.json | 6 +- apps/web/locales/nl.json | 6 +- apps/web/locales/pl.json | 6 +- apps/web/locales/pt.json | 6 +- apps/web/locales/ru.json | 4 +- apps/web/locales/zh.json | 6 +- 17 files changed, 136 insertions(+), 86 deletions(-) diff --git a/apps/web/app/[locale]/page-component.tsx b/apps/web/app/[locale]/page-component.tsx index 89a043e2e..2a1ab3151 100644 --- a/apps/web/app/[locale]/page-component.tsx +++ b/apps/web/app/[locale]/page-component.tsx @@ -2,7 +2,7 @@ 'use client'; import React, { useEffect, useState } from 'react'; -import { useOrganizationTeams } from '@app/hooks'; +import { useOrganizationTeams, useTimerView } from '@app/hooks'; import { clsxm } from '@app/utils'; import NoTeam from '@components/pages/main/no-team'; import { withAuthentication } from 'lib/app/authenticator'; @@ -34,6 +34,8 @@ function MainPage() { const t = useTranslations(); const [headerSize] = useState(10); const { isTeamMember, isTrackingEnabled, activeTeam } = useOrganizationTeams(); + const { timerStatus } = useTimerView(); + const [fullWidth, setFullWidth] = useAtom(fullWidthState); const [view, setView] = useAtom(headerTabs); const path = usePathname(); @@ -56,7 +58,7 @@ function MainPage() { }, [setFullWidth]); if (!online) { - return ; + return ; } return ( <> diff --git a/apps/web/app/interfaces/hooks.ts b/apps/web/app/interfaces/hooks.ts index 288c22120..33a4b3e69 100644 --- a/apps/web/app/interfaces/hooks.ts +++ b/apps/web/app/interfaces/hooks.ts @@ -110,6 +110,7 @@ export interface IDrowDownData { export type IClassName = { className?: string; fullWidth?: boolean; + showTimerButton?: boolean, type?: 'VERTICAL' | 'HORIZONTAL'; } & T; diff --git a/apps/web/components/pages/offline/index.tsx b/apps/web/components/pages/offline/index.tsx index ec2fdc015..198e689df 100644 --- a/apps/web/components/pages/offline/index.tsx +++ b/apps/web/components/pages/offline/index.tsx @@ -1,20 +1,36 @@ +import { Timer } from '@/lib/features'; +import { cn } from '@/lib/utils'; import SadCry from '@components/ui/svgs/sad-cry'; import { Text } from 'lib/components'; import { useTranslations } from 'next-intl'; - -function Offline() { +interface IPropsOffline { + showTimer?: boolean +} +function Offline({ showTimer }: IPropsOffline) { const t = useTranslations(); - return (
- Offline! + {t('pages.offline.STATUS_NETWORK')}
{t('pages.offline.HEADING_TITLE')} +
+ + {t('pages.offline.HEADING_SUB_DESCRIPTION')} + +
+ {showTimer && }
{t('pages.offline.HEADING_DESCRIPTION')} diff --git a/apps/web/lib/features/timer/timer.tsx b/apps/web/lib/features/timer/timer.tsx index 3ce63957c..6d8ab6609 100644 --- a/apps/web/lib/features/timer/timer.tsx +++ b/apps/web/lib/features/timer/timer.tsx @@ -18,7 +18,7 @@ import { useCallback, useMemo } from 'react'; import { AddTasksEstimationHoursModal, EnforcePlanedTaskModal, SuggestDailyPlanModal } from '../daily-plan'; import { useStartStopTimerHandler } from '@app/hooks/features/useStartStopTimerHandler'; -export function Timer({ className }: IClassName) { +export function Timer({ className, showTimerButton = true }: IClassName) { const t = useTranslations(); const { @@ -86,13 +86,12 @@ export function Timer({ className }: IClassName) {
{pad(hours)}:{pad(minutes)}:{pad(seconds)} :{pad(ms_p)} @@ -117,68 +116,74 @@ export function Timer({ className }: IClassName) {
- -
- - + +
+ - + // enabled={ + // !canRunTimer && timerStatus?.lastLog?.source !== TimerSource.TEAMS + // } + > + + - - {/** + + {/** * Track time on planned task (SOFT FLOW) */} - {hasPlan && activeTeamTask && ( - - )} + {hasPlan && activeTeamTask && ( + + )} - {hasPlan && hasPlan.tasks && ( - - )} + {hasPlan && hasPlan.tasks && ( + + )} - {/** + {/** * Track time on planned task (REQUIRE PLAN) */} - {requirePlan && hasPlan && activeTeamTask && ( - - )} -
+ {requirePlan && hasPlan && activeTeamTask && ( + + )} +
+ + ) + } ); } diff --git a/apps/web/locales/ar.json b/apps/web/locales/ar.json index 5f2c47efd..21adcb4b7 100644 --- a/apps/web/locales/ar.json +++ b/apps/web/locales/ar.json @@ -611,8 +611,10 @@ "LINK_LABEL": "الذهاب إلى الصفحة الرئيسية" }, "offline": { - "HEADING_TITLE": "انقطاع الشبكة!", - "HEADING_DESCRIPTION": "أنت غير متصل حاليًا، يرجى التحقق من اتصالك بالإنترنت..." + "HEADING_TITLE": "تم قطع الشبكة!", + "HEADING_SUB_DESCRIPTION": "عفوًا، فقدناك. لا تقلق، الوقت ما زال يتم تتبعه.", + "HEADING_DESCRIPTION": "ستتمكن من متابعة العمل في تطبيق الويب بمجرد استعادة الاتصال.", + "STATUS_NETWORK": "غير متصل!" }, "error": { "TITLE": "خطأ", diff --git a/apps/web/locales/bg.json b/apps/web/locales/bg.json index ce51bec75..936a57d6c 100644 --- a/apps/web/locales/bg.json +++ b/apps/web/locales/bg.json @@ -612,7 +612,9 @@ }, "offline": { "HEADING_TITLE": "Мрежата е прекъсната!", - "HEADING_DESCRIPTION": "В момента сте извън линия, моля, проверете интернет връзката си..." + "HEADING_SUB_DESCRIPTION": "Опа, изгубихме ви. Не се притеснявайте, времето ви все още се отчита.", + "HEADING_DESCRIPTION": "Ще можете да продължите да работите в уеб приложението, след като връзката ви бъде възстановена.", + "STATUS_NETWORK": "Офлайн!" }, "error": { "TITLE": "грешка!", diff --git a/apps/web/locales/de.json b/apps/web/locales/de.json index 09b5a8192..b7fcbcc8f 100644 --- a/apps/web/locales/de.json +++ b/apps/web/locales/de.json @@ -612,7 +612,9 @@ }, "offline": { "HEADING_TITLE": "Netzwerk getrennt!", - "HEADING_DESCRIPTION": "Sie sind derzeit offline, bitte überprüfen Sie Ihre Internetverbindung..." + "HEADING_SUB_DESCRIPTION": "Ups, wir haben Sie verloren. Keine Sorge, Ihre Zeit wird weiterhin erfasst.", + "HEADING_DESCRIPTION": "Sie können in der Web-App weiterarbeiten, sobald Ihre Verbindung wiederhergestellt ist.", + "STATUS_NETWORK": "Offline!" }, "error": { "TITLE": "Error !", diff --git a/apps/web/locales/en.json b/apps/web/locales/en.json index 37c2d34eb..02baf2cca 100644 --- a/apps/web/locales/en.json +++ b/apps/web/locales/en.json @@ -612,7 +612,9 @@ }, "offline": { "HEADING_TITLE": "Network Disconnected!", - "HEADING_DESCRIPTION": "Your network is offline, please check your internet connection..." + "HEADING_SUB_DESCRIPTION": "Oops, we lost you. Don't worry, your time is still tracking.", + "HEADING_DESCRIPTION": "You will be able to continue working in the web app once your connection is restored.", + "STATUS_NETWORK": "Offline!" }, "error": { "TITLE": "Error !", diff --git a/apps/web/locales/es.json b/apps/web/locales/es.json index 4e9f06126..6269b7b28 100644 --- a/apps/web/locales/es.json +++ b/apps/web/locales/es.json @@ -611,8 +611,10 @@ "LINK_LABEL": "Ir a la página de inicio" }, "offline": { - "HEADING_TITLE": "¡Red Desconectada!", - "HEADING_DESCRIPTION": "Actualmente estás desconectado, por favor verifica tu conexión a Internet..." + "HEADING_TITLE": "¡Red desconectada!", + "HEADING_SUB_DESCRIPTION": "Vaya, te hemos perdido. No te preocupes, tu tiempo sigue siendo registrado.", + "HEADING_DESCRIPTION": "Podrás continuar trabajando en la aplicación web una vez que se restablezca tu conexión.", + "STATUS_NETWORK": "¡Desconectado!" }, "error": { "TITLE": "Error !", diff --git a/apps/web/locales/fr.json b/apps/web/locales/fr.json index 408e52567..20a2e02c6 100644 --- a/apps/web/locales/fr.json +++ b/apps/web/locales/fr.json @@ -612,7 +612,9 @@ }, "offline": { "HEADING_TITLE": "Réseau déconnecté !", - "HEADING_DESCRIPTION": "Vous êtes actuellement hors ligne, veuillez vérifier votre connexion Internet..." + "HEADING_SUB_DESCRIPTION": "Oups, nous vous avons perdu. Ne vous inquiétez pas, votre temps est toujours suivi.", + "HEADING_DESCRIPTION": "Vous pourrez continuer à travailler dans l'application web une fois votre connexion rétablie.", + "STATUS_NETWORK": "Hors ligne !" }, "error": { "TITLE": "Erreur !", diff --git a/apps/web/locales/he.json b/apps/web/locales/he.json index 22fcdc8be..ea287b699 100644 --- a/apps/web/locales/he.json +++ b/apps/web/locales/he.json @@ -611,8 +611,10 @@ "LINK_LABEL": "לך לדף הבית" }, "offline": { - "HEADING_TITLE": "רשת מנותקת!", - "HEADING_DESCRIPTION": "אתה לא מחובר כרגע, בבקשה בדוק את חיבור האינטרנט שלך..." + "HEADING_TITLE": "החיבור נותק!", + "HEADING_SUB_DESCRIPTION": "אופס, איבדנו אותך. אל דאגה, הזמן שלך עדיין עוקב.", + "HEADING_DESCRIPTION": "תוכל להמשיך לעבוד באפליקציית האינטרנט לאחר שחיבורך ישוחזר.", + "STATUS_NETWORK": "לא מקוון!" }, "error": { "TITLE": "שגיאה", diff --git a/apps/web/locales/it.json b/apps/web/locales/it.json index a675053bb..1b55c461d 100644 --- a/apps/web/locales/it.json +++ b/apps/web/locales/it.json @@ -611,8 +611,10 @@ "LINK_LABEL": "Vai alla homepage" }, "offline": { - "HEADING_TITLE": "Rete Disconnessa!", - "HEADING_DESCRIPTION": "Attualmente sei offline, controlla la tua connessione Internet..." + "HEADING_TITLE": "Connessione di rete interrotta!", + "HEADING_SUB_DESCRIPTION": "Ops, ti abbiamo perso. Non preoccuparti, il tuo tempo è ancora in tracciamento.", + "HEADING_DESCRIPTION": "Potrai continuare a lavorare nell'app web una volta ripristinata la connessione.", + "STATUS_NETWORK": "Offline!" }, "error": { "TITLE": "Errore!", diff --git a/apps/web/locales/nl.json b/apps/web/locales/nl.json index 75d00076d..0fb542512 100644 --- a/apps/web/locales/nl.json +++ b/apps/web/locales/nl.json @@ -611,8 +611,10 @@ "LINK_LABEL": "Naar de startpagina" }, "offline": { - "HEADING_TITLE": "Netwerk Verbroken!", - "HEADING_DESCRIPTION": "U bent momenteel offline, controleer uw internetverbinding..." + "HEADING_TITLE": "Netwerk verbroken!", + "HEADING_SUB_DESCRIPTION": "Oeps, we zijn je kwijt. Maak je geen zorgen, je tijd wordt nog steeds bijgehouden.", + "HEADING_DESCRIPTION": "Je kunt doorgaan met werken in de webapp zodra je verbinding is hersteld.", + "STATUS_NETWORK": "Offline!" }, "error": { "TITLE": "Fout !", diff --git a/apps/web/locales/pl.json b/apps/web/locales/pl.json index e5df9337c..477f8cf14 100644 --- a/apps/web/locales/pl.json +++ b/apps/web/locales/pl.json @@ -611,8 +611,10 @@ "LINK_LABEL": "Przejdź do strony głównej" }, "offline": { - "HEADING_TITLE": "Rozłączono sieć!", - "HEADING_DESCRIPTION": "Jesteś obecnie offline, sprawdź swoje połączenie z internetem..." + "HEADING_TITLE": "Sieć rozłączona!", + "HEADING_SUB_DESCRIPTION": "Ups, straciliśmy cię. Nie martw się, twój czas jest nadal śledzony.", + "HEADING_DESCRIPTION": "Będziesz mógł kontynuować pracę w aplikacji internetowej, gdy połączenie zostanie przywrócone.", + "STATUS_NETWORK": "Offline!" }, "error": { "TITLE": "Błąd !", diff --git a/apps/web/locales/pt.json b/apps/web/locales/pt.json index a17e5f55d..027e08e28 100644 --- a/apps/web/locales/pt.json +++ b/apps/web/locales/pt.json @@ -612,8 +612,10 @@ "LINK_LABEL": "Ir para a página inicial" }, "offline": { - "HEADING_TITLE": "Rede Desconectada!", - "HEADING_DESCRIPTION": "Você está atualmente offline, por favor, verifique sua conexão com a Internet..." + "HEADING_TITLE": "Rede desconectada!", + "HEADING_SUB_DESCRIPTION": "Ops, perdemos você. Não se preocupe, seu tempo ainda está sendo rastreado.", + "HEADING_DESCRIPTION": "Você poderá continuar trabalhando no aplicativo web assim que sua conexão for restaurada.", + "STATUS_NETWORK": "Offline!" }, "error": { "TITLE": "Erro!", diff --git a/apps/web/locales/ru.json b/apps/web/locales/ru.json index 5f406cfb5..f44561ad4 100644 --- a/apps/web/locales/ru.json +++ b/apps/web/locales/ru.json @@ -612,7 +612,9 @@ }, "offline": { "HEADING_TITLE": "Сеть отключена!", - "HEADING_DESCRIPTION": "В настоящее время вы не подключены к Интернету, проверьте ваше соединение..." + "HEADING_SUB_DESCRIPTION": "Ой, мы потеряли вас. Не волнуйтесь, ваше время все еще отслеживается.", + "HEADING_DESCRIPTION": "Вы сможете продолжить работу в веб-приложении, как только ваше соединение будет восстановлено.", + "STATUS_NETWORK": "Офлайн!" }, "error": { "TITLE": "Ошибка !", diff --git a/apps/web/locales/zh.json b/apps/web/locales/zh.json index f5c69dbf5..8281b7660 100644 --- a/apps/web/locales/zh.json +++ b/apps/web/locales/zh.json @@ -587,8 +587,10 @@ "TRY_AGAIN": "再试一次" }, "offline": { - "HEADING_TITLE": "网络断开连接！", - "HEADING_DESCRIPTION": "您目前处于离线状态，请检查您的互联网连接..." + "HEADING_TITLE": "网络断开！", + "HEADING_SUB_DESCRIPTION": "糟糕，我们失去了您的连接。别担心，您的时间仍在跟踪中。", + "HEADING_DESCRIPTION": "连接恢复后，您将可以继续在网页应用中工作。", + "STATUS_NETWORK": "离线！" }, "invite": { "HEADING_TITLE": "邀请成员加入您的团队",