foreman_patch 1.1.1

data/test/factories/foreman_patch_factories.rb

@@ -0,0 +1,5 @@
+FactoryBot.define do
+  factory :host do
+    name 'foreman_patch'
+  end
+end

data/test/test_plugin_helper.rb

@@ -0,0 +1,6 @@
+# This calls the main test_helper in Foreman-core
+require 'test_helper'
+
+# Add plugin to FactoryBot's paths
+FactoryBot.definition_file_paths << File.join(File.dirname(__FILE__), 'factories')
+FactoryBot.reload

data/test/unit/foreman_patch_test.rb

@@ -0,0 +1,11 @@
+require 'test_plugin_helper'
+
+class ForemanPatchTest < ActiveSupport::TestCase
+  setup do
+    User.current = User.find_by_login 'admin'
+  end
+
+  test 'the truth' do
+    assert true
+  end
+end

data/webpack/components/Cycle/Cycle.js

@@ -0,0 +1,57 @@
+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 Calendar from '../common/Calendar';
+import Window from './Window';
+
+const Cycle = ({ id, name, description, start_date, end_date, windows, moveWindow, status}) => {
+  if (status === STATUS.ERROR) {
+    return (
+      <Alert type="error">
+        {__(
+          'There was 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 events = windows.map(window => {
+    const start = new Date(window.start_at);
+    const end = new Date(window.end_by);
+
+    return {
+      id: window.id,
+      start: new Date(window.start_at),
+      end: new Date(window.end_by),
+      title: <Window {...window} start={start} end={end} />,
+    }
+  });
+  
+  return (
+    <LoadingState loading={status === STATUS.PENDING}>
+      <Calendar start={start} end={end} events={events} onEventMoved={moveWindow} />
+    </LoadingState>
+  );
+};
+
+Cycle.propTypes = {
+  id: PropTypes.number,
+  name: PropTypes.string,
+  start_date: PropTypes.string,
+  end_date: PropTypes.string,
+  windows: PropTypes.array,
+  moveWindow: PropTypes.func,
+  status: PropTypes.string,
+};
+
+Cycle.defaultProps = {
+  windows: [],
+};
+
+export default Cycle;

data/webpack/components/Cycle/CycleActions.js

@@ -0,0 +1,21 @@
+import { APIActions } from 'foremanReact/redux/API/APIActions';
+//import { withInterval } from 'foremanReact/redux/middlewares/IntervalMiddleware';
+import { CYCLE, WINDOW } from './CycleConstants';
+
+const getCycleUrl = (id) => `/foreman_patch/api/cycles/${id}`;
+const getWindowUrl = (id) => `/foreman_patch/api/windows/${id}`;
+
+export const getCycle = (id) => APIActions.get({ key: CYCLE, url: getCycleUrl(id) });
+
+export const deleteWindow = (id) => APIActions.delete({ key: WINDOW, url: getWindowUrl(id)});
+
+export const moveWindow = (object) => APIActions.put({
+  key: WINDOW,
+  url: getWindowUrl(object.id),
+  params: {
+    window: {
+      start_at: object.start.toISOString(),
+      end_by: object.end.toISOString(),
+    }
+  }
+});

data/webpack/components/Cycle/CycleConstants.js

@@ -0,0 +1,2 @@
+export const CYCLE = 'CYCLE';
+export const WINDOW = 'WINDOW';

data/webpack/components/Cycle/CycleHelpers.js

@@ -0,0 +1,3 @@
+export const canMove = (window) => {
+  return true;
+};

data/webpack/components/Cycle/CycleSelectors.js

@@ -0,0 +1,10 @@
+import {
+  selectAPIStatus,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { CYCLE } from './CycleConstants';
+
+export const selectCycle = state => (selectAPIResponse(state, CYCLE) || {});
+
+export const selectStatus = state => selectAPIStatus(state, CYCLE);
+

data/webpack/components/Cycle/Window.js

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

data/webpack/components/Cycle/index.js

@@ -0,0 +1,41 @@
+import React, { useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { useSelector, useDispatch } from 'react-redux';
+
+import Cycle from './Cycle';
+import {
+  selectCycle,
+  selectStatus,
+} from './CycleSelectors';
+import {
+  getCycle,
+  moveWindow,
+} from './CycleActions';
+
+const WrappedCycle = ({ id }) => {
+  const dispatch = useDispatch();
+
+  const cycle = useSelector(selectCycle);
+  const status = useSelector(selectStatus);
+
+  const updateWindow = (window) => {
+    dispatch(moveWindow(window));
+  };
+
+  useEffect(() => {
+    dispatch(getCycle(id));
+  }, [dispatch]);
+
+  return (<Cycle {...cycle} moveWindow={updateWindow} status={status} />);
+};
+
+WrappedCycle.propTypes = {
+  id: PropTypes.number.isRequired,
+  locale: PropTypes.string,
+};
+
+WrappedCycle.defaultProps = {
+  locale: 'en-US',
+};
+
+export default WrappedCycle;

data/webpack/components/Groups/Group.js

@@ -0,0 +1,20 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import { useDrag } from 'react-dnd'
+
+import { GROUP } from './GroupsConstants'
+
+const Group = (props) => {
+  const [, drag] = useDrag({
+    type: GROUP,
+    item: {
+      ...props
+    },
+  });
+
+  return (
+    <span ref={drag}></span>
+  );
+};
+
+export default Group;

data/webpack/components/Groups/Groups.js

@@ -0,0 +1,46 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { DndProvider } from 'react-dnd';
+import HTML5Backend from 'react-dnd-html5-backend';
+
+import Priority from './Priority';
+import { prioritizeGroups } from './GroupsHelpers';
+
+const Groups = ({groups}) => {
+  const [priorities, setPriorities] = useState(prioritizeGroups(groups));
+
+  const moveGroup = (group, source, target, insert) => {
+    const result = priorities;
+
+    // insert the group into the correct priority
+    if (insert) {
+      // insert a new priority with the group
+      result.splice(target, 0, [ group ]);
+    } else {
+      // add group to existing priority
+      result[target].push(group);
+    }
+
+    // remove group from source priority
+    result[source] = result[source].filter(e => (e !== group));
+
+    // remove priority if it is empty
+    if (result[source].length === 0) {
+      result.splice(group.priority, 1);
+    }
+
+    setPriorities(result);
+  };
+
+  return (
+    <DndProvider backend={HTML5Backend}>
+      <div className="group-list">
+        {priorities.map(groups, index => (
+          <Priority priority={index} groups={groups} /> 
+        ))}
+      </div>
+    </DndProvider>
+  );
+};
+
+export default Groups;

data/webpack/components/Groups/GroupsHelpers.js

@@ -0,0 +1,11 @@
+
+export const prioritizeGroups = (groups) => {
+  return groups.reduce(
+    (priorities, group) => {
+      let priority = group.priority;
+      
+    }, new Array())
+    .filter(
+      item => (item != null)
+    );
+};

data/webpack/components/Groups/Priority.js

@@ -0,0 +1,51 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { useDrop } from 'react-dnd';
+
+import { GROUP } from './GroupConstants';
+
+const Priority = ({priority, groups}) => {
+  const [, drop] = useDrop({
+    accept: GROUP,
+    hover(item, monitor) {
+      const sourcePriority = item.priority
+      const targetPriority = priority
+
+      if (groups.length === 1 && sourcePriority === targetPriority) {
+        return
+      }
+
+      // Determine rectangle on screen
+      const hoverBoundingRect = ref.current?.getBoundingClientRect()
+
+      // Three vertical zones
+      // 1: top 25% - insert above
+      // 2: middle 50% - drop into
+      // 3: bottom 25% - insert below
+      // This results in 2 Y boundaries
+      const hoverAboveY = (hoverBoundingRect.bottom - hoverBoundingRect.top) * 0.25
+      const hoverBelowY = (hoverBoundingRect.bottom - hoverBoundingRect.top) * 0.75
+
+      // Determine mouse position
+      const clientOffset = monitor.getClientOffset()
+
+      // Get pixes from the top
+      const hoverClientY = clientOffset.y - hoverBoundingRect.top
+      
+      const targetPriority = hoverPriority
+
+      moveGroup(group, targetPriority, insert)
+      group.priority = hoverPriority
+    }
+  });
+
+  return (
+    <div ref={drop}>
+      {groups.map(group => (
+        <Group priority={priority} group={group} />
+      ))}
+    </div>
+  );
+};
+
+export default Priority;

data/webpack/components/Invocation/Invocation.js

@@ -0,0 +1,47 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { translate as __ } from 'foremanReact/common/I18n';
+import { Tabs, Tab, TabTitleText, LoadingState } from 'patternfly-react';
+import { STATUS } from 'foremanReact/constants';
+
+import Terminal from '../common/Terminal/Terminal';
+
+const Invocation = ({ invocation, status }) => {
+  if (status === STATUS.ERROR) {
+    return (
+      <Alert type="error">
+        {__(
+          'There was an error loading the invocation, try refreshing the page.'
+        )}
+      </Alert>
+    );
+  }
+
+  const [activeTabKey, setActiveTabKey] = useState(0);
+
+  const handleTabClick = (event, tabIndex) => {
+    setActiveTabKey(tabIndex);
+  };
+
+  return (
+    <LoadingState loading={status == STATUS.PENDING}>
+      <Tabs activeKey={activeTabKey} onSelect={handleTabClick}>
+        <Tab eventKey={0} title={<TabTitleText>Overview</TabTitleText>}>
+          TODO: status
+        </Tab>
+        {invocation.phases.map((phase, index) => (
+          <Tab event={index + 1} title={<TabTitleText>{phase.humanized_name}</TabTitleText>}>
+            <Terminal key={phase.label} linesets={phase.live_output}/>
+          </Tab>
+        ))}
+      </Tabs>
+    </LoadingState>
+  );
+};
+
+Invocation.propTypes = {
+  status: PropTypes.string.isRequired,
+  invocation: PropTypes.object.isRequired,
+};
+
+export default Invocation;

data/webpack/components/Invocation/InvocationActions.js

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

data/webpack/components/Invocation/InvocationConsts.js

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

data/webpack/components/Invocation/InvocationSelectors.js

@@ -0,0 +1,14 @@
+import {
+  selectAPIStatus,
+  selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { INVOCATION } from './InvocationConsts';
+
+export const selectInvocation = state =>
+  selectAPIResponse(state, INVOCATION) || {};
+
+export const selectState = state =>
+  selectAPIResponse(state, INVOCATION).state;
+
+export const selectStatus = state =>
+  selectAPIStatus(state, INVOCATION);

data/webpack/components/Invocation/index.js

@@ -0,0 +1,36 @@
+import React { useEffect, useState } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { stopInterval } from 'foremanReact/redux/middlewares/IntervalMiddleware';
+import Invocation from './Invocation';
+import {
+  selectInvocation,
+  selectState,
+  selectStatus,
+} from './InvocationSelectors';
+import { getData } from './InvocationActions';
+import { INVOCATION } from './InvocationsConsts';
+
+const WrappedInvocation = () => {
+  const dispatch = useDispatch();
+  const state = useSelector(selectState);
+  const invocation = useSelector(selectInvocation);
+  const status = useSelector(selectStatus);
+  
+  useEffect(() => {
+    dispatch(getData());
+
+    return () => {
+      dispatch(stopInterval(INVOCATION));
+    };
+  }, [dispatch]);
+
+  useEffect(() => {
+    if (state === 'stopped') {
+      dispatch(stopInterval(INVOCATION));
+    }
+  }, [state, dispatch]);
+
+  return <Invocation invocation={invocation} status={status}/>
+};
+
+export default WrappedInvocation;

data/webpack/components/Invocations/Invocations.js

@@ -0,0 +1,55 @@
+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 InvocationItem from './components/InvocationItem';
+
+const Invocations = ({ status, items }) => {
+  if (status === STATUS.ERROR) {
+    return (
+      <Alert type="error">
+        {__(
+          'There was an error while updating the status, try refreshing the page.'
+        )}
+      </Alert>
+    );
+  }
+
+  const rows = items.length ? (
+    items.map(item => (<InvocationItem {...item} />))
+  ) : (
+    <tr>
+      <td colSpan="3">{__('No hosts found.')}</td>
+    </tr>
+  );
+
+  return (
+    <LoadingState loading={!items.length && status === STATUS.PENDING}>
+      <div>
+        <table className="table table-bordered table-striped table-hover">
+          <thead>
+            <tr>
+              <th>{__('Host')}</th>
+              <th className="col-md-2">{__('Status')}</th>
+              <th className="col-md-1">{__('Actions')}</th>
+            </tr>
+          </thead>
+          <tbody>{rows}</tbody>
+        </table>
+      </div>
+    </LoadingState>
+  );
+};
+
+Invocations.propTypes = {
+  status: PropTypes.string,
+  items: PropTypes.array.isRequired,
+};
+
+Invocations.defaultProps = {
+  status: null,
+};
+
+export default Invocations;

data/webpack/components/Invocations/InvocationsConstants.js

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

data/webpack/components/Invocations/InvocationsHelpers.js

@@ -0,0 +1,11 @@
+import { getURI } from 'foremanReact/common/urlHelpers';
+
+export const getUrl = (round, searchQuery, pagination) => {
+  const baseUrl = getURI()
+    .path(`/foreman_patch/api/rounds/${round}/invocations`)
+    .search('')
+    .addQuery('page', pagination.page)
+    .addQuery('per_page', pagination.perPage);
+
+  return searchQuery ? baseUrl.addQuery('search', searchQuery) : baseUrl;
+};

data/webpack/components/Invocations/InvocationsPage.js

@@ -0,0 +1,66 @@
+import React from 'react';
+import PropTypes from 'prop-types'
+import { Grid } from 'patternfly-react';
+
+import SearchBar from 'foremanReact/components/SearchBar';
+import Pagination from 'foremanReact/components/Pagination/PaginationWrapper';
+import { getControllerSearchProps } from 'foremanReact/constants';
+
+import Invocations from './Invocations';
+import './InvocationsPage.scss';
+
+const InvocationsPage = ({
+  status,
+  items,
+  total,
+  searchQuery,
+  pagination,
+  handleSearch,
+  handlePagination,
+}) => (
+  <div id="patch_invocations">
+    <Grid.Row>
+      <Grid.Col md={6} className="title_filter">
+        <SearchBar
+          onSearch={handleSearch}
+          data={{
+            ...getControllerSearchProps('foreman_patch/invocations'),
+            autocomplete: {
+              id: 'invocations_search',
+              searchQuery,
+              url: '/foreman_patch/invocations/auto_complete_search',
+              useKeyShortcuts: true,
+            },
+            bookmarks: {},
+          }}
+        />
+      </Grid.Col>
+    </Grid.Row>
+    <br />
+    <Invocations status={status} items={items} />
+    <Pagination
+      viewType="table"
+      itemCount={total}
+      pagination={pagination}
+      onChange={handlePagination}
+      dropdownButtonId="invocations-pagination-dropdown"
+      className="invocations-pagination"
+    />
+  </div>
+);
+
+InvocationsPage.propTypes = {
+  status: PropTypes.string,
+  items: PropTypes.array.isRequired,
+  total: PropTypes.number.isRequired,
+  searchQuery: PropTypes.string.isRequired,
+  pagination: PropTypes.object.isRequired,
+  handleSearch: PropTypes.func.isRequired,
+  handlePagination: PropTypes.func.isRequired,
+};
+
+InvocationsPage.defaultProps = {
+  status: null,
+};
+
+export default InvocationsPage;

data/webpack/components/Invocations/InvocationsPage.scss

@@ -0,0 +1,3 @@
+#patch-invocations {
+  min-height: 350px;
+}

data/webpack/components/Invocations/InvocationsSelectors.js

@@ -0,0 +1,21 @@
+import {
+    selectAPIStatus,
+    selectAPIResponse,
+} from 'foremanReact/redux/API/APISelectors';
+import { selectDoesIntervalExist } from 'foremanReact/redux/middlewares/IntervalMiddleware/IntervalSelectors';
+
+import { INVOCATIONS } from './InvocationsConstants';
+
+export const selectItems = state =>
+  selectAPIResponse(state, INVOCATIONS).results || [];
+export const selectTotal = state =>
+  selectAPIResponse(state, INVOCATIONS).total || 0;
+
+export const selectAutoRefresh = state =>
+  selectItems(state).some(item => (item.result === 'pending'));
+
+export const selectStatus = state => selectAPIStatus(state, INVOCATIONS);
+
+export const selectIntervalExists = state =>
+  selectDoesIntervalExist(state, INVOCATIONS);
+

data/webpack/components/Invocations/components/InvocationItem.js

@@ -0,0 +1,66 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { ActionButtons } from 'foremanReact/components/common/ActionButtons/ActionButtons';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+import InvocationStatus from './InvocationStatus';
+
+const InvocationItem = ({ id, name, status, task_id, host_id }) => {
+
+  const actions = [
+    {
+      title: __('Host Detail'),
+      action: {
+        href: `/hosts/${name}`,
+        'data-method': 'get',
+        id: `${name}-actions-host`,
+      }
+    },
+  ];
+
+  if (task_id) {
+    actions.push({
+      title: __('Task Detail'),
+      action: {
+        href: `/foreman_tasks/tasks/${task_id}`,
+        'data-method': 'get',
+        id: `${name}-actions-task`,
+      },
+    });
+  }
+
+  if (status == 'pending') {
+    actions.push({
+      title: __('Cancel'),
+      action: {
+        href: `/foreman_patch/invocations/${id}`,
+        'data-method': 'delete',
+        id: `${name}-actions-cancel`,
+      }
+    });
+  }
+
+  return (
+    <tr id={`invocation-${id}`}>
+      <td className="invocation_name">
+        <a href={`/foreman_patch/invocations/${id}`}>{name}</a>
+      </td>
+      <td className="invocation_status">
+        <InvocationStatus status={status} />
+      </td>
+      <td className="invocation_actions">
+        <ActionButtons buttons={[...actions]} />
+      </td>
+    </tr>
+  );
+};
+
+InvocationItem.propTypes = {
+  id: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  status: PropTypes.string.isRequired,
+  host_id: PropTypes.number.isRequired,
+  task_id: PropTypes.number.isRequired,
+};
+
+export default InvocationItem;