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

Add guard clause to loadMoreRows and style tweaks

Browse Source
This commit is contained in:
Marliana Lara
2019-07-26 10:36:28 -04:00
parent 033308de69
commit 2aa38e84dd
2 changed files with 14 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
awx/ui_next/src/screens/Job/JobOutput/JobEvent.jsx
View File

@@ -71,7 +71,7 @@ const JobEventLineNumber = styled.div`
text-align: right; text-align: right;
vertical-align: top; vertical-align: top;
padding-right: 5px; padding-right: 5px;
border-right: 1px solid #b7b7b7; border-right: 1px solid #d7d7d7;
user-select: none; user-select: none;
`; `;
const JobEventLineText = styled.div` const JobEventLineText = styled.div`
@@ -132,10 +132,10 @@ function JobEvent({ counter, created, event, stdout, start_line, ...rest }) {
<JobEventWrapper {...rest}> <JobEventWrapper {...rest}>
{getLineTextHtml({ created, event, start_line, stdout }).map( {getLineTextHtml({ created, event, start_line, stdout }).map(
({ lineNumber, html }) => ({ lineNumber, html }) =>
lineNumber !== 0 && ( lineNumber >= 0 && (
<JobEventLine <JobEventLine
key={`${counter}-${lineNumber}`} key={`${counter}-${lineNumber}`}
isFirst={lineNumber === 1} isFirst={lineNumber === 0}
> >
<JobEventLineToggle /> <JobEventLineToggle />
<JobEventLineNumber>{lineNumber}</JobEventLineNumber> <JobEventLineNumber>{lineNumber}</JobEventLineNumber>

15
awx/ui_next/src/screens/Job/JobOutput/JobOutput.jsx
View File

@@ -17,23 +17,26 @@ import JobEvent from './JobEvent';
import JobEventSkeleton from './JobEventSkeleton'; import JobEventSkeleton from './JobEventSkeleton';
import MenuControls from './shared/MenuControls'; import MenuControls from './shared/MenuControls';
const OutputHeader = styled.div`
font-weight: var(--pf-global--FontWeight--bold);
`;
const OutputToolbar = styled.div` const OutputToolbar = styled.div`
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
`; `;
const OutputWrapper = styled.div` const OutputWrapper = styled.div`
height: calc(100vh - 325px); height: calc(100vh - 350px);
background-color: #fafafa; background-color: #fafafa;
margin-top: 24px; margin-top: 24px;
font-family: monospace; font-family: monospace;
font-size: 15px; font-size: 15px;
border: 1px solid #b7b7b7; outline: 1px solid #d7d7d7;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
`; `;
const OutputFooter = styled.div` const OutputFooter = styled.div`
background-color: #ebebeb; background-color: #ebebeb;
border-right: 1px solid #b7b7b7; border-right: 1px solid #d7d7d7;
width: 75px; width: 75px;
flex: 1; flex: 1;
`; `;
@@ -160,6 +163,9 @@ class JobOutput extends Component {
} }
loadMoreRows({ startIndex, stopIndex }) { loadMoreRows({ startIndex, stopIndex }) {
if (startIndex === 0 && stopIndex === 0) {
return;
}
const { job } = this.props; const { job } = this.props;
const loadRange = range(startIndex, stopIndex); const loadRange = range(startIndex, stopIndex);
@@ -171,6 +177,7 @@ class JobOutput extends Component {
counter__lte: stopIndex, counter__lte: stopIndex,
order_by: 'start_line', order_by: 'start_line',
}; };
return JobsAPI.readEvents(job.id, job.type, params).then(response => { return JobsAPI.readEvents(job.id, job.type, params).then(response => {
this.setState(({ results, currentlyLoading }) => { this.setState(({ results, currentlyLoading }) => {
response.data.results.forEach(jobEvent => { response.data.results.forEach(jobEvent => {
@@ -229,7 +236,7 @@ class JobOutput extends Component {
return ( return (
<CardBody> <CardBody>
<b>{job.name}</b> <OutputHeader>{job.name}</OutputHeader>
<OutputToolbar> <OutputToolbar>
<MenuControls <MenuControls
onScrollTop={this.handleScrollTop} onScrollTop={this.handleScrollTop}