1
0
mirror of https://github.com/ansible/awx.git synced 2024-11-01 16:51:11 +03:00

add status icon to job list

This commit is contained in:
Keith Grant 2019-10-18 10:08:59 -07:00
parent c262df0dfe
commit a5d9bbb1e6

View File

@ -1,5 +1,6 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import styled from 'styled-components';
import { withI18n } from '@lingui/react'; import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { import {
@ -14,10 +15,15 @@ import DataListCheck from '@components/DataListCheck';
import LaunchButton from '@components/LaunchButton'; import LaunchButton from '@components/LaunchButton';
import ListActionButton from '@components/ListActionButton'; import ListActionButton from '@components/ListActionButton';
import VerticalSeparator from '@components/VerticalSeparator'; import VerticalSeparator from '@components/VerticalSeparator';
import { StatusIcon } from '@components/Sparkline';
import { toTitleCase } from '@util/strings'; import { toTitleCase } from '@util/strings';
import { formatDateString } from '@util/dates'; import { formatDateString } from '@util/dates';
import { JOB_TYPE_URL_SEGMENTS } from '../../../constants'; import { JOB_TYPE_URL_SEGMENTS } from '../../../constants';
const PaddedIcon = styled(StatusIcon)`
margin-right: 20px;
`;
class JobListItem extends Component { class JobListItem extends Component {
render() { render() {
const { i18n, job, isSelected, onSelect } = this.props; const { i18n, job, isSelected, onSelect } = this.props;
@ -38,6 +44,7 @@ class JobListItem extends Component {
dataListCells={[ dataListCells={[
<DataListCell key="divider"> <DataListCell key="divider">
<VerticalSeparator /> <VerticalSeparator />
{job.status && <PaddedIcon status={job.status} />}
<span> <span>
<Link <Link
to={`/jobs/${JOB_TYPE_URL_SEGMENTS[job.type]}/${job.id}`} to={`/jobs/${JOB_TYPE_URL_SEGMENTS[job.type]}/${job.id}`}