foreman_acd 0.4.0 → 0.9.0

data/webpack/components/ApplicationInstance/__tests__/__snapshots__/ApplicationInstanceSelectors.test.js.snap

@@ -0,0 +1,276 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ApplicationInstanceSelectors should return ParamEditMode from applicationInstanceConfData_1 fixtures 1`] = `undefined`;
+
+exports[`ApplicationInstanceSelectors should return ansibleVarsAll from applicationInstanceConfData_1 fixtures 1`] = `
+Array [
+  Object {
+    "id": 0,
+    "name": "repository",
+    "value": "https://github.com/bennojoy/mywebapp.git",
+  },
+]
+`;
+
+exports[`ApplicationInstanceSelectors should return appDefinition from applicationInstanceConfData_1 fixtures 1`] = `
+Object {
+  "ansible_vars_all": "[{\\"id\\":0,\\"name\\":\\"repository\\",\\"value\\":\\"https://github.com/bennojoy/mywebapp.git\\"}]",
+  "created_at": "2021-03-11 12:51:34 +0100",
+  "description": "",
+  "id": 1,
+  "location_ids": Array [
+    2,
+  ],
+  "name": "LAMP",
+  "organization_ids": Array [
+    1,
+  ],
+  "services": "[{\\"id\\":1,\\"name\\":\\"web\\",\\"description\\":\\"\\",\\"hostgroup\\":\\"1\\",\\"ansibleGroup\\":\\"webservers\\",\\"minCount\\":\\"2\\",\\"maxCount\\":\\"\\",\\"foremanParameters\\":[{\\"id\\":1,\\"locked\\":false,\\"name\\":\\"CP\\",\\"description\\":\\"\\",\\"type\\":\\"computeprofile\\",\\"value\\":\\"1\\"},{\\"id\\":2,\\"locked\\":true,\\"name\\":\\"LE\\",\\"description\\":\\"\\",\\"type\\":\\"lifecycleenv\\",\\"value\\":\\"1\\"}],\\"ansibleParameters\\":[{\\"id\\":0,\\"name\\":\\"dummy_var\\",\\"value\\":\\"0\\"}]},{\\"id\\":2,\\"name\\":\\"db\\",\\"description\\":\\"\\",\\"hostgroup\\":\\"1\\",\\"ansibleGroup\\":\\"dbservers\\",\\"minCount\\":\\"1\\",\\"maxCount\\":\\"\\",\\"foremanParameters\\":[],\\"ansibleParameters\\":[{\\"id\\":0,\\"name\\":\\"mysqlservice\\",\\"value\\":\\"mysqld\\"},{\\"id\\":1,\\"name\\":\\"mysql_port\\",\\"value\\":\\"3306\\",\\"locked\\":true},{\\"id\\":2,\\"name\\":\\"dbuser\\",\\"value\\":\\"webapp\\"},{\\"id\\":3,\\"name\\":\\"dbname\\",\\"value\\":\\"ANSAP01\\"},{\\"id\\":4,\\"name\\":\\"upassword\\",\\"value\\":\\"Bond@007\\"},{\\"id\\":5,\\"name\\":\\"masterpassword\\",\\"value\\":\\"MySQL@007\\"}]}]",
+  "updated_at": "2021-03-13 00:06:12 +0100",
+}
+`;
+
+exports[`ApplicationInstanceSelectors should return columns from applicationInstanceConfData_1 fixtures 1`] = `
+Array [
+  Object {
+    "cell": Object {
+      "formatters": Array [
+        null,
+      ],
+    },
+    "header": Object {
+      "formatters": Array [
+        null,
+      ],
+      "label": "Hostname",
+      "props": Object {
+        "index": 0,
+        "style": Object {
+          "width": "30%",
+        },
+      },
+    },
+    "property": "hostname",
+  },
+  Object {
+    "cell": Object {
+      "formatters": Array [
+        null,
+      ],
+    },
+    "header": Object {
+      "formatters": Array [
+        null,
+      ],
+      "label": "Description",
+      "props": Object {
+        "index": 1,
+        "style": Object {
+          "width": "30%",
+        },
+      },
+    },
+    "property": "description",
+  },
+  Object {
+    "cell": Object {
+      "formatters": Array [
+        null,
+      ],
+    },
+    "header": Object {
+      "formatters": Array [
+        null,
+      ],
+      "label": "Service",
+      "props": Object {
+        "index": 2,
+        "style": Object {
+          "width": "20%",
+        },
+      },
+    },
+    "property": "service",
+  },
+  Object {
+    "cell": Object {
+      "formatters": Array [
+        null,
+      ],
+    },
+    "header": Object {
+      "formatters": Array [
+        null,
+      ],
+      "label": "Actions",
+      "props": Object {
+        "index": 4,
+        "style": Object {
+          "width": "20%",
+        },
+      },
+    },
+    "property": "actions",
+  },
+]
+`;
+
+exports[`ApplicationInstanceSelectors should return editMode from applicationInstanceConfData_1 fixtures 1`] = `undefined`;
+
+exports[`ApplicationInstanceSelectors should return hosts from applicationInstanceConfData_1 fixtures 1`] = `
+Array [
+  Object {
+    "ansibleParameters": Array [
+      Object {
+        "id": 0,
+        "name": "mysqlservice",
+        "value": "mysqld",
+      },
+      Object {
+        "id": 1,
+        "name": "mysql_port",
+        "value": "3306",
+      },
+      Object {
+        "id": 2,
+        "name": "dbuser",
+        "value": "webapp",
+      },
+      Object {
+        "id": 3,
+        "name": "dbname",
+        "value": "ANSAP01",
+      },
+      Object {
+        "id": 4,
+        "name": "upassword",
+        "value": "Bond@007",
+      },
+      Object {
+        "id": 5,
+        "name": "masterpassword",
+        "value": "MySQL@007",
+      },
+    ],
+    "description": "",
+    "foremanParameters": Array [],
+    "hostname": "great-web-app-db-1",
+    "id": 4,
+    "service": "2",
+  },
+  Object {
+    "ansibleParameters": Array [
+      Object {
+        "id": 0,
+        "name": "dummy_var",
+        "value": "0",
+      },
+    ],
+    "description": "",
+    "foremanParameters": Array [],
+    "hostname": "great-web-app-web-1",
+    "id": 1,
+    "service": "1",
+  },
+  Object {
+    "ansibleParameters": Array [
+      Object {
+        "id": 0,
+        "name": "dummy_var",
+        "value": "0",
+      },
+    ],
+    "description": "",
+    "foremanParameters": Array [],
+    "hostname": "great-web-app-web-2",
+    "id": 2,
+    "service": "1",
+  },
+]
+`;
+
+exports[`ApplicationInstanceSelectors should return parametersData from applicationInstanceConfData_1 fixtures 1`] = `undefined`;
+
+exports[`ApplicationInstanceSelectors should return services from applicationInstanceConfData_1 fixtures 1`] = `
+Array [
+  Object {
+    "ansibleGroup": "webservers",
+    "ansibleParameters": Array [
+      Object {
+        "id": 0,
+        "name": "dummy_var",
+        "value": "0",
+      },
+    ],
+    "currentCount": 2,
+    "description": "",
+    "foremanParameters": Array [
+      Object {
+        "description": "",
+        "id": 1,
+        "locked": false,
+        "name": "CP",
+        "type": "computeprofile",
+        "value": "1",
+      },
+      Object {
+        "description": "",
+        "id": 2,
+        "locked": true,
+        "name": "LE",
+        "type": "lifecycleenv",
+        "value": "1",
+      },
+    ],
+    "hostgroup": "1",
+    "id": 1,
+    "maxCount": "",
+    "minCount": "2",
+    "name": "web",
+  },
+  Object {
+    "ansibleGroup": "dbservers",
+    "ansibleParameters": Array [
+      Object {
+        "id": 0,
+        "name": "mysqlservice",
+        "value": "mysqld",
+      },
+      Object {
+        "id": 1,
+        "locked": true,
+        "name": "mysql_port",
+        "value": "3306",
+      },
+      Object {
+        "id": 2,
+        "name": "dbuser",
+        "value": "webapp",
+      },
+      Object {
+        "id": 3,
+        "name": "dbname",
+        "value": "ANSAP01",
+      },
+      Object {
+        "id": 4,
+        "name": "upassword",
+        "value": "Bond@007",
+      },
+      Object {
+        "id": 5,
+        "name": "masterpassword",
+        "value": "MySQL@007",
+      },
+    ],
+    "currentCount": 1,
+    "description": "",
+    "foremanParameters": Array [],
+    "hostgroup": "1",
+    "id": 2,
+    "maxCount": "",
+    "minCount": "1",
+    "name": "db",
+  },
+]
+`;

data/webpack/components/ApplicationInstance/components/AppDefinitionSelector.js

@@ -18,6 +18,7 @@ const AppDefinitionSelector= ({
       <label className="col-md-2 control-label">{label}</label>
       <div className="col-md-4">
         <ExtSelect
+          hidden={hidden}
           editable={editable}
           viewText={viewText}
           selectValue={selectValue}

data/webpack/components/ApplicationInstance/components/Service.js

@@ -9,7 +9,7 @@ const Service= ({
 }) =>{
   return (
     <div>
-      <label>{name}:</label> {currentCount} (Min/Max: {minCount}/{maxCount})
+      <label>{name}:</label> {currentCount} ({__("Min/Max")}: {minCount}/{maxCount})
     </div>
   );
 };

data/webpack/components/ApplicationInstance/components/ServiceCounter.js

@@ -15,7 +15,7 @@ const ServiceCounter= ({
 
   return (
     <div>
-      <label class="service-counter-title">{title}</label>
+      <label className="service-counter-title">{title}</label>
     {Object.keys(services).map(key => (
       <Service
         key={services[key].id}

data/webpack/components/ApplicationInstance/index.js

@@ -6,6 +6,9 @@ import ApplicationInstance from './ApplicationInstance';
 import * as ApplicationInstanceActions from './ApplicationInstanceActions';
 
 import {
+  selectShowAlertModal,
+  selectAlertModalText,
+  selectAlertModalTitle,
   selectEditMode,
   selectAppDefinition,
   selectHosts,
@@ -13,9 +16,13 @@ import {
   selectColumns,
   selectParametersData,
   selectAnsibleVarsAll,
+  selectParamEditMode,
 } from './ApplicationInstanceSelectors';
 
 const mapStateToProps = state => ({
+  showAlertModal: selectShowAlertModal(state),
+  alertModalText: selectAlertModalText(state),
+  alertModalTitle: selectAlertModalTitle(state),
   editMode: selectEditMode(state),
   appDefinition: selectAppDefinition(state),
   hosts: selectHosts(state),
@@ -23,6 +30,7 @@ const mapStateToProps = state => ({
   columns: selectColumns(state),
   parametersData: selectParametersData(state),
   ansibleVarsAll: selectAnsibleVarsAll(state),
+  paramEditMode: selectParamEditMode(state),
 });
 
 const mapDispatchToProps = dispatch =>

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReport.js

@@ -1,10 +1,19 @@
 import React, { useState } from 'react'
 import PropTypes from 'prop-types';
 
+import {
+  Icon,
+  Spinner,
+} from 'patternfly-react';
+
 import {
   VerticalTabs,
 } from 'patternfly-react-extensions';
 
+import {
+  translate as __
+} from 'foremanReact/common/I18n';
+
 import PowerStatus from 'foremanReact/components/hosts/powerStatus';
 import ReportViewer from './components/ReportViewer';
 
@@ -16,56 +25,50 @@ class ApplicationInstanceReport extends React.Component {
 
   componentDidMount() {
     const {
-      data: { hosts, mode },
+      data: { hosts, deploymentState, initialConfigureState, initialConfigureJobUrl },
       initApplicationInstanceReport,
-      setActiveAndLoadLiveReport,
+      setActiveHost,
     } = this.props;
 
-    initApplicationInstanceReport(hosts);
-
-    if (mode == 'liveReport') {
-      if (hosts.length > 0) {
-        const index = 0;
-        const url = `/api/v2/orchestration/${hosts[index].progress_report_id}/tasks`;
-        setActiveAndLoadLiveReport(index, url);
-      }
-    }
+    initApplicationInstanceReport(hosts, deploymentState, initialConfigureState, initialConfigureJobUrl);
+    this.reloadReportData();
   };
 
-  isActive(id) {
-    return (this.props.activeHostId === id);
-  }
-
-  collectLiveData(hosts) {
+  reloadReportData() {
     const {
-      setActiveAndLoadLiveReport,
+      data: { appInstanceId, reportDataUrl },
+      deploymentState, initialConfigureState,
+      loadReportData,
     } = this.props;
-    const tabs = []
 
-    for (const [index, value] of hosts.entries()) {
-      const url = `/api/v2/orchestration/${hosts[index].progress_report_id}/tasks`
+    // 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);
 
-      tabs.push(
-        <VerticalTabs.Tab
-          id={index}
-          key={"vt_tab_"+index}
-          title={ value.name }
-          wrapStyle='nowrap'
-          onActivate={() => setActiveAndLoadLiveReport(index, url)}
-          active={this.isActive(index)}
-        />
-      );
+      return;
     }
 
-    return tabs;
+    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);
   }
 
   collectLastReportData(hosts) {
     const {
-      setActiveAndLoadLastReport,
+      setActiveHost,
     } = this.props;
-    // FIXME
-    const url = undefined;
 
     const tabs = []
     for (const [index, value] of hosts.entries()) {
@@ -75,7 +78,7 @@ class ApplicationInstanceReport extends React.Component {
           key={"vt_tab_"+index}
           title={ value.name }
           wrapStyle='nowrap'
-          onActivate={() => setActiveAndLoadLastReport(index, url)}
+          onActivate={() => setActiveHost(index)}
           active={this.isActive(index)}
         />
       );
@@ -84,43 +87,94 @@ class ApplicationInstanceReport extends React.Component {
     return tabs;
   }
 
-  liveReportStatus(host) {
-    return (
-      <span>Host: <a href={ host['hostUrl'] }>{ host['hostname'] }</a></span>
-    );
-  }
-
   lastReportStatus(host) {
-    return (
-      <div>
-        <span>Host: <a href={ host['hostUrl'] }>{ host['hostname'] }</a></span>
-        <span>&nbsp;|&nbsp;</span>
-        <span>Power Status: <PowerStatus data={{ id: host['id'], url: host['powerStatusUrl'] }} /></span>
-      </div>
-    )
+    if (!host['id']) {
+      return (
+        <div>
+          <span>Host: { host['name'] }</span>
+          <span>&nbsp;|&nbsp;</span>
+          <span>State: { __('not build') }</span>
+          <span>&nbsp;|&nbsp;</span>
+          <span>Power Status: { __('unknown') }</span>
+        </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'] } 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>
+      )
+    }
   }
 
   render() {
     const {
-      data: { hosts, mode },
-      report,
-      activeHostId,
+      data: { appInstanceId, appInstanceName, deployTaskUrl, configureJobUrl, reportDataUrl },
+      activeHostId, hosts,
+      deploymentState,
+      initialConfigureState, initialConfigureJobUrl, showInitialConfigureJob,
+      loadReportData,
     } = this.props;
 
     let tabs = [];
     let reportStatus = undefined;
+    let report = undefined;
 
-    if (mode == 'liveReport') {
-      tabs = this.collectLiveData(hosts);
-      reportStatus = this.liveReportStatus(hosts[activeHostId])
-    } else if (mode == 'lastReport') {
-      tabs = this.collectLastReportData(hosts);
-      reportStatus = this.lastReportStatus(hosts[activeHostId])
+    // 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]);
+
+    if (hosts[activeHostId]['progress_report']) {
+      report = hosts[activeHostId]['progress_report'];
     }
 
     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
           <VerticalTabs id="vertical_tabs">
             {tabs}
           </VerticalTabs>
@@ -137,19 +191,33 @@ class ApplicationInstanceReport extends React.Component {
 
 ApplicationInstanceReport.defaultProps = {
   error: {},
+  appInstanceName: '',
+  deployTaskUrl: '',
+  configureJobUrl: '',
   hosts: [],
   report: [],
   activeHostId: 0,
+  deploymentState: 'unknown',
+  initialConfigureState: 'unknown',
+  initialConfigureJobUrl: '',
+  showInitialConfigureJob: false,
 }
 
 ApplicationInstanceReport.propTypes = {
   initApplicationInstanceReport: PropTypes.func,
+  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,
-  setActiveAndLoadLiveReport: PropTypes.func,
-  setActiveAndLoadLastReport: PropTypes.func,
+  setActiveHost: PropTypes.func,
+  loadReportData: PropTypes.func,
   activeHostId: PropTypes.number,
-
 };
 
 export default ApplicationInstanceReport;

data/webpack/components/ApplicationInstanceReport/ApplicationInstanceReport.scss

@@ -1,5 +1,21 @@
 @import '~@theforeman/vendor/scss/variables';
 
+.deploy_status {
+  padding-bottom: 80px;
+}
+
+.deploy_status_head {
+  float:left;
+  width:25%;
+  height:10%;
+}
+
+.deploy_status_content {
+  float:left;
+  width:75%;
+  height:10%;
+}
+
 .deploy_report_hosts {
   float:left;
   width:25%;
@@ -11,6 +27,7 @@
   width:75%;
   min-height: 300px;
   background-color: #ecf9fe;
+  padding: 10px;
   border: 1px solid #3dbff3;
 }