Adds popout for extra vars on Job Details view

This commit is contained in:
Alex Corey 2021-09-21 13:36:27 -04:00
parent 0ac3a377fd
commit 6af27fffbc
2 changed files with 25 additions and 31 deletions

View File

@ -17,7 +17,7 @@ import {
import { CardBody, CardActionsRow } from 'components/Card';
import ChipGroup from 'components/ChipGroup';
import CredentialChip from 'components/CredentialChip';
import { VariablesInput as _VariablesInput } from 'components/CodeEditor';
import { VariablesDetail } from 'components/CodeEditor';
import DeleteButton from 'components/DeleteButton';
import ErrorDetail from 'components/ErrorDetail';
import { LaunchButton, ReLaunchDropDown } from 'components/LaunchButton';
@ -29,12 +29,6 @@ import { toTitleCase } from 'util/strings';
import { formatDateString } from 'util/dates';
import { Job } from 'types';
const VariablesInput = styled(_VariablesInput)`
.pf-c-form__label {
--pf-c-form__label--FontWeight: var(--pf-global--FontWeight--bold);
}
`;
const StatusDetailValue = styled.div`
align-items: center;
display: inline-grid;
@ -420,29 +414,29 @@ function JobDetail({ job, inventorySourceLabels }) {
label={t`Last Modified`}
date={job.modified}
/>
{job.extra_vars && (
<VariablesDetail
css="margin: 20px 0"
id="job-variables"
readOnly
value={job.extra_vars}
rows={4}
label={t`Variables`}
name="extra_vars"
/>
)}
{job.artifacts && (
<VariablesDetail
css="margin: 20px 0"
id="job-artifacts"
readOnly
value={JSON.stringify(job.artifacts)}
rows={4}
label={t`Artifacts`}
name="artifacts"
/>
)}
</DetailList>
{job.extra_vars && (
<VariablesInput
css="margin: 20px 0"
id="job-variables"
readOnly
value={job.extra_vars}
rows={4}
label={t`Variables`}
name="extra_vars"
/>
)}
{job.artifacts && (
<VariablesInput
css="margin: 20px 0"
id="job-artifacts"
readOnly
value={JSON.stringify(job.artifacts)}
rows={4}
label={t`Artifacts`}
name="artifacts"
/>
)}
<CardActionsRow>
{job.type !== 'system_job' &&
job.summary_fields.user_capabilities.start &&

View File

@ -251,7 +251,7 @@ describe('<JobDetail />', () => {
wrapper.find('button[aria-label="Delete"]').simulate('click');
await sleep(1);
wrapper.update();
const modal = wrapper.find('Modal');
const modal = wrapper.find('Modal[aria-label="Alert modal"]');
expect(modal.length).toBe(1);
modal.find('button[aria-label="Confirm Delete"]').simulate('click');
expect(JobsAPI.destroy).toHaveBeenCalledTimes(1);
@ -272,7 +272,7 @@ describe('<JobDetail />', () => {
);
wrapper = mountWithContexts(<JobDetail job={mockJobData} />);
wrapper.find('button[aria-label="Delete"]').simulate('click');
const modal = wrapper.find('Modal');
const modal = wrapper.find('Modal[aria-label="Alert modal"]');
expect(modal.length).toBe(1);
await act(async () => {
modal.find('button[aria-label="Confirm Delete"]').simulate('click');