foreman-tasks 0.15.1 → 0.15.2

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboard.js

@@ -0,0 +1,77 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Grid } from 'patternfly-react';
+import { noop } from 'foremanReact/common/helpers';
+
+import TasksTimeRow from './Components/TasksTimeRow/TasksTimeRow';
+import TasksCardsGrid from './Components/TasksCardsGrid/TasksCardsGrid';
+import TasksLabelsRow from './Components/TasksLabelsRow/TasksLabelsRow';
+
+import { TASKS_DASHBOARD_AVAILABLE_TIMES } from './TasksDashboardConstants';
+import { getQueryFromUrl } from './TasksDashboardHelper';
+import { timePropType, queryPropType } from './TasksDashboardPropTypes';
+import './TasksDashboard.scss';
+
+class TasksDashboard extends React.Component {
+  componentDidMount() {
+    const { time, initializeDashboard, fetchTasksSummary } = this.props;
+    const query = getQueryFromUrl();
+
+    initializeDashboard({
+      time: query.time,
+      query,
+    });
+
+    // dont fetch if time is going to be changed
+    if (!query.time || query.time === time) {
+      fetchTasksSummary(time);
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    const { time, fetchTasksSummary } = this.props;
+
+    if (time !== prevProps.time) {
+      fetchTasksSummary(time);
+    }
+  }
+
+  render() {
+    const { time, query, tasksSummary, updateTime, updateQuery } = this.props;
+
+    return (
+      <Grid fluid className="tasks-dashboard-grid">
+        <TasksTimeRow time={time} updateTime={updateTime} />
+        <TasksCardsGrid
+          time={time}
+          query={query}
+          data={tasksSummary}
+          updateQuery={updateQuery}
+        />
+        <TasksLabelsRow query={query} updateQuery={updateQuery} />
+      </Grid>
+    );
+  }
+}
+
+TasksDashboard.propTypes = {
+  time: timePropType,
+  query: queryPropType,
+  tasksSummary: TasksCardsGrid.propTypes.data,
+  initializeDashboard: PropTypes.func,
+  updateTime: PropTypes.func,
+  updateQuery: PropTypes.func,
+  fetchTasksSummary: PropTypes.func,
+};
+
+TasksDashboard.defaultProps = {
+  time: TASKS_DASHBOARD_AVAILABLE_TIMES.H24,
+  query: {},
+  tasksSummary: TasksCardsGrid.defaultProps.data,
+  initializeDashboard: noop,
+  updateTime: noop,
+  updateQuery: noop,
+  fetchTasksSummary: noop,
+};
+
+export default TasksDashboard;

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboard.scss

@@ -0,0 +1,6 @@
+.tasks-dashboard-grid {
+  min-height: 200px;
+  background-color: #F5F5F5;
+  margin: 5px -60px 20px -60px;
+  padding: 20px 50px;
+}

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboardActions.js

@@ -0,0 +1,62 @@
+import API from 'foremanReact/API';
+import { timeToHoursNumber, resolveQuery } from './TasksDashboardHelper';
+import {
+  FOREMAN_TASKS_DASHBOARD_INIT,
+  FOREMAN_TASKS_DASHBOARD_UPDATE_TIME,
+  FOREMAN_TASKS_DASHBOARD_UPDATE_QUERY,
+  TASKS_DASHBOARD_CURRENT_TIME,
+  FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_REQUEST,
+  FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_SUCCESS,
+  FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_FAILURE,
+} from './TasksDashboardConstants';
+import { selectTime } from './TasksDashboardSelectors';
+
+export const initializeDashboard = ({ time, query }) => ({
+  type: FOREMAN_TASKS_DASHBOARD_INIT,
+  payload: { time, query },
+});
+
+export const updateTime = time => ({
+  type: FOREMAN_TASKS_DASHBOARD_UPDATE_TIME,
+  payload: time,
+});
+
+export const updateQuery = query => (dispatch, getState) => {
+  if (query.time === TASKS_DASHBOARD_CURRENT_TIME)
+    query.time = selectTime(getState());
+
+  dispatch({
+    type: FOREMAN_TASKS_DASHBOARD_UPDATE_QUERY,
+    payload: query,
+  });
+
+  resolveQuery(query);
+};
+
+export const fetchTasksSummary = time => async dispatch => {
+  try {
+    dispatch(startRequest());
+
+    const hours = timeToHoursNumber(time);
+
+    const { data } = await API.get(`/foreman_tasks/tasks/summary/${hours}`);
+
+    return dispatch(requestSuccess(data));
+  } catch (error) {
+    return dispatch(requestFailure(error));
+  }
+};
+
+const startRequest = () => ({
+  type: FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_REQUEST,
+});
+
+const requestSuccess = data => ({
+  type: FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_SUCCESS,
+  payload: data,
+});
+
+const requestFailure = error => ({
+  type: FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_FAILURE,
+  payload: error,
+});

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboardConstants.js

@@ -0,0 +1,94 @@
+import { translate as __ } from 'foremanReact/common/I18n';
+
+export const TASKS_DASHBOARD_AVAILABLE_QUERY_STATES = {
+  RUNNING: 'running',
+  PAUSED: 'paused',
+  STOPPED: 'stopped',
+  SCHEDULED: 'scheduled',
+};
+
+export const TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS = {
+  ERROR: 'error',
+  WARNING: 'warning',
+  SUCCESS: 'success',
+};
+
+export const TASKS_DASHBOARD_AVAILABLE_QUERY_MODES = {
+  LAST: 'last',
+  OLDER: 'older',
+};
+
+export const TASKS_DASHBOARD_AVAILABLE_TIMES = {
+  H24: 'H24',
+  H12: 'H12',
+  WEEK: 'WEEK',
+};
+
+export const TASKS_DASHBOARD_QUERY_KEYS_TEXT = {
+  state: __('state'),
+  result: __('result'),
+  mode: __('mode'),
+  time: __('time'),
+};
+
+export const TASKS_DASHBOARD_QUERY_VALUES_TEXT = {
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.RUNNING]: __('running'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.PAUSED]: __('paused'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.STOPPED]: __('stopped'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_STATES.SCHEDULED]: __('scheduled'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS.ERROR]: __('error'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS.WARNING]: __('warning'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_RESULTS.SUCCESS]: __('success'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_MODES.LAST]: __('last'),
+  [TASKS_DASHBOARD_AVAILABLE_QUERY_MODES.OLDER]: __('older'),
+  [TASKS_DASHBOARD_AVAILABLE_TIMES.H24]: __('24h'),
+  [TASKS_DASHBOARD_AVAILABLE_TIMES.H12]: __('12h'),
+  [TASKS_DASHBOARD_AVAILABLE_TIMES.WEEK]: __('week'),
+};
+
+export const TASKS_DASHBOARD_CURRENT_TIME = 'TASKS_DASHBOARD_CURRENT_TIME';
+
+export const FOREMAN_TASKS_DASHBOARD_INIT = 'FOREMAN_TASKS_DASHBOARD_INIT';
+
+export const FOREMAN_TASKS_DASHBOARD_UPDATE_TIME =
+  'FOREMAN_TASKS_DASHBOARD_UPDATE_TIME';
+
+export const FOREMAN_TASKS_DASHBOARD_UPDATE_QUERY =
+  'FOREMAN_TASKS_DASHBOARD_UPDATE_QUERY';
+
+export const FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_REQUEST =
+  'FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_REQUEST';
+export const FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_SUCCESS =
+  'FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_SUCCESS';
+export const FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_FAILURE =
+  'FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_FAILURE';
+
+export const TASKS_SUMMARY_ZERO = {
+  running: {
+    recent: 0,
+    total: 0,
+  },
+  paused: {
+    recent: 0,
+    total: 0,
+  },
+  stopped: {
+    by_result: {
+      error: {
+        total: 0,
+        recent: 0,
+      },
+      warning: {
+        total: 0,
+        recent: 0,
+      },
+      success: {
+        total: 0,
+        recent: 0,
+      },
+    },
+  },
+  scheduled: {
+    total: 0,
+  },
+};

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboardHelper.js

