diff --git a/packages/manager/apps/zimbra/public/translations/dashboard/Messages_fr_FR.json b/packages/manager/apps/zimbra/public/translations/dashboard/Messages_fr_FR.json index bf9608bae522..8a3237abd5b8 100644 --- a/packages/manager/apps/zimbra/public/translations/dashboard/Messages_fr_FR.json +++ b/packages/manager/apps/zimbra/public/translations/dashboard/Messages_fr_FR.json @@ -44,6 +44,7 @@ "zimbra_dashboard_tile_status_ongoingTask": "Tâches en cours", "zimbra_dashboard_tile_status_ongoingTask_viewMore": "Voir plus", "zimbra_dashboard_tile_status_ongoingTask_viewLess": "Voir moins", + "zimbra_dashboard_tile_status_ongoingTask_none": "Aucune tâche en cours", "zimbra_dashboard_tile_serviceConsumption_title": "Statistiques", "zimbra_dashboard_tile_serviceConsumption_accountOffer": "Compte par offre", "zimbra_dashboard_tile_serviceConsumption_noAccountOffer": "Vous ne possedez actuellement aucune boite email.", diff --git a/packages/manager/apps/zimbra/src/api/api.type.ts b/packages/manager/apps/zimbra/src/api/api.type.ts index be74b21e6eab..6e75ed3144a1 100644 --- a/packages/manager/apps/zimbra/src/api/api.type.ts +++ b/packages/manager/apps/zimbra/src/api/api.type.ts @@ -11,15 +11,6 @@ export type ErrorResponse = { }; }; -export type TaskErrorMessage = { - message: string; -}; - -export type TaskProgressStatus = { - name: string; - status: string; -}; - export enum ResourceStatus { CREATING = 'CREATING', DELETING = 'DELETING', diff --git a/packages/manager/apps/zimbra/src/api/task/type.ts b/packages/manager/apps/zimbra/src/api/task/type.ts index 8e62ad00ecb3..61709885a68c 100644 --- a/packages/manager/apps/zimbra/src/api/task/type.ts +++ b/packages/manager/apps/zimbra/src/api/task/type.ts @@ -1,4 +1,19 @@ -import { TaskErrorMessage, TaskProgressStatus } from '../api.type'; +export enum TaskStatus { + DONE = 'DONE', + ERROR = 'ERROR', + PENDING = 'PENDING', + RUNNING = 'RUNNING', + SCHEDULED = 'SCHEDULED', +} + +export type TaskErrorMessage = { + message: string; +}; + +export type TaskProgressStatus = { + name: string; + status: TaskStatus; +}; export type TaskType = { createdAt: string; @@ -9,7 +24,7 @@ export type TaskType = { message: string; progress: TaskProgressStatus[]; startedAt: string; - status: string; + status: TaskStatus; type: string; updatedAt: string; }; diff --git a/packages/manager/apps/zimbra/src/index.scss b/packages/manager/apps/zimbra/src/index.scss index 335ef20d5221..662482538b50 100644 --- a/packages/manager/apps/zimbra/src/index.scss +++ b/packages/manager/apps/zimbra/src/index.scss @@ -18,3 +18,8 @@ ods-button.action-menu-item::part(button) { ods-modal::part(dialog) { max-height: 100vh; } + +.tile-block-description { + display: flex; + flex-direction: column; +} diff --git a/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/GeneralInformation.tsx b/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/GeneralInformation.tsx index ca66c76dd8cb..f76bc6f135da 100644 --- a/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/GeneralInformation.tsx +++ b/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/GeneralInformation.tsx @@ -8,6 +8,7 @@ import { GuideLinks, GUIDES_LIST } from '@/guides.constants'; import { IAM_ACTIONS } from '@/utils/iamAction.constants'; import GuideLink from '@/components/GuideLink'; import { BadgeStatus } from '@/components/BadgeStatus'; +import { OngoingTasks } from './OngoingTasks'; function GeneralInformation() { const { t } = useTranslation('dashboard'); @@ -44,15 +45,14 @@ function GeneralInformation() { : []), { id: 'ongoing-task', - label: t( - 'Coming Soon', - ) /* label={t('zimbra_dashboard_tile_status_ongoingTask')} */, + label: t('zimbra_dashboard_tile_status_ongoingTask'), value: platformUrn && ( - Coming Soon + ), }, diff --git a/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/OngoingTasks.tsx b/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/OngoingTasks.tsx index 6aaf79584282..6de7f720c495 100644 --- a/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/OngoingTasks.tsx +++ b/packages/manager/apps/zimbra/src/pages/dashboard/GeneralInformation/OngoingTasks.tsx @@ -1,45 +1,65 @@ import React, { useEffect, useState } from 'react'; import { useTranslation } from 'react-i18next'; -import { OdsIcon, OdsLink } from '@ovhcloud/ods-components/react'; -import { ODS_ICON_NAME, ODS_LINK_COLOR } from '@ovhcloud/ods-components'; +import { OdsLink, OdsText } from '@ovhcloud/ods-components/react'; +import { + ODS_ICON_NAME, + ODS_LINK_COLOR, + ODS_SPINNER_SIZE, + ODS_TEXT_PRESET, +} from '@ovhcloud/ods-components'; import { useTasks } from '@/hooks'; +import Loading from '@/components/Loading/Loading'; +import { TaskType, TaskStatus } from '@/api/task'; + +const defaultNumberToShow = 5; +const isOngoing = (task: TaskType) => + ![TaskStatus.DONE, TaskStatus.ERROR].includes(task.status); export const OngoingTasks: React.FC = () => { const { t } = useTranslation('dashboard'); const [loadMore, setLoadMore] = useState(false); - const [tasksDiplayed, setTasksDiplayed] = useState([]); - const { data } = useTasks(); + const [tasks, setTasks] = useState([]); + const { data, isError, isPending } = useTasks(); useEffect(() => { - setTasksDiplayed(loadMore ? data : data?.slice(0, 5)); + const ongoingTasks = data?.filter(isOngoing); + setTasks( + loadMore ? ongoingTasks : ongoingTasks?.slice(0, defaultNumberToShow), + ); }, [loadMore, data]); return (
- {tasksDiplayed?.map((task) => ( - {`${task.type} ${task.message}`} - ))} - {data?.length > 5 && ( + + {tasks?.length > defaultNumberToShow && ( setLoadMore(!loadMore)} + onClick={(e) => { + e?.preventDefault(); + setLoadMore(!loadMore); + }} href="#" - > - - {!loadMore - ? t('zimbra_dashboard_tile_status_ongoingTask_viewMore') - : t('zimbra_dashboard_tile_status_ongoingTask_viewLess')} - - - - + label={ + !loadMore + ? t('zimbra_dashboard_tile_status_ongoingTask_viewMore') + : t('zimbra_dashboard_tile_status_ongoingTask_viewLess') + } + icon={!loadMore ? ODS_ICON_NAME.chevronDown : ODS_ICON_NAME.chevronUp} + > + )} + {(!tasks?.length || isError) && !isPending && ( + + {t('zimbra_dashboard_tile_status_ongoingTask_none')} + )} + {isPending && }
); };