Fix HealthCheckProbeData type

frontend/packages/dev-console/src/components/health-checks/HealthChecksProbe.tsx → frontend/packages/dev-console/src/components/health-checks/HealthCheckProbe.tsx

@@ -8,7 +8,7 @@ import { getHealthChecksProbeConfig, healthChecksDefaultValues } from './health-
 import { HealthCheckProbeData } from './health-checks-types';
 import { HealthCheckContext } from './health-checks-utils';
 import ProbeForm from './ProbeForm';
-import './HealthChecksProbe.scss';
+import './HealthCheckProbe.scss';
 
 interface HealthCheckProbeProps {
   probeType: string;

frontend/packages/dev-console/src/components/health-checks/HealthChecks.tsx

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Resources } from '../import/import-types';
 import FormSection from '../import/section/FormSection';
 import { HealthChecksProbeType } from './health-checks-types';
-import HealthCheckProbe from './HealthChecksProbe';
+import HealthCheckProbe from './HealthCheckProbe';
 
 interface HealthChecksProps {
   title?: string;

frontend/packages/dev-console/src/components/health-checks/__tests__/create-health-check-probe-utils.spec.ts

@@ -51,13 +51,19 @@ describe('Create Health Check probe Utils', () => {
     expect(constructProbeData(healthChecksInputData.healthChecks.readinessProbe.data)).toEqual(
       enabledProbeData.readinessProbe,
     );
+    expect(constructProbeData(healthChecksInputData.healthChecks.livenessProbe.data)).toEqual(
+      enabledProbeData.livenessProbe,
+    );
     expect(constructProbeData(healthChecksInputData.healthChecks.startupProbe.data)).toEqual(
       enabledProbeData.startupProbe,
     );
   });
 
   it('getProbesData should return all the enabled probes', () => {
-    expect(getProbesData(healthChecksInputData.healthChecks)).toEqual(enabledProbeData);
+    expect(getProbesData(healthChecksInputData.healthChecks)).toEqual({
+      readinessProbe: enabledProbeData.readinessProbe,
+      startupProbe: enabledProbeData.startupProbe,
+    });
   });
 
   it('getProbesData should not return startup probes in case of knative service', () => {

frontend/packages/dev-console/src/components/health-checks/__tests__/create-health-checks-probe-data.ts

@@ -1,39 +1,39 @@
-import { HealthChecksData } from '../../import/import-types';
+import { HealthChecksFormData } from '../../import/import-types';
 import { healthChecksDefaultValues } from '../health-checks-probe-utils';
 import { RequestType } from '../health-checks-types';
 
-export const healthChecksData: HealthChecksData = {
+export const healthChecksData: HealthChecksFormData = {
   readinessProbe: {
     showForm: false,
     enabled: true,
     modified: false,
     data: {
-      failureThreshold: 3,
+      failureThreshold: '3',
       requestType: RequestType.HTTPGET,
       httpGet: {
-        scheme: 'HTTP',
+        scheme: undefined,
         path: '/',
-        port: 8080,
+        port: '8080',
         httpHeaders: [{ name: 'header', value: 'val' }],
       },
-      initialDelaySeconds: 0,
-      periodSeconds: 10,
-      timeoutSeconds: 1,
-      successThreshold: 1,
+      initialDelaySeconds: '0',
+      periodSeconds: '10',
+      timeoutSeconds: '1',
+      successThreshold: '1',
     },
   },
   livenessProbe: {
     showForm: false,
     enabled: true,
     modified: false,
     data: {
-      failureThreshold: 3,
+      failureThreshold: '3',
       requestType: RequestType.ContainerCommand,
       exec: { command: ['cat', '/tmp/healthy'] },
-      initialDelaySeconds: 0,
-      periodSeconds: 10,
-      timeoutSeconds: 1,
-      successThreshold: 1,
+      initialDelaySeconds: '0',
+      periodSeconds: '10',
+      timeoutSeconds: '1',
+      successThreshold: '1',
     },
   },
   startupProbe: healthChecksDefaultValues,
@@ -48,9 +48,9 @@ export const healthChecksInputData = {
       data: {
         ...healthChecksDefaultValues.data,
         httpGet: {
-          scheme: 'HTTPS',
+          scheme: ['HTTPS'],
           path: '/tmp/healthy',
-          port: 8080,
+          port: '8080',
           httpHeaders: [{ name: 'custom-header', value: 'value' }],
         },
       },
@@ -64,7 +64,7 @@ export const healthChecksInputData = {
         ...healthChecksDefaultValues.data,
         requestType: RequestType.TCPSocket,
         tcpSocket: {
-          port: 8081,
+          port: '8081',
         },
       },
     },
@@ -80,19 +80,34 @@ export const enabledProbeData = {
       port: 8080,
       scheme: 'HTTPS',
     },
+    initialDelaySeconds: 0,
     periodSeconds: 10,
     successThreshold: 1,
     timeoutSeconds: 1,
   },
   startupProbe: {
     failureThreshold: 3,
+    initialDelaySeconds: 0,
     periodSeconds: 10,
     successThreshold: 1,
     tcpSocket: {
       port: 8081,
     },
     timeoutSeconds: 1,
   },
+  livenessProbe: {
+    failureThreshold: 3,
+    httpGet: {
+      httpHeaders: [],
+      path: '/',
+      port: 8080,
+      scheme: 'HTTP',
+    },
+    initialDelaySeconds: 0,
+    periodSeconds: 10,
+    successThreshold: 1,
+    timeoutSeconds: 1,
+  },
 };
 
 export const healthChecksFormInputData = {

frontend/packages/dev-console/src/components/health-checks/create-health-checks-probe-utils.ts

@@ -1,10 +1,18 @@
 import * as _ from 'lodash';
 import { K8sResourceKind } from '@console/internal/module/k8s';
-import { Resources, HealthChecksData } from '../import/import-types';
+import { Resources, HealthChecksFormData } from '../import/import-types';
 import { healthChecksDefaultValues } from './health-checks-probe-utils';
-import { HealthCheckProbeData, RequestType, HealthChecksProbeType } from './health-checks-types';
+import {
+  HealthCheckProbeData,
+  RequestType,
+  HealthChecksProbeType,
+  HealthCheckFormProbeData,
+} from './health-checks-types';
 
-export const constructProbeData = (data: HealthCheckProbeData, resourceType?: Resources) => {
+export const constructProbeData = (
+  data: HealthCheckFormProbeData,
+  resourceType?: Resources,
+): HealthCheckProbeData => {
   const probeData = {
     ...(data.failureThreshold && { failureThreshold: _.toInteger(data.failureThreshold) }),
     ...(data.successThreshold && { successThreshold: _.toInteger(data.successThreshold) }),
@@ -14,9 +22,7 @@ export const constructProbeData = (data: HealthCheckProbeData, resourceType?: Re
     ...(data.requestType === RequestType.HTTPGET && {
       httpGet: {
         ...data[data.requestType],
-        ...(data[data.requestType]?.scheme?.[0] === 'HTTPS' && {
-          scheme: data[data.requestType].scheme[0],
-        }),
+        scheme: data[data.requestType]?.scheme ? data[data.requestType].scheme[0] : 'HTTP',
         port: resourceType === Resources.KnativeService ? 0 : _.toInteger(data.httpGet.port),
       },
     }),
@@ -41,26 +47,50 @@ export const getRequestType = (data: HealthCheckProbeData) => {
   return '';
 };
 
+export const convertResourceDataToFormData = (
+  resourceData: HealthCheckProbeData,
+): HealthCheckFormProbeData => {
+  return {
+    ...resourceData,
+    requestType: getRequestType(resourceData),
+    failureThreshold: resourceData.failureThreshold.toString(),
+    successThreshold: resourceData.successThreshold.toString(),
+    initialDelaySeconds: resourceData.initialDelaySeconds?.toString(),
+    periodSeconds: resourceData.periodSeconds.toString(),
+    timeoutSeconds: resourceData.timeoutSeconds.toString(),
+    ...(resourceData.httpGet && {
+      httpGet: {
+        ...resourceData.httpGet,
+        port: resourceData.httpGet.port.toString(),
+        scheme: resourceData.httpGet.scheme === 'HTTP' ? undefined : ['HTTPS'],
+      },
+    }),
+    ...(resourceData.tcpSocket && {
+      tcpSocket: { port: resourceData.tcpSocket.port.toString() },
+    }),
+  };
+};
+
 export const getHealthChecksData = (
   resource: K8sResourceKind,
   containerIndex: number = 0,
-): HealthChecksData => {
+): HealthChecksFormData => {
   const containers = resource?.spec?.template?.spec?.containers ?? [];
-  const readinessProbe = containers?.[containerIndex]?.[HealthChecksProbeType.ReadinessProbe] ?? {};
-  const livenessProbe = containers?.[containerIndex]?.[HealthChecksProbeType.LivenessProbe] ?? {};
-  const startupProbe = containers?.[containerIndex]?.[HealthChecksProbeType.StartupProbe] ?? {};
+  const readinessProbe: HealthCheckProbeData =
+    containers?.[containerIndex]?.[HealthChecksProbeType.ReadinessProbe] ?? {};
+  const livenessProbe: HealthCheckProbeData =
+    containers?.[containerIndex]?.[HealthChecksProbeType.LivenessProbe] ?? {};
+  const startupProbe: HealthCheckProbeData =
+    containers?.[containerIndex]?.[HealthChecksProbeType.StartupProbe] ?? {};
+
   const healthChecks = {
     readinessProbe: {
       showForm: false,
       modified: false,
       enabled: !_.isEmpty(readinessProbe),
       data: !_.isEmpty(readinessProbe)
         ? {
-            ...readinessProbe,
-            requestType: getRequestType(readinessProbe),
-            ...(readinessProbe.httpGet?.scheme === 'HTTPS' && {
-              httpGet: { ...readinessProbe.httpGet, scheme: ['HTTPS'] },
-            }),
+            ...convertResourceDataToFormData(readinessProbe),
           }
         : healthChecksDefaultValues.data,
     },
@@ -70,11 +100,7 @@ export const getHealthChecksData = (
       enabled: !_.isEmpty(livenessProbe),
       data: !_.isEmpty(livenessProbe)
         ? {
-            ...livenessProbe,
-            requestType: getRequestType(livenessProbe),
-            ...(livenessProbe.httpGet?.scheme === 'HTTPS' && {
-              httpGet: { ...livenessProbe.httpGet, scheme: ['HTTPS'] },
-            }),
+            ...convertResourceDataToFormData(livenessProbe),
           }
         : healthChecksDefaultValues.data,
     },
@@ -84,19 +110,15 @@ export const getHealthChecksData = (
       enabled: !_.isEmpty(startupProbe),
       data: !_.isEmpty(startupProbe)
         ? {
-            ...startupProbe,
-            requestType: getRequestType(startupProbe),
-            ...(startupProbe.httpGet?.scheme === 'HTTPS' && {
-              httpGet: { ...startupProbe.httpGet, scheme: ['HTTPS'] },
-            }),
+            ...convertResourceDataToFormData(startupProbe),
           }
         : healthChecksDefaultValues.data,
     },
   };
   return healthChecks;
 };
 
-export const getProbesData = (healthChecks: HealthChecksData, resourceType?: Resources) => {
+export const getProbesData = (healthChecks: HealthChecksFormData, resourceType?: Resources) => {
   const { readinessProbe, livenessProbe, startupProbe } = healthChecks;
   return {
     ...(readinessProbe.enabled

frontend/packages/dev-console/src/components/health-checks/health-checks-probe-utils.ts

@@ -1,5 +1,5 @@
 import { TFunction } from 'i18next';
-import { HealthChecksProbeType, RequestType, HealthCheckProbe } from './health-checks-types';
+import { HealthChecksProbeType, RequestType, HealthCheckFormProbe } from './health-checks-types';
 
 export const getHealthChecksProbeConfig = (probe: string, t: TFunction) => {
   switch (probe) {
@@ -32,27 +32,27 @@ export const getHealthChecksProbeConfig = (probe: string, t: TFunction) => {
   }
 };
 
-export const healthChecksDefaultValues: HealthCheckProbe = {
+export const healthChecksDefaultValues: HealthCheckFormProbe = {
   showForm: false,
   enabled: false,
   modified: false,
   data: {
-    failureThreshold: 3,
+    failureThreshold: '3',
     requestType: RequestType.HTTPGET,
     httpGet: {
-      scheme: 'HTTP',
+      scheme: undefined,
       path: '/',
-      port: 8080,
+      port: '8080',
       httpHeaders: [],
     },
     tcpSocket: {
-      port: 8080,
+      port: '8080',
     },
     exec: { command: [''] },
-    initialDelaySeconds: 0,
-    periodSeconds: 10,
-    timeoutSeconds: 1,
-    successThreshold: 1,
+    initialDelaySeconds: '0',
+    periodSeconds: '10',
+    timeoutSeconds: '1',
+    successThreshold: '1',
   },
 };
 

frontend/packages/dev-console/src/components/health-checks/health-checks-types.ts

@@ -12,8 +12,13 @@ export enum RequestType {
   TCPSocket = 'tcpSocket',
 }
 export interface HealthCheckProbeData {
-  failureThreshold: number | string;
+  failureThreshold: number;
+  initialDelaySeconds: number;
+  periodSeconds: number;
+  timeoutSeconds: number;
+  successThreshold: number;
   requestType?: string;
+  exec?: { command?: string[] };
   httpGet?: {
     scheme: string;
     path: string;
@@ -23,15 +28,29 @@ export interface HealthCheckProbeData {
   tcpSocket?: {
     port: number;
   };
+}
+
+export interface HealthCheckFormProbeData {
+  failureThreshold: string;
+  initialDelaySeconds: string;
+  periodSeconds: string;
+  timeoutSeconds: string;
+  successThreshold: string;
+  requestType?: string;
   exec?: { command?: string[] };
-  initialDelaySeconds: number | string;
-  periodSeconds: number | string;
-  timeoutSeconds: number | string;
-  successThreshold: number | string;
+  httpGet?: {
+    scheme: string[];
+    path: string;
+    port: string;
+    httpHeaders: NameValuePair[];
+  };
+  tcpSocket?: {
+    port: string;
+  };
 }
-export interface HealthCheckProbe {
+export interface HealthCheckFormProbe {
   showForm?: boolean;
   enabled?: boolean;
   modified?: boolean;
-  data: HealthCheckProbeData;
+  data: HealthCheckFormProbeData;
 }