foreman_rh_cloud 0.9.8 → 0.9.13

data/webpack/InsightsHostDetailsTab/InsightsTab.scss

@@ -0,0 +1,86 @@
+#host_details_insights_react_container {
+  #btn_toolbar {
+    float: right;
+  }
+
+  #btn_fullscreen {
+    margin-left: 5px;
+
+    .fa-arrows-alt {
+      margin-left: 5px;
+    }
+  }
+
+  h2 {
+    margin-top: 5px;
+  }
+
+  #hits_list {
+    max-height: 650px;
+    overflow-y: scroll;
+    overflow-x: hidden;
+    margin-top: 15px;
+
+    .list-view-pf-expand {
+      padding: 0;
+    }
+
+    .list-group-item-header {
+      .list-view-pf-expand .fa-angle-right {
+        margin-top: 6px;
+      }
+
+      .list-view-pf-main-info .list-view-pf-description {
+        width: 83%;
+
+        .list-group-item-heading {
+          width: 375px;
+        }
+
+        p {
+          margin: 0;
+          font-size: 14px;
+        }
+      }
+
+      .list-view-pf-additional-info {
+        .risk-label {
+          padding: 5px 8px;
+          border-radius: 12px;
+
+          &.Low {
+            background-color: #e7f1fa;
+          }
+
+          &.Moderate {
+            background-color: #fdf7e7;
+          }
+
+          &.Important {
+            background-color: #f9dddd;
+          }
+
+          &.Critical {
+            background-color: #ffecec;
+          }
+
+          p {
+            margin: 0;
+          }
+        }
+      }
+    }
+
+    &::-webkit-scrollbar {
+      width: 12px;
+      height: 12px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: #0e0e0e6e;
+      border-radius: 6px;
+      border: 3px solid transparent;
+      background-clip: content-box;
+    }
+  }
+}

data/webpack/InsightsHostDetailsTab/InsightsTabActions.js

@@ -0,0 +1,31 @@
+import API from 'foremanReact/API';
+import { addToast } from 'foremanReact/redux/actions/toasts';
+import { insightsCloudUrl } from '../InsightsCloudSync/InsightsCloudSyncHelpers';
+import {
+  INSIGHTS_HITS_REQUEST,
+  INSIGHTS_HITS_SUCCESS,
+} from './InsightsTabConstants';
+
+export const fetchHits = hostID => async dispatch => {
+  try {
+    dispatch({
+      type: INSIGHTS_HITS_REQUEST,
+      payload: {},
+    });
+    const {
+      data: { hits },
+    } = await API.get(insightsCloudUrl(`hits/${hostID}`));
+    dispatch({
+      type: INSIGHTS_HITS_SUCCESS,
+      payload: { hits },
+    });
+  } catch ({ message }) {
+    dispatch(
+      addToast({
+        sticky: true,
+        type: 'error',
+        message,
+      })
+    );
+  }
+};

data/webpack/InsightsHostDetailsTab/InsightsTabConstants.js

@@ -0,0 +1,2 @@
+export const INSIGHTS_HITS_REQUEST = 'INSIGHTS_HITS_REQUEST';
+export const INSIGHTS_HITS_SUCCESS = 'INSIGHTS_HITS_SUCCESS';

data/webpack/InsightsHostDetailsTab/InsightsTabReducer.js

@@ -0,0 +1,19 @@
+import Immutable from 'seamless-immutable';
+import { INSIGHTS_HITS_SUCCESS } from './InsightsTabConstants';
+
+const initialState = Immutable({
+  hits: [],
+});
+
+export default (state = initialState, action) => {
+  const { payload: { hits } = {} } = action;
+
+  switch (action.type) {
+    case INSIGHTS_HITS_SUCCESS:
+      return state.merge({
+        hits,
+      });
+    default:
+      return state;
+  }
+};

data/webpack/InsightsHostDetailsTab/InsightsTabSelectors.js

