External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-18 13:11:19 -03:30
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #7960 from mabashian/6113-6703-cred-file-upload

Browse Source 
Support file upload/drag and drop on credential mutliline fields

Reviewed-by: https://github.com/apps/softwarefactory-project-zuul
This commit is contained in:
softwarefactory-project-zuul[bot] 2020-09-04 17:27:43 +00:00 committed by GitHub
commit e6cd27a858
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 45 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
awx/ui_next/src/screens/Credential/shared/CredentialForm.jsx
View File

@ -224,6 +224,7 @@ function CredentialForm({
<FormFullWidthLayout>
<ActionGroup>
<Button
id="credential-form-save-button"
aria-label={i18n._(t`Save`)}
variant="primary"
type="button"
@ -235,6 +236,7 @@ function CredentialForm({
credentialTypes[formik.values.credential_type]?.kind ===
'external' && (
<Button
id="credential-form-test-button"
aria-label={i18n._(t`Test`)}
variant="secondary"
type="button"
@ -245,6 +247,7 @@ function CredentialForm({
</Button>
)}
<Button
id="credential-form-cancel-button"
aria-label={i18n._(t`Cancel`)}
variant="secondary"
type="button"

22
awx/ui_next/src/screens/Credential/shared/CredentialForm.test.jsx
View File

@ -163,7 +163,7 @@ describe('<CredentialForm />', () => {
wrapper.find('textarea#credential-ssh_key_data').prop('value')
).toBe('');
await act(async () => {
wrapper.find('FileUpload').invoke('onChange')({
wrapper.find('FileUpload#credential-gce-file').invoke('onChange')({
name: 'foo.json',
text: () =>
'{"client_email":"testemail@ansible.com","project_id":"test123","private_key":"-----BEGIN PRIVATE KEY-----\\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\\n-----END PRIVATE KEY-----\\n"}',
@ -184,7 +184,9 @@ describe('<CredentialForm />', () => {
});
test('should clear expected fields when file clear button clicked', async () => {
await act(async () => {
wrapper.find('FileUploadField').invoke('onClearButtonClick')();
wrapper
.find('FileUploadField#credential-gce-file')
.invoke('onClearButtonClick')();
});
wrapper.update();
expect(wrapper.find('input#credential-username').prop('value')).toBe('');
@ -193,6 +195,20 @@ describe('<CredentialForm />', () => {
wrapper.find('textarea#credential-ssh_key_data').prop('value')
).toBe('');
});
test('should update field when RSA Private Key file uploaded', async () => {
await act(async () => {
wrapper.find('FileUpload#credential-ssh_key_data').invoke('onChange')(
'-----BEGIN PRIVATE KEY-----\\nBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB\\n-----END PRIVATE KEY-----\\n',
'foo.key'
);
});
wrapper.update();
expect(
wrapper.find('textarea#credential-ssh_key_data').prop('value')
).toBe(
'-----BEGIN PRIVATE KEY-----\\nBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBBB\\n-----END PRIVATE KEY-----\\n'
);
});
test('should show error when error thrown parsing JSON', async () => {
await act(async () => {
await wrapper
@ -204,7 +220,7 @@ describe('<CredentialForm />', () => {
'Select a JSON formatted service account key to autopopulate the following fields.'
);
await act(async () => {
wrapper.find('FileUpload').invoke('onChange')({
wrapper.find('FileUpload#credential-gce-file').invoke('onChange')({
name: 'foo.json',
text: () => '{not good json}',
});

32
awx/ui_next/src/screens/Credential/shared/CredentialFormFields/CredentialField.jsx
View File

@ -1,12 +1,13 @@
import React from 'react';
import React, { useState } from 'react';
import { useField, useFormikContext } from 'formik';
import { shape, string } from 'prop-types';
import styled from 'styled-components';
import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro';
import {
FileUpload as PFFileUpload,
FormGroup,
InputGroup,
TextArea,
TextInput,
} from '@patternfly/react-core';
import { FieldTooltip, PasswordInput } from '../../../../components/FormField';
@ -16,19 +17,32 @@ import { required } from '../../../../util/validators';
import { CredentialPluginField } from './CredentialPlugins';
import BecomeMethodField from './BecomeMethodField';
const FileUpload = styled(PFFileUpload)`
flex-grow: 1;
`;
function CredentialInput({ fieldOptions, credentialKind, ...rest }) {
const [subFormField, meta] = useField(`inputs.${fieldOptions.id}`);
const [fileName, setFileName] = useState('');
const [fileIsUploading, setFileIsUploading] = useState(false);
const [subFormField, meta, helpers] = useField(`inputs.${fieldOptions.id}`);
const isValid = !(meta.touched && meta.error);
if (fieldOptions.multiline) {
const handleFileChange = (value, filename) => {
helpers.setValue(value);
setFileName(filename);
};
return (
<TextArea
<FileUpload
{...subFormField}
id={`credential-${fieldOptions.id}`}
rows={6}
resizeOrientation="vertical"
onChange={(value, event) => {
subFormField.onChange(event);
}}
type="text"
filename={fileName}
onChange={handleFileChange}
onReadStarted={() => setFileIsUploading(true)}
onReadFinished={() => setFileIsUploading(false)}
isLoading={fileIsUploading}
allowEditingUploadedText
validated={isValid ? 'default' : 'error'}
/>
);