Skip to content

Commit

Permalink
Aesthetic changes to target dialog for new elevate credential
Browse files Browse the repository at this point in the history
  • Loading branch information
@saberlynx
saberlynx committed Jun 1, 2021
1 parent ddc17af commit f5b198a
Show file tree
Hide file tree
Showing 3 changed files with 95 additions and 36 deletions.
2 changes: 2 additions & 0 deletions gsa/src/gmp/models/credential.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,8 @@ export const SSH_CREDENTIAL_TYPES = [
USERNAME_SSH_KEY_CREDENTIAL_TYPE,
];

export const SSH_ELEVATE_CREDENTIAL_TYPES = [USERNAME_PASSWORD_CREDENTIAL_TYPE];

export const SMB_CREDENTIAL_TYPES = [USERNAME_PASSWORD_CREDENTIAL_TYPE];

export const ESXI_CREDENTIAL_TYPES = [USERNAME_PASSWORD_CREDENTIAL_TYPE];
Expand Down
28 changes: 19 additions & 9 deletions gsa/src/web/pages/targets/component.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,9 +54,8 @@ class TargetComponent extends React.Component {
};

this.openCredentialsDialog = this.openCredentialsDialog.bind(this);
this.handleCloseCredentialsDialog = this.handleCloseCredentialsDialog.bind(
this,
);
this.handleCloseCredentialsDialog =
this.handleCloseCredentialsDialog.bind(this);
this.openPortListDialog = this.openPortListDialog.bind(this);
this.handleClosePortListDialog = this.handleClosePortListDialog.bind(this);
this.openTargetDialog = this.openTargetDialog.bind(this);
Expand All @@ -65,14 +64,14 @@ class TargetComponent extends React.Component {
this.handleCreateCredential = this.handleCreateCredential.bind(this);
this.handleCreatePortList = this.handleCreatePortList.bind(this);
this.handlePortListChange = this.handlePortListChange.bind(this);
this.handleEsxiCredentialChange = this.handleEsxiCredentialChange.bind(
this,
);
this.handleEsxiCredentialChange =
this.handleEsxiCredentialChange.bind(this);
this.handleSshCredentialChange = this.handleSshCredentialChange.bind(this);
this.handleSshElevateCredentialChange =
this.handleSshElevateCredentialChange.bind(this);
this.handleSmbCredentialChange = this.handleSmbCredentialChange.bind(this);
this.handleSnmpCredentialChange = this.handleSnmpCredentialChange.bind(
this,
);
this.handleSnmpCredentialChange =
this.handleSnmpCredentialChange.bind(this);
}

