foreman_patch 1.1.1

data/webpack/components/Invocations/components/InvocationStatus.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import { Icon } from 'patternfly-react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+const InvocationStatus = ({ status }) => {
+  switch (status) {
+    case 'error':
+      return (
+        <div>
+          <Icon type="pf" name="error-circle-o" /> {__('failed')}
+        </div>
+      );
+    case 'warning':
+      return (
+        <div>
+          <Icon type="pf" name="warning-triangle-o" /> {__('warning')}
+        </div>
+      );
+    case 'success':
+      return (
+        <div>
+          <Icon type="pf" name="ok" /> {__('success')}
+        </div>
+      );
+    case 'cancelled':
+      return (
+        <div>
+          <Icon type="fa" name="ban" /> {__('cancelled')}
+        </div>
+      );
+    case 'running':
+      return (
+        <div>
+          <Icon type="pf" name="in-progress" /> {__('running')}
+        </div>
+      );
+    default:
+      return (
+        <div>
+          <Icon type="pf" name="pending" /> {__('pending')}
+        </div>
+      );
+  }
+};
+
+InvocationStatus.propTypes = {
+  status: PropTypes.string.isRequired,
+};
+
+export default InvocationStatus;

data/webpack/components/Invocations/index.js

@@ -0,0 +1,99 @@
+import React, { useEffect, useState } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import PropTypes from 'prop-types';
+
+import { 
+  withInterval,
+  stopInterval
+} from 'foremanReact/redux/middlewares/IntervalMiddleware';
+import { get } from 'foremanReact/redux/API';
+import { useForemanSettings } from 'foremanReact/Root/Context/ForemanContext';
+
+import {
+  selectItems,
+  selectTotal,
+  selectAutoRefresh,
+  selectStatus,
+  selectIntervalExists,
+} from './InvocationsSelectors';
+import { getUrl } from './InvocationsHelpers';
+import { INVOCATIONS } from './InvocationsConstants';
+import InvocationsPage from './InvocationsPage';
+
+const WrappedInvocations = ({ round }) => {
+  const dispatch = useDispatch();
+  const { perPage, perPageOptions } = useForemanSettings();
+
+  const items = useSelector(selectItems);
+  const total = useSelector(selectTotal);
+  const autoRefresh = useSelector(selectAutoRefresh);
+  const status = useSelector(selectStatus);
+  const [searchQuery, setSearchQuery] = useState('');
+  const [pagination, setPagination] = useState({
+    page: 1,
+    perPage,
+    perPageOptions,
+  });
+  const [url, setUrl] = useState(getUrl(round, searchQuery, pagination));
+  const intervalExists = useSelector(selectIntervalExists);
+
+  const handleSearch = query => {
+    const defaultPagination = { page: 1, perPage: pagination.perPage };
+    stopApiInterval();
+
+    setUrl(getUrl(round, query, defaultPagination));
+    setSearchQuery(query);
+    setPagination(defaultPagination);
+  };
+
+  const handlePagination = args => {
+    stopApiInterval();
+    setPagination(args);
+    setUrl(getUrl(round, searchQuery, args));
+  };
+
+  const stopApiInterval = () => {
+    if (intervalExists) {
+      dispatch(stopInterval(INVOCATIONS));
+    }
+  };
+
+  const getData = url =>  withInterval(get({
+    key: INVOCATIONS,
+    url,
+    handleError: () => {
+      dispatch(stopInterval(INVOCATIONS));
+    },
+  }), 5000);
+
+  useEffect(() => {
+    dispatch(getData(url));
+
+    if (!autoRefresh) {
+      dispatch(stopInterval(INVOCATIONS));
+    }
+
+    return () => {
+      dispatch(stopInterval(INVOCATIONS));
+    };
+  }, [dispatch, url, autoRefresh]);
+
+  return (
+    <InvocationsPage
+      status={status}
+      items={items}
+      total={total}
+      searchQuery={searchQuery}
+      handleSearch={handleSearch}
+      pagination={pagination}
+      handlePagination={handlePagination}
+    />
+  );
+};
+
+WrappedInvocations.propTypes = {
+  round: PropTypes.number.isRequired,
+};
+
+export default WrappedInvocations;
+

