From c2f594bdd2e7e8c50e0b7e6ead17c1d999b2c320 Mon Sep 17 00:00:00 2001
From: "vault-token-factory-spectrocloud[bot]"
 <133815545+vault-token-factory-spectrocloud[bot]@users.noreply.github.com>
Date: Fri, 17 Nov 2023 13:20:12 -0700
Subject: [PATCH] Deprecated packs style (#1819) (#1823)

* save

* chore: fixed edge cases

* chore: removed uneeded logic

(cherry picked from commit e54ecabefba46db2b1e61ee68362bd4bd0e6d35a)

Co-authored-by: Karl Cardenas <karl@spectrocloud.com>
---
 src/components/PacksTable/PackTable.test.tsx | 18 ++++++++++++
 src/components/PacksTable/PacksTable.tsx     | 30 +++++++++++++++++++-
 2 files changed, 47 insertions(+), 1 deletion(-)

diff --git a/src/components/PacksTable/PackTable.test.tsx b/src/components/PacksTable/PackTable.test.tsx
index 08bc4eb144..7dfb5e1e85 100644
--- a/src/components/PacksTable/PackTable.test.tsx
+++ b/src/components/PacksTable/PackTable.test.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import { render, waitFor, screen, fireEvent } from "@testing-library/react";
 import fetchMock from "jest-fetch-mock";
 import FilteredTable from "./PacksTable";
+import { toTitleCase } from "./PacksTable";
 // Enable fetch mocking
 fetchMock.enableMocks();
 
@@ -103,3 +104,20 @@ describe("FilteredTable Tests", () => {
   });
 
 });
+
+
+describe('toTitleCase', () => {
+  it('converts a dasherized string to title case', () => {
+      expect(toTitleCase("my-example-string")).toBe("My Example String");
+  });
+
+  it('converts a camelCase string to title case', () => {
+      expect(toTitleCase("myExampleString")).toBe("My Example String");
+  });
+
+
+  it('converts aws to AWS in a string', () => {
+      expect(toTitleCase("my-example-aws-string")).toBe("My Example AWS String");
+  });
+
+});
\ No newline at end of file
diff --git a/src/components/PacksTable/PacksTable.tsx b/src/components/PacksTable/PacksTable.tsx
index ef2ab8ff60..a78783f1ba 100644
--- a/src/components/PacksTable/PacksTable.tsx
+++ b/src/components/PacksTable/PacksTable.tsx
@@ -142,7 +142,17 @@ const FilteredTable: React.FC = () => {
     fetch("/packs-data/packs_report.json")
       .then((response) => response.json())
       .then((packData: PacksData) => {
-        const deprecatedPackData = packData.Packs.filter((pack) => {  
+        const deprecatedPackData = packData.Packs.filter((pack) => { 
+
+          // Handle the case where the pack name is empty.
+          // This is applicable when the API returns a pack with no name.
+          // The API also does not include the last modified date for these packs.
+          if (pack.displayName == "") {
+            pack.displayName = toTitleCase(pack.name);
+            pack.timeLastUpdated = "-"
+            pack.packLastModifiedDate = "-"
+          }
+
           return pack.prodStatus !== "active" && pack.prodStatus !== "unknown"
         });
         setDeprecatedPacks(deprecatedPackData);
@@ -184,4 +194,22 @@ const FilteredTable: React.FC = () => {
   );
 };
 
+// Convert the pack name to title case
+export function toTitleCase(str:string) {
+  return str
+      .replace(/([a-z])([A-Z])|-/g, '$1 $2')
+      // Split, filter, and capitalize words
+      .split(/\s+/)
+      .map(word => {
+        // Words that should be capitalized
+          if (['CNI', 'CSI', 'OSS', 'EBS', 'AWS'].includes(word.toUpperCase())) {
+              return word.toUpperCase();
+          }
+          return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
+      })
+      .filter(word => word)
+      .join(' ');
+}
+
+
 export default FilteredTable;