From 927f96cb79c13768ab97097c63a43b85d6304f48 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Wed, 5 Mar 2025 11:26:40 +0100
Subject: [PATCH] fix(ui): update icon in health modal refresh button

Replace the string-based icon reference 'arrow-repeat' with the React
component <RefreshCcw size={18} /> from lucide-react. Also fix indentation
in the category mapping section for better code organization.

Signed-off-by: Shekar Siri <sshekarsiri@gmail.com>
---
 .../HealthStatus/HealthModal/HealthModal.tsx  | 27 ++++++++++---------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/frontend/app/components/Header/HealthStatus/HealthModal/HealthModal.tsx b/frontend/app/components/Header/HealthStatus/HealthModal/HealthModal.tsx
index 08962dd21..cd2c8d90c 100644
--- a/frontend/app/components/Header/HealthStatus/HealthModal/HealthModal.tsx
+++ b/frontend/app/components/Header/HealthStatus/HealthModal/HealthModal.tsx
@@ -8,6 +8,7 @@ import { getHighest } from 'App/constants/zindex';
 import Category from 'Components/Header/HealthStatus/ServiceCategory';
 import SubserviceHealth from 'Components/Header/HealthStatus/SubserviceHealth/SubserviceHealth';
 import { IServiceStats } from '../HealthStatus';
+import { RefreshCcw } from 'lucide-react';
 
 function HealthModal({
   getHealth,
@@ -81,7 +82,7 @@ function HealthModal({
           <Button
             disabled={isLoading}
             onClick={getHealth}
-            icon={'arrow-repeat'}
+            icon={<RefreshCcw size={18} />}
             type={'text'}
             className={'text-main'}
           >
@@ -97,18 +98,18 @@ function HealthModal({
                   {isLoading
                     ? null
                     : Object.keys(healthResponse.healthMap).map((service) => (
-                        <React.Fragment key={service}>
-                          <Category
-                            onClick={() => setSelectedService(service)}
-                            healthOk={
-                              healthResponse.healthMap[service].healthOk
-                            }
-                            name={healthResponse.healthMap[service].name}
-                            isSelectable
-                            isSelected={selectedService === service}
-                          />
-                        </React.Fragment>
-                      ))}
+                      <React.Fragment key={service}>
+                        <Category
+                          onClick={() => setSelectedService(service)}
+                          healthOk={
+                            healthResponse.healthMap[service].healthOk
+                          }
+                          name={healthResponse.healthMap[service].name}
+                          isSelectable
+                          isSelected={selectedService === service}
+                        />
+                      </React.Fragment>
+                    ))}
                 </div>
                 <div
                   className={