@@ -202,3 +224,156 @@ function Pod(props) {
);
}
+
+function configMaps(pods, namespace, capacitorClient) {
+ let configMaps = []
+ pods.forEach((pod) => {
+ const configMapNames = jp.query(pod, '$.spec.volumes[*].configMap.name');
+ configMaps.push(...configMapNames);
+ })
+ pods.forEach((pod) => {
+ const configMapNames = jp.query(pod, '$.spec.containers[*].envFrom[*].configMapRef.name');
+ configMaps.push(...configMapNames);
+ })
+
+ if (configMaps.length === 0) {
+ return null
+ }
+
+ return (
+
+ {configMaps.map(configMap => {
+ return
+ })}
+
+ )
+}
+
+function secrets(pods, namespace, capacitorClient) {
+ let secrets = []
+ pods.forEach((pod) => {
+ const secretNames = jp.query(pod, '$.spec.volumes[*].secret.secretName');
+ secrets.push(...secretNames)
+ })
+ pods.forEach((pod) => {
+ const configMapNames = jp.query(pod, '$.spec.containers[*].envFrom[*].secretRef.name');
+ secrets.push(...configMapNames);
+ })
+
+ if (secrets.length === 0) {
+ return null
+ }
+
+ return (
+
+ {secrets.map(secret => {
+ return
+ })}
+
+ )
+}
+
+function ConfigMap({ name, namespace, capacitorClient }) {
+ const [showModal, setShowModal] = useState(false);
+
+ const describeConfigmap = () => {
+ return capacitorClient.describeConfigmap(namespace, name)
+ }
+
+ return (
+ <>
+
+ {showModal &&
+
+ }
+
+ );
+}
+
+function Secret({ name, namespace, capacitorClient }) {
+ const [showModal, setShowModal] = useState(false);
+
+ const describeSecret = () => {
+ return capacitorClient.describeSecret(namespace, name)
+ }
+
+ return (
+ <>
+
+ {showModal &&
+
+ }
+
+ );
+}
+
+function Modal(props) {
+ const { setShowModal, fetchData } = props;
+ const [data, setData] = useState(null)
+
+ useEffect(() => {
+ fetchData().then(data => setData(data));
+
+ document.body.style.overflow = 'hidden';
+ document.body.style.paddingRight = '15px';
+ return () => { document.body.style.overflow = 'unset'; document.body.style.paddingRight = '0px' }
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, []);
+
+ return (
+
setShowModal(false)}
+ >
+
+
e.stopPropagation()}
+ >
+
+
+
+
+
+ {data ?? }
+
+
+
+
+
+ )
+}
+
+const SkeletonLoader = () => {
+ return (
+
+ )
+}
diff --git a/web/src/Services.js b/web/src/Services.js
index db0279a..43e2fa0 100644
--- a/web/src/Services.js
+++ b/web/src/Services.js
@@ -2,7 +2,7 @@ import React, { memo, useState } from 'react';
import Service from "./Service";
const Services = memo(function Services(props) {
- const { store, filters } = props
+ const { capacitorClient, store, filters } = props
const [services, setServices] = useState(store.getState().services);
const [fluxState, setFluxState] = useState(store.getState().fluxState);
store.subscribe(() => setServices(store.getState().services))
@@ -22,6 +22,7 @@ const Services = memo(function Services(props) {
alerts={[]}
kustomization={kustomization}
gitRepository={gitRepository}
+ capacitorClient={capacitorClient}
/>
)
})}
diff --git a/web/src/client.js b/web/src/client.js
index f12b080..3d494bf 100644
--- a/web/src/client.js
+++ b/web/src/client.js
@@ -11,6 +11,10 @@ export default class CapacitorClient {
getServices = () => this.get('/api/services');
+ describeConfigmap = (namespace, name) => this.get(`/api/describeConfigmap?namespace=${namespace}&name=${name}`);
+
+ describeSecret = (namespace, name) => this.get(`/api/describeSecret?namespace=${namespace}&name=${name}`);
+
get = async (path) => {
try {
const { data } = await axios.get(path, {