Skip to content

Commit

Permalink
Fixes #30633 - Stopped chart doesnt count cancelled
Browse files Browse the repository at this point in the history
  • Loading branch information
MariaAga authored and adamruzicka committed Sep 15, 2020
1 parent 0f34e46 commit 05dbdb2
Show file tree
Hide file tree
Showing 18 changed files with 1,379 additions and 1,491 deletions.
6 changes: 5 additions & 1 deletion app/services/foreman_tasks/dashboard_table_filter.rb
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,11 @@ def scope
private

def scope_by(field)
@new_scope = @new_scope.where(field => @params[field]) if @params[field].present?
if (field == :result) && (@params[field] == 'other')
@new_scope = @new_scope.where(:result => ['cancelled', 'pending'])
elsif @params[field].present?
@new_scope = @new_scope.where(field => @params[field])
end
end

def scope_by_time
Expand Down
Original file line number Diff line number Diff line change
@@ -1,15 +1,19 @@
.scheduled-tasks-card {
text-align: center;

.scheduled-data {
margin-top: 30px;
padding-right: 15px;
cursor: pointer;
font-size: 40px;
font-weight: 300;
transition: font-weight 50ms ease-in;

p {
font-size: 20px;
margin: 0;
}

* {
margin: 10px;
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';

import { Icon, Button, OverlayTrigger, Tooltip } from 'patternfly-react';
import { translate as __ } from 'foremanReact/common/I18n';
import {
TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS,
} from '../../../../TasksDashboardConstants';
import { queryPropType } from '../../../../TasksDashboardPropTypes';

const tooltip = (
<Tooltip id="stopped-tooltip">
{__('Other includes all stopped tasks that are cancelled or pending')}
</Tooltip>
);

export const OtherInfo = ({ updateQuery, otherCount, query }) => {
const { OTHER } = TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS;
const { STOPPED } = TASKS_DASHBOARD_AVAILABLE_QUERY_STATES;
const active = query.state === STOPPED && query.result === OTHER;
return (
<span className={classNames(active && 'other-active')}>
<OverlayTrigger
overlay={tooltip}
trigger={['hover', 'focus']}
placement="bottom"
>
<span>
<Icon type="pf" name="info" />
<span>{__('Other:')} </span>
</span>
</OverlayTrigger>
<Button
bsStyle="link"
onClick={() =>
updateQuery({
state: STOPPED,
result: OTHER,
})
}
>
{otherCount}
</Button>
</span>
);
};
OtherInfo.propTypes = {
updateQuery: PropTypes.func.isRequired,
otherCount: PropTypes.number.isRequired,
query: queryPropType.isRequired,
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import { testComponentSnapshotsWithFixtures } from '@theforeman/test';

import { OtherInfo } from './OtherInfo';

const fixtures = {
render: {
updateQuery: jest.fn,
otherCount: 7,
query: { state: 'STOPPED', result: 'OTHER' },
},
};

describe('OtherInfo', () =>
testComponentSnapshotsWithFixtures(OtherInfo, fixtures));
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ import { Card } from 'patternfly-react';
import classNames from 'classnames';
import { noop } from 'foremanReact/common/helpers';
import { translate as __ } from 'foremanReact/common/I18n';

import { StoppedTable } from './StoppedTasksCardHelper';
import { OtherInfo } from './OtherInfo';
import { StoppedTable } from './StoppedTasksCardTable';
import {
timePropType,
queryPropType,
Expand All @@ -14,7 +14,6 @@ import {
TASKS_DASHBOARD_AVAILABLE_TIMES,
TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
} from '../../../../TasksDashboardConstants';
import { getQueryValueText } from '../../../../TasksDashboardHelper';
import './StoppedTasksCard.scss';

const StoppedTasksCard = ({
Expand Down Expand Up @@ -44,16 +43,19 @@ const StoppedTasksCard = ({
{__('Stopped')}
</Card.Title>
<Card.Body>
<table className="table table-bordered table-striped stopped-table">
<thead>
<tr>
<th />
<th>{__('Total')}</th>
<th>{getQueryValueText(time)}</th>
</tr>
</thead>
<tbody>{StoppedTable(data, query, time, updateQuery)}</tbody>
</table>
<React.Fragment>
<StoppedTable
data={data.results}
query={query}
time={time}
updateQuery={updateQuery}
/>
<OtherInfo
updateQuery={updateQuery}
otherCount={data.other}
query={query}
/>
</React.Fragment>
</Card.Body>
</Card>
);
Expand All @@ -66,9 +68,12 @@ const resultPropType = PropTypes.shape({

StoppedTasksCard.propTypes = {
data: PropTypes.shape({
error: resultPropType.isRequired,
warning: resultPropType.isRequired,
success: resultPropType.isRequired,
results: PropTypes.shape({
error: resultPropType.isRequired,
warning: resultPropType.isRequired,
success: resultPropType.isRequired,
}),
other: PropTypes.number,
}),
time: timePropType,
query: queryPropType,
Expand All @@ -78,9 +83,12 @@ StoppedTasksCard.propTypes = {

StoppedTasksCard.defaultProps = {
data: {
error: { total: 0, last: 0 },
warning: { total: 0, last: 0 },
success: { total: 0, last: 0 },
results: {
error: { total: 0, last: 0 },
warning: { total: 0, last: 0 },
success: { total: 0, last: 0 },
},
other: 0,
},
time: TASKS_DASHBOARD_AVAILABLE_TIMES.H24,
query: {},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,4 +39,18 @@
}
}
}

.other-active {
text-decoration: underline;
}

.pficon {
margin-right: 5px;
}

.btn-link {
font-size: 14px;
padding-top: 0;
padding-bottom: 0;
}
}
Original file line number Diff line number Diff line change
@@ -1,48 +1,15 @@
import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
import {
TASKS_DASHBOARD_AVAILABLE_TIMES,
TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
TASKS_DASHBOARD_AVAILABLE_QUERY_MODES,
TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS,
} from '../../../../TasksDashboardConstants';
import { TASKS_DASHBOARD_AVAILABLE_QUERY_STATES } from '../../../../TasksDashboardConstants';
import StoppedTasksCard from './StoppedTasksCard';

const { STOPPED } = TASKS_DASHBOARD_AVAILABLE_QUERY_STATES;
const { LAST } = TASKS_DASHBOARD_AVAILABLE_QUERY_MODES;
const { WEEK } = TASKS_DASHBOARD_AVAILABLE_TIMES;

const fixtures = {
'render with minimal props': {},
'render with props': {
data: {
error: { total: 9, last: 1 },
warning: { total: 8, last: 2 },
success: { total: 7, last: 3 },
},
time: WEEK,
},
'render selected': {
query: { state: STOPPED },
},
};

Object.values(TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS).forEach(result => {
fixtures[`render ${result}-total selected`] = {
query: {
state: STOPPED,
result,
},
};
fixtures[`render ${result}-last selected`] = {
time: WEEK,
query: {
state: STOPPED,
result,
mode: LAST,
time: WEEK,
},
};
});

describe('StoppedTasksCard', () =>
testComponentSnapshotsWithFixtures(StoppedTasksCard, fixtures));
Original file line number Diff line number Diff line change
@@ -1,19 +1,26 @@
import React from 'react';
import PropTypes from 'prop-types';
import { capitalize } from 'lodash';
import classNames from 'classnames';
import { Icon, Button } from 'patternfly-react';
import { translate as __ } from 'foremanReact/common/I18n';
import {
TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
TASKS_DASHBOARD_AVAILABLE_QUERY_MODES,
} from '../../../../TasksDashboardConstants';
import { getQueryValueText } from '../../../../TasksDashboardHelper';
import {
timePropType,
queryPropType,
} from '../../../../TasksDashboardPropTypes';

const resultIcons = {
error: <Icon type="pf" name="error-circle-o" />,
warning: <Icon type="pf" name="warning-triangle-o" />,
success: <Icon type="pf" name="ok" />,
};

export const StoppedTable = (data, query, time, updateQuery) =>
const StoppedTableCells = (data, query, time, updateQuery) =>
Object.entries(data).map(([result, { total, last }]) => {
const { STOPPED } = TASKS_DASHBOARD_AVAILABLE_QUERY_STATES;
const { LAST } = TASKS_DASHBOARD_AVAILABLE_QUERY_MODES;
Expand Down Expand Up @@ -61,3 +68,23 @@ export const StoppedTable = (data, query, time, updateQuery) =>
</tr>
);
});

export const StoppedTable = ({ data, query, time, updateQuery }) => (
<table className="table table-bordered table-striped stopped-table">
<thead>
<tr>
<th />
<th>{__('Total')}</th>
<th>{getQueryValueText(time)}</th>
</tr>
</thead>
<tbody>{StoppedTableCells(data, query, time, updateQuery)}</tbody>
</table>
);

StoppedTable.propTypes = {
data: PropTypes.object.isRequired,
query: queryPropType.isRequired,
time: timePropType.isRequired,
updateQuery: PropTypes.func.isRequired,
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import { testComponentSnapshotsWithFixtures } from '@theforeman/test';

import { StoppedTable } from './StoppedTasksCardTable';
import {
TASKS_DASHBOARD_AVAILABLE_TIMES,
TASKS_DASHBOARD_AVAILABLE_QUERY_STATES,
TASKS_DASHBOARD_AVAILABLE_QUERY_MODES,
TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS,
} from '../../../../TasksDashboardConstants';

const { STOPPED } = TASKS_DASHBOARD_AVAILABLE_QUERY_STATES;
const { LAST } = TASKS_DASHBOARD_AVAILABLE_QUERY_MODES;
const { WEEK } = TASKS_DASHBOARD_AVAILABLE_TIMES;
const data = {
error: { total: 9, last: 1 },
warning: { total: 8, last: 2 },
success: { total: 7, last: 3 },
};
const fixtures = {
'render with props': {
data,
time: WEEK,
query: {},
updateQuery: jest.fn(),
},
};

Object.values(TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS)
.filter(result => result !== TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS.OTHER)
.forEach(result => {
fixtures[`render ${result}-total selected`] = {
query: {
state: STOPPED,
result,
},
updateQuery: jest.fn(),
data,
time: WEEK,
};
fixtures[`render ${result}-last selected`] = {
time: WEEK,
query: {
state: STOPPED,
result,
mode: LAST,
time: WEEK,
},
updateQuery: jest.fn(),
data,
};
});

describe('StoppedTable', () =>
testComponentSnapshotsWithFixtures(StoppedTable, fixtures));

0 comments on commit 05dbdb2

Please sign in to comment.