foreman_rh_cloud 3.0.14 → 3.0.15

data/webpack/InsightsCloudSync/InsightsCloudSync.test.js

@@ -1,12 +1,20 @@
 import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
 import { noop } from 'patternfly-react';
-
 import InsightsCloudSync from './InsightsCloudSync';
 
 const fixtures = {
   render: {
+    status: 'RESOLVED',
+    syncInsights: noop,
+    fetchInsights: noop,
+    query: '',
+    hasToken: true,
+  },
+  'render no token': {
+    status: 'RESOLVED',
     syncInsights: noop,
-    settingsUrl: 'www.example.com/settings',
+    fetchInsights: noop,
+    hasToken: false,
   },
 };
 

data/webpack/InsightsCloudSync/InsightsCloudSyncActions.js

@@ -1,4 +1,4 @@
-import API from 'foremanReact/API';
+import { API } from 'foremanReact/redux/API';
 import { addToast } from 'foremanReact/redux/actions/toasts';
 import { insightsCloudUrl } from './InsightsCloudSyncHelpers';
 import { INSIGHTS_CLOUD_SYNC_SUCCESS } from './InsightsCloudSyncConstants';

data/webpack/InsightsCloudSync/InsightsCloudSyncConstants.js

@@ -1,4 +1,18 @@
 import { translate as __ } from 'foremanReact/common/I18n';
+import { getControllerSearchProps } from 'foremanReact/constants';
+import { foremanUrl } from '../ForemanRhCloudHelpers';
 
 export const INSIGHTS_CLOUD_SYNC_SUCCESS = 'INSIGHTS_CLOUD_SYNC_SUCCESS';
-export const INSIGHTS_SYNC_PAGE_TITLE = __('Red Hat Insights cloud sync');
+
+export const INSIGHTS_SYNC_PAGE_TITLE = __('Red Hat Insights');
+
+export const INSIGHTS_PATH = foremanUrl('/foreman_rh_cloud/insights_cloud');
+
+export const INSIGHTS_SAVE_AND_SYNC_PATH = foremanUrl(
+  '/insights_cloud/save_token_and_sync'
+);
+
+export const INSIGHTS_SEARCH_PROPS = {
+  ...getControllerSearchProps('/insights_cloud/hits'),
+  controller: 'insights_hits',
+};

data/webpack/InsightsCloudSync/InsightsCloudSyncHelpers.js

@@ -1,3 +1,10 @@
+import URI from 'urijs';
 import { foremanUrl } from '../ForemanRhCloudHelpers';
 
 export const insightsCloudUrl = path => foremanUrl(`/insights_cloud/${path}`);
+
+export const cloudTokenSettingUrl = () => {
+  const settingsUrl = new URI(foremanUrl('/settings'));
+  settingsUrl.setSearch({ search: 'name = rh_cloud_token' });
+  return settingsUrl.toString();
+};

data/webpack/InsightsCloudSync/InsightsCloudSyncReducers.js

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

data/webpack/InsightsCloudSync/__snapshots__/InsightsCloudSync.test.js.snap

@@ -1,67 +1,50 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`InsightsCloudSync render 1`] = `
-<IntlProvider
-  locale="en-US"
->
-  <div
-    className="insights-cloud-sync"
-  >
-    <h1>
-      Red Hat Insights Sync
-    </h1>
-    <div
-      className="insights-cloud-sync-body"
+<PageLayout
+  beforeToolbarComponent={<InsightsHeader />}
+  header="Red Hat Insights"
+  onSearch={[Function]}
+  searchProps={
+    Object {
+      "autocomplete": Object {
+        "id": "searchBar",
+        "searchQuery": "",
+        "url": "/insights_cloud/hits/auto_complete_search",
+        "useKeyShortcuts": true,
+      },
+      "bookmarks": Object {
+        "canCreateBookmarks": true,
+        "documentationUrl": "4.1.5Searching",
+        "url": "/api/bookmarks",
+      },
+      "controller": "insights_hits",
+    }
+  }
+  searchQuery=""
+  searchable={true}
+  toolbarButtons={
+    <Button
+      active={false}
+      block={false}
+      bsClass="btn"
+      bsStyle="primary"
+      disabled={false}
+      onClick={[Function]}
     >
-      <Connect(InsightsSettings) />
-      <p>
-        Insights synchronization process is used to provide Insights
-             recommendations output for hosts managed here
-      </p>
-      <p>
-        1. Obtain an Red Hat API token: 
-        <a
-          href="https://access.redhat.com/management/api"
-          rel="noopener noreferrer"
-          target="_blank"
-        >
-          access.redhat.com 
-          <Icon
-            name="external-link"
-            size="xs"
-            type="fa"
-          />
-        </a>
-        <br />
-        2. Copy the token to 'Red Hat Cloud token' setting: 
-        <a
-          href="www.example.com/settings"
-          rel="noopener noreferrer"
-          target="_blank"
-        >
-          Red Hat Cloud token 
-          <Icon
-            name="external-link"
-            size="xs"
-            type="fa"
-          />
-        </a>
-        <br />
-        3. Now you can synchronize recommendations manually using the "Sync now" button.
-      </p>
-      <div>
-        <Button
-          active={false}
-          block={false}
-          bsClass="btn"
-          bsStyle="primary"
-          disabled={false}
-          onClick={[Function]}
-        >
-          Sync now
-        </Button>
-      </div>
-    </div>
-  </div>
-</IntlProvider>
+      Sync now
+    </Button>
+  }
+>
+  <Connect(InsightsTable) />
+</PageLayout>
+`;
+
+exports[`InsightsCloudSync render no token 1`] = `
+<PageLayout
+  header="Red Hat Insights"
+  searchable={false}
+>
+  <NoTokenEmptyState />
+</PageLayout>
 `;

