Skip to content

Commit 18189c1

Browse files
nchauletnchaulet
committed
Simplify a lot the instructions to only display manual instructions
1 parent 57c1c18 commit 18189c1

4 files changed

Lines changed: 65 additions & 234 deletions

File tree

  • x-pack/plugins/ingest_manager/public/applications/ingest_manager

‎x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/enrollment_instructions/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,4 @@
44
* you may not use this file except in compliance with the Elastic License.
55
*/
66

7-
export { QuickSetupInstructions } from './shell';
87
export { ManualInstructions } from './manual';

‎x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/enrollment_instructions/manual/index.tsx‎

Lines changed: 22 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,24 +5,31 @@
55
*/
66

77
import React from 'react';
8-
import { EuiText, EuiSpacer, EuiCode, EuiCodeBlock } from '@elastic/eui';
8+
import { EuiText, EuiSpacer, EuiCode, EuiCodeBlock, EuiCopy, EuiButton } from '@elastic/eui';
99
import { FormattedMessage } from '@kbn/i18n/react';
1010
import { EnrollmentAPIKey } from '../../../types';
1111

1212
interface Props {
1313
kibanaUrl: string;
1414
apiKey: EnrollmentAPIKey;
15+
kibanaCASha256?: string;
1516
}
1617

17-
export const ManualInstructions: React.FunctionComponent<Props> = ({ kibanaUrl, apiKey }) => {
18+
export const ManualInstructions: React.FunctionComponent<Props> = ({
19+
kibanaUrl,
20+
apiKey,
21+
kibanaCASha256,
22+
}) => {
1823
const command = `
19-
./elastic-agent enroll ${kibanaUrl} ${apiKey.api_key}
24+
./elastic-agent enroll ${kibanaUrl} ${apiKey.api_key}${
25+
kibanaCASha256 ? ` --ca_sha256=${kibanaCASha256}` : ''
26+
}
2027
./elastic-agent run`;
2128
return (
2229
<>
2330
<EuiText>
2431
<FormattedMessage
25-
id="todo"
32+
id="xpack.ingestManager.enrollmentInstructions.descriptionText"
2633
defaultMessage="From the agent’s directory, run these commands to enroll and start the Elastic Agent. {enrollCommand} will write to your agent’s configuration file so that it has the correct settings. You can use this command to setup agents on more than one host."
2734
values={{
2835
enrollCommand: <EuiCode>agent enroll</EuiCode>,
@@ -33,6 +40,17 @@ export const ManualInstructions: React.FunctionComponent<Props> = ({ kibanaUrl,
3340
<EuiCodeBlock fontSize="m">
3441
<pre>{command}</pre>
3542
</EuiCodeBlock>
43+
<EuiSpacer size="m" />
44+
<EuiCopy textToCopy={command}>
45+
{copy => (
46+
<EuiButton iconType="copy" fill onClick={copy}>
47+
<FormattedMessage
48+
id="xpack.ingestManager.enrollmentInstructions.copyButton"
49+
defaultMessage="Copy command"
50+
/>
51+
</EuiButton>
52+
)}
53+
</EuiCopy>
3654
</>
3755
);
3856
};

‎x-pack/plugins/ingest_manager/public/applications/ingest_manager/components/enrollment_instructions/shell/index.tsx‎

Lines changed: 0 additions & 96 deletions
This file was deleted.

‎x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/fleet/components/agent_enrollment_flyout/index.tsx‎

Lines changed: 43 additions & 133 deletions
Original file line numberDiff line numberDiff line change
@@ -14,23 +14,17 @@ import {
1414
EuiButtonEmpty,
1515
EuiButton,
1616
EuiFlyoutFooter,
17-
EuiTabs,
18-
EuiTab,
1917
EuiSteps,
2018
EuiText,
21-
EuiSelect,
2219
EuiLink,
2320
} from '@elastic/eui';
2421
import { EuiContainedStepProps } from '@elastic/eui/src/components/steps/steps';
2522
import { i18n } from '@kbn/i18n';
2623
import { FormattedMessage } from '@kbn/i18n/react';
2724
import { AgentConfig } from '../../../../types';
2825
import { EnrollmentStepAgentConfig } from './config_selection';
29-
import { useGetOneEnrollmentAPIKey, useCore } from '../../../../hooks';
30-
import {
31-
QuickSetupInstructions,
32-
ManualInstructions,
33-
} from '../../../../components/enrollment_instructions';
26+
import { useGetOneEnrollmentAPIKey, useCore, useGetSettings } from '../../../../hooks';
27+
import { ManualInstructions } from '../../../../components/enrollment_instructions';
3428

3529
interface Props {
3630
onClose: () => void;
@@ -43,39 +37,38 @@ export const AgentEnrollmentFlyout: React.FunctionComponent<Props> = ({
4337
}) => {
4438
const core = useCore();
4539
const [selectedAPIKeyId, setSelectedAPIKeyId] = useState<string | undefined>();
46-
const [selectedPlatform, setSelectedPlatform] = useState<string>('macos');
47-
const [selectedTab, setSelectedTab] = useState<'quick_setup' | 'manual'>('quick_setup');
4840

41+
const settings = useGetSettings();
4942
const apiKey = useGetOneEnrollmentAPIKey(selectedAPIKeyId);
5043

44+
const kibanaUrl =
45+
settings.data?.item?.kibana_url ?? `${window.location.origin}${core.http.basePath.get()}`;
46+
const kibanaCASha256 = settings.data?.item?.kibana_ca_sha256;
47+
5148
const steps: EuiContainedStepProps[] = [
52-
...(selectedTab === 'manual'
53-
? [
54-
{
55-
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepDownloadAgentTitle', {
56-
defaultMessage: 'Download the Elastic Agent',
57-
}),
58-
children: (
59-
<EuiText>
60-
<FormattedMessage
61-
id="xpack.ingestManager.agentEnrollment.downloadDescription"
62-
defaultMessage="Download the Elastic agent on your host’s machine. You can download the agent binary and it’s verification signature from Elastic’s {downloadLink}."
63-
values={{
64-
downloadLink: (
65-
<EuiLink href="https://ela.st/download-elastic-agent" target="_blank">
66-
<FormattedMessage
67-
id="xpack.ingestManager.agentEnrollment.downloadLink"
68-
defaultMessage="download page"
69-
/>
70-
</EuiLink>
71-
),
72-
}}
73-
/>
74-
</EuiText>
75-
),
76-
},
77-
]
78-
: []),
49+
{
50+
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepDownloadAgentTitle', {
51+
defaultMessage: 'Download the Elastic Agent',
52+
}),
53+
children: (
54+
<EuiText>
55+
<FormattedMessage
56+
id="xpack.ingestManager.agentEnrollment.downloadDescription"
57+
defaultMessage="Download the Elastic agent on your host’s machine. You can download the agent binary and it’s verification signature from Elastic’s {downloadLink}."
58+
values={{
59+
downloadLink: (
60+
<EuiLink href="https://ela.st/download-elastic-agent" target="_blank">
61+
<FormattedMessage
62+
id="xpack.ingestManager.agentEnrollment.downloadLink"
63+
defaultMessage="download page"
64+
/>
65+
</EuiLink>
66+
),
67+
}}
68+
/>
69+
</EuiText>
70+
),
71+
},
7972
{
8073
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepChooseAgentConfigTitle', {
8174
defaultMessage: 'Choose an agent configuration',
@@ -84,85 +77,23 @@ export const AgentEnrollmentFlyout: React.FunctionComponent<Props> = ({
8477
<EnrollmentStepAgentConfig agentConfigs={agentConfigs} onKeyChange={setSelectedAPIKeyId} />
8578
),
8679
},
87-
...(selectedTab === 'manual'
88-
? [
89-
{
90-
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepRunAgentTitle', {
91-
defaultMessage: 'Enroll and run the Elastic Agent',
92-
}),
93-
children: apiKey.data && (
94-
<ManualInstructions
95-
apiKey={apiKey.data.item}
96-
kibanaUrl={`${window.location.origin}${core.http.basePath.get()}`}
97-
/>
98-
),
99-
},
100-
]
101-
: [
102-
{
103-
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepChoosePlatformTitle', {
104-
defaultMessage: 'Select your agent platform',
105-
}),
106-
children: (
107-
<EuiSelect
108-
fullWidth
109-
prepend={
110-
<EuiText>
111-
<FormattedMessage
112-
id="xpack.ingestManager.agentEnrollment.selectPlatformLabel"
113-
defaultMessage="Agent platform"
114-
/>
115-
</EuiText>
116-
}
117-
value={selectedPlatform}
118-
onChange={e => setSelectedPlatform(e.target.value)}
119-
options={[
120-
{
121-
text: i18n.translate(
122-
'xpack.ingestManager.agentEnrollment.platformDarwinLabel',
123-
{
124-
defaultMessage: 'Macos',
125-
}
126-
),
127-
value: 'macos',
128-
},
129-
{
130-
text: i18n.translate('xpack.ingestManager.agentEnrollment.platformLinuxLabel', {
131-
defaultMessage: 'Linux 64-bit',
132-
}),
133-
value: 'linux',
134-
},
135-
{
136-
text: i18n.translate(
137-
'xpack.ingestManager.agentEnrollment.platformWindowsLabel',
138-
{
139-
defaultMessage: 'Windows',
140-
}
141-
),
142-
value: 'windows',
143-
},
144-
]}
145-
/>
146-
),
147-
},
148-
{
149-
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepQuickSetupTitle', {
150-
defaultMessage: 'Download and enroll the Elastic Agent',
151-
}),
152-
children: apiKey.data && (
153-
<QuickSetupInstructions
154-
apiKey={apiKey.data.item}
155-
kibanaUrl={`${window.location.origin}${core.http.basePath.get()}`}
156-
platform={selectedPlatform}
157-
/>
158-
),
159-
},
160-
]),
80+
{
81+
title: i18n.translate('xpack.ingestManager.agentEnrollment.stepRunAgentTitle', {
82+
defaultMessage: 'Enroll and run the Elastic Agent',
83+
}),
84+
children: apiKey.data && (
85+
<ManualInstructions
86+
apiKey={apiKey.data.item}
87+
kibanaUrl={kibanaUrl}
88+
kibanaCASha256={kibanaCASha256}
89+
/>
90+
),
91+
},
16192
];
16293

