-
Notifications
You must be signed in to change notification settings - Fork 21
/
SSHCommand.tsx
111 lines (99 loc) · 3.35 KB
/
SSHCommand.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
import React, { useEffect, useState } from 'react';
import { IoK8sApiCoreV1Service } from '@kubevirt-ui/kubevirt-api/kubernetes';
import { V1VirtualMachine, V1VirtualMachineInstance } from '@kubevirt-ui/kubevirt-api/kubevirt';
import Loading from '@kubevirt-utils/components/Loading/Loading';
import { useKubevirtTranslation } from '@kubevirt-utils/hooks/useKubevirtTranslation';
import { Alert, AlertVariant, ClipboardCopy, Popover } from '@patternfly/react-core';
import {
DescriptionListDescription,
DescriptionListGroup,
DescriptionListTerm,
Stack,
StackItem,
} from '@patternfly/react-core';
import { HelpIcon } from '@patternfly/react-icons';
import useSSHCommand from '../useSSHCommand';
import { createSSHService, deleteSSHService } from '../utils';
import SSHCheckbox from './SSHCheckbox';
type SSHCommandProps = {
vmi: V1VirtualMachineInstance;
vm: V1VirtualMachine;
sshService: IoK8sApiCoreV1Service;
sshServiceLoaded?: boolean;
};
const SSHCommand: React.FC<SSHCommandProps> = ({
vmi,
vm,
sshService: initialSSHService,
sshServiceLoaded,
}) => {
const { t } = useKubevirtTranslation();
const [sshService, setSSHService] = useState<IoK8sApiCoreV1Service>();
const { command, sshServiceRunning } = useSSHCommand(vmi, sshService);
const [loading, setLoading] = useState(false);
const [error, setError] = useState<Error>();
const onSSHChange = (enableSSH: boolean) => {
setLoading(true);
const request = enableSSH
? createSSHService(vm, vmi).then(setSSHService)
: deleteSSHService(sshService).then(() => setSSHService(undefined));
request.catch(setError).finally(() => setLoading(false));
};
useEffect(() => {
setSSHService(initialSSHService);
setError(undefined);
}, [initialSSHService]);
return (
<DescriptionListGroup>
<DescriptionListTerm className="pf-u-font-size-xs">
{t('SSH over NodePort')}{' '}
<Popover
aria-label={'Help'}
position="right"
bodyContent={() =>
t(
'This option allows access through any SSH client via a NodePort Service. Additional network ports will be allocated. The node must be accessible from the outside network.',
)
}
>
<HelpIcon />
</Popover>
</DescriptionListTerm>
<DescriptionListDescription>
<Stack hasGutter>
<StackItem>
<SSHCheckbox
vmName={vm?.metadata?.name}
sshServiceRunning={!!sshService}
setSSHServiceRunning={onSSHChange}
/>
</StackItem>
{sshServiceLoaded && !loading ? (
sshServiceRunning && (
<StackItem>
<ClipboardCopy
isReadOnly
data-test="ssh-command-copy"
clickTip={t('Copied')}
hoverTip={t('Copy to clipboard')}
>
{command}
</ClipboardCopy>
</StackItem>
)
) : (
<Loading />
)}
{error && (
<StackItem>
<Alert variant={AlertVariant.danger} title={t('Error')} isInline>
{error?.message}
</Alert>
</StackItem>
)}
</Stack>
</DescriptionListDescription>
</DescriptionListGroup>
);
};
export default SSHCommand;