data/webpack/InsightsCloudSync/index.js

@@ -2,14 +2,22 @@ import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
 import * as actions from './InsightsCloudSyncActions';
+import { fetchInsights } from './Components/InsightsTable/InsightsTableActions';
 import InsightsCloudSync from './InsightsCloudSync';
 import insightsCloudSyncReducers from './InsightsCloudSyncReducers';
-
+import {
+  selectSearch,
+  selectHasToken,
+} from './Components/InsightsTable/InsightsTableSelectors';
 // map state to props
-const mapStateToProps = state => ({});
+const mapStateToProps = state => ({
+  query: selectSearch(state),
+  hasToken: selectHasToken(state),
+});
 
 // map action dispatchers to props
-const mapDispatchToProps = dispatch => bindActionCreators(actions, dispatch);
+const mapDispatchToProps = dispatch =>
+  bindActionCreators({ ...actions, fetchInsights }, dispatch);
 
 // export reducers
 export const reducers = insightsCloudSyncReducers;

data/webpack/InsightsHostDetailsTab/InsightsTabActions.js

@@ -1,4 +1,4 @@
-import API from 'foremanReact/API';
+import { API } from 'foremanReact/redux/API';
 import { addToast } from 'foremanReact/redux/actions/toasts';
 import { insightsCloudUrl } from '../InsightsCloudSync/InsightsCloudSyncHelpers';
 import {

data/webpack/InsightsHostDetailsTab/__tests__/InsightsTabActions.test.js

@@ -1,9 +1,9 @@
 import { testActionSnapshotWithFixtures } from '@theforeman/test';
-import API from 'foremanReact/API';
+import { API } from 'foremanReact/redux/API';
 import { fetchHits } from '../InsightsTabActions';
 import { hostID, hits } from './InsightsTab.fixtures';
 
-jest.mock('foremanReact/API');
+jest.mock('foremanReact/redux/API');
 API.get.mockImplementation(async () => ({ data: { hits } }));
 
 const fixtures = {

data/webpack/__mocks__/foremanReact/Root/Context/ForemanContext.js

@@ -0,0 +1 @@
+export const useForemanSettings = () => ({ perPage: 20 });

data/webpack/__mocks__/foremanReact/constants.js

@@ -3,3 +3,22 @@ export const STATUS = {
   RESOLVED: 'RESOLVED',
   ERROR: 'ERROR',
 };
+
+export const getControllerSearchProps = (
+  controller,
+  id = 'searchBar',
+  canCreateBookmarks = true
+) => ({
+  controller,
+  autocomplete: {
+    id,
+    searchQuery: '',
+    url: `${controller}/auto_complete_search`,
+    useKeyShortcuts: true,
+  },
+  bookmarks: {
+    url: '/api/bookmarks',
+    canCreateBookmarks,
+    documentationUrl: `4.1.5Searching`,
+  },
+});

data/webpack/__mocks__/foremanReact/redux/API/APISelectors.js

@@ -0,0 +1,24 @@
+import { STATUS } from '../../constants';
+
+export const selectAPI = state => state.API;
+
+export const selectAPIByKey = (state, key) => selectAPI(state)[key] || {};
+
+export const selectAPIStatus = (state, key) =>
+  selectAPIByKey(state, key).status;
+
+export const selectAPIPayload = (state, key) =>
+  selectAPIByKey(state, key).payload || {};
+
+export const selectAPIResponse = (state, key) =>
+  selectAPIByKey(state, key).response || {};
+
+export const selectAPIError = (state, key) =>
+  selectAPIStatus(state, key) === STATUS.ERROR
+    ? selectAPIResponse(state, key)
+    : null;
+
+export const selectAPIErrorMessage = (state, key) => {
+  const error = selectAPIError(state, key);
+  return error && error.message;
+};

data/webpack/__mocks__/foremanReact/redux/API/index.js

@@ -0,0 +1,11 @@
+export const get = data => ({ type: 'get-some-type', ...data });
+export const put = data => ({ type: 'put-some-type', ...data });
+export const post = data => ({ type: 'post-some-type', ...data });
+export const patch = data => ({ type: 'patch-some-type', ...data });
+export const API = {
+  get: jest.fn(),
+  put: jest.fn(),
+  post: jest.fn(),
+  delete: jest.fn(),
+  patch: jest.fn(),
+};

data/webpack/__mocks__/foremanReact/routes/RouterSelector.js

@@ -0,0 +1,2 @@
+export const selectRouter = state => state.router;
+export const selectRouterLocation = state => selectRouter(state).location;

data/webpack/__mocks__/foremanReact/routes/common/PageLayout/PageLayout.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const PageLayout = ({ children }) => <div>{children}</div>;
+
+PageLayout.propTypes = {
+  children: PropTypes.node.isRequired,
+};
+
+export default PageLayout;

data/webpack/common/Switcher/HelpLabel.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Popover } from '@patternfly/react-core';
+import { HelpIcon } from '@patternfly/react-icons';
+
+export const HelpLabel = ({ text, id, className }) => {
+  if (!text) return null;
+  return (
+    <Popover id={`${id}-help`} bodyContent={text} aria-label="help-text">
+      <button
+        onClick={e => e.preventDefault()}
+        className={`pf-c-form__group-label-help ${className}`}
+      >
+        <HelpIcon noVerticalAlign />
+      </button>
+    </Popover>
+  );
+};
+
+HelpLabel.propTypes = {
+  id: PropTypes.string.isRequired,
+  text: PropTypes.string,
+  className: PropTypes.string,
+};
+HelpLabel.defaultProps = {
+  text: '',
+  className: '',
+};
+
+export default HelpLabel;

data/webpack/common/Switcher/SwitcherPF4.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Switch } from '@patternfly/react-core';
+import { HelpLabel } from './HelpLabel';
+import './SwitcherPF4.scss';
+
+const SwitcherPF4 = ({ id, label, tooltip, isChecked, onChange }) => (
+  <Switch
+    className="foreman-switcher"
+    id={`rh-cloud-switcher-${id}`}
+    isChecked={isChecked}
+    onChange={onChange}
+    label={
+      <div>
+        {label}
+        <HelpLabel text={tooltip} id={id} className="switcher-help-label" />
+      </div>
+    }
+  />
+);
+
+SwitcherPF4.propTypes = {
+  id: PropTypes.string.isRequired,
+  label: PropTypes.string,
+  tooltip: PropTypes.string,
+  isChecked: PropTypes.bool,
+  onChange: PropTypes.func.isRequired,
+};
+
+SwitcherPF4.defaultProps = {
+  label: null,
+  tooltip: null,
+  isChecked: true,
+};
+
+export default SwitcherPF4;

