From a47b378e7e1fa77f66f2b237a4ff8d3eef3433f0 Mon Sep 17 00:00:00 2001
From: Neha <neha_h@berkeley.edu>
Date: Thu, 12 Dec 2024 22:04:28 -0800
Subject: [PATCH] [chore] refactoring

---
 components/KeyDevelopmentMilestone/index.tsx | 25 +++++++++-----------
 components/KeyDevelopmentMilestone/styles.ts |  1 -
 components/StatusTag/index.tsx               |  1 -
 3 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/components/KeyDevelopmentMilestone/index.tsx b/components/KeyDevelopmentMilestone/index.tsx
index 39e4390..5fd1225 100644
--- a/components/KeyDevelopmentMilestone/index.tsx
+++ b/components/KeyDevelopmentMilestone/index.tsx
@@ -56,31 +56,28 @@ export default function KeyDevelopmentMilestone({
   }
 
   const renderWithTooltip = (text: string) => {
-    // Find the abbreviation in the text
+    // Find the abbreviation in the KDMs (ex. NYISO)
     const abbreviation = Object.keys(abbreviationMap).find(abbr =>
       text.includes(abbr),
     );
 
-    // If an abbreviation is found, replace it with a React component (tooltip)
+    // If an abbreviation is found, render it with a tooltip
     if (abbreviation) {
+      const parts = text.split(abbreviation);
+      const fullText = abbreviationMap[abbreviation];
+
       return (
         <KDMInfoHoverContainer>
-          {text.split(abbreviation).map((part, index) => (
-            <React.Fragment key={index}>
-              {part}
-              {index < 1 && ( // Only show the tooltip after the abbreviation
-                <>
-                  {abbreviation}
-                  <KDMInfoText>{abbreviationMap[abbreviation]}</KDMInfoText>
-                </>
-              )}
-            </React.Fragment>
-          ))}
+          <React.Fragment>
+            {abbreviation}
+            <KDMInfoText>{fullText}</KDMInfoText>
+          </React.Fragment>
+          {parts[1]} {/* Text after the abbreviation */}
         </KDMInfoHoverContainer>
       );
     }
 
-    // If no abbreviation is found, just return the text
+    // If no abbreviation is found, return plain text
     return text;
   };
 
diff --git a/components/KeyDevelopmentMilestone/styles.ts b/components/KeyDevelopmentMilestone/styles.ts
index 8c94c39..de444a5 100644
--- a/components/KeyDevelopmentMilestone/styles.ts
+++ b/components/KeyDevelopmentMilestone/styles.ts
@@ -68,7 +68,6 @@ export const KDMInfoText = styled.div`
   box-shadow:
     0rem 1rem 1.25rem 0rem rgba(46, 58, 89, 0.1),
     0rem 0.0625rem 0.0625rem 0rem rgba(46, 58, 89, 0.15);
-
   left: 50%;
   transform: translateX(-70%);
 
diff --git a/components/StatusTag/index.tsx b/components/StatusTag/index.tsx
index daf3d4d..04815be 100644
--- a/components/StatusTag/index.tsx
+++ b/components/StatusTag/index.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import {
   CalendarIcon,
   GreenDotOperationalIcon,