openCredentialsDialog({id_field, types, title}) {
Expand Down Expand Up @@ -128,6 +127,7 @@ class TargetComponent extends React.Component {
smb_credential_id: id_or__(entity.smb_credential),
snmp_credential_id: id_or__(entity.snmp_credential),
ssh_credential_id: id_or__(entity.ssh_credential),
ssh_elevate_credential_id: id_or__(entity.ssh_elevate_credential_id),
});
});
} else {
Expand All @@ -154,6 +154,7 @@ class TargetComponent extends React.Component {
smb_credential_id: undefined,
snmp_credential_id: undefined,
ssh_credential_id: undefined,
ssh_elevate_credential_id: undefined,
target_source: undefined,
target_exclude_source: undefined,
target_title: _('New Target'),
Expand Down Expand Up @@ -269,6 +270,10 @@ class TargetComponent extends React.Component {
this.setState({ssh_credential_id});
}

handleSshElevateCredentialChange(ssh_elevate_credential_id) {
this.setState({ssh_elevate_credential_id});
}

handleSnmpCredentialChange(snmp_credential_id) {
this.setState({snmp_credential_id});
}
Expand Down Expand Up @@ -327,6 +332,7 @@ class TargetComponent extends React.Component {
smb_credential_id,
snmp_credential_id,
ssh_credential_id,
ssh_elevate_credential_id,
target_source,
target_exclude_source,
target_title,
Expand Down Expand Up @@ -377,6 +383,7 @@ class TargetComponent extends React.Component {
smb_credential_id={smb_credential_id}
snmp_credential_id={snmp_credential_id}
ssh_credential_id={ssh_credential_id}
ssh_elevate_credential_id={ssh_elevate_credential_id}
target_source={target_source}
target_exclude_source={target_exclude_source}
title={target_title}
Expand All @@ -388,6 +395,9 @@ class TargetComponent extends React.Component {
onSshCredentialChange={this.handleSshCredentialChange}
onEsxiCredentialChange={this.handleEsxiCredentialChange}
onSmbCredentialChange={this.handleSmbCredentialChange}
onSshElevateCredentialChange={
this.handleSshElevateCredentialChange
}
onSave={d => {
this.handleInteraction();
return save(d).then(() => this.closeTargetDialog());
Expand Down
101 changes: 74 additions & 27 deletions gsa/src/web/pages/targets/dialog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@
*/
import React from 'react';

import styled from 'styled-components';

import {_, _l} from 'gmp/locale/lang';

import {NO_VALUE, YES_VALUE} from 'gmp/parser';
Expand All @@ -39,6 +41,8 @@ import NewIcon from 'web/components/icon/newicon';
import Divider from 'web/components/layout/divider';
import Layout from 'web/components/layout/layout';

import Theme from 'web/utils/theme';

import {
snmp_credential_filter,
ssh_credential_filter,
Expand All @@ -47,6 +51,7 @@ import {
SNMP_CREDENTIAL_TYPES,
SSH_CREDENTIAL_TYPES,
USERNAME_PASSWORD_CREDENTIAL_TYPE,
SSH_ELEVATE_CREDENTIAL_TYPES,
} from 'gmp/models/credential';

const DEFAULT_PORT = 22;
Expand Down Expand Up @@ -89,6 +94,12 @@ const NEW_SSH = {
title: _l('Create new SSH credential'),
};

const NEW_SSH_ELEVATE = {
id_field: 'ssh_elevate_credential_id',
types: SSH_ELEVATE_CREDENTIAL_TYPES,
title: _l('Create new credential for root privileges on target system'), // what is a shorter, more explanatory title?
};

const NEW_SMB = {
id_field: 'smb_credential_id',
title: _l('Create new SMB credential'),
Expand All @@ -107,6 +118,10 @@ const NEW_SNMP = {
types: SNMP_CREDENTIAL_TYPES,
};

const ElevatePrivilegeText = styled(Layout)`
color: ${Theme.darkRed};
`;

const TargetDialog = ({
alive_tests = ALIVE_TESTS_DEFAULT,
allowSimultaneousIPs = YES_VALUE,
Expand All @@ -127,6 +142,7 @@ const TargetDialog = ({
smb_credential_id = UNSET_VALUE,
snmp_credential_id = UNSET_VALUE,
ssh_credential_id = UNSET_VALUE,
ssh_elevate_credential_id = UNSET_VALUE,
target_source = 'manual',
target_exclude_source = 'manual',
title = _('New Target'),
Expand All @@ -139,6 +155,7 @@ const TargetDialog = ({
onSmbCredentialChange,
onEsxiCredentialChange,
onSnmpCredentialChange,
onSshElevateCredentialChange,
...initial
}) => {
const ssh_credentials = credentials.filter(ssh_credential_filter);
Expand Down Expand Up @@ -170,6 +187,7 @@ const TargetDialog = ({
smb_credential_id,
snmp_credential_id,
ssh_credential_id,
ssh_elevate_credential_id,
};

return (
Expand Down Expand Up @@ -342,34 +360,61 @@ const TargetDialog = ({
)}

{capabilities.mayOp('get_credentials') && (
<FormGroup title={_('SSH')}>
<Divider>
<Select
name="ssh_credential_id"
disabled={in_use}
items={renderSelectItems(ssh_credentials, UNSET_VALUE)}
value={state.ssh_credential_id}
onChange={onSshCredentialChange}
/>
<Layout>{_('on port')}</Layout>
<TextField
size="6"
name="port"
disabled={in_use}
value={state.port}
onChange={onValueChange}
/>
{!in_use && (
<Layout>
<NewIcon
title={_('Create a new credential')}
value={NEW_SSH}
onClick={onNewCredentialsClick}
<React.Fragment>
<FormGroup title={_('SSH')}>
<Divider>
<Select
name="ssh_credential_id"
disabled={in_use}
items={renderSelectItems(ssh_credentials, UNSET_VALUE)}
value={state.ssh_credential_id}
onChange={onSshCredentialChange}
/>
<Layout>{_('on port')}</Layout>
<TextField
size="6"
name="port"
disabled={in_use}
value={state.port}
onChange={onValueChange}
/>
{!in_use && (
<Layout>
<NewIcon
title={_('Create a new credential')}
value={NEW_SSH}
onClick={onNewCredentialsClick}
/>
</Layout>
)}
</Divider>
</FormGroup>
{state.ssh_credential_id !== UNSET_VALUE && (
<FormGroup title={' '}>
<Divider>
<ElevatePrivilegeText>
{_('Elevate privileges')}
</ElevatePrivilegeText>
<Select
name="ssh_elevate_credential_id"
disabled={in_use}
items={renderSelectItems(up_credentials, UNSET_VALUE)}
value={state.ssh_elevate_credential_id}
onChange={onSshElevateCredentialChange}
/>
</Layout>
)}
</Divider>
</FormGroup>
{!in_use && (
<Layout>
<NewIcon
title={_('Create a new credential')}
value={NEW_SSH_ELEVATE}
onClick={onNewCredentialsClick}
/>
</Layout>
)}
</Divider>
</FormGroup>
)}
</React.Fragment>
)}

{capabilities.mayOp('get_credentials') && (
Expand Down Expand Up @@ -485,6 +530,7 @@ TargetDialog.propTypes = {
smb_credential_id: PropTypes.idOrZero,
snmp_credential_id: PropTypes.idOrZero,
ssh_credential_id: PropTypes.idOrZero,
ssh_elevate_credential_id: PropTypes.idOrZero,
target_exclude_source: PropTypes.oneOf(['manual', 'file']),
target_source: PropTypes.oneOf(['manual', 'file', 'asset_hosts']),
title: PropTypes.string,
Expand All @@ -497,6 +543,7 @@ TargetDialog.propTypes = {
onSmbCredentialChange: PropTypes.func.isRequired,
onSnmpCredentialChange: PropTypes.func.isRequired,
onSshCredentialChange: PropTypes.func.isRequired,
onSshElevateCredentialChange: PropTypes.func.isRequired,
};

export default withCapabilities(TargetDialog);
Expand Down

0 comments on commit f5b198a

Please sign in to comment.