fix: adjust badges after overriding functionality (#3627)

* fix: adjust badges

* adjust test

Author: OliwiaGowor

src/components/Extensibility/components/tests/Badge.cy.js

@@ -36,7 +36,7 @@ describe('Badge Component', () => {
     const value = -2;
     const structure = {
       highlights: {
-        negative: 'data < 0',
+        critical: 'data < 0',
       },
     };
 

src/components/Extensibility/helpers/index.js

@@ -269,9 +269,9 @@ export const getTextSearchProperties = ({
 };
 
 const TYPE_FALLBACK = new Map([
-  ['success', 'Success'],
-  ['warning', 'Warning'],
-  ['error', 'Error'],
+  ['success', 'Positive'],
+  ['warning', 'Critical'],
+  ['error', 'Negative'],
   ['info', 'Information'],
 ]);
 
@@ -301,11 +301,10 @@ export const getBadgeType = (highlights, value, jsonata, t) => {
       type = match[0];
     }
   }
-
-  if (type === 'negative') type = 'Warning';
+  if (type === 'negative') type = 'Critical';
   else if (type === 'informative') type = 'Information';
-  else if (type === 'positive') type = 'Success';
-  else if (type === 'critical') type = 'Error';
+  else if (type === 'positive') type = 'Positive';
+  else if (type === 'critical') type = 'Negative';
   else if (type === 'none') type = 'None';
 
   type = TYPE_FALLBACK.get(type) || type;

src/components/KymaModules/KymaModulesList.js

@@ -41,7 +41,7 @@ import pluralize from 'pluralize';
 import { Spinner } from 'shared/components/Spinner/Spinner';
 import { Label } from 'shared/ResourceForm/components/Label';
 import { isFormOpenState } from 'state/formOpenAtom';
-import { ModuleStatus } from './components/ModuleStatus';
+import { ModuleStatus, resolveType } from './components/ModuleStatus';
 import { cloneDeep } from 'lodash';
 import { StatusBadge } from 'shared/components/StatusBadge/StatusBadge';
 import { useNavigate } from 'react-router-dom';
@@ -269,16 +269,7 @@ export default function KymaModulesList({
         // Installation State
         <StatusBadge
           resourceKind="kymas"
-          type={
-            moduleStatus?.state === 'Ready'
-              ? 'Positive'
-              : moduleStatus?.state === 'Processing' ||
-                moduleStatus?.state === 'Deleting' ||
-                moduleStatus?.state === 'Unmanaged' ||
-                moduleStatus?.state === 'Unknown'
-              ? 'None'
-              : moduleStatus?.state || 'None'
-          }
+          type={resolveType(moduleStatus?.state)}
           tooltipContent={moduleStatus?.message}
         >
           {moduleStatus?.state || 'Unknown'}

src/components/KymaModules/components/ModuleStatus.tsx

@@ -1,29 +1,30 @@
 import { StatusBadge } from 'shared/components/StatusBadge/StatusBadge';
 import { useModuleStatus } from '../support';
 
+export const resolveType = (status: string) => {
+  switch (status) {
+    case 'Ready':
+      return 'Positive';
+    case 'Processing':
+    case 'Deleting':
+    case 'Unknown':
+    case 'Unmanaged':
+      return 'None';
+    case 'Warning':
+      return 'Critical';
+    case 'Error':
+      return 'Negative';
+    default:
+      return 'None';
+  }
+};
+
 export const ModuleStatus = ({ resource }: any) => {
   const { data: status } = useModuleStatus(resource);
 
   const moduleState = status?.state || 'Unknown';
   const moduleMessage = status?.description;
 
-  const resolveType = (status: string) => {
-    switch (status) {
-      case 'Ready':
-        return 'Positive';
-      case 'Processing':
-      case 'Deleting':
-      case 'Unknown':
-        return 'None';
-      case 'Warning':
-        return 'Critical';
-      case 'Error':
-        return 'Negative';
-      default:
-        return 'None';
-    }
-  };
-
   return (
     <StatusBadge
       resourceKind="kymas"

src/resources/Deployments/DeploymentDetails.js

@@ -65,7 +65,7 @@ export function DeploymentDetails(props) {
     return deployment?.status?.conditions?.map(condition => {
       const overridenStatus = () => {
         if (condition.type === 'ReplicaFailure')
-          return condition.status === 'True' ? 'Error' : 'Success';
+          return condition.status === 'True' ? 'Negative' : 'Positive';
         return undefined;
       };
       return {

src/shared/components/ExpandableListItem/ExpandableListItem.tsx

@@ -32,10 +32,10 @@ export const ExpandableListItem = ({
   let statusType;
   switch (status) {
     case 'True':
-      statusType = 'Success';
+      statusType = 'Positive';
       break;
     case 'False':
-      statusType = 'Error';
+      statusType = 'Negative';
       break;
     case 'Unknown':
       statusType = 'Information';