foreman_acd 0.7.0 → 0.9.0

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReport.js

@@ -1,6 +1,11 @@
 import React, { useState } from 'react'
 import PropTypes from 'prop-types';
 
+import {
+  Icon,
+  Spinner,
+} from 'patternfly-react';
+
 import {
   VerticalTabs,
 } from 'patternfly-react-extensions';
@@ -20,14 +25,42 @@ class ApplicationInstanceReport extends React.Component {
 
   componentDidMount() {
     const {
-      data: { hosts, mode },
+      data: { hosts, deploymentState, initialConfigureState, initialConfigureJobUrl },
       initApplicationInstanceReport,
       setActiveHost,
     } = this.props;
 
-    initApplicationInstanceReport(hosts);
+    initApplicationInstanceReport(hosts, deploymentState, initialConfigureState, initialConfigureJobUrl);
+    this.reloadReportData();
   };
 
+  reloadReportData() {
+    const {
+      data: { appInstanceId, reportDataUrl },
+      deploymentState, initialConfigureState,
+      loadReportData,
+    } = this.props;
+
+    // if both states are unknown, it means, that the component was just loaded. try again after a short timeout.
+    if (deploymentState == 'unknown' && initialConfigureState == 'unknown') {
+      setTimeout(() => {
+        this.reloadReportData();
+      }, 1000);
+
+      return;
+    }
+
+    if ((deploymentState != 'new' && deploymentState != 'finished' && deploymentState != 'failed') ||
+        (initialConfigureState == 'unconfigured' || initialConfigureState == 'scheduled' || initialConfigureState == 'pending')) {
+
+      loadReportData(reportDataUrl, appInstanceId);
+
+      setTimeout(() => {
+        this.reloadReportData();
+      }, 5000);
+    }
+  }
+
   isActive(id) {
     return (this.props.activeHostId === id);
   }
@@ -66,13 +99,20 @@ class ApplicationInstanceReport extends React.Component {
         </div>
       )
     } else {
+      const already_deployed_msg = __("Already existing host which was added to the application instance");
       return (
         <div>
           <span>Host: <a href={ host['hostUrl'] }>{ host['name'] }</a></span>
           <span>&nbsp;|&nbsp;</span>
           <span>State: { host['build'] == true ? "in Build" : "Deployed" }</span>
           <span>&nbsp;|&nbsp;</span>
-          <span>Power Status: <PowerStatus key={ "power_status_"+ host['id'] } data={{ id: host['id'], url: host['powerStatusUrl'] }} /></span>
+          <span>Power Status: <PowerStatus key={ "power_status_"+ host['id'] } id={ host['id'] } url={ host['powerStatusUrl'] } data={{ id: host['id'], url: host['powerStatusUrl'] }} /></span>
+          {host['isExistingHost'] ? (
+            <span>
+              &nbsp;|&nbsp; Existing host &nbsp;
+              <Icon style={{marginRight: 8, marginLeft: 2}} type="pf" name="info" title={already_deployed_msg} />
+            </span>
+          ) : (<span></span>)}
         </div>
       )
     }