data/webpack/common/Switcher/SwitcherPF4.scss

@@ -0,0 +1,10 @@
+.rh-cloud-page {
+  label.foreman-switcher {
+    font-weight: 400;
+    margin-bottom: 5px;
+
+    .switcher-help-label {
+      padding-left: 5px;
+    }
+  }
+}

data/webpack/common/Switcher/__tests__/HelpLabel.test.js

@@ -0,0 +1,13 @@
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
+import { HelpLabel } from '../HelpLabel';
+
+const fixtures = {
+  'should return insights cloud Url': {
+    id: 'some-id',
+    text: 'some-text',
+    className: 'some-class',
+  },
+};
+
+describe('InsightsCloudSync helpers', () =>
+  testComponentSnapshotsWithFixtures(HelpLabel, fixtures));

data/webpack/common/Switcher/__tests__/SwitcherPF4.test.js

@@ -0,0 +1,14 @@
+import { testComponentSnapshotsWithFixtures } from '@theforeman/test';
+import SwitcherPF4 from '../SwitcherPF4';
+
+const fixtures = {
+  'should return insights cloud Url': {
+    id: 'some-id',
+    tooltip: 'some-text',
+    label: 'some-label',
+    onChange: jest.fn(),
+  },
+};
+
+describe('InsightsCloudSync helpers', () =>
+  testComponentSnapshotsWithFixtures(SwitcherPF4, fixtures));

data/webpack/common/Switcher/__tests__/__snapshots__/HelpLabel.test.js.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsCloudSync helpers should return insights cloud Url 1`] = `
+<Popover
+  aria-label="help-text"
+  bodyContent="some-text"
+  id="some-id-help"
+>
+  <button
+    className="pf-c-form__group-label-help some-class"
+    onClick={[Function]}
+  >
+    <HelpIcon
+      color="currentColor"
+      noVerticalAlign={true}
+      size="sm"
+    />
+  </button>
+</Popover>
+`;