diff --git a/frontend/src/component/changeRequest/ChangeRequestStatusBadge/ChangeRequestStatusBadge.tsx b/frontend/src/component/changeRequest/ChangeRequestStatusBadge/ChangeRequestStatusBadge.tsx index 0b47bbf0fb..977ddc9d15 100644 --- a/frontend/src/component/changeRequest/ChangeRequestStatusBadge/ChangeRequestStatusBadge.tsx +++ b/frontend/src/component/changeRequest/ChangeRequestStatusBadge/ChangeRequestStatusBadge.tsx @@ -8,6 +8,7 @@ import { Close, Error as ErrorIcon, } from '@mui/icons-material'; +import { HtmlTooltip } from 'component/common/HtmlTooltip/HtmlTooltip'; interface IChangeRequestStatusBadgeProps { changeRequest: IChangeRequest | undefined; @@ -59,17 +60,30 @@ export const ChangeRequestStatusBadge: VFC = ({ ); case 'Scheduled': { const { schedule } = changeRequest; - const color = schedule?.status === 'pending' ? 'warning' : 'error'; + const color = schedule!.status === 'pending' ? 'warning' : 'error'; const icon = schedule?.status === 'pending' ? ( ) : ( ); + const scheduledAt = new Date( + schedule!.scheduledAt, + ).toLocaleString(); + + const tooltipTitle = + schedule?.status === 'pending' + ? `Scheduled for ${scheduledAt}` + : `Failed on ${scheduledAt} because of ${ + schedule!.failureReason + }`; + return ( - - Scheduled - + + + Scheduled + + ); } default: diff --git a/frontend/src/component/changeRequest/changeRequest.types.ts b/frontend/src/component/changeRequest/changeRequest.types.ts index dc5902ee9f..e90bfd6a5b 100644 --- a/frontend/src/component/changeRequest/changeRequest.types.ts +++ b/frontend/src/component/changeRequest/changeRequest.types.ts @@ -5,7 +5,6 @@ import { SetStrategySortOrderSchema } from '../../openapi'; export interface IChangeRequest { id: number; - state: ChangeRequestState; title: string; project: string; environment: string; @@ -18,6 +17,7 @@ export interface IChangeRequest { rejections: IChangeRequestApproval[]; comments: IChangeRequestComment[]; conflict?: string; + state: ChangeRequestState; schedule?: IChangeRequestSchedule; }