@@ -0,0 +1,3 @@
+import { selectHostInsights } from '../ForemanRhCloudSelectors';
+
+export const selectHits = state => selectHostInsights(state).hits;

data/webpack/InsightsHostDetailsTab/__tests__/InsightsTab.fixtures.js

@@ -0,0 +1,25 @@
+export const hostID = 1234;
+
+export const hits = [
+  {
+    insights_hit: {
+      hostname: 'my-host.example.com',
+      rhel_version: '7.8',
+      uuid: '4739b323-a343-4e89-b71b-81991b8dc656',
+      last_seen: '2020-08-19T04:43:09.068706Z',
+      title:
+        'New Ansible Engine packages are inaccessible when dedicated Ansible repo is not enabled',
+      solution_url: 'https://access.redhat.com/node/3359651',
+      total_risk: 2,
+      likelihood: 2,
+      publish_date: '2018-04-16T10:03:16Z',
+      results_url:
+        'https://cloud.redhat.com/insights/advisor/recommendations/ansible_deprecated_repo%7CANSIBLE_DEPRECATED_REPO/4739b323-a343-4e89-b71b-81991b8dc656/',
+    },
+  },
+];
+
+export const props = {
+  hostID,
+  hits,
+};

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

@@ -0,0 +1,13 @@
+import { testComponentSnapshotsWithFixtures } from 'react-redux-test-utils';
+
+import InsightsTab from '../InsightsTab';
+import { props } from './InsightsTab.fixtures';
+
+const fixtures = {
+  'render with props': props,
+};
+
+describe('InsightsTab', () => {
+  describe('rendering', () =>
+    testComponentSnapshotsWithFixtures(InsightsTab, fixtures));
+});

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

@@ -0,0 +1,19 @@
+import { testActionSnapshotWithFixtures } from 'react-redux-test-utils';
+import API from 'foremanReact/API';
+import { fetchHits } from '../InsightsTabActions';
+import { hostID, hits } from './InsightsTab.fixtures';
+
+jest.mock('foremanReact/API');
+API.get.mockImplementation(async () => ({ data: { hits } }));
+
+const fixtures = {
+  'should fetchHits': () => fetchHits(hostID),
+  'should fetchHits with error': () => {
+    API.get.mockImplementationOnce(() =>
+      Promise.reject(new Error('Network error!'))
+    );
+    return fetchHits(hostID);
+  },
+};
+
+describe('InsightsTab actions', () => testActionSnapshotWithFixtures(fixtures));

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

@@ -0,0 +1,17 @@
+import React from 'react';
+import { IntegrationTestHelper } from 'react-redux-test-utils';
+
+import InsightsTab from '../index';
+import reducers from '../../ForemanRhCloudReducers';
+import { hostID } from './InsightsTab.fixtures';
+
+describe('InsightsTab integration test', () => {
+  it('should flow', async () => {
+    const integrationTestHelper = new IntegrationTestHelper(reducers);
+    const component = integrationTestHelper.mount(
+      <InsightsTab hostID={hostID} />
+    );
+    component.update();
+    /** Create a Flow test */
+  });
+});

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

@@ -0,0 +1,26 @@
+import { testReducerSnapshotWithFixtures } from 'react-redux-test-utils';
+import reducer from '../InsightsTabReducer';
+import { hits } from './InsightsTab.fixtures';
+import {
+  INSIGHTS_HITS_REQUEST,
+  INSIGHTS_HITS_SUCCESS,
+} from '../InsightsTabConstants';
+
+const fixtures = {
+  'should return the initial state': {},
+  'should handle INSIGHTS_HITS_REQUEST': {
+    action: {
+      type: INSIGHTS_HITS_REQUEST,
+      payload: {},
+    },
+  },
+  'should handle INSIGHTS_HITS_SUCCESS': {
+    action: {
+      type: INSIGHTS_HITS_SUCCESS,
+      payload: { hits },
+    },
+  },
+};
+
+describe('AccountList reducer', () =>
+  testReducerSnapshotWithFixtures(reducer, fixtures));

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

