mirror of https://github.com/portainer/portainer
51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import clsx from 'clsx';
|
|
import { useState } from 'react';
|
|
import { createPortal } from 'react-dom';
|
|
|
|
import { EnvironmentId } from '@/react/portainer/environments/types';
|
|
import { useAnalytics } from '@/angulartics.matomo/analytics-services';
|
|
|
|
import { Button } from '@@/buttons';
|
|
import { Icon } from '@@/Icon';
|
|
|
|
import { KubeCtlShell } from './KubectlShell';
|
|
import styles from './KubectlShellButton.module.css';
|
|
|
|
interface Props {
|
|
environmentId: EnvironmentId;
|
|
}
|
|
export function KubectlShellButton({ environmentId }: Props) {
|
|
const [open, setOpen] = useState(false);
|
|
const { trackEvent } = useAnalytics();
|
|
return (
|
|
<>
|
|
<Button
|
|
color="primary"
|
|
size="small"
|
|
disabled={open}
|
|
data-cy="k8sSidebar-shellButton"
|
|
onClick={() => handleOpen()}
|
|
className={clsx(styles.root, '!flex')}
|
|
>
|
|
<Icon icon="terminal" feather className="vertical-center" size="md" />{' '}
|
|
kubectl shell
|
|
</Button>
|
|
|
|
{open &&
|
|
createPortal(
|
|
<KubeCtlShell
|
|
environmentId={environmentId}
|
|
onClose={() => setOpen(false)}
|
|
/>,
|
|
document.body
|
|
)}
|
|
</>
|
|
);
|
|
|
|
function handleOpen() {
|
|
setOpen(true);
|
|
|
|
trackEvent('kubernetes-kubectl-shell', { category: 'kubernetes' });
|
|
}
|
|
}
|