16394
return (
16495
<EuiFlyout onClose={onClose} size="l" maxWidth={860}>
165-
<EuiFlyoutHeader aria-labelledby="FleetAgentEnrollmentFlyoutTitle">
96+
<EuiFlyoutHeader hasBorder aria-labelledby="FleetAgentEnrollmentFlyoutTitle">
16697
<EuiTitle size="m">
16798
<h2 id="FleetAgentEnrollmentFlyoutTitle">
16899
<FormattedMessage
@@ -172,27 +103,6 @@ export const AgentEnrollmentFlyout: React.FunctionComponent<Props> = ({
172103
</h2>
173104
</EuiTitle>
174105
</EuiFlyoutHeader>
175-
<div>
176-
<EuiTabs>
177-
{/* TODO check if we can do better */}
178-
&nbsp; &nbsp;
179-
<EuiTab
180-
onClick={() => setSelectedTab('quick_setup')}
181-
isSelected={selectedTab === 'quick_setup'}
182-
>
183-
<FormattedMessage
184-
id="xpack.ingestManager.agentEnrollment.tabQuickSetupTitle"
185-
defaultMessage="Quick setup"
186-
/>
187-
</EuiTab>
188-
<EuiTab onClick={() => setSelectedTab('manual')} isSelected={selectedTab === 'manual'}>
189-
<FormattedMessage
190-
id="xpack.ingestManager.agentEnrollment.manualInstructionsTitle"
191-
defaultMessage="Manual instructions"
192-
/>
193-
</EuiTab>
194-
</EuiTabs>
195-
</div>
196106
<EuiFlyoutBody>
197107
<EuiSteps steps={steps} />
198108
</EuiFlyoutBody>

0 commit comments

Comments
 (0)