From 23d2ce4c2c33a658fc646d04b983b5207c20e8c5 Mon Sep 17 00:00:00 2001
From: Suraj yadav <harrypotter1108@gmail.com>
Date: Tue, 5 Mar 2024 04:45:30 +0530
Subject: [PATCH] fix(ui): Highlight failing containers in the UI (#17143)

* failing container icon added

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>

* lint-fix

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>

* ..

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>

* tried yarn lint-fix

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>

* margin

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>

* running

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>

---------

Signed-off-by: Surajyadav <harrypotter1108@gmail.com>
Signed-off-by: Mangaal <angommeeteimangaal@gmail.com>
---
 .../application-node-info.tsx                     | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

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 18ff44e381c55..edd787e0240c1 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
@@ -21,7 +21,20 @@ const RenderContainerState = (props: {container: any}) => {
 
     return (
         <div className='application-node-info__container'>
-            <div className='application-node-info__container--name'>{props.container.name}</div>
+            <div className='application-node-info__container--name'>
+                {props.container.state?.running && (
+                    <span style={{marginRight: '4px'}}>
+                        <i className='fa fa-check-circle' style={{color: 'rgb(24, 190, 148)'}} />
+                    </span>
+                )}
+                {(props.container.state.terminated && props.container.state.terminated?.exitCode !== 0) ||
+                    (lastState && lastState?.exitCode !== 0 && (
+                        <span style={{marginRight: '4px'}}>
+                            <i className='fa fa-times-circle' style={{color: 'red'}} />
+                        </span>
+                    ))}
+                {props.container.name}
+            </div>
             <div>
                 {state && (
                     <>