Skip to content

Commit

Permalink
fix(credential): ds-391 correct rendered fields
Browse files Browse the repository at this point in the history 
When choosing auth type username and password, some extra fields
should only be generated to network source type.
Relates to JIRA: DISCOVERY-391
  • Loading branch information
@nicolearagao
nicolearagao committed Sep 12, 2024
1 parent 6978a70 commit 30cffff
Show file tree
Hide file tree
Showing 3 changed files with 235 additions and 65 deletions.
220 changes: 185 additions & 35 deletions src/views/credentials/__tests__/__snapshots__/addCredentialModal.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,6 +155,8 @@ exports[`CredentialFormFields should render a basic component: basic 1`] = `
type="password"
/>
</FormGroup>
</React.Fragment>
<React.Fragment>
<FormGroup
fieldId="become_method"
label="Become Method"
Expand Down Expand Up @@ -207,6 +209,102 @@ exports[`CredentialFormFields should render a basic component: basic 1`] = `
</React.Fragment>
`;

exports[`CredentialFormFields should render ansible form appropriately: ansible, "Username and Password" 1`] = `
<React.Fragment>
<FormGroup
fieldId="name"
isRequired={true}
label="Name"
>
<TextInput
id="credential-name"
isRequired={true}
name="name"
onChange={[Function]}
placeholder="Enter a name for the credential"
type="text"
/>
</FormGroup>
<React.Fragment>
<FormGroup
fieldId="username"
isRequired={true}
label="Username"
>
<TextInput
id="credential-username"
isRequired={true}
name="username"
onChange={[Function]}
placeholder="Enter username"
/>
</FormGroup>
<FormGroup
fieldId="password"
isRequired={true}
label="Password"
>
<TextInput
id="credential-password"
isRequired={true}
name="password"
onChange={[Function]}
placeholder="Enter password"
type="password"
/>
</FormGroup>
</React.Fragment>
</React.Fragment>
`;

exports[`CredentialFormFields should render satellite form appropriately: satellite, "Username and Password" 1`] = `
<React.Fragment>
<FormGroup
fieldId="name"
isRequired={true}
label="Name"
>
<TextInput
id="credential-name"
isRequired={true}
name="name"
onChange={[Function]}
placeholder="Enter a name for the credential"
type="text"
/>
</FormGroup>
<React.Fragment>
<FormGroup
fieldId="username"
isRequired={true}
label="Username"
>
<TextInput
id="credential-username"
isRequired={true}
name="username"
onChange={[Function]}
placeholder="Enter username"
/>
</FormGroup>
<FormGroup
fieldId="password"
isRequired={true}
label="Password"
>
<TextInput
id="credential-password"
isRequired={true}
name="password"
onChange={[Function]}
placeholder="Enter password"
type="password"
/>
</FormGroup>
</React.Fragment>
</React.Fragment>
`;

exports[`CredentialFormFields should render specific to authType for type network: network, SSH Key 1`] = `
<React.Fragment>
<FormGroup
Expand Down Expand Up @@ -284,6 +382,56 @@ exports[`CredentialFormFields should render specific to authType for type networ
/>
</FormGroup>
</React.Fragment>
<React.Fragment>
<FormGroup
fieldId="become_method"
label="Become Method"
>
<SimpleDropdown
dropdownItems={
[
"Select option",
"sudo",
"su",
"pbrun",
"pfexec",
"doas",
"dzdo",
"ksu",
"runas",
]
}
isFullWidth={true}
label="Select option"
onSelect={[Function]}
variant="default"
/>
</FormGroup>
<FormGroup
fieldId="become_user"
label="Become User"
>
<TextInput
id="become_user"
name="become_user"
onChange={[Function]}
placeholder="Enter become user (optional)"
type="text"
/>
</FormGroup>
<FormGroup
fieldId="become_password"
label="Become Password"
>
<TextInput
id="become_password"
name="become_password"
onChange={[Function]}
placeholder="Enter become password (optional)"
type="password"
/>
</FormGroup>
</React.Fragment>
</React.Fragment>
`;

Expand Down Expand Up @@ -348,6 +496,8 @@ exports[`CredentialFormFields should render specific to authType for type networ
type="password"
/>
</FormGroup>
</React.Fragment>
<React.Fragment>
<FormGroup
fieldId="become_method"
label="Become Method"
Expand Down Expand Up @@ -511,51 +661,51 @@ exports[`CredentialFormFields should render specific to authType for type opensh
type="password"
/>
</FormGroup>
</React.Fragment>
</React.Fragment>
`;

exports[`CredentialFormFields should render vcenter form appropriately: vcenter, "Username and Password" 1`] = `
<React.Fragment>
<FormGroup
fieldId="name"
isRequired={true}
label="Name"
>
<TextInput
id="credential-name"
isRequired={true}
name="name"
onChange={[Function]}
placeholder="Enter a name for the credential"
type="text"
/>
</FormGroup>
<React.Fragment>
<FormGroup
fieldId="become_method"
label="Become Method"
>
<SimpleDropdown
dropdownItems={
[
"Select option",
"sudo",
"su",
"pbrun",
"pfexec",
"doas",
"dzdo",
"ksu",
"runas",
]
}
isFullWidth={true}
label="Select option"
onSelect={[Function]}
variant="default"
/>
</FormGroup>
<FormGroup
fieldId="become_user"
label="Become User"
fieldId="username"
isRequired={true}
label="Username"
>
<TextInput
id="become_user"
name="become_user"
id="credential-username"
isRequired={true}
name="username"
onChange={[Function]}
placeholder="Enter become user (optional)"
type="text"
placeholder="Enter username"
/>
</FormGroup>
<FormGroup
fieldId="become_password"
label="Become Password"
fieldId="password"
isRequired={true}
label="Password"
>
<TextInput
id="become_password"
name="become_password"
id="credential-password"
isRequired={true}
name="password"
onChange={[Function]}
placeholder="Enter become password (optional)"
placeholder="Enter password"
type="password"
/>
</FormGroup>
Expand Down
15 changes: 15 additions & 0 deletions src/views/credentials/__tests__/addCredentialModal.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,21 @@ describe('CredentialFormFields', () => {
expect(openshiftToken).toMatchSnapshot('openshift, "Token"');
});

it('should render vcenter form appropriately', async () => {
const vcenter = await shallowComponent(<CredentialFormFields typeValue="vcenter" />);
expect(vcenter).toMatchSnapshot('vcenter, "Username and Password"');
});

it('should render satellite form appropriately', async () => {
const satellite = await shallowComponent(<CredentialFormFields typeValue="satellite" />);
expect(satellite).toMatchSnapshot('satellite, "Username and Password"');
});

it('should render ansible form appropriately', async () => {
const ansible = await shallowComponent(<CredentialFormFields typeValue="ansible" />);
expect(ansible).toMatchSnapshot('ansible, "Username and Password"');
});

it('should call handlers for setAuthType and handleInputChange', async () => {
const mockHandleInputChange = jest.fn();
const mockSetAuthType = jest.fn();
Expand Down
65 changes: 35 additions & 30 deletions src/views/credentials/addCredentialModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -170,35 +170,6 @@ const CredentialFormFields: React.FC<CredentialFormFieldsProps> = ({
onChange={event => handleInputChange('password', (event.target as HTMLInputElement).value)}
/>
</FormGroup>
<FormGroup label="Become Method" fieldId="become_method">
<SimpleDropdown
label={formData?.become_method || 'Select option'}
variant="default"
isFullWidth
onSelect={item => handleInputChange('become_method', (item !== 'Select option' && item) || '')}
dropdownItems={['Select option', 'sudo', 'su', 'pbrun', 'pfexec', 'doas', 'dzdo', 'ksu', 'runas']}
/>
</FormGroup>
<FormGroup label="Become User" fieldId="become_user">
<TextInput
value={formData?.become_user}
placeholder="Enter become user (optional)"
type="text"
id="become_user"
name="become_user"
onChange={event => handleInputChange('become_user', (event.target as HTMLInputElement).value)}
/>
</FormGroup>
<FormGroup label="Become Password" fieldId="become_password">
<TextInput
value={formData?.become_password}
placeholder="Enter become password (optional)"
type="password"
id="become_password"
name="become_password"
onChange={event => handleInputChange('become_password', (event.target as HTMLInputElement).value)}
/>
</FormGroup>
</React.Fragment>
)}

Expand Down Expand Up @@ -241,9 +212,43 @@ const CredentialFormFields: React.FC<CredentialFormFieldsProps> = ({
</FormGroup>
</React.Fragment>
)}

{/* Render "Become" fields only if network is selected and authType is Username/Password or SSH Key */}
{typeValue === 'network' && (
<React.Fragment>
<FormGroup label="Become Method" fieldId="become_method">
<SimpleDropdown
label={formData?.become_method || 'Select option'}
variant="default"
isFullWidth
onSelect={item => handleInputChange('become_method', (item !== 'Select option' && item) || '')}
dropdownItems={['Select option', 'sudo', 'su', 'pbrun', 'pfexec', 'doas', 'dzdo', 'ksu', 'runas']}
/>
</FormGroup>
<FormGroup label="Become User" fieldId="become_user">
<TextInput
value={formData?.become_user}
placeholder="Enter become user (optional)"
type="text"
id="become_user"
name="become_user"
onChange={event => handleInputChange('become_user', (event.target as HTMLInputElement).value)}
/>
</FormGroup>
<FormGroup label="Become Password" fieldId="become_password">
<TextInput
value={formData?.become_password}
placeholder="Enter become password (optional)"
type="password"
id="become_password"
name="become_password"
onChange={event => handleInputChange('become_password', (event.target as HTMLInputElement).value)}
/>
</FormGroup>
</React.Fragment>
)}
</React.Fragment>
);

const AddCredentialModal: React.FC<AddCredentialModalProps> = ({
isOpen,
credential,
Expand Down

0 comments on commit 30cffff

Please sign in to comment.