Skip to content

[Web] Allow Security Group selection in AWS RDS Discovery flow #32885

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
rudream merged 1 commit into from
Oct 12, 2023
Merged

[Web] Allow Security Group selection in AWS RDS Discovery flow #32885

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
237 changes: 234 additions & 3 deletions web/packages/teleport/src/Discover/Database/DeployService/AutoDeploy/AutoDeploy.story.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@

import React from 'react';
import { MemoryRouter } from 'react-router';
import { initialize, mswLoader } from 'msw-storybook-addon';
import { rest } from 'msw';

import { Context as TeleportContext, ContextProvider } from 'teleport';
import cfg from 'teleport/config';
Expand All @@ -30,15 +32,19 @@ import {
import {
DiscoverProvider,
DiscoverContextState,
DbMeta,
} from 'teleport/Discover/useDiscover';
import { IntegrationStatusCode } from 'teleport/services/integrations';

import { AutoDeploy } from './AutoDeploy';

export default {
title: 'Teleport/Discover/Database/Deploy/Auto',
loaders: [mswLoader],
};

initialize();

export const Init = () => {
return (
<Provider>
Expand All @@ -47,6 +53,18 @@ export const Init = () => {
);
};

Init.parameters = {
msw: {
handlers: [
rest.post(
cfg.getListSecurityGroupsUrl('test-integration'),
(req, res, ctx) =>
res(ctx.json({ securityGroups: securityGroupsResponse }))
),
],
},
};

export const InitWithLabels = () => {
return (
<Provider
Expand All @@ -62,25 +80,88 @@ export const InitWithLabels = () => {
);
};

InitWithLabels.parameters = {
msw: {
handlers: [
rest.post(
cfg.getListSecurityGroupsUrl('test-integration'),
(req, res, ctx) =>
res(ctx.json({ securityGroups: securityGroupsResponse }))
),
],
},
};

export const InitSecurityGroupsLoadingFailed = () => {
return (
<Provider>
<AutoDeploy />
</Provider>
);
};

InitSecurityGroupsLoadingFailed.parameters = {
msw: {
handlers: [
rest.post(
cfg.getListSecurityGroupsUrl('test-integration'),
(req, res, ctx) =>
res(
ctx.status(403),
ctx.json({
message: 'some error when trying to list security groups',
})
)
),
],
},
};

export const InitSecurityGroupsLoading = () => {
return (
<Provider>
<AutoDeploy />
</Provider>
);
};

InitSecurityGroupsLoading.parameters = {
msw: {
handlers: [
rest.post(
cfg.getListSecurityGroupsUrl('test-integration'),
(req, res, ctx) => res(ctx.delay('infinite'))
),
],
},
};

const Provider = props => {
const ctx = createTeleportContext();
const discoverCtx: DiscoverContextState = {
agentMeta: {
resourceName: 'db-name',
agentMatcherLabels: [],
db: {} as any,
db: {
aws: {
rds: {
region: 'us-east-1',
vpcId: 'test-vpc',
},
},
},
selectedAwsRdsDb: { region: 'us-east-1' } as any,
integration: {
kind: 'aws-oidc',
name: 'integration/aws-oidc',
name: 'test-integration',
resourceType: 'integration',
spec: {
roleArn: 'arn-123',
},
statusCode: IntegrationStatusCode.Running,
},
...props.agentMeta,
},
} as DbMeta,
currentStep: 0,
nextStep: () => null,
prevStep: () => null,
Expand Down Expand Up @@ -131,3 +212,153 @@ function createTeleportContext() {

return ctx;
}

const securityGroupsResponse = [
{
name: 'security-group-1',
id: 'sg-1',
description: 'this is security group 1',
inboundRules: [
{
ipProtocol: 'tcp',
fromPort: '0',
toPort: '0',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '443',
toPort: '443',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '2000',
toPort: '5000',
cidrs: [
{ cidr: '192.168.1.0/24', description: 'Subnet Mask 255.255.255.0' },
],
},
],
outboundRules: [
{
ipProtocol: 'tcp',
fromPort: '0',
toPort: '0',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '22',
toPort: '22',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '2000',
toPort: '5000',
cidrs: [
{ cidr: '10.0.0.0/16', description: 'Subnet Mask 255.255.0.0' },
],
},
],
},
{
name: 'security-group-2',
id: 'sg-2',
description: 'this is security group 2',
inboundRules: [
{
ipProtocol: 'tcp',
fromPort: '0',
toPort: '0',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '443',
toPort: '443',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '2000',
toPort: '5000',
cidrs: [
{ cidr: '192.168.1.0/24', description: 'Subnet Mask 255.255.255.0' },
],
},
],
outboundRules: [
{
ipProtocol: 'tcp',
fromPort: '0',
toPort: '0',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '22',
toPort: '22',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '2000',
toPort: '5000',
cidrs: [
{ cidr: '10.0.0.0/16', description: 'Subnet Mask 255.255.0.0' },
],
},
],
},
{
name: 'security-group-3',
id: 'sg-3',
description: 'this is security group 3',
inboundRules: [
{
ipProtocol: 'tcp',
fromPort: '0',
toPort: '0',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '443',
toPort: '443',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '2000',
toPort: '5000',
cidrs: [
{ cidr: '192.168.1.0/24', description: 'Subnet Mask 255.255.255.0' },
],
},
],
outboundRules: [
{
ipProtocol: 'tcp',
fromPort: '0',
toPort: '0',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '22',
toPort: '22',
cidrs: [{ cidr: '0.0.0.0/0', description: 'Everything' }],
},
{
ipProtocol: 'tcp',
fromPort: '2000',
toPort: '5000',
cidrs: [
{ cidr: '10.0.0.0/16', description: 'Subnet Mask 255.255.0.0' },
],
},
],
},
];
28 changes: 25 additions & 3 deletions web/packages/teleport/src/Discover/Database/DeployService/AutoDeploy/AutoDeploy.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,6 +55,8 @@ import {
import { DeployServiceProp } from '../DeployService';
import { hasMatchingLabels, Labels } from '../../common';

import { SelectSecurityGroups } from './SelectSecurityGroups';

import type { Database } from 'teleport/services/databases';

export function AutoDeploy({ toggleDeployMethod }: DeployServiceProp) {
Expand All @@ -68,6 +70,10 @@ export function AutoDeploy({ toggleDeployMethod }: DeployServiceProp) {
useState<AwsOidcDeployServiceResponse>();
const [deployFinished, setDeployFinished] = useState(false);

const [selectedSecurityGroups, setSelectedSecurityGroups] = useState<
string[]
>([]);

const hasDbLabels = agentMeta?.agentMatcherLabels?.length;
const dbLabels = hasDbLabels ? agentMeta.agentMatcherLabels : [];
const [labels, setLabels] = useState<DiscoverLabel[]>([
Expand Down Expand Up @@ -101,6 +107,7 @@ export function AutoDeploy({ toggleDeployMethod }: DeployServiceProp) {
subnetIds: dbMeta.selectedAwsRdsDb?.subnets,
taskRoleArn,
databaseAgentMatcherLabels: labels,
securityGroups: selectedSecurityGroups,
})
// The user is still technically in the "processing"
// state, because after this call succeeds, we will
Expand Down Expand Up @@ -170,8 +177,8 @@ export function AutoDeploy({ toggleDeployMethod }: DeployServiceProp) {

{/* step two */}
<StyledBox mb={5}>
<Text bold>Step 2</Text>
<Box mb={4}>
<Box>
<Text bold>Step 2 (Optional)</Text>
<Labels
labels={labels}
setLabels={setLabels}
Expand All @@ -182,11 +189,27 @@ export function AutoDeploy({ toggleDeployMethod }: DeployServiceProp) {
region={dbMeta.selectedAwsRdsDb?.region}
/>
</Box>
</StyledBox>

{/* step three */}
<StyledBox mb={5}>
<SelectSecurityGroups
selectedSecurityGroups={selectedSecurityGroups}
setSelectedSecurityGroups={setSelectedSecurityGroups}
dbMeta={dbMeta}
emitErrorEvent={emitErrorEvent}
/>
</StyledBox>

<StyledBox mb={5}>
<Text bold>Step 4</Text>
<Text mb={2}>Deploy the Teleport Database Service.</Text>
<ButtonSecondary
width="215px"
type="submit"
onClick={() => handleDeploy(validator)}
disabled={attempt.status === 'processing'}
mt={2}
mb={2}
>
Deploy Teleport Service
Expand All @@ -212,7 +235,6 @@ export function AutoDeploy({ toggleDeployMethod }: DeployServiceProp) {
)}
</StyledBox>

{/* step three */}
{isDeploying && (
<DeployHints
deployFinished={handleDeployFinished}
Expand Down
Loading