@@ -0,0 +1,78 @@
+import URI from 'urijs';
+import { getURIQuery } from 'foremanReact/common/helpers';
+
+import {
+  TASKS_DASHBOARD_AVAILABLE_TIMES,
+  TASKS_DASHBOARD_QUERY_KEYS_TEXT,
+  TASKS_DASHBOARD_QUERY_VALUES_TEXT,
+} from './TasksDashboardConstants';
+
+export const getQueryKeyText = key => TASKS_DASHBOARD_QUERY_KEYS_TEXT[key];
+
+export const getQueryValueText = value =>
+  TASKS_DASHBOARD_QUERY_VALUES_TEXT[value];
+
+export const timeToHoursNumber = time => {
+  switch (time) {
+    case TASKS_DASHBOARD_AVAILABLE_TIMES.H12:
+      return 12;
+    case TASKS_DASHBOARD_AVAILABLE_TIMES.H24:
+      return 24;
+    case TASKS_DASHBOARD_AVAILABLE_TIMES.WEEK:
+      return 24 * 7;
+    default:
+      return 24;
+  }
+};
+
+const uriToQueryMap = {
+  state: 'state',
+  result: 'result',
+  time_mode: 'mode',
+  time_horizon: 'time',
+};
+
+const queryFromUriQuery = uriQuery => {
+  const query = {};
+
+  Object.entries(uriToQueryMap).forEach(([uriField, queryField]) => {
+    if (uriQuery[uriField]) query[queryField] = uriQuery[uriField];
+  });
+
+  if (query.mode === 'recent') {
+    query.mode = 'last';
+  }
+
+  return query;
+};
+
+const uriQueryFromQuery = query => {
+  const uriQuery = {};
+
+  Object.entries(uriToQueryMap).forEach(([uriField, queryField]) => {
+    if (query[queryField]) uriQuery[uriField] = query[queryField];
+  });
+
+  if (uriQuery.time_mode === 'last') {
+    uriQuery.time_mode = 'recent';
+  }
+
+  return uriQuery;
+};
+
+export const getQueryFromUrl = () => {
+  const uriQuery = getURIQuery(window.location.href);
+
+  return queryFromUriQuery(uriQuery);
+};
+
+export const resolveQuery = query => {
+  const uriQuery = uriQueryFromQuery(query);
+
+  const uri = new URI(window.location.href);
+  const { search } = uri.query(true);
+
+  const data = { search, ...uriQuery, page: 1 };
+  uri.query(URI.buildQuery(data, true));
+  window.location.href = uri.toString();
+};

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboardPropTypes.js

