@kinvolk/headlamp-plugin
Version:
The needed infrastructure for building Headlamp plugins.
117 lines (116 loc) • 6.32 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
/*
* Copyright 2025 The Kubernetes Authors
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { InlineIcon } from '@iconify/react';
import Box from '@mui/material/Box';
import _ from 'lodash';
import { useTranslation } from 'react-i18next';
import { useParams } from 'react-router-dom';
import Endpoint from '../../lib/k8s/endpoints';
import EndpointSlice from '../../lib/k8s/endpointSlices';
import Service from '../../lib/k8s/service';
import Empty from '../common/EmptyContent';
import { ValueLabel } from '../common/Label';
import Link from '../common/Link';
import { DetailsGrid, MetadataDictGrid } from '../common/Resource';
import PortForward from '../common/Resource/PortForward';
import { SectionBox } from '../common/SectionBox';
import SimpleTable from '../common/SimpleTable';
export default function ServiceDetails(props) {
const params = useParams();
const { name = params.name, namespace = params.namespace, cluster } = props;
const { t } = useTranslation(['glossary', 'translation']);
const [endpoints, endpointsError] = Endpoint.useList({ namespace, cluster });
const [endpointSlices, endpointSlicesError] = EndpointSlice.useList({ namespace, cluster });
function getOwnedEndpoints(item) {
return item ? endpoints?.filter(endpoint => endpoint.getName() === item.getName()) : null;
}
function getOwnedEndpointSlices(item) {
return item
? endpointSlices?.filter(endpointSlice => endpointSlice.getOwnerServiceName() === item.getName())
: null;
}
return (_jsx(DetailsGrid, { resourceType: Service, name: name, namespace: namespace, cluster: cluster, withEvents: true, extraInfo: item => item && [
{
name: t('translation|Type'),
value: item.spec.type,
},
{
name: t('Cluster IP'),
value: item.spec.clusterIP,
},
{
name: t('External IP'),
value: item.getExternalAddresses(),
hide: _.isEmpty,
},
{
name: t('Selector'),
value: _jsx(MetadataDictGrid, { dict: item.spec.selector }),
},
], extraSections: item => {
if (!item) {
return [];
}
return [
{
id: 'headlamp.service-ports',
section: (_jsx(SectionBox, { title: t('Ports'), children: _jsx(SimpleTable, { data: item.spec.ports, columns: [
{ label: t('Protocol'), datum: 'protocol' },
{ label: t('translation|Name'), datum: 'name' },
{
label: t('Ports'),
getter: ({ port, targetPort }) => (_jsxs(_Fragment, { children: [_jsx(ValueLabel, { children: port }), _jsx(InlineIcon, { icon: "mdi:chevron-right" }), _jsx(ValueLabel, { children: targetPort }), _jsx(PortForward, { containerPort: targetPort, resource: item })] })),
},
], reflectInURL: "ports" }) })),
},
{
id: 'headlamp.service-endpoints',
section: (_jsx(SectionBox, { title: t('Endpoints'), children: endpointsError ? (_jsx(Empty, { color: "error", children: endpointsError.toString() })) : (_jsx(SimpleTable, { data: getOwnedEndpoints(item) ?? null, columns: [
{
label: t('translation|Name'),
getter: endpoint => _jsx(Link, { kubeObject: endpoint }),
},
{
label: t('translation|Addresses'),
getter: endpoint => (_jsx(Box, { display: "flex", flexDirection: "column", children: endpoint.getAddresses().map((address, index) => (_jsx(ValueLabel, { children: address }, index))) })),
},
], reflectInURL: "endpoints" })) })),
},
{
id: 'headlamp.service-endpointslices',
section: (_jsx(SectionBox, { title: t('Endpoint Slices'), children: endpointSlicesError ? (_jsx(Empty, { color: "error", children: endpointSlicesError.toString() })) : (_jsx(SimpleTable, { data: getOwnedEndpointSlices(item) ?? null, columns: [
{
label: t('translation|Name'),
getter: endpointSlice => _jsx(Link, { kubeObject: endpointSlice }),
},
{
label: t('translation|Addresses'),
getter: endpointSlice => (_jsx(Box, { display: "flex", flexDirection: "column", children: endpointSlice.spec.endpoints.map((ep, index) => (_jsx(ValueLabel, { children: ep.addresses.join(',') }, index))) })),
},
{
label: t('Ports'),
getter: endpoint => endpoint.ports?.join(', ') ?? '',
},
{
label: t('translation|Address Type'),
getter: endpoint => endpoint?.spec?.addressType ?? '',
},
], reflectInURL: "endpoints" })) })),
},
];
} }));
}