@@ -0,0 +1,13 @@
+import { testSelectorsSnapshotWithFixtures } from 'react-redux-test-utils';
+import { hostInsightsStateWrapper } from '../../ForemanRhCloudTestHelpers';
+import { hits } from './InsightsTab.fixtures';
+import { selectHits } from '../InsightsTabSelectors';
+
+const state = hostInsightsStateWrapper({ hits });
+
+const fixtures = {
+  'should return hits': () => selectHits(state),
+};
+
+describe('InsightsTab selectors', () =>
+  testSelectorsSnapshotWithFixtures(fixtures));

data/webpack/InsightsHostDetailsTab/__tests__/__snapshots__/InsightsTab.test.js.snap

@@ -0,0 +1,30 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsTab rendering render with props 1`] = `
+<Row
+  bsClass="row"
+  componentClass="div"
+>
+  <Col
+    bsClass="col"
+    componentClass="div"
+    xs={12}
+  >
+    <h2>
+      Recommendations
+    </h2>
+    <ListView
+      className=""
+      id="hits_list"
+    >
+      <ListItem
+        key="0"
+        resultsUrl="https://cloud.redhat.com/insights/advisor/recommendations/ansible_deprecated_repo%7CANSIBLE_DEPRECATED_REPO/4739b323-a343-4e89-b71b-81991b8dc656/"
+        solutionUrl="https://access.redhat.com/node/3359651"
+        title="New Ansible Engine packages are inaccessible when dedicated Ansible repo is not enabled"
+        totalRisk={2}
+      />
+    </ListView>
+  </Col>
+</Row>
+`;

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

@@ -0,0 +1,58 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsTab actions should fetchHits 1`] = `
+Array [
+  Array [
+    Object {
+      "payload": Object {},
+      "type": "INSIGHTS_HITS_REQUEST",
+    },
+  ],
+  Array [
+    Object {
+      "payload": Object {
+        "hits": Array [
+          Object {
+            "insights_hit": Object {
+              "hostname": "my-host.example.com",
+              "last_seen": "2020-08-19T04:43:09.068706Z",
+              "likelihood": 2,
+              "publish_date": "2018-04-16T10:03:16Z",
+              "results_url": "https://cloud.redhat.com/insights/advisor/recommendations/ansible_deprecated_repo%7CANSIBLE_DEPRECATED_REPO/4739b323-a343-4e89-b71b-81991b8dc656/",
+              "rhel_version": "7.8",
+              "solution_url": "https://access.redhat.com/node/3359651",
+              "title": "New Ansible Engine packages are inaccessible when dedicated Ansible repo is not enabled",
+              "total_risk": 2,
+              "uuid": "4739b323-a343-4e89-b71b-81991b8dc656",
+            },
+          },
+        ],
+      },
+      "type": "INSIGHTS_HITS_SUCCESS",
+    },
+  ],
+]
+`;
+
+exports[`InsightsTab actions should fetchHits with error 1`] = `
+Array [
+  Array [
+    Object {
+      "payload": Object {},
+      "type": "INSIGHTS_HITS_REQUEST",
+    },
+  ],
+  Array [
+    Object {
+      "payload": Object {
+        "message": Object {
+          "message": "Network error!",
+          "sticky": true,
+          "type": "error",
+        },
+      },
+      "type": "TOASTS_ADD",
+    },
+  ],
+]
+`;

data/webpack/InsightsHostDetailsTab/__tests__/__snapshots__/InsightsTabReducer.test.js.snap