data/webpack/components/Plan/Plan.js

@@ -0,0 +1,90 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { LoadingState, Alert } from 'patternfly-react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { STATUS } from 'foremanReact/constants';
+
+import Window from './Window';
+import Calendar from '../common/Calendar';
+
+const Plan = ({
+  id,
+  name,
+  description,
+  start_date,
+  end_date,
+  interval,
+  units,
+  correction,
+  activeCount,
+  window_plans,
+  moveWindow,
+  status,
+}) => {
+  if (status === STATUS.ERROR) {
+    return (
+      <Alert type="error">
+        {__(
+          'There is an error while loading the cycle, try refreshing the page.'
+        )}
+      </Alert>
+    );
+  }
+
+  const start = new Date(start_date + 'T00:00:00.000');
+  const end = new Date(end_date + 'T23:59:59.999');
+
+  const onEventMoved = (event) => {
+    const window = {
+      id: event.id,
+      start_day: Math.floor((event.start.getTime() - start.getTime()) / (24 * 60 * 60 * 1000)),
+      duration: (event.end.getTime() - event.start.getTime()) / 1000,
+      start_time: event.start,
+    };
+
+    moveWindow(window);
+  };
+
+
+  const events = window_plans.map(window => {
+    const start = new Date(window.start_time);
+    const end = new Date(start.getTime() + window.duration * 1000);
+
+    return {
+      id: window.id,
+      start: start,
+      end: end,
+      title: <Window {...window} />
+    };
+  });
+
+  return (
+    <LoadingState loading={status === STATUS.PENDING} >
+      <Calendar start={start} end={end} events={events} onEventMoved={onEventMoved} />
+    </LoadingState>
+  );
+};
+
+Plan.propTypes = {
+  id: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  description: PropTypes.string,
+  start_date: PropTypes.string.isRequired,
+  end_date: PropTypes.string.isRequired,
+  interval: PropTypes.number.isRequired,
+  units: PropTypes.oneOf(['days', 'weeks', 'months']).isRequired,
+  correction: PropTypes.string,
+  activeCount: PropTypes.number.isRequired,
+  window_plans: PropTypes.array,
+  moveWindow: PropTypes.func,
+  status: PropTypes.string.isRequired,
+};
+
+Plan.defaultProps = {
+  description: null,
+  correction: null,
+  window_plans: [],
+  moveWindow: (window) => {},
+};
+
+export default Plan;

data/webpack/components/Plan/PlanActions.js

@@ -0,0 +1,12 @@
+import { APIActions } from 'foremanReact/redux/API';
+import { PLAN, WINDOW } from './PlanConstants';
+
+export const getPlan = (id) => APIActions.get({ key: PLAN, url: `/foreman_patch/api/plans/${id}` });
+
+export const moveWindow = ({id, ...object}) => APIActions.put({
+  key: WINDOW,
+  url: `/foreman_patch/api/window_plans/${id}`,
+  params: {
+    window_plan: object,
+  }
+});

data/webpack/components/Plan/PlanConstants.js

@@ -0,0 +1 @@
+export const PLAN = 'PLAN';

data/webpack/components/Plan/PlanSelectors.js

