From 0df409394da76a625af3c12dc8ae8273b5f3252e Mon Sep 17 00:00:00 2001 From: Michael Crenshaw <350466+crenshaw-dev@users.noreply.github.com> Date: Thu, 15 Jun 2023 13:21:27 -0400 Subject: [PATCH] fix(ui): soften readiness gate failure message (#13972) (#14076) (#14079) * fix(ui): soften readiness gate failure message (#13972) * null check everything --------- Signed-off-by: Michael Crenshaw <350466+crenshaw-dev@users.noreply.github.com> --- .../application-node-info.tsx | 22 +++++++++---------- ...> readiness-gates-not-passed-warning.scss} | 2 +- ...=> readiness-gates-not-passed-warning.tsx} | 20 ++++++++--------- ui/src/app/applications/components/utils.tsx | 7 +++--- 4 files changed, 26 insertions(+), 25 deletions(-) rename ui/src/app/applications/components/application-node-info/{readiness-gates-failed-warning.scss => readiness-gates-not-passed-warning.scss} (72%) rename ui/src/app/applications/components/application-node-info/{readiness-gates-failed-warning.tsx => readiness-gates-not-passed-warning.tsx} (62%) diff --git a/ui/src/app/applications/components/application-node-info/application-node-info.tsx b/ui/src/app/applications/components/application-node-info/application-node-info.tsx index ee0e2516cce15..8ac1a46d582d2 100644 --- a/ui/src/app/applications/components/application-node-info/application-node-info.tsx +++ b/ui/src/app/applications/components/application-node-info/application-node-info.tsx @@ -8,17 +8,9 @@ import * as models from '../../../shared/models'; import {services} from '../../../shared/services'; import {ResourceTreeNode} from '../application-resource-tree/application-resource-tree'; import {ApplicationResourcesDiff} from '../application-resources-diff/application-resources-diff'; -import { - ComparisonStatusIcon, - formatCreationTimestamp, - getPodReadinessGatesState, - getPodReadinessGatesState as _getPodReadinessGatesState, - getPodStateReason, - HealthStatusIcon -} from '../utils'; - +import {ComparisonStatusIcon, formatCreationTimestamp, getPodReadinessGatesState, getPodStateReason, HealthStatusIcon} from '../utils'; import './application-node-info.scss'; -import {ReadinessGatesFailedWarning} from './readiness-gates-failed-warning'; +import {ReadinessGatesNotPassedWarning} from './readiness-gates-not-passed-warning'; export const ApplicationNodeInfo = (props: { application: models.Application; @@ -175,6 +167,14 @@ export const ApplicationNodeInfo = (props: { } const readinessGatesState = React.useMemo(() => { + // If containers are not ready then readiness gate status is not important. + if (!props.live?.status?.containerStatuses?.length) { + return null; + } + if (props.live?.status?.containerStatuses?.some((containerStatus: {ready: boolean}) => !containerStatus.ready)) { + return null; + } + if (props.live && props.node?.kind === 'Pod') { return getPodReadinessGatesState(props.live); } @@ -184,7 +184,7 @@ export const ApplicationNodeInfo = (props: { return (
- {Boolean(readinessGatesState) && } + {Boolean(readinessGatesState) && }
{attributes.map(attr => ( diff --git a/ui/src/app/applications/components/application-node-info/readiness-gates-failed-warning.scss b/ui/src/app/applications/components/application-node-info/readiness-gates-not-passed-warning.scss similarity index 72% rename from ui/src/app/applications/components/application-node-info/readiness-gates-failed-warning.scss rename to ui/src/app/applications/components/application-node-info/readiness-gates-not-passed-warning.scss index b7c9ad7f0bd50..7887918671396 100644 --- a/ui/src/app/applications/components/application-node-info/readiness-gates-failed-warning.scss +++ b/ui/src/app/applications/components/application-node-info/readiness-gates-not-passed-warning.scss @@ -3,7 +3,7 @@ .white-box { &__readiness-gates-alert { padding: 20px; - border-left: 6px solid $argo-status-failed-color !important; + border-left: 6px solid $argo-status-warning-color !important; ul { margin-bottom: 0; diff --git a/ui/src/app/applications/components/application-node-info/readiness-gates-failed-warning.tsx b/ui/src/app/applications/components/application-node-info/readiness-gates-not-passed-warning.tsx similarity index 62% rename from ui/src/app/applications/components/application-node-info/readiness-gates-failed-warning.tsx rename to ui/src/app/applications/components/application-node-info/readiness-gates-not-passed-warning.tsx index c38dc598d6634..31af11b1d0349 100644 --- a/ui/src/app/applications/components/application-node-info/readiness-gates-failed-warning.tsx +++ b/ui/src/app/applications/components/application-node-info/readiness-gates-not-passed-warning.tsx @@ -1,29 +1,29 @@ import * as React from 'react'; import {selectPostfix} from '../utils'; -import './readiness-gates-failed-warning.scss'; +import './readiness-gates-not-passed-warning.scss'; -export interface ReadinessGatesFailedWarningProps { +export interface ReadinessGatesNotPassedWarningProps { readinessGatesState: { nonExistingConditions: string[]; - failedConditions: string[]; + notPassedConditions: string[]; }; } -export const ReadinessGatesFailedWarning = ({readinessGatesState}: ReadinessGatesFailedWarningProps) => { - if (readinessGatesState.failedConditions.length > 0 || readinessGatesState.nonExistingConditions.length > 0) { +export const ReadinessGatesNotPassedWarning = ({readinessGatesState}: ReadinessGatesNotPassedWarningProps) => { + if (readinessGatesState.notPassedConditions.length > 0 || readinessGatesState.nonExistingConditions.length > 0) { return (
-
Readiness Gates Failing:
+
Readiness Gates Not Passing:
    - {readinessGatesState.failedConditions.length > 0 && ( + {readinessGatesState.notPassedConditions.length > 0 && (
  • - The status of pod readiness gate{selectPostfix(readinessGatesState.failedConditions, '', 's')}{' '} - {readinessGatesState.failedConditions + The status of pod readiness gate{selectPostfix(readinessGatesState.notPassedConditions, '', 's')}{' '} + {readinessGatesState.notPassedConditions .map(t => `"${t}"`) .join(', ') .trim()}{' '} - {selectPostfix(readinessGatesState.failedConditions, 'is', 'are')} False. + {selectPostfix(readinessGatesState.notPassedConditions, 'is', 'are')} False.
    • )} {readinessGatesState.nonExistingConditions.length > 0 && ( diff --git a/ui/src/app/applications/components/utils.tsx b/ui/src/app/applications/components/utils.tsx index 7e4fed73cbd17..b30ddc87f3d0b 100644 --- a/ui/src/app/applications/components/utils.tsx +++ b/ui/src/app/applications/components/utils.tsx @@ -942,11 +942,12 @@ export function getPodStateReason(pod: appModels.State): {message: string; reaso return {reason, message}; } -export const getPodReadinessGatesState = (pod: appModels.State): {nonExistingConditions: string[]; failedConditions: string[]} => { +export const getPodReadinessGatesState = (pod: appModels.State): {nonExistingConditions: string[]; notPassedConditions: string[]} => { + // if pod does not have readiness gates then return empty status if (!pod.spec?.readinessGates?.length) { return { nonExistingConditions: [], - failedConditions: [] + notPassedConditions: [] }; } @@ -985,7 +986,7 @@ export const getPodReadinessGatesState = (pod: appModels.State): {nonExistingCon return { nonExistingConditions, - failedConditions + notPassedConditions: failedConditions }; };