@@ -0,0 +1,34 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`AccountList reducer should handle INSIGHTS_HITS_REQUEST 1`] = `
+Object {
+  "hits": Array [],
+}
+`;
+
+exports[`AccountList reducer should handle INSIGHTS_HITS_SUCCESS 1`] = `
+Object {
+  "hits": Array [
+    Object {
+      "insights_hit": Object {
+        "hostname": "my-host.example.com",
+        "last_seen": "2020-08-19T04:43:09.068706Z",
+        "likelihood": 2,
+        "publish_date": "2018-04-16T10:03:16Z",
+        "results_url": "https://cloud.redhat.com/insights/advisor/recommendations/ansible_deprecated_repo%7CANSIBLE_DEPRECATED_REPO/4739b323-a343-4e89-b71b-81991b8dc656/",
+        "rhel_version": "7.8",
+        "solution_url": "https://access.redhat.com/node/3359651",
+        "title": "New Ansible Engine packages are inaccessible when dedicated Ansible repo is not enabled",
+        "total_risk": 2,
+        "uuid": "4739b323-a343-4e89-b71b-81991b8dc656",
+      },
+    },
+  ],
+}
+`;
+
+exports[`AccountList reducer should return the initial state 1`] = `
+Object {
+  "hits": Array [],
+}
+`;

data/webpack/InsightsHostDetailsTab/__tests__/__snapshots__/InsightsTabSelectors.test.js.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InsightsTab selectors should return hits 1`] = `
+Array [
+  Object {
+    "insights_hit": Object {
+      "hostname": "my-host.example.com",
+      "last_seen": "2020-08-19T04:43:09.068706Z",
+      "likelihood": 2,
+      "publish_date": "2018-04-16T10:03:16Z",
+      "results_url": "https://cloud.redhat.com/insights/advisor/recommendations/ansible_deprecated_repo%7CANSIBLE_DEPRECATED_REPO/4739b323-a343-4e89-b71b-81991b8dc656/",
+      "rhel_version": "7.8",
+      "solution_url": "https://access.redhat.com/node/3359651",
+      "title": "New Ansible Engine packages are inaccessible when dedicated Ansible repo is not enabled",
+      "total_risk": 2,
+      "uuid": "4739b323-a343-4e89-b71b-81991b8dc656",
+    },
+  },
+]
+`;

data/webpack/InsightsHostDetailsTab/components/ListItem/ListItem.js

@@ -0,0 +1,69 @@
+import React, { Fragment } from 'react';
+import { ListView, Icon } from 'patternfly-react';
+import PropTypes from 'prop-types';
+
+const labelMapper = {
+  1: 'Low',
+  2: 'Moderate',
+  3: 'Important',
+  4: 'Critical',
+};
+
+const ListItem = ({ title, totalRisk, resultsUrl, solutionUrl }) => {
+  const heading = (
+    <p className="ellipsis list-item-heading" title={title}>
+      {title}
+    </p>
+  );
+
+  const riskLabel = labelMapper[totalRisk];
+  const additionalInfo = [
+    <span key={`risk-info-${title}`} className={`risk-label ${riskLabel}`}>
+      <p>{riskLabel}</p>
+    </span>,
+  ];
+
+  const knowledgebaseLink = solutionUrl && (
+    <p>
+      <a href={solutionUrl} target="_blank" rel="noopener noreferrer">
+        Knowledgebase article <Icon name="external-link" />
+      </a>
+    </p>
+  );
+
+  const insightsCloudLink = resultsUrl && (
+    <p>
+      <a href={resultsUrl} target="_blank" rel="noopener noreferrer">
+        Read more about it in RH cloud insights <Icon name="external-link" />
+      </a>
+    </p>
+  );
+
+  return (
+    <ListView.Item
+      heading={heading}
+      additionalInfo={additionalInfo}
+      hideCloseIcon
+    >
+      <Fragment>
+        <p>{title}</p>
+        {knowledgebaseLink}
+        {insightsCloudLink}
+      </Fragment>
+    </ListView.Item>
+  );
+};
+
+ListItem.propTypes = {
+  title: PropTypes.string.isRequired,
+  totalRisk: PropTypes.number.isRequired,
+  resultsUrl: PropTypes.string,
+  solutionUrl: PropTypes.string,
+};
+
+ListItem.defaultProps = {
+  resultsUrl: '',
+  solutionUrl: '',
+};
+
+export default ListItem;