@@ -0,0 +1,9 @@
+import {
+  selectAPIStatus,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { PLAN } from './PlanConstants';
+
+export const selectPlan = state => selectAPIResponse(state, PLAN) || {};
+
+export const selectStatus = state => selectAPIStatus(state, PLAN);

data/webpack/components/Plan/Window.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const Window = ({id, name, description, start_day, start_time, locale, hour12}) => {
+  const time = Intl.DateTimeFormat(locale, {
+    hour: 'numeric', minute: 'numeric', hour12: hour12
+  }).format(new Date(start_time));
+
+  return (
+    <div className="ellipsis">
+      <a href={`/foreman_patch/window_plans/${id}/edit`}>{time} {name}</a>
+    </div>
+  );
+};
+
+Window.propTypes = {
+  id: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  description: PropTypes.string,
+  start_day: PropTypes.number.isRequired,
+  start_time: PropTypes.instanceOf(Date).isRequired,
+  duration: PropTypes.number.isRequired,
+  locale: PropTypes.string,
+  hour12: PropTypes.bool,
+};
+
+Window.defaultProps = {
+  description: null,
+  locale: 'en-US',
+  hour12: true,
+};
+
+export default Window;

data/webpack/components/Plan/index.js

@@ -0,0 +1,36 @@
+import React, { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import { useSelector, useDispatch } from 'react-redux';
+
+import Plan from './Plan';
+import {
+  selectPlan,
+  selectStatus,
+} from './PlanSelectors';
+import {
+  getPlan,
+  moveWindow,
+} from './PlanActions';
+
+const WrappedPlan = ({ id }) => {
+  const dispatch = useDispatch();
+
+  const plan = useSelector(selectPlan);
+  const status = useSelector(selectStatus);
+
+  const updateWindow = (window) => {
+    dispatch(moveWindow(window));
+  };
+
+  useEffect(() => {
+    dispatch(getPlan(id));
+  }, [dispatch]);
+
+  return (<Plan {...plan} moveWindow={updateWindow} status={status} />);
+};
+
+WrappedPlan.propTypes = {
+  id: PropTypes.number.isRequired,
+};
+
+export default WrappedPlan;

data/webpack/components/PlanWindow/PlanWindow.js

@@ -0,0 +1,55 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { LoadingState, Alert } from 'patternfly-react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { STATUS } from 'foremanReact/constants';
+
+const PlanWindow = ({
+  id,
+  name,
+  description,
+  start_day,
+  start_time,
+  duration,
+  plan_id,
+  plan,
+  groups,
+  status
+}) => {
+  if (status === STATUS.ERROR) {
+    return (
+      <Alert type="error">
+        {__(
+          'There was an error while loading the window, try refreshing the page.'
+        )}
+      </Alert>
+    );
+  }
+
+  return (
+    <LoadingState loading={status === STATUS.PENDING}>
+      <PlanWindowCards {...props} />
+      <hr/>
+      <Groups groups={groups} />
+    </LoadingState>
+  );
+};
+
+PlanWindow.propTypes = {
+  id: PropTypes.number,
+  name: PropTypes.string,
+  description: PropTypes.string,
+  start_day: PropTypes.number,
+  start_time: PropTypes.string,
+  duration: PropTypes.number,
+  plan_id: PropTypes.number,
+  plan: PropTypes.object,
+  groups: PropTypes.array,
+  status: PropTypes.string.isRequired,
+};
+
+PlanWindow.defaultProps = {
+  groups: [],
+};
+
+export default PlanWindow;

data/webpack/components/PlanWindow/index.js

@@ -0,0 +1,32 @@
+import React, { useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { useSelector, useDispatch } from 'react-redux';
+
+import PlanWindow from './PlanWindow';
+import {
+  selectPlanWindow,
+  selectStatus,
+} from './PlanWindowSelectors';
+import {
+  getPlanWindow,
+  moveGroup,
+} from './PlanWindowActions';
+
+const WrappedPlanWindow = ({ id }) => {
+  const dispatch = useDispatch();
+
+  const planWindow = useSelector(selectPlanWindow);
+  const status = useSelector(selectStatus);
+
+  useEffect(() => {
+    dispatch(getPlanWindow(id));
+  }, [dispatch]);
+
+  return (<PlanWindow {...planWindow} status={status} />);
+};
+
+WrappedPlanWindow.propTypes = {
+  id: PropTypes.number.isRequired,
+};
+
+export default WrappedPlanWindow;

data/webpack/components/RoundProgress/AggregateStatus.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const AggregateStatus = ({ progress }) => (
+  <div id="aggregate_statuses">
+    <p className="card-pf-aggregate-status-notifications">
+      <span className="card-pf-aggregate-status-notification">
+        <span id="success_count">
+          <span className="pficon pficon-ok" />
+          {progress.success}
+        </span>
+      </span>
+      <span className="card-pf-aggregate-status-notification">
+        <span id="warning_count">
+          <span className="pficon pficon-warning-triangle-o" />
+          {progress.warning}
+        </span>
+      </span>
+      <span className="card-pf-aggregate-status-notification">
+        <span id="failed_count">
+          <span className="pficon pficon-error-circle-o" />
+          {progress.failed}
+        </span>
+      </span>
+      <span className="card-pf-aggregate-status-notification">
+        <span id="running_count">
+          <span className="pficon pficon-running" />
+          {progress.running}
+        </span>
+      </span>
+      <span className="card-pf-aggregate-status-notification">
+        <span id="pending_count">
+          <span className="pficon pficon-pending" />
+          {progress.pending}
+        </span>
+      </span>
+      <span className="card-pf-aggregate-status-notification">
+        <span id="cancelled_count">
+          <span className="pficon pficon-close" />
+          {progress.cancelled}
+        </span>
+      </span>
+    </p>
+  </div>
+);
+
+AggregateStatus.propTypes = {
+  progress: PropTypes.shape({
+    success: PropTypes.number,
+    warning: PropTypes.number,
+    failed: PropTypes.number,
+    running: PropTypes.number,
+    pending: PropTypes.number,
+    cancelled: PropTypes.number,
+  }).isRequired,
+};
+
+export default AggregateStatus;

data/webpack/components/RoundProgress/RoundProgress.js

@@ -0,0 +1,48 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import Immutable from 'seamless-immutable';
+
+import DonutChart from 'foremanReact/components/common/charts/DonutChart';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+import AggregateStatus from './AggregateStatus';
+
+const RoundProgress = ({ progress }) => {
+  const data = [
+    [__('Success'), progress.success, '#5CB85C'],
+    [__('Warning'), progress.warning, '#DB843D'],
+    [__('Failed'), progress.failed, '#D9534F'],
+    [__('Running'), progress.running, '#3D96AE'],
+    [__('Pending'), progress.pending, '#DEDEDE'],
+    [__('Cancelled'), progress.cancelled, '#B7312D'],
+  ];
+
+  const iMax = data.reduce((im, e, i, arr) => 
+    (e[1] > arr[im][i] ? i : im), 0);
+
+  return (
+    <div id="round_progress">
+      <DonutChart 
+        data={Immutable.asMutable(data)}
+        title={{
+          type: 'percent',
+          secondary: (data[iMax] || [])[0],
+        }}
+      />
+      <AggregateStatus progress={progress} />
+    </div>
+  );
+};
+
+RoundProgress.propTypes = {
+  progress: PropTypes.shape({
+    success: PropTypes.number,
+    warning: PropTypes.number,
+    failed: PropTypes.number,
+    running: PropTypes.number,
+    pending: PropTypes.number,
+    cancelled: PropTypes.number,
+  }).isRequired,
+};
+
+export default RoundProgress;

data/webpack/components/RoundProgress/RoundProgressActions.js

@@ -0,0 +1,9 @@
+import { get } from 'foremanReact/redux/API';
+import { withInterval } from 'foremanReact/redux/middlewares/IntervalMiddleware';
+
+import { ROUND_PROGRESS } from './RoundProgressConstants';
+
+export const getProgress = (round) => withInterval(get({ 
+  key: ROUND_PROGRESS, 
+  url: `/foreman_patch/api/rounds/${round}/status`,
+}), 5000);

data/webpack/components/RoundProgress/RoundProgressConstants.js

@@ -0,0 +1 @@
+export const ROUND_PROGRESS = 'ROUND_PROGRESS';

data/webpack/components/RoundProgress/RoundProgressSelectors.js

@@ -0,0 +1,24 @@
+import {
+  selectAPIStatus,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+
+import { ROUND_PROGRESS } from './RoundProgressConstants';
+
+const defaultProgress = {
+  success: 0,
+  warning: 0,
+  failed: 0,
+  running: 0,
+  pending: 0,
+  cancelled: 0,
+};
+
+export const selectProgress = state =>
+  selectAPIResponse(state, ROUND_PROGRESS).progress || defaultProgress;
+
+export const selectAutoRefresh = state =>
+  !selectAPIResponse(state, ROUND_PROGRESS).complete;
+
+export const selectStatus = state =>
+  selectAPIStatus(state, ROUND_PROGRESS);

data/webpack/components/RoundProgress/index.js

@@ -0,0 +1,44 @@
+import React, { useEffect } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import PropTypes from 'prop-types';
+
+import { stopInterval } from 'foremanReact/redux/middlewares/IntervalMiddleware';
+
+import {
+  selectProgress,
+  selectAutoRefresh,
+  selectStatus,
+} from './RoundProgressSelectors';
+import { getProgress } from './RoundProgressActions';
+import { ROUND_PROGRESS } from './RoundProgressConstants';
+import RoundProgress from './RoundProgress';
+
+const WrappedRoundProgress = ({ round }) => {
+  const dispatch = useDispatch();
+
+  const progress = useSelector(selectProgress);
+  const autoRefresh = useSelector(selectAutoRefresh);
+  const status = useSelector(selectStatus);
+
+  useEffect(() => {
+    dispatch(getProgress(round));
+
+    if (!autoRefresh) {
+      dispatch(stopInterval(ROUND_PROGRESS));
+    }
+
+    return () => {
+      dispatch(stopInterval(ROUND_PROGRESS));
+    };
+  }, [dispatch, autoRefresh]);
+
+  return (
+    <RoundProgress progress={progress} />
+  );
+};
+
+WrappedRoundProgress.propTypes = {
+  round: PropTypes.number.isRequired,
+};
+
+export default WrappedRoundProgress;

data/webpack/components/Rounds/Rounds.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { LoadingState, Alert } from 'patternfly-react';
+import { STATUS } from 'foremanReact/constants';
+import RoundItem from './components/RoundItem';
+
+const Rounds = ({ status, items }) => {
+  if (status === STATUS.ERROR) {
+    return (
+      <Alert type="error">
+        {__(
+          'There was an error while updating the status, try refreshing the page.'
+        )}
+      </Alert>
+    );
+  }
+
+  return (
+    <LoadingState loading={!items.length && status === STATUS.PENDING}>
+      <div>
+        <table className="table table-bordered table-striped table-hover">
+          <thead>
+            <tr>
+              <th>{__('Round')}</th>
+              <th>{__('Priority')}</th>
+              <th>{__('Hosts Count')}</th>
+              <th>{__('Status')}</th>
+              <th>{__('Actions')}</th>
+            </tr>
+          </thead>
+          <tbody>
+            {items.map(round => (
+              <RoundItem
+                key={round.name}
+                name={round.name}
+                link={round.link}
+                priority={round.priority}
+                hostsCount={round.hostsCount}
+                hostsLink={round.hostsLink}
+                status={round.status}
+                actions={round.actions}
+              />
+            ))}
+          </tbody>
+        </table>
+      </div>
+    </LoadingState>
+  );
+};
+
+Rounds.propTypes = {
+  status: PropTypes.string.isRequired,
+  items: PropTypes.array.isRequired,
+};
+
+export default Rounds;

data/webpack/components/Rounds/RoundsActions.js

@@ -0,0 +1,8 @@
+import { getURI } from 'foremanReact/common/urlHelpers';
+import { get } from 'foremanReact/redux/API';
+import { withInterval } from 'foremanReact/redux/middlewares/IntervalMiddleware';
+import { ROUNDS } from './RoundsConsts';
+
+const url = getURI().addQuery('format', 'json');
+export const getData = () => 
+  withInterval(get({ key: ROUNDS, url }), 1000);

data/webpack/components/Rounds/RoundsConsts.js

@@ -0,0 +1 @@
+export const ROUNDS = 'ROUNDS';