Skip to content

Commit

Permalink
create shared components to be used for both agent-based and agentless
Browse files Browse the repository at this point in the history
  • Loading branch information
@maxcold
maxcold committed Dec 5, 2023
1 parent b5bdfcc commit a28c337
Show file tree
Hide file tree
Showing 3 changed files with 67 additions and 103 deletions.
58 changes: 33 additions & 25 deletions ..._posture/public/components/fleet_extensions/aws_credentials_form/aws_credentials_form.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
* 2.0; you may not use this file except in compliance with the Elastic License
* 2.0.
*/
import React from 'react';
import React, { ReactNode } from 'react';
import {
EuiCallOut,
EuiFormRow,
Expand All @@ -22,6 +22,7 @@ import { FormattedMessage } from '@kbn/i18n-react';
import { css } from '@emotion/react';
import { i18n } from '@kbn/i18n';
import {
AwsCredentialsTypeOptions,
DEFAULT_AGENTLESS_AWS_CREDENTIALS_TYPE,
DEFAULT_MANUAL_AWS_CREDENTIALS_TYPE,
getAwsCredentialsFormManualOptions,
Expand All @@ -38,9 +39,9 @@ import { AwsCredentialsType } from '../../../../common/types';
import { AwsInputVarFields } from './aws_input_var_fields';

interface AWSSetupInfoContentProps {
integrationLink: string;
info: ReactNode;
}
const AWSSetupInfoContent = ({ integrationLink }: AWSSetupInfoContentProps) => {
export const AWSSetupInfoContent = ({ info }: AWSSetupInfoContentProps) => {
return (
<>
<EuiHorizontalRule margin="xl" />
Expand All @@ -54,20 +55,7 @@ const AWSSetupInfoContent = ({ integrationLink }: AWSSetupInfoContentProps) => {
</EuiTitle>
<EuiSpacer size="l" />
<EuiText color="subdued" size="s">
<FormattedMessage
id="xpack.csp.awsIntegration.gettingStarted.setupInfoContent"
defaultMessage="Utilize AWS CloudFormation (a built-in AWS tool) or a series of manual steps to set up and deploy CSPM for assessing your AWS environment's security posture. Refer to our {gettingStartedLink} guide for details."
values={{
gettingStartedLink: (
<EuiLink href={integrationLink} target="_blank">
<FormattedMessage
id="xpack.csp.awsIntegration.gettingStarted.setupInfoContentLink"
defaultMessage="Getting Started"
/>
</EuiLink>
),
}}
/>
{info}
</EuiText>
</>
);
Expand Down Expand Up @@ -243,7 +231,24 @@ export const AwsCredentialsForm = ({

return (
<>
<AWSSetupInfoContent integrationLink={integrationLink} />
<AWSSetupInfoContent
info={
<FormattedMessage
id="xpack.csp.awsIntegration.gettingStarted.setupInfoContent"
defaultMessage="Utilize AWS CloudFormation (a built-in AWS tool) or a series of manual steps to set up and deploy CSPM for assessing your AWS environment's security posture. Refer to our {gettingStartedLink} guide for details."
values={{
gettingStartedLink: (
<EuiLink href={integrationLink} target="_blank">
<FormattedMessage
id="xpack.csp.awsIntegration.gettingStarted.setupInfoContentLink"
defaultMessage="Getting Started"
/>
</EuiLink>
),
}}
/>
}
/>
<EuiSpacer size="l" />
<RadioGroup
disabled={disabled}
Expand All @@ -261,6 +266,10 @@ export const AwsCredentialsForm = ({
{setupFormat === 'manual' && (
<>
<AwsCredentialTypeSelector
label={i18n.translate('xpack.csp.awsIntegration.awsCredentialTypeSelectorLabel', {
defaultMessage: 'Preferred manual method',
})}
options={getAwsCredentialsFormManualOptions()}
type={awsCredentialsType}
onChange={(optionId) => {
updatePolicy(
Expand Down Expand Up @@ -290,19 +299,18 @@ export const AwsCredentialsForm = ({
export const AwsCredentialTypeSelector = ({
type,
onChange,
label,
options,
}: {
onChange(type: AwsCredentialsType): void;
type: AwsCredentialsType;
label: string;
options: AwsCredentialsTypeOptions;
}) => (
<EuiFormRow
fullWidth
label={i18n.translate('xpack.csp.awsIntegration.awsCredentialTypeSelectorLabel', {
defaultMessage: 'Preferred manual method',
})}
>
<EuiFormRow fullWidth label={label}>
<EuiSelect
fullWidth
options={getAwsCredentialsFormManualOptions()}
options={options}
value={type}
onChange={(optionElem) => {
onChange(optionElem.target.value as AwsCredentialsType);
Expand Down
83 changes: 20 additions & 63 deletions ...ublic/components/fleet_extensions/aws_credentials_form/aws_credentials_form_agentless.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,17 +6,9 @@
*/

import React from 'react';
import {
EuiFormRow,
EuiHorizontalRule,
EuiSelect,
EuiSpacer,
EuiText,
EuiTitle,
} from '@elastic/eui';
import { EuiSpacer } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n-react';
import { i18n } from '@kbn/i18n';
import { AwsCredentialsType } from '../../../../common/types';
import { cspIntegrationDocsNavigation } from '../../../common/navigation/constants';
import {
DEFAULT_AGENTLESS_AWS_CREDENTIALS_TYPE,
Expand All @@ -26,59 +18,12 @@ import {
} from './get_aws_credentials_form_options';
import { getAwsCredentialsType, getPosturePolicy } from '../utils';
import { AwsInputVarFields } from './aws_input_var_fields';
import { AwsFormProps, ReadDocumentation } from './aws_credentials_form';

// TODO: create a shared component between agent-based and agentless
// TODO: update tranalsation keys
// TODO: get text
const AWSSetupInfoContentAgentless = () => {
return (
<>
<EuiHorizontalRule margin="xl" />
<EuiTitle size="xs">
<h2>
<FormattedMessage
id="xpack.csp.awsIntegration.setupInfoContentTitle"
defaultMessage="Setup Access"
/>
</h2>
</EuiTitle>
<EuiSpacer size="l" />
<EuiText color="subdued" size="s">
<FormattedMessage
id="xpack.csp.awsIntegration.gettingStarted.setupInfoContent"
defaultMessage="TBD Agentless guide"
/>
</EuiText>
</>
);
};

// TODO: create a shared component between agent-based and agentless, pass options and label
// TODO: update tranalsation keys
const AwsCredentialTypeSelector = ({
type,
onChange,
}: {
onChange(type: AwsCredentialsType): void;
type: AwsCredentialsType;
}) => (
<EuiFormRow
fullWidth
label={i18n.translate('xpack.csp.awsIntegration.awsCredentialTypeSelectorLabelAgentless', {
defaultMessage: 'Preferred method',
})}
>
<EuiSelect
fullWidth
options={getAwsCredentialsFormManualOptionsAgentless()}
value={type}
onChange={(optionElem) => {
onChange(optionElem.target.value as AwsCredentialsType);
}}
/>
</EuiFormRow>
);
import {
AwsFormProps,
ReadDocumentation,
AWSSetupInfoContent,
AwsCredentialTypeSelector,
} from './aws_credentials_form';

export const AwsCredentialsFormAgentless = ({ input, newPolicy, updatePolicy }: AwsFormProps) => {
const awsCredentialsType = getAwsCredentialsType(input) || DEFAULT_AGENTLESS_AWS_CREDENTIALS_TYPE;
Expand All @@ -87,12 +32,24 @@ export const AwsCredentialsFormAgentless = ({ input, newPolicy, updatePolicy }:
const fields = getInputVarsFields(input, group.fields);
const integrationLink = cspIntegrationDocsNavigation.cspm.getStartedPath;

// TODO: get text
return (
<>
<AWSSetupInfoContentAgentless />
<AWSSetupInfoContent
info={
<FormattedMessage
id="xpack.csp.awsIntegration.gettingStarted.setupInfoContentAgentless"
defaultMessage="TBD Agentless guide"
/>
}
/>
<EuiSpacer size="l" />
<AwsCredentialTypeSelector
label={i18n.translate('xpack.csp.awsIntegration.awsCredentialTypeSelectorLabelAgentless', {
defaultMessage: 'Preferred method',
})}
type={awsCredentialsType}
options={getAwsCredentialsFormManualOptionsAgentless()}
onChange={(optionId) => {
updatePolicy(
getPosturePolicy(newPolicy, input.type, {
Expand Down
29 changes: 14 additions & 15 deletions ...lic/components/fleet_extensions/aws_credentials_form/get_aws_credentials_form_options.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,31 +92,30 @@ export const getInputVarsFields = (input: NewPackagePolicyInput, fields: AwsCred
});

export type AwsOptions = Record<AwsCredentialsType, AwsOptionValue>;

export const getAwsCredentialsFormManualOptions = (): Array<{
export type AwsCredentialsTypeOptions = Array<{
value: AwsCredentialsType;
text: string;
}> => {
}>;

const getAwsCredentialsTypeSelectorOptions = (
filterFn: ({ value }: { value: AwsCredentialsType }) => boolean
): AwsCredentialsTypeOptions => {
return Object.entries(getAwsCredentialsFormOptions())
.map(([key, value]) => ({
value: key as AwsCredentialsType,
text: value.label,
}))
.filter(({ value }) => value !== 'cloud_formation');
.filter(filterFn);
};

export const getAwsCredentialsFormManualOptions = (): AwsCredentialsTypeOptions =>
getAwsCredentialsTypeSelectorOptions(({ value }) => value !== 'cloud_formation');

// TODO: move strings to constants
export const getAwsCredentialsFormManualOptionsAgentless = (): Array<{
value: AwsCredentialsType;
text: string;
}> => {
return Object.entries(getAwsCredentialsFormOptions())
.map(([key, value]) => ({
value: key as AwsCredentialsType,
text: value.label,
}))
.filter(({ value }) => value === 'direct_access_keys' || value === 'temporary_keys');
};
export const getAwsCredentialsFormManualOptionsAgentless = (): AwsCredentialsTypeOptions =>
getAwsCredentialsTypeSelectorOptions(
({ value }) => value === 'direct_access_keys' || value === 'temporary_keys'
);

export const DEFAULT_MANUAL_AWS_CREDENTIALS_TYPE = 'assume_role';
export const DEFAULT_AGENTLESS_AWS_CREDENTIALS_TYPE = 'direct_access_keys';
Expand Down

0 comments on commit a28c337

Please sign in to comment.