foreman_rh_cloud 2.0.8 → 2.0.13

data/webpack/InsightsCloudSync/Components/InsightsSettings/__tests__/InsightsSettingsReducer.test.js

@@ -0,0 +1,33 @@
+import { testReducerSnapshotWithFixtures } from '@theforeman/test';
+import reducer from '../InsightsSettingsReducer';
+import {
+  INSIGHTS_SYNC_SETTING_SET,
+  INSIGHTS_SYNC_SETTINGS_GET_SUCCESS,
+} from '../InsightsSettingsConstants';
+
+const fixtures = {
+  'should return the initial state': {},
+  'should handle INSIGHTS_SYNC_SETTINGS_GET_SUCCESS': {
+    action: {
+      type: INSIGHTS_SYNC_SETTINGS_GET_SUCCESS,
+      payload: {
+        settings: {
+          insightsSyncEnabled: true,
+        },
+      },
+    },
+  },
+  'should handle INSIGHTS_SYNC_SETTING_SET': {
+    action: {
+      type: INSIGHTS_SYNC_SETTING_SET,
+      payload: {
+        settings: {
+          insightsSyncEnabled: true,
+        },
+      },
+    },
+  },
+};
+
+describe('InsightsSettings reducer', () =>
+  testReducerSnapshotWithFixtures(reducer, fixtures));

data/webpack/InsightsCloudSync/Components/InsightsSettings/__tests__/InsightsSettingsSelectors.test.js

@@ -0,0 +1,21 @@
+import { testSelectorsSnapshotWithFixtures } from '@theforeman/test';
+import {
+  selectSettings,
+  selectInsightsSyncEnabled,
+} from '../InsightsSettingsSelectors';
+import { insightsStateWrapper } from '../../../../ForemanRhCloudTestHelpers';
+
+const state = insightsStateWrapper({
+  settings: {
+    insightsSyncEnabled: true,
+  },
+});
+
+const fixtures = {
+  'should return insights sync settings': () => selectSettings(state),
+  'should return insightsSyncEnabled setting': () =>
+    selectInsightsSyncEnabled(state),
+};
+
+describe('InsightsSettings selectors', () =>
+  testSelectorsSnapshotWithFixtures(fixtures));

data/webpack/InsightsCloudSync/Components/InsightsSettings/__tests__/__snapshots__/InsightsSettings.test.js.snap

@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsSettings rendering render without Props 1`] = `
+<div
+  className="insights_settings"
+>
+  <h3>
+    Settings
+  </h3>
+  <InsightsSyncSwitcher
+    insightsSyncEnabled={false}
+    setInsightsSyncEnabled={[Function]}
+  />
+</div>
+`;

data/webpack/InsightsCloudSync/Components/InsightsSettings/__tests__/__snapshots__/InsightsSettingsActions.test.js.snap

@@ -0,0 +1,65 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsSettings actions should generate INSIGHTS_SYNC_SETTING_SET action 1`] = `
+Array [
+  Array [
+    Object {
+      "payload": Object {
+        "settings": Object {
+          "insightsSyncEnabled": true,
+        },
+      },
+      "type": "INSIGHTS_SYNC_SETTING_SET",
+    },
+  ],
+]
+`;
+
+exports[`InsightsSettings actions should generate INSIGHTS_SYNC_SETTINGS_GET_SUCCESS action 1`] = `
+Array [
+  Array [
+    Object {
+      "payload": Object {
+        "settings": Object {
+          "insightsSyncEnabled": true,
+        },
+      },
+      "type": "INSIGHTS_SYNC_SETTINGS_GET_SUCCESS",
+    },
+  ],
+]
+`;
+
+exports[`InsightsSettings actions should handle getInsightsSyncSettings with error  1`] = `
+Array [
+  Array [
+    Object {
+      "payload": Object {
+        "message": Object {
+          "message": "Network error!",
+          "sticky": true,
+          "type": "error",
+        },
+      },
+      "type": "TOASTS_ADD",
+    },
+  ],
+]
+`;
+
+exports[`InsightsSettings actions should handle setInsightsSyncEnabled with error  1`] = `
+Array [
+  Array [
+    Object {
+      "payload": Object {
+        "message": Object {
+          "message": "Network error!",
+          "sticky": true,
+          "type": "error",
+        },
+      },
+      "type": "TOASTS_ADD",
+    },
+  ],
+]
+`;

