@kinvolk/headlamp-plugin
Version:
The needed infrastructure for building Headlamp plugins.
53 lines (52 loc) • 2.82 kB
JavaScript
import { jsx as _jsx, 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 Collapse from '@mui/material/Collapse';
import List from '@mui/material/List';
import ListItem from '@mui/material/ListItem';
import React, { memo } from 'react';
import { generatePath } from 'react-router';
import { formatClusterPathParam, getClusterPrefixedPath } from '../../lib/cluster';
import { useSelectedClusters } from '../../lib/k8s';
import { createRouteURL, getRoute } from '../../lib/router';
import ListItemLink from './ListItemLink';
const SidebarItem = memo((props) => {
const { label, name, subtitle, url = null, search, useClusterURL = false, subList = [], isSelected, hasParent = false, icon, fullWidth = true, hide, ...other } = props;
const clusters = useSelectedClusters();
let fullURL = url;
if (fullURL && useClusterURL && clusters.length) {
fullURL = generatePath(getClusterPrefixedPath(url), {
cluster: clusters.length ? formatClusterPathParam(clusters) : '',
});
}
if (!fullURL) {
let routeName = name;
if (!getRoute(name)) {
routeName = subList.length > 0 ? subList[0].name : '';
}
fullURL = createRouteURL(routeName);
}
return hide ? null : (_jsxs(React.Fragment, { children: [_jsx(ListItemLink, { selected: isSelected, pathname: fullURL || '', primary: fullWidth ? label : '', icon: icon, name: label, subtitle: subtitle, search: search, iconOnly: !fullWidth, hasParent: hasParent, fullWidth: fullWidth, ...other }), subList.length > 0 && (_jsx(ListItem, { sx: {
padding: 0,
}, children: _jsx(Collapse, { in: fullWidth && isSelected, sx: { width: '100%' }, children: _jsx(List, { component: "ul", disablePadding: true, sx: {
'& .MuiListItem-root': {
fontSize: '.875rem',
paddingTop: '2px',
paddingBottom: '2px',
},
}, children: subList.map((item) => (_jsx(SidebarItem, { isSelected: item.isSelected, hasParent: true, search: search, ...item }, item.name))) }) }) }))] }));
});
export default SidebarItem;