@@ -80,14 +120,22 @@ class ApplicationInstanceReport extends React.Component {
 
   render() {
     const {
-      data: { hosts, mode, appInstanceName, deployTaskUrl, configureJobUrl },
-      activeHostId,
+      data: { appInstanceId, appInstanceName, deployTaskUrl, configureJobUrl, reportDataUrl },
+      activeHostId, hosts,
+      deploymentState,
+      initialConfigureState, initialConfigureJobUrl, showInitialConfigureJob,
+      loadReportData,
     } = this.props;
 
     let tabs = [];
     let reportStatus = undefined;
     let report = undefined;
 
+    // This handles the first call to render() in which the state hosts is always empty
+    if (hosts.length == 0) {
+      return (<span>No host</span>);
+    }
+
     tabs = this.collectLastReportData(hosts);
     reportStatus = this.lastReportStatus(hosts[activeHostId]);
 
@@ -98,14 +146,32 @@ class ApplicationInstanceReport extends React.Component {
     return (
       <span>
         <div className="deploy_status">
+          <div>
+            <div className="deploy_status_head">Host deployment state</div>
+            <div className="deploy_status_content">
+              { (deploymentState != 'new' && deploymentState != 'finished' && deploymentState != 'failed') ? (<span><Spinner loading size='sm' /> &nbsp;</span>) : (<span></span>) }
+              { deploymentState }
+            </div>
+          </div>
           <div>
             <div className="deploy_status_head">Deployment task</div>
             <div className="deploy_status_content"><a href={ deployTaskUrl } >Last deployment task</a></div>
           </div>
+          { (showInitialConfigureJob == true) ? (
+          <div>
+            <div className="deploy_status_head">Configuration job</div>
+            <div className="deploy_status_content">
+              { (initialConfigureState == 'scheduled' || initialConfigureState == 'pending') ? (<span><Spinner loading size='sm' /> &nbsp;</span>) : (<span></span>) }
+              { (initialConfigureState != 'unconfigured' && initialConfigureState != 'scheduled') ? (<a href={ initialConfigureJobUrl }>Configuration job</a>) : (<span></span>) }
+              { (initialConfigureState != 'unconfigured') ? (<span>&nbsp; State: { initialConfigureState }</span>) : (<span></span>) }
+            </div>
+          </div>
+          ) : (
           <div>
             <div className="deploy_status_head">Configuration job</div>
             <div className="deploy_status_content"><a href={ configureJobUrl }>Configuration jobs</a></div>
           </div>
+          ) }
         </div>
         <div className="deploy_report_hosts">
           Hosts
@@ -131,6 +197,10 @@ ApplicationInstanceReport.defaultProps = {
   hosts: [],
   report: [],
   activeHostId: 0,
+  deploymentState: 'unknown',
+  initialConfigureState: 'unknown',
+  initialConfigureJobUrl: '',
+  showInitialConfigureJob: false,
 }
 
 ApplicationInstanceReport.propTypes = {
@@ -138,11 +208,16 @@ ApplicationInstanceReport.propTypes = {
   appInstanceName: PropTypes.string,
   deployTaskUrl: PropTypes.string,
   configureJobUrl: PropTypes.string,
+  deploymentState: PropTypes.string,
+  initialConfigureState: PropTypes.string,
+  initialConfigureJobUrl: PropTypes.string,
+  showInitialConfigureJob: PropTypes.bool,
   hosts: PropTypes.array,
+  deploymentState: PropTypes.string,
   report: PropTypes.array,
   setActiveHost: PropTypes.func,
+  loadReportData: PropTypes.func,
   activeHostId: PropTypes.number,
-
 };
 
 export default ApplicationInstanceReport;

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReportActions.js

@@ -13,14 +13,28 @@ import {
 import {
   APPLICATION_INSTANCE_REPORT_INIT,
   APPLICATION_INSTANCE_REPORT_SET_ACTIVE_HOST,
+  APPLICATION_INSTANCE_REPORT_LOAD_REPORT_REQUEST,
+  APPLICATION_INSTANCE_REPORT_LOAD_REPORT_SUCCESS,
+  APPLICATION_INSTANCE_REPORT_LOAD_REPORT_FAILURE,
 } from './ApplicationInstanceReportConstants';
 
 export const initApplicationInstanceReport = (
-  hosts,
+  hosts, deploymentState, initialConfigureState, initialConfigureJobUrl,
 ) => dispatch => {
   const initialState = {};
 
   initialState.hosts = hosts;
+  initialState.deploymentState = deploymentState;
+  initialState.initialConfigureState = initialConfigureState;
+  initialState.initialConfigureJobUrl = initialConfigureJobUrl;
+
+  // Decide if it should show only the initial Configure job state + URL or
+  // the URL to all configuration jobs
+  if (initialConfigureState == 'unconfigured') {
+    initialState.showInitialConfigureJob = true;
+  } else {
+    initialState.showInitialConfigureJob = false;
+  }
 
   dispatch({
     type: APPLICATION_INSTANCE_REPORT_INIT,
@@ -28,6 +42,26 @@ export const initApplicationInstanceReport = (
   });
 };
 
+export const loadReportData = (
+  reportDataUrl,
+  appInstanceId,
+) => dispatch => {
+  dispatch({ type: APPLICATION_INSTANCE_REPORT_LOAD_REPORT_REQUEST });
+
+  const baseUrl = reportDataUrl;
+  const realUrl = baseUrl.replace("__id__", appInstanceId);
+
+  return api
+    .get(realUrl, {}, {})
+    .then(({ data }) =>
+      dispatch({
+        type: APPLICATION_INSTANCE_REPORT_LOAD_REPORT_SUCCESS,
+        payload: { ...data }
+      })
+    )
+    .catch(error => dispatch(errorHandler(APPLICATION_INSTANCE_REPORT_LOAD_REPORT_FAILURE, error)));
+};
+
 const errorHandler = (msg, err) => {
   const error = {
     errorMsg: 'Failed to fetch data from server.',

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReportConstants.js

@@ -1,2 +1,5 @@
 export const APPLICATION_INSTANCE_REPORT_INIT = 'APPLICATION_INSTANCE_REPORT_INIT';
 export const APPLICATION_INSTANCE_REPORT_SET_ACTIVE_HOST = 'APPLICATION_INSTANCE_REPORT_SET_ACTIVE_HOST';
+export const APPLICATION_INSTANCE_REPORT_LOAD_REPORT_REQUEST = 'APPLICATION_INSTANCE_REPORT_LOAD_REPORT_REQUEST';
+export const APPLICATION_INSTANCE_REPORT_LOAD_REPORT_SUCCESS = 'APPLICATION_INSTANCE_REPORT_LOAD_REPORT_SUCCESS';
+export const APPLICATION_INSTANCE_REPORT_LOAD_REPORT_FAILURE = 'APPLICATION_INSTANCE_REPORT_LOAD_REPORT_FAILURE';

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReportReducer.js

@@ -9,6 +9,9 @@ import {
 import {
   APPLICATION_INSTANCE_REPORT_INIT,
   APPLICATION_INSTANCE_REPORT_SET_ACTIVE_HOST,
+  APPLICATION_INSTANCE_REPORT_LOAD_REPORT_REQUEST,
+  APPLICATION_INSTANCE_REPORT_LOAD_REPORT_SUCCESS,
+  APPLICATION_INSTANCE_REPORT_LOAD_REPORT_FAILURE,
 } from './ApplicationInstanceReportConstants';
 
 export const initialState = Immutable({
@@ -29,6 +32,22 @@ const applicationInstanceReport = (state = initialState, action) => {
         activeHostId: payload.activeHostId,
       })
     }
+    case APPLICATION_INSTANCE_REPORT_LOAD_REPORT_REQUEST: {
+      // Nothing to do
+      return state;
+    }
+    case APPLICATION_INSTANCE_REPORT_LOAD_REPORT_SUCCESS: {
+      return state.merge({
+        deploymentState: payload.deploymentState,
+        initialConfigureState: payload.initialConfigureState,
+        initialConfigureJobUrl: payload.initialConfigureJobUrl,
+        hosts: payload.hosts,
+      });
+    }
+    case APPLICATION_INSTANCE_REPORT_LOAD_REPORT_FAILURE: {
+      console.log("Error while loading report data: "+ payload.error);
+      return state.merge({ error: payload.error});
+    }
     default: {
       return state;
     }

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReportSelectors.js

@@ -2,3 +2,7 @@ const applicationInstanceReport = state => state.foremanAcd.applicationInstanceR
 
 export const selectHosts = state => applicationInstanceReport(state).hosts;
 export const selectActiveHostId = state => applicationInstanceReport(state).activeHostId;
+export const selectDeploymentState = state => applicationInstanceReport(state).deploymentState;
+export const selectInitialConfigureState = state => applicationInstanceReport(state).initialConfigureState;
+export const selectInitialConfigureJobUrl = state => applicationInstanceReport(state).initialConfigureJobUrl;
+export const selectShowInitialConfigureJob = state => applicationInstanceReport(state).showInitialConfigureJob;

data/webpack/components/ApplicationInstanceReport/__tests__/__snapshots__/ApplicationInstanceReport.test.js.snap

@@ -2,129 +2,6 @@
 
 exports[`ApplicationInstanceReport should render application instance report 1`] = `
 <span>
-  <div
-    className="deploy_status"
-  >
-    <div>
-      <div
-        className="deploy_status_head"
-      >
-        Deployment task
-      </div>
-      <div
-        className="deploy_status_content"
-      >
-        <a
-          href="deploy/task/url"
-        >
-          Last deployment task
-        </a>
-      </div>
-    </div>
-    <div>
-      <div
-        className="deploy_status_head"
-      >
-        Configuration job
-      </div>
-      <div
-        className="deploy_status_content"
-      >
-        <a
-          href="configure/job/url"
-        >
-          Configuration jobs
-        </a>
-      </div>
-    </div>
-  </div>
-  <div
-    className="deploy_report_hosts"
-  >
-    Hosts
-    <VerticalTabs
-      activeTab={false}
-      className=""
-      id="vertical_tabs"
-      restrictTabs={false}
-    >
-      <VerticalTabsTab
-        active={true}
-        className=""
-        hasActiveDescendant={false}
-        id={0}
-        key="vt_tab_0"
-        onActivate={[Function]}
-        shown={false}
-        title="great-web-app-db-1"
-        wrapStyle="nowrap"
-      />
-      <VerticalTabsTab
-        active={false}
-        className=""
-        hasActiveDescendant={false}
-        id={1}
-        key="vt_tab_1"
-        onActivate={[Function]}
-        shown={false}
-        title="great-web-app-web-1"
-        wrapStyle="nowrap"
-      />
-      <VerticalTabsTab
-        active={false}
-        className=""
-        hasActiveDescendant={false}
-        id={2}
-        key="vt_tab_2"
-        onActivate={[Function]}
-        shown={false}
-        title="great-web-app-web-2"
-        wrapStyle="nowrap"
-      />
-    </VerticalTabs>
-  </div>
-  <div
-    className="deploy_report_status"
-  >
-    <div>
-      <span>
-        Host: 
-        <a
-          href="/hosts/great-web-app-db-1.deploy3.dev.atix"
-        >
-          great-web-app-db-1
-        </a>
-      </span>
-      <span>
-         | 
-      </span>
-      <span>
-        State: 
-        Deployed
-      </span>
-      <span>
-         | 
-      </span>
-      <span>
-        Power Status: 
-        <Component
-          data={
-            Object {
-              "id": 8,
-              "url": "/api/v2/hosts/great-web-app-db-1.deploy3.dev.atix/power",
-            }
-          }
-          key="power_status_8"
-        />
-      </span>
-    </div>
-  </div>
-  <div
-    className="deploy_report_tasks"
-  >
-    <ReportViewer
-      report={Array []}
-    />
-  </div>
+  No host
 </span>
 `;

data/webpack/components/ApplicationInstanceReport/index.js

@@ -8,11 +8,19 @@ import * as ApplicationInstanceReportActions from './ApplicationInstanceReportAc
 import {
   selectHosts,
   selectActiveHostId,
+  selectDeploymentState,
+  selectInitialConfigureState,
+  selectInitialConfigureJobUrl,
+  selectShowInitialConfigureJob,
 } from './ApplicationInstanceReportSelectors';
 
 const mapStateToProps = state => ({
   hosts: selectHosts(state),
   activeHostId: selectActiveHostId(state),
+  deploymentState: selectDeploymentState(state),
+  initialConfigureState: selectInitialConfigureState(state),
+  initialConfigureJobUrl: selectInitialConfigureJobUrl(state),
+  showInitialConfigureJob: selectShowInitialConfigureJob(state),
 });
 
 const mapDispatchToProps = dispatch =>
@@ -22,4 +30,3 @@ export default connect(
   mapStateToProps,
   mapDispatchToProps
 )(ApplicationInstanceReport);
-

data/webpack/components/ExistingHostSelection/ExistingHostSelection.js

@@ -0,0 +1,104 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { orderBy } from 'lodash';
+import ServiceSelector from './components/ServiceSelector';
+import { arrayToObject } from '../../helper';
+
+import {
+  cloneDeep,
+} from 'lodash';
+
+import {
+  Icon,
+  Button,
+  DualListControlled,
+} from 'patternfly-react';
+
+class ExistingHostSelection extends React.Component {
+
+  constructor(props) {
+    super(props);
+  }
+
+  componentDidMount() {
+    const {
+      location,
+      organization,
+      services,
+      initExistingHostSelection,
+      allHosts,
+    } = this.props;
+
+    initExistingHostSelection(allHosts);
+  }
+
+  render() {
+    const {
+      location,
+      organization,
+      services,
+      serviceId,
+      availableHosts,
+      alreadyUsedHosts,
+      loadHostsOfHostgroup,
+      hostSelectionChanged,
+    } = this.props;
+
+    const serviceList = arrayToObject(services, "id", "name");
+    const load_hostgroup_url = "/api/v2/hostgroups/__hostgroup_id__/hosts"
+
+    return(
+      <div>
+        <div className="row">
+          <ServiceSelector
+            label="Service"
+            hidden={ false }
+            selectValue={ this.props.serviceId ? this.props.serviceId.toString() : '0'}
+            options={ serviceList }
+            onChange={ loadHostsOfHostgroup }
+            additionalData={{ url: load_hostgroup_url, services: services }} />
+        </div>
+        <div className="row">
+          <label className="col-md-2 control-label">{ __("Hosts") }</label>
+          {this.props.serviceId != undefined ? (
+          <div className="col-md-6">
+            <DualListControlled
+              onChange={ hostSelectionChanged }
+              left={{
+                items: cloneDeep(availableHosts),
+              }}
+              right={{
+                items: cloneDeep(alreadyUsedHosts),
+              }}
+              allowHiddenInputs={false}
+            />
+          </div>) : (<span>{ __("Please select service first.") }</span>)}
+        </div>
+      </div>
+    );
+  }
+}
+
+ExistingHostSelection.defaultProps = {
+  serviceId: undefined,
+  hostsInHostgroup: {},
+  availableHosts: [],
+  alreadyUsedHosts: [],
+  selectedHosts: [],
+};
+
+ExistingHostSelection.propTypes = {
+  location: PropTypes.string.isRequired,
+  organization: PropTypes.string.isRequired,
+  services: PropTypes.array.isRequired,
+  initExistingHostSelection: PropTypes.func,
+  serviceId: PropTypes.number,
+  hostsInHostgroup: PropTypes.object,
+  availableHosts: PropTypes.array,
+  alreadyUsedHosts: PropTypes.array,
+  selectedHosts: PropTypes.array,
+  loadHostsOfHostgroup: PropTypes.func,
+  hostSelectionChanged: PropTypes.func,
+};
+
+export default ExistingHostSelection;

data/webpack/components/ExistingHostSelection/ExistingHostSelection.scss

@@ -0,0 +1,15 @@
+@import '~@theforeman/vendor/scss/variables';
+
+.add_existing_hosts_modal {
+    margin-top: 0;
+    margin-bottom: 0;
+    height: 100%;
+    width: 80%;
+    max-width: none !important;
+}
+
+.row {
+  margin-left: 0;
+  margin-right: 0;
+  margin-bottom: 20px;
+}

data/webpack/components/ExistingHostSelection/ExistingHostSelectionActions.js

@@ -0,0 +1,71 @@
+import React from 'react';
+import * as sort from 'sortabular';
+import { translate as __ } from 'foremanReact/common/I18n';
+
+import api from 'foremanReact/API';
+
+import {
+  propsToSnakeCase,
+  propsToCamelCase,
+} from 'foremanReact/common/helpers';
+
+import {
+  EXISTING_HOST_SELECTION_INIT,
+  EXISTING_HOST_SELECTION_LOAD_HOSTS_SUCCESS,
+  EXISTING_HOST_SELECTION_LOAD_HOSTS_FAILURE,
+  EXISTING_HOST_SELECTION_SELECTION_CHANGED,
+} from './ExistingHostSelectionConstants';
+
+export const initExistingHostSelection = (
+  allHosts,
+) => dispatch => {
+  const initialState = {};
+
+  initialState.alreadyUsedHosts = undefined;
+  initialState.serviceId = undefined;
+  initialState.selectedHosts = [];
+  initialState.hostsInHostgroup = {};
+  initialState.allHosts = allHosts;
+
+  dispatch({
+    type: EXISTING_HOST_SELECTION_INIT,
+    payload: initialState,
+  });
+}
+
+export const loadHostsOfHostgroup = (
+  serviceId,
+  additionalData
+) => dispatch => {
+
+  const selService = additionalData.services.filter(s => (s.id == serviceId))[0];
+  const realUrl = additionalData.url.replace("__hostgroup_id__", selService.hostgroup);
+
+  return api
+    .get(realUrl, {}, {})
+    .then(({ data }) =>
+      dispatch({
+        type: EXISTING_HOST_SELECTION_LOAD_HOSTS_SUCCESS,
+        payload: {
+          hosts: data.results,
+          serviceId: parseInt(serviceId),
+        }
+      })
+    )
+    .catch(error => dispatch(errorHandler(EXISTING_HOST_SELECTION_LOAD_HOSTS_FAILURE, error)));
+};
+
+export const hostSelectionChanged = ({ left, right }) => ({
+  type: EXISTING_HOST_SELECTION_SELECTION_CHANGED,
+  payload: {
+    selection: right.items,
+  }
+});
+
+const errorHandler = (msg, err) => {
+  const error = {
+    errorMsg: __('Failed to fetch data from server.'),
+    statusText: err,
+  };
+  return { type: msg, payload: { error } };
+};

data/webpack/components/ExistingHostSelection/ExistingHostSelectionConstants.js

@@ -0,0 +1,4 @@
+export const EXISTING_HOST_SELECTION_INIT = 'EXISTING_HOST_SELECTION_INIT';
+export const EXISTING_HOST_SELECTION_LOAD_HOSTS_SUCCESS = 'EXISTING_HOST_SELECTION_LOAD_HOSTS_SUCCESS';
+export const EXISTING_HOST_SELECTION_LOAD_HOSTS_FAILURE = 'EXISTING_HOST_SELECTION_LOAD_HOSTS_FAILURE';
+export const EXISTING_HOST_SELECTION_SELECTION_CHANGED = 'EXISTING_HOST_SELECTION_SELECTION_CHANGED';