@@ -0,0 +1,13 @@
+import PropTypes from 'prop-types';
+import { TASKS_DASHBOARD_AVAILABLE_TIMES } from './TasksDashboardConstants';
+
+export const timePropType = PropTypes.oneOf(
+  Object.values(TASKS_DASHBOARD_AVAILABLE_TIMES)
+);
+
+export const queryPropType = PropTypes.shape({
+  state: PropTypes.string,
+  result: PropTypes.string,
+  mode: PropTypes.string,
+  time: timePropType,
+});

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboardReducer.js

@@ -0,0 +1,50 @@
+import Immutable from 'seamless-immutable';
+import {
+  TASKS_DASHBOARD_AVAILABLE_TIMES,
+  FOREMAN_TASKS_DASHBOARD_INIT,
+  FOREMAN_TASKS_DASHBOARD_UPDATE_TIME,
+  FOREMAN_TASKS_DASHBOARD_UPDATE_QUERY,
+  FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_REQUEST,
+  FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_SUCCESS,
+  FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_FAILURE,
+  TASKS_SUMMARY_ZERO,
+} from './TasksDashboardConstants';
+
+const initialState = Immutable({
+  time: TASKS_DASHBOARD_AVAILABLE_TIMES.H24,
+  query: {},
+  isLoadingTasksSummary: false,
+  error: null,
+  tasksSummary: TASKS_SUMMARY_ZERO,
+});
+
+export default (state = initialState, action) => {
+  const { type, payload } = action;
+
+  switch (type) {
+    case FOREMAN_TASKS_DASHBOARD_INIT:
+      return state
+        .set('time', (payload && payload.time) || initialState.time)
+        .set('query', (payload && payload.query) || initialState.query);
+    case FOREMAN_TASKS_DASHBOARD_UPDATE_TIME:
+      return state.set('time', payload);
+    case FOREMAN_TASKS_DASHBOARD_UPDATE_QUERY:
+      return state.set('query', payload);
+    case FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_REQUEST:
+      return state.set('isLoading', true);
+    case FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_SUCCESS:
+      return state.merge({
+        tasksSummary: payload,
+        isLoading: false,
+        error: null,
+      });
+    case FOREMAN_TASKS_DASHBOARD_FETCH_TASKS_SUMMARY_FAILURE:
+      return state.merge({
+        tasksSummary: TASKS_SUMMARY_ZERO,
+        isLoading: false,
+        error: payload,
+      });
+    default:
+      return state;
+  }
+};

data/webpack/ForemanTasks/Components/TasksDashboard/TasksDashboardSelectors.js

@@ -0,0 +1,44 @@
+import { selectForemanTasks } from '../../ForemanTasksSelectors';
+import {
+  TASKS_DASHBOARD_AVAILABLE_TIMES,
+  TASKS_SUMMARY_ZERO,
+} from './TasksDashboardConstants';
+
+export const selectTasksDashboard = state =>
+  selectForemanTasks(state).tasksDashboard || {};
+
+export const selectTime = state =>
+  selectTasksDashboard(state).time || TASKS_DASHBOARD_AVAILABLE_TIMES.H24;
+
+export const selectQuery = state => selectTasksDashboard(state).query || {};
+
+export const selectTasksSummary = state => {
+  const { running, paused, stopped, scheduled } =
+    selectTasksDashboard(state).tasksSummary || TASKS_SUMMARY_ZERO;
+
+  return {
+    running: {
+      last: running.recent,
+      older: running.total - running.recent,
+    },
+    paused: {
+      last: paused.recent,
+      older: paused.total - paused.recent,
+    },
+    stopped: {
+      error: {
+        total: stopped.by_result.error.total,
+        last: stopped.by_result.error.recent,
+      },
+      warning: {
+        total: stopped.by_result.warning.total,
+        last: stopped.by_result.warning.recent,
+      },
+      success: {
+        total: stopped.by_result.success.total,
+        last: stopped.by_result.success.recent,
+      },
+    },
+    scheduled: scheduled.total,
+  };
+};

data/webpack/ForemanTasks/Components/TasksDashboard/__tests__/TasksDashboard.test.js

@@ -0,0 +1,13 @@
+import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+
+import TasksDashboard from '../TasksDashboard';
+
+const fixtures = {
+  'render without Props': {},
+  /** fixtures, props for the component */
+};
+
+describe('TasksDashboard', () => {
+  describe('rendering', () =>
+    testComponentSnapshotsWithFixtures(TasksDashboard, fixtures));
+});