fix(kube): configmaps and secrets from envFrom in the app detail screen [EE-6282] (#10741)

* fix configmaps and secrets from envFrom

* adress review comments

app/react/kubernetes/applications/DetailsView/ApplicationDetailsWidget/ApplicationEnvVarsTable.tsx

@@ -1,4 +1,4 @@
-import { EnvVar, Pod } from 'kubernetes-types/core/v1';
+import { Pod } from 'kubernetes-types/core/v1';
 import { Asterisk, File, FileCode, Key, Lock } from 'lucide-react';
 
 import { Icon } from '@@/Icon';
@@ -44,7 +44,7 @@ export function ApplicationEnvVarsTable({ namespace, app }: Props) {
                   {envVar.isInitContainer && (
                     <span>
                       <Icon icon={Asterisk} className="!ml-1" />
-                      {envVar.valueFrom?.fieldRef?.fieldPath} (
+                      {envVar.fieldPath} (
                       <a
                         href="https://kubernetes.io/docs/concepts/workloads/pods/init-containers/"
                         target="_blank"
@@ -56,13 +56,13 @@ export function ApplicationEnvVarsTable({ namespace, app }: Props) {
                     </span>
                   )}
                 </td>
-                <td data-cy="k8sAppDetail-envVarName">{envVar.name}</td>
+                <td data-cy="k8sAppDetail-envVarName">{envVar.key || '-'}</td>
                 <td data-cy="k8sAppDetail-envVarValue">
                   {envVar.value && <span>{envVar.value}</span>}
-                  {envVar.valueFrom?.fieldRef?.fieldPath && (
+                  {envVar.fieldPath && (
                     <span>
                       <Icon icon={Asterisk} className="!ml-1" />
-                      {envVar.valueFrom.fieldRef.fieldPath} (
+                      {envVar.fieldPath} (
                       <a
                         href="https://kubernetes.io/docs/tasks/inject-data-application/downward-api-volume-expose-pod-information/"
                         target="_blank"
@@ -73,50 +73,36 @@ export function ApplicationEnvVarsTable({ namespace, app }: Props) {
                       )
                     </span>
                   )}
-                  {envVar.valueFrom?.secretKeyRef?.key && (
+                  {envVar.key ? (
                     <span className="flex items-center">
                       <Icon icon={Key} className="!mr-1" />
-                      {envVar.valueFrom.secretKeyRef.key}
+                      {envVar.key}
                     </span>
+                  ) : (
+                    '-'
                   )}
-                  {envVar.valueFrom?.configMapKeyRef?.key && (
-                    <span className="flex items-center">
-                      <Icon icon={Key} className="!mr-1" />
-                      {envVar.valueFrom.configMapKeyRef.key}
-                    </span>
-                  )}
-                  {!envVar.value && !envVar.valueFrom && <span>-</span>}
                 </td>
                 <td data-cy="k8sAppDetail-configName">
-                  {!envVar.valueFrom?.configMapKeyRef?.name &&
+                  {!envVar.resourseName && <span>-</span>}
-                    !envVar.valueFrom?.secretKeyRef?.name && <span>-</span>}
+                  {envVar.resourseName && (
-                  {envVar.valueFrom?.configMapKeyRef && (
                     <span>
                       <Link
-                        to="kubernetes.configmaps.configmap"
+                        to={
+                          envVar.type === 'configMap'
+                            ? 'kubernetes.configmaps.configmap'
+                            : 'kubernetes.secrets.secret'
+                        }
                         params={{
-                          name: envVar.valueFrom.configMapKeyRef.name,
+                          name: envVar.resourseName,
                           namespace,
                         }}
                         className="flex items-center"
                       >
-                        <Icon icon={FileCode} className="!mr-1" />
+                        <Icon
-                        {envVar.valueFrom.configMapKeyRef.name}
+                          icon={envVar.type === 'configMap' ? FileCode : Lock}
-                      </Link>
+                          className="!mr-1"
-                    </span>
+                        />
-                  )}
+                        {envVar.resourseName}
-                  {envVar.valueFrom?.secretKeyRef && (
-                    <span>
-                      <Link
-                        to="kubernetes.secrets.secret"
-                        params={{
-                          name: envVar.valueFrom.secretKeyRef.name,
-                          namespace,
-                        }}
-                        className="flex items-center"
-                      >
-                        <Icon icon={Lock} className="!mr-1" />
-                        {envVar.valueFrom.secretKeyRef.name}
                       </Link>
                     </span>
                   )}
@@ -130,9 +116,14 @@ export function ApplicationEnvVarsTable({ namespace, app }: Props) {
   );
 }
 
-interface ContainerEnvVar extends EnvVar {
+interface ContainerEnvVar {
+  key?: string;
+  value?: string;
+  fieldPath?: string;
   containerName: string;
   isInitContainer: boolean;
+  type: 'configMap' | 'secret';
+  resourseName: string;
 }
 
 function getApplicationEnvironmentVariables(
@@ -150,23 +141,60 @@ function getApplicationEnvironmentVariables(
 
   // get all the environment variables for each container
   const appContainersEnvVars =
-    appContainers?.flatMap(
+    appContainers?.flatMap((container) => {
-      (container) =>
+      const containerEnvVars: ContainerEnvVar[] =
         container?.env?.map((envVar) => ({
-          ...envVar,
+          key: envVar?.name,
+          fieldPath: envVar?.valueFrom?.fieldRef?.fieldPath,
           containerName: container.name,
           isInitContainer: false,
-        })) || []
+          type: envVar?.valueFrom?.configMapKeyRef ? 'configMap' : 'secret',
-    ) || [];
+          resourseName:
-  const appInitContainersEnvVars =
+            envVar?.valueFrom?.configMapKeyRef?.name ||
-    appInitContainers?.flatMap(
+            envVar?.valueFrom?.secretKeyRef?.name ||
-      (container) =>
+            '',
-        container?.env?.map((envVar) => ({
+        })) || [];
-          ...envVar,
+
+      const containerEnvFroms: ContainerEnvVar[] =
+        container?.envFrom?.map((envFrom) => ({
+          name: '',
+          resourseName:
+            envFrom?.configMapRef?.name || envFrom?.secretRef?.name || '',
           containerName: container.name,
-          isInitContainer: true,
+          isInitContainer: false,
-        })) || []
+          type: envFrom?.configMapRef ? 'configMap' : 'secret',
-    ) || [];
+        })) || [];
+
+      return [...containerEnvVars, ...containerEnvFroms];
+    }) || [];
+
+  const appInitContainersEnvVars =
+    appInitContainers?.flatMap((container) => {
+      const containerEnvVars: ContainerEnvVar[] =
+        container?.env?.map((envVar) => ({
+          key: envVar?.name,
+          fieldPath: envVar?.valueFrom?.fieldRef?.fieldPath,
+          containerName: container.name,
+          isInitContainer: false,
+          type: envVar?.valueFrom?.configMapKeyRef ? 'configMap' : 'secret',
+          resourseName:
+            envVar?.valueFrom?.configMapKeyRef?.name ||
+            envVar?.valueFrom?.secretKeyRef?.name ||
+            '',
+        })) || [];
+
+      const containerEnvFroms: ContainerEnvVar[] =
+        container?.envFrom?.map((envFrom) => ({
+          name: '',
+          resourseName:
+            envFrom?.configMapRef?.name || envFrom?.secretRef?.name || '',
+          containerName: container.name,
+          isInitContainer: false,
+          type: envFrom?.configMapRef ? 'configMap' : 'secret',
+        })) || [];
+
+      return [...containerEnvVars, ...containerEnvFroms];
+    }) || [];
 
   return [...appContainersEnvVars, ...appInitContainersEnvVars];
 }

app/react/kubernetes/applications/application.service.ts

@@ -250,7 +250,12 @@ async function getApplicationsByKind<T extends ApplicationList>(
     const { data } = await axios.get<T>(
       buildUrl(environmentId, namespace, `${appKind}s`)
     );
-    return data.items as T['items'];
+    const items = (data.items || []).map((app) => ({
+      ...app,
+      kind: appKind,
+      apiVersion: data.apiVersion,
+    }));
+    return items as T['items'];
   } catch (e) {
     throw parseAxiosError(e as Error, `Unable to retrieve ${appKind}s`);
   }

app/react/kubernetes/applications/pod.service.ts

@@ -19,7 +19,15 @@ export async function getNamespacePods(
         },
       }
     );
-    return data.items;
+    const items = (data.items || []).map(
+      (pod) =>
+        <Pod>{
+          ...pod,
+          kind: 'Pod',
+          apiVersion: data.apiVersion,
+        }
+    );
+    return items;
   } catch (e) {
     throw parseAxiosError(e as Error, 'Unable to retrieve pods');
   }

app/react/kubernetes/configs/ListView/ConfigMapsDatatable/utils.ts

@@ -14,12 +14,16 @@ export function getIsConfigMapInUse(
       ? app?.spec
       : app?.spec?.template?.spec;
 
-    const hasEnvVarReference = appSpec?.containers.some((container) =>
+    const hasEnvVarReference = appSpec?.containers.some((container) => {
-      container.env?.some(
+      const valueFromEnv = container.env?.some(
         (envVar) =>
           envVar.valueFrom?.configMapKeyRef?.name === configMap.metadata?.name
-      )
       );
+      const envFromEnv = container.envFrom?.some(
+        (envVar) => envVar.configMapRef?.name === configMap.metadata?.name
+      );
+      return valueFromEnv || envFromEnv;
+    });
     const hasVolumeReference = appSpec?.volumes?.some(
       (volume) => volume.configMap?.name === configMap.metadata?.name
     );

app/react/kubernetes/configs/ListView/SecretsDatatable/utils.ts

@@ -11,12 +11,16 @@ export function getIsSecretInUse(secret: Secret, applications: Application[]) {
       ? app?.spec
       : app?.spec?.template?.spec;
 
-    const hasEnvVarReference = appSpec?.containers.some((container) =>
+    const hasEnvVarReference = appSpec?.containers.some((container) => {
-      container.env?.some(
+      const valueFromEnv = container.env?.some(
         (envVar) =>
           envVar.valueFrom?.secretKeyRef?.name === secret.metadata?.name
-      )
       );
+      const envFromEnv = container.envFrom?.some(
+        (envVar) => envVar.secretRef?.name === secret.metadata?.name
+      );
+      return valueFromEnv || envFromEnv;
+    });
     const hasVolumeReference = appSpec?.volumes?.some(
       (volume) => volume.secret?.secretName === secret.metadata?.name
     );