diff --git a/web/packages/design/src/index.ts b/web/packages/design/src/index.ts index f5260ba2ac1c7..89c45fa08a326 100644 --- a/web/packages/design/src/index.ts +++ b/web/packages/design/src/index.ts @@ -34,7 +34,7 @@ import CardSuccess, { CardSuccessLogin } from './CardSuccess'; import { Indicator } from './Indicator'; import Input from './Input'; import Label from './Label'; -import LabelInput from './LabelInput'; +import { LabelInput } from './LabelInput'; import LabelState from './LabelState'; import Link from './Link'; import { Mark } from './Mark'; diff --git a/web/packages/teleport/src/Roles/RoleEditor/StandardEditor.tsx b/web/packages/teleport/src/Roles/RoleEditor/StandardEditor.tsx index 46a53abf472b6..af9957505c8ea 100644 --- a/web/packages/teleport/src/Roles/RoleEditor/StandardEditor.tsx +++ b/web/packages/teleport/src/Roles/RoleEditor/StandardEditor.tsx @@ -24,6 +24,8 @@ import { Flex, H3, H4, + Input, + LabelInput, Mark, Text, } from 'design'; @@ -46,6 +48,10 @@ import { } from 'shared/components/FieldSelect'; import { SlideTabs } from 'design/SlideTabs'; +import { RadioGroup } from 'design/RadioGroup'; + +import Select from 'shared/components/Select'; + import { Role, RoleWithYaml } from 'teleport/services/resources'; import { LabelsInput } from 'teleport/components/LabelsInput'; @@ -73,6 +79,9 @@ import { resourceKindOptions, verbOptions, newRuleModel, + OptionsModel, + requireMFATypeOptions, + createHostUserModeOptions, } from './standardmodel'; import { validateRoleEditorModel, @@ -200,6 +209,13 @@ export const StandardEditor = ({ }); } + function setOptions(options: OptionsModel) { + handleChange({ + ...standardEditorModel, + options, + }); + } + return ( {({ validator }) => ( @@ -337,6 +353,18 @@ export const StandardEditor = ({ validation={validation.rules} /> +
+ +
handleSave(validator)} @@ -996,6 +1024,188 @@ function AdminRule({ ); } +function Options({ + value, + isProcessing, + onChange, +}: SectionProps) { + const theme = useTheme(); + const id = useId(); + const maxSessionTTLId = `${id}-max-session-ttl`; + const clientIdleTimeoutId = `${id}-client-idle-timeout`; + const requireMFATypeId = `${id}-require-mfa-type`; + const createHostUserModeId = `${id}-create-host-user-mode`; + return ( + +

+ Global Settings +

+ + Max Session TTL + onChange({ ...value, maxSessionTTL: e.target.value })} + /> + + + Client Idle Timeout + + + onChange({ ...value, clientIdleTimeout: e.target.value }) + } + /> + +
Disconnect When Certificate Expires
+ onChange({ ...value, disconnectExpiredCert: d })} + /> + + Require Session MFA + onChange?.({ ...value, createHostUserMode: m })} + /> + +

+ Database +

+ +
Create Database User
+ onChange({ ...value, createDBUser: c })} + /> + + {/* TODO(bl-nero): a bug in YAML unmarshalling backend breaks this option. Fix it. */} + {/* + Create Database User Mode + +