data/webpack/InsightsCloudSync/Components/InsightsSettings/__tests__/__snapshots__/InsightsSettingsReducer.test.js.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsSettings reducer should handle INSIGHTS_SYNC_SETTING_SET 1`] = `
+Object {
+  "insightsSyncEnabled": true,
+}
+`;
+
+exports[`InsightsSettings reducer should handle INSIGHTS_SYNC_SETTINGS_GET_SUCCESS 1`] = `
+Object {
+  "insightsSyncEnabled": true,
+}
+`;
+
+exports[`InsightsSettings reducer should return the initial state 1`] = `
+Object {
+  "insightsSyncEnabled": false,
+}
+`;

data/webpack/InsightsCloudSync/Components/InsightsSettings/__tests__/__snapshots__/InsightsSettingsSelectors.test.js.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsSettings selectors should return insights sync settings 1`] = `
+Object {
+  "insightsSyncEnabled": true,
+}
+`;
+
+exports[`InsightsSettings selectors should return insightsSyncEnabled setting 1`] = `true`;

data/webpack/InsightsCloudSync/Components/InsightsSettings/index.js

@@ -0,0 +1,21 @@
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+
+import InsightsSettings from './InsightsSettings';
+import { selectInsightsSyncEnabled } from './InsightsSettingsSelectors';
+import * as actions from './InsightsSettingsActions';
+import reducer from './InsightsSettingsReducer';
+
+// map state to props
+const mapStateToProps = state => ({
+  insightsSyncEnabled: selectInsightsSyncEnabled(state),
+});
+
+// map action dispatchers to props
+const mapDispatchToProps = dispatch => bindActionCreators(actions, dispatch);
+
+// export connected component
+export default connect(mapStateToProps, mapDispatchToProps)(InsightsSettings);
+
+// export reducers
+export const reducers = { settings: reducer };

data/webpack/InsightsCloudSync/Components/InsightsSettings/insightsSettings.scss

@@ -0,0 +1,16 @@
+.insights_settings {
+  border: 1px solid #ededed;
+  border-radius: 4px;
+  padding: 10px;
+  margin-bottom: 15px;
+  float: right;
+
+  h3 {
+    margin-top: 0;
+    font-weight: 600;
+  }
+
+  .bootstrap-switch {
+    float: right;
+  }
+}

data/webpack/InsightsCloudSync/Components/InsightsSyncSwitcher/InsightsSyncSwitcher.fixtures.js

@@ -0,0 +1 @@
+export const handleToggleResponse = { data: { insightsSyncEnabled: true } };

data/webpack/InsightsCloudSync/Components/InsightsSyncSwitcher/InsightsSyncSwitcher.js

@@ -0,0 +1,45 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { Switch, FieldLevelHelp } from 'patternfly-react';
+import { translate as __ } from 'foremanReact/common/I18n';
+import './insightsSyncSwitcher.scss';
+
+class InsightsSyncSwitcher extends Component {
+  handleToggle = () => {
+    const { insightsSyncEnabled, setInsightsSyncEnabled } = this.props;
+
+    const toggledInsightsSyncEnabled = !insightsSyncEnabled;
+    setInsightsSyncEnabled(toggledInsightsSyncEnabled);
+  };
+
+  render() {
+    const { insightsSyncEnabled } = this.props;
+
+    return (
+      <div className="insights_sync_switcher">
+        <span>Synchronize Automatically</span>
+        <FieldLevelHelp
+          content={__(
+            'Enable automatic synchronization of Insights recommendations from the Red Hat cloud'
+          )}
+        />
+        <Switch
+          size="mini"
+          value={insightsSyncEnabled}
+          onChange={this.handleToggle}
+        />
+      </div>
+    );
+  }
+}
+
+InsightsSyncSwitcher.propTypes = {
+  insightsSyncEnabled: PropTypes.bool,
+  setInsightsSyncEnabled: PropTypes.func.isRequired,
+};
+
+InsightsSyncSwitcher.defaultProps = {
+  insightsSyncEnabled: true,
+};
+
+export default InsightsSyncSwitcher;

data/webpack/InsightsCloudSync/Components/InsightsSyncSwitcher/__tests__/InsightsSyncSwitcher.test.js

@@ -0,0 +1,17 @@
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
+import { noop } from 'patternfly-react';
+
+import InsightsSyncSwitcher from '../InsightsSyncSwitcher';
+
+const fixtures = {
+  'render with props': {
+    insightsSyncEnabled: true,
+    setInsightsSyncEnabled: noop,
+  },
+  /** fixtures, props for the component */
+};
+
+describe('InsightsSyncSwitcher', () => {
+  describe('rendering', () =>
+    testComponentSnapshotsWithFixtures(InsightsSyncSwitcher, fixtures));
+});

data/webpack/InsightsCloudSync/Components/InsightsSyncSwitcher/__tests__/__snapshots__/InsightsSyncSwitcher.test.js.snap

@@ -0,0 +1,38 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsSyncSwitcher rendering render with props 1`] = `
+<div
+  className="insights_sync_switcher"
+>
+  <span>
+    Synchronize Automatically
+  </span>
+  <FieldLevelHelp
+    buttonClass=""
+    content="Enable automatic synchronization of Insights recommendations from the Red Hat cloud"
+    placement="top"
+    rootClose={true}
+  />
+  <Switch
+    animate={true}
+    baseClass="bootstrap-switch"
+    bsSize={null}
+    defaultValue={true}
+    disabled={false}
+    handleWidth="auto"
+    inverse={false}
+    labelText=" "
+    labelWidth="auto"
+    offColor="default"
+    offText="OFF"
+    onChange={[Function]}
+    onColor="primary"
+    onText="ON"
+    readonly={false}
+    size="mini"
+    tristate={false}
+    value={true}
+    wrapperClass="wrapper"
+  />
+</div>
+`;

data/webpack/InsightsCloudSync/Components/InsightsSyncSwitcher/index.js

@@ -0,0 +1 @@
+export { default } from './InsightsSyncSwitcher';

data/webpack/InsightsCloudSync/Components/InsightsSyncSwitcher/insightsSyncSwitcher.scss

@@ -0,0 +1,3 @@
+.insights_sync_switcher {
+  margin-bottom: 5px;
+}

data/webpack/InsightsCloudSync/InsightsCloudSync.js

@@ -2,18 +2,48 @@ import React from 'react';
 import { IntlProvider } from 'react-intl';
 import PropTypes from 'prop-types';
 import { translate as __ } from 'foremanReact/common/I18n';
-import { Button } from 'patternfly-react';
+import { Button, Icon } from 'patternfly-react';
 import { INSIGHTS_SYNC_PAGE_TITLE } from './InsightsCloudSyncConstants';
+import InsightsSettings from './Components/InsightsSettings';
 
-const InsightsCloudSync = ({ syncInsights }) => {
+const InsightsCloudSync = ({ settingsUrl, syncInsights }) => {
   document.title = INSIGHTS_SYNC_PAGE_TITLE;
   return (
     <IntlProvider locale={navigator.language}>
       <div className="insights-cloud-sync">
         <h1>{__('Red Hat Insights Sync')}</h1>
-        <Button bsStyle="primary" onClick={syncInsights}>
-          {__('Sync now')}
-        </Button>
+        <div className="insights-cloud-sync-body">
+          <InsightsSettings />
+          <p>
+            {__(`Insights synchronization process is used to provide Insights
+             recommendations output for hosts managed here`)}
+          </p>
+          <p>
+            {__(`1. Obtain an RHSM API token: `)}
+            <a
+              href="https://access.redhat.com/management/api"
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              access.redhat.com <Icon name="external-link" size="xs" />
+            </a>
+            <br />
+            {__("2. Copy the token to 'Red Hat Cloud token' setting: ")}
+            <a href={settingsUrl} target="_blank" rel="noopener noreferrer">
+              {__('Red Hat Cloud token ')}
+              <Icon name="external-link" size="xs" />
+            </a>
+            <br />
+            {__(
+              '3. Now you can synchronize recommendations manually using the "Sync now" button.'
+            )}
+          </p>
+          <div>
+            <Button bsStyle="primary" onClick={syncInsights}>
+              {__('Sync now')}
+            </Button>
+          </div>
+        </div>
       </div>
     </IntlProvider>
   );
@@ -21,6 +51,7 @@ const InsightsCloudSync = ({ syncInsights }) => {
 
 InsightsCloudSync.propTypes = {
   syncInsights: PropTypes.func.isRequired,
+  settingsUrl: PropTypes.string.isRequired,
 };
 
 export default InsightsCloudSync;

data/webpack/InsightsCloudSync/InsightsCloudSync.test.js

@@ -6,6 +6,7 @@ import InsightsCloudSync from './InsightsCloudSync';
 const fixtures = {
   render: {
     syncInsights: noop,
+    settingsUrl: 'www.example.com/settings',
   },
 };
 

data/webpack/InsightsCloudSync/InsightsCloudSyncActions.js

@@ -1,9 +1,7 @@
 import API from 'foremanReact/API';
+import { addToast } from 'foremanReact/redux/actions/toasts';
 import { insightsCloudUrl } from './InsightsCloudSyncHelpers';
-import {
-  INSIGHTS_CLOUD_SYNC_SUCCESS,
-  INSIGHTS_CLOUD_SYNC_FAILURE,
-} from './InsightsCloudSyncConstants';
+import { INSIGHTS_CLOUD_SYNC_SUCCESS } from './InsightsCloudSyncConstants';
 
 export const syncInsights = () => async dispatch => {
   try {
@@ -12,12 +10,13 @@ export const syncInsights = () => async dispatch => {
       type: INSIGHTS_CLOUD_SYNC_SUCCESS,
       payload: {},
     });
-  } catch (error) {
-    dispatch({
-      type: INSIGHTS_CLOUD_SYNC_FAILURE,
-      payload: {
-        error: error.message,
-      },
-    });
+  } catch ({ message }) {
+    dispatch(
+      addToast({
+        sticky: true,
+        type: 'error',
+        message,
+      })
+    );
   }
 };

data/webpack/InsightsCloudSync/InsightsCloudSyncConstants.js

@@ -1,6 +1,4 @@
 import { translate as __ } from 'foremanReact/common/I18n';
 
 export const INSIGHTS_CLOUD_SYNC_SUCCESS = 'INSIGHTS_CLOUD_SYNC_SUCCESS';
-export const INSIGHTS_CLOUD_SYNC_FAILURE = 'INSIGHTS_CLOUD_SYNC_FAILURE';
-
 export const INSIGHTS_SYNC_PAGE_TITLE = __('Red Hat Insights cloud sync');

data/webpack/InsightsCloudSync/InsightsCloudSyncReducers.js

@@ -1,3 +1,8 @@
-const reducers = {};
+import { combineReducers } from 'redux';
+import { reducers as settingsReducers } from './Components/InsightsSettings';
 
-export default reducers;
+export default {
+  InsightsCloudSync: combineReducers({
+    ...settingsReducers,
+  }),
+};