From eedee5178950c70751c1ebfb2af3ffb10da5ebe8 Mon Sep 17 00:00:00 2001
From: hemahg <hhg@redhat.com>
Date: Thu, 12 Dec 2024 12:52:38 +0530
Subject: [PATCH] fix icon in rebalance page

Signed-off-by: hemahg <hhg@redhat.com>
---
 .../nodes/rebalances/RebalanceTable.tsx          | 16 +++++++++++-----
 ui/public/stop-icon.svg                          |  3 +++
 2 files changed, 14 insertions(+), 5 deletions(-)
 create mode 100644 ui/public/stop-icon.svg

diff --git a/ui/app/[locale]/(authorized)/kafka/[kafkaId]/nodes/rebalances/RebalanceTable.tsx b/ui/app/[locale]/(authorized)/kafka/[kafkaId]/nodes/rebalances/RebalanceTable.tsx
index a4d094dfa..b89dffba6 100644
--- a/ui/app/[locale]/(authorized)/kafka/[kafkaId]/nodes/rebalances/RebalanceTable.tsx
+++ b/ui/app/[locale]/(authorized)/kafka/[kafkaId]/nodes/rebalances/RebalanceTable.tsx
@@ -20,12 +20,13 @@ import {
   ExclamationCircleIcon,
   PauseCircleIcon,
   PendingIcon,
-  ResourcesFullIcon,
+  OutlinedClockIcon,
 } from "@/libs/patternfly/react-icons";
 import Link from "next/link";
 import React, { ReactNode } from "react";
 import { EmptyStateNoMatchFound } from "@/components/Table/EmptyStateNoMatchFound";
 import { EmptyStateNoKafkaRebalance } from "./EmptyStateNoKafkaRebalance";
+import Image from "next/image";
 
 export const RebalanceTableColumns = ["name", "status", "createdAt"] as const;
 
@@ -59,7 +60,12 @@ const StatusLabel: Record<RebalanceStatus, ReactNode> = {
   Stopped: (
     <>
       <Icon>
-        <ResourcesFullIcon />
+        <Image
+          src={"/stop-icon.svg"}
+          alt="stop icon"
+          width={100}
+          height={100}
+        />
       </Icon>
       &nbsp;Stopped
     </>
@@ -75,7 +81,7 @@ const StatusLabel: Record<RebalanceStatus, ReactNode> = {
   NotReady: (
     <>
       <Icon>
-        <PendingIcon />
+        <OutlinedClockIcon />
       </Icon>
       &nbsp;NotReady
     </>
@@ -216,7 +222,7 @@ export function RebalanceTable({
             {
               title: t("refresh"),
               onClick: () => onRefresh(row),
-              isDisabled: !row.meta?.allowedActions.includes("refresh")
+              isDisabled: !row.meta?.allowedActions.includes("refresh"),
             },
             {
               title: t("stop"),
@@ -262,7 +268,7 @@ export function RebalanceTable({
                   <DescriptionListTerm>{t("brokers")}</DescriptionListTerm>
                   <DescriptionListDescription>
                     {!row.attributes.brokers ||
-                      row.attributes.brokers.length === 0
+                    row.attributes.brokers.length === 0
                       ? "N/A"
                       : row.attributes.brokers.join(",")}
                   </DescriptionListDescription>
diff --git a/ui/public/stop-icon.svg b/ui/public/stop-icon.svg
new file mode 100644
index 000000000..335f9760b
--- /dev/null
+++ b/ui/public/stop-icon.svg
@@ -0,0 +1,3 @@
+<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.2188 9.5C17.2188 7.45286 16.4055 5.48957 14.958 4.04202C13.5104 2.59447 11.5471 1.78125 9.5 1.78125C7.45286 1.78125 5.48957 2.59447 4.04202 4.04202C2.59447 5.48957 1.78125 7.45286 1.78125 9.5C1.78125 11.5471 2.59447 13.5104 4.04202 14.958C5.48957 16.4055 7.45286 17.2188 9.5 17.2188C11.5471 17.2188 13.5104 16.4055 14.958 14.958C16.4055 13.5104 17.2188 11.5471 17.2188 9.5ZM0 9.5C0 6.98044 1.00089 4.56408 2.78249 2.78249C4.56408 1.00089 6.98044 0 9.5 0C12.0196 0 14.4359 1.00089 16.2175 2.78249C17.9991 4.56408 19 6.98044 19 9.5C19 12.0196 17.9991 14.4359 16.2175 16.2175C14.4359 17.9991 12.0196 19 9.5 19C6.98044 19 4.56408 17.9991 2.78249 16.2175C1.00089 14.4359 0 12.0196 0 9.5ZM7.125 5.9375H11.875C12.5318 5.9375 13.0625 6.46816 13.0625 7.125V11.875C13.0625 12.5318 12.5318 13.0625 11.875 13.0625H7.125C6.46816 13.0625 5.9375 12.5318 5.9375 11.875V7.125C5.9375 6.46816 6.46816 5.9375 7.125 5.9375Z" fill="black"/>
+</svg>