feat(api): AffectedSystems are not pulled from engine

RedHatInsights · Oct 11, 2018 · 6d485a0 · 6d485a0
1 parent e337d24
commit 6d485a0
Show file tree

Hide file tree

Showing 8 changed files with 71 additions and 92 deletions.
diff --git a/src/Components/SmartComponents/CVEPage/CVEPage.js b/src/Components/SmartComponents/CVEPage/CVEPage.js
@@ -4,17 +4,20 @@ import propTypes from 'prop-types';
 import React from 'react';
 import { connect } from 'react-redux';
 import { dispatchAction } from '../../../Helpers/MiscHelp';
-import { fetchCveDetails } from '../../../Store/Actions/CVEActions';
-import { sCveDetailsPage } from '../../../Store/Selectors/CVESelectors';
+import { fetchAffectedSystemsByCVE, fetchCveDetails } from '../../../Store/Actions/CVEActions';
+import { sCveDetailsPage, sExposedSystemsTable } from '../../../Store/Selectors/CVESelectors';
 import CVEPageDetails from '../../PresentationalComponents/CVEPageDetails/CVEPageDetails';
+import SystemsExposedTable from '../SystemsExposedTable/SystemsExposedTable';
 
 class CVEPage extends React.Component {
     constructor(props) {
         super(props);
     }
 
     componentDidMount() {
-        this.props.fetchCveDetails(this.props.match.params.cve);
+        let cveName = this.props.match.params.cve;
+        this.props.fetchCveDetails(cveName);
+        this.props.fetchAffectedSystems(cveName);
     }
     render() {
         return (
@@ -23,7 +26,9 @@ class CVEPage extends React.Component {
                     <GridItem span={12}>
                         <CVEPageDetails data={this.props.cveDetails} />
                     </GridItem>
-                    <GridItem span={12} />
+                    <GridItem span={12}>
+                        <SystemsExposedTable affectedBy={this.props.cveTableRows} />
+                    </GridItem>
                 </Grid>
             </React.Fragment>
         );
@@ -32,13 +37,15 @@ class CVEPage extends React.Component {
 
 function mapStateToProps(state) {
     return {
-        cveDetails: sCveDetailsPage(state)
+        cveDetails: sCveDetailsPage(state),
+        cveTableRows: sExposedSystemsTable(state)
     };
 }
 
 const mapDispatchToProps = dispatch => {
     return {
-        fetchCveDetails: cveName => dispatchAction(fetchCveDetails(cveName), dispatch)
+        fetchCveDetails: cveName => dispatchAction(fetchCveDetails(cveName), dispatch),
+        fetchAffectedSystems: cveName => dispatchAction(fetchAffectedSystemsByCVE(cveName), dispatch)
     };
 };
 

diff --git a/src/Components/SmartComponents/SystemsExposedTable/SystemsExposedTable.js b/src/Components/SmartComponents/SystemsExposedTable/SystemsExposedTable.js
@@ -1,12 +1,9 @@
-import React from 'react';
-import './SystemsExposedTable.scss';
-import { Table, Pagination, Ansible, routerParams } from '@red-hat-insights/insights-frontend-components';
-import { connect } from 'react-redux';
-import { fetchCVEsWithSystems } from '../../../Store/Actions/CVEActions';
-import { sExposedSystemsTable } from '../../../Store/Selectors/CVESelectors';
+import { Alert, Badge, Button, Grid, GridItem } from '@patternfly/react-core';
+import { Ansible, Pagination, Table } from '@red-hat-insights/insights-frontend-components';
 import propTypes from 'prop-types';
-import { Grid, GridItem, Button, Badge, Alert } from '@patternfly/react-core';
+import React from 'react';
 import WithLoader from '../../PresentationalComponents/WithLoader/WithLoader';
+import './SystemsExposedTable.scss';
 
 class SystemsExposedTable extends React.Component {
     constructor(props) {
@@ -18,31 +15,28 @@ class SystemsExposedTable extends React.Component {
     }
 
     static getDerivedStateFromProps(props) {
-        return { systemList: props.cveTableRows };
-    }
-
-    componentDidMount() {
-        this.props.fetchData();
+        return { systemList: props.affectedBy.content };
     }
 
     getSelectedCount() {
-        let selected = this.state.systemList.filter(item => item.selected === true);
-        return selected.length;
+        if (this.state.systemList) {
+            let selected = this.state.systemList.filter(item => item.selected === true);
+            return selected.length;
+        }
+
+        return [];
     }
 
     checkItem(key, value) {
         let newList = this.state.systemList;
         newList[key].selected = value;
         this.setState({ systemList: newList });
     }
-    handleRedirect(key) {
-        this.props.history.push('/vulnerabilities/cves/' + this.props.cveTableRows[key].synopsis);
-    }
     render() {
         return (
             <React.Fragment>
                 <Grid gutter="sm">
-                    <WithLoader isLoading={this.props.cve.isLoading}>
+                    <WithLoader isLoading={this.props.affectedBy.isLoading}>
                         <GridItem span={12}>
                             <Alert
                                 variant={this.state.systemList.length === 0 ? 'success' : 'warning'}
@@ -51,7 +45,7 @@ class SystemsExposedTable extends React.Component {
                         </GridItem>
                         <GridItem span={12} style={this.state.systemList.length === 0 ? { display: 'none' } : {}}>
                             <Pagination
-                                numberOfItems={this.props.cveTableRows ? this.props.cveTableRows.length : 1}
+                                numberOfItems={this.state.systemList.length}
                                 itemsPerPage={50}
                             />
                             <Table
@@ -100,29 +94,9 @@ class SystemsExposedTable extends React.Component {
         );
     }
 }
-function mapStateToProps(state) {
-    return {
-        cve: state.CVEStore.cveListWithSystems,
-        cveTableRows: sExposedSystemsTable(state)
-    };
-}
-
-const mapDispatchToProps = dispatch => {
-    return {
-        fetchData: () => dispatch(fetchCVEsWithSystems())
-    };
-};
-
 SystemsExposedTable.propTypes = {
     history: propTypes.object,
-    cveTableRows: propTypes.array,
-    fetchData: propTypes.func,
-    cve: propTypes.object
+    affectedBy: propTypes.object
 };
 
-export default routerParams(
-    connect(
-        mapStateToProps,
-        mapDispatchToProps
-    )(SystemsExposedTable)
-);
+export default SystemsExposedTable;
diff --git a/src/Helpers/APIHelper.js b/src/Helpers/APIHelper.js
@@ -1,4 +1,4 @@
-export function createApiCall(endpoint, method, parser, data = undefined) {
+export function createApiCall(endpoint, method, data = undefined) {
     return fetch('https://localhost:8300' + endpoint, {
         method,
         body: JSON.stringify(data)

diff --git a/src/Helpers/CVE/CVEHelper.js b/src/Helpers/CVE/CVEHelper.js
@@ -1,6 +1,6 @@
+import { ExclamationTriangleIcon, LaptopIcon, LinkIcon } from '@patternfly/react-icons';
+import { Ansible, Battery } from '@red-hat-insights/insights-frontend-components';
 import React from 'react';
-import { Battery, Ansible } from '@red-hat-insights/insights-frontend-components';
-import { LaptopIcon, ExclamationTriangleIcon, LinkIcon } from '@patternfly/react-icons';
 import { createApiCall } from '../APIHelper';
 
 /* global require */
@@ -24,7 +24,12 @@ export function getVMaaSCVEs(apiProps) {
 }
 
 export function getCveDetails(synopsis) {
-    let result = createApiCall('/api/v1/cves/details/' + synopsis, 'get', processRawCVEs);
+    let result = createApiCall('/api/v1/cves/details/' + synopsis, 'get');
+    return result;
+}
+
+export function getAffectedSystemsByCVE(synopsis) {
+    let result = createApiCall('/api/v1/cves/affectedsystems/' + synopsis, 'get');
     return result;
 }
 
@@ -81,31 +86,24 @@ export function createCveWithSystemsTable(cves) {
     return table;
 }
 
-function getAffectedSystems(cve) {
-    let systems = getDemoCVESystem()
-    .filter(item => {
-        return item.cve === cve;
-    })
-    .map(single => single.system);
-    return systems;
-}
-
-export function createExposedSystemsTable(cves) {
-    if (cves.isLoading) {
-        return [];
+export function createExposedSystemsTable(affectedSystems) {
+    let dataSet = affectedSystems.payload;
+    let isLoading = affectedSystems.isLoading;
+    if (!isLoading) {
+        let systemList = affectedSystems.payload;
+        dataSet = systemList.map(system => {
+            let icon = <LaptopIcon size="lg" />;
+            let ansibleIcon = (
+                <a download href="../common/AnsiblePlaybook.yml">
+                    <Ansible />
+                </a>
+            );
+            return { cells: [icon, system.display_name, ansibleIcon] };
+        });
     }
 
-    let singleCve = cves.items[0];
-    let affectedSystems = [...new Set(getAffectedSystems(singleCve.synopsis))];
-    return affectedSystems.map(system => {
-        let icon = <LaptopIcon size="lg" />;
-        let ansibleIcon = (
-            <a download href="../common/AnsiblePlaybook.yml">
-                <Ansible />
-            </a>
-        );
-        return { cells: [icon, system, ansibleIcon] };
-    });
+    dataSet = { content: dataSet, isLoading };
+    return dataSet;
 }
 
 export function createCveDetailsPage(cves) {

diff --git a/src/Store/ActionTypes.js b/src/Store/ActionTypes.js
@@ -1,5 +1,5 @@
 export const FETCH_CVES = 'CVE_FETCH_DATA';
 export const FETCH_CVE_DETAILS = 'CVE_FETCH_DETAILS';
-export const FETCH_CVES_WITH_SYSTEMS = 'CVE_FETCH_DATA_SYSTEMS';
+export const FETCH_AFFECTED_SYSTEMS_BY_CVE = 'CVE_FETCH_AFFECTED_SYSTEMS';
 export const FILTER_CVES = 'CVE_FILTER';
 export const FETCH_CHANGES_SINCE_LAST_LOGIN = 'CHANGES_SINCE_LAST_LOGIN';
diff --git a/src/Store/Actions/CVEActions.js b/src/Store/Actions/CVEActions.js
@@ -1,7 +1,7 @@
-import * as ActionTypes from '../../Store/ActionTypes';
 import * as CVEHelper from '../../Helpers/CVE/CVEHelper';
-import ReducerRegistry from '../../Utilities/ReducerRegistry';
+import * as ActionTypes from '../../Store/ActionTypes';
 import { CVEReducer } from '../../Store/Reducers/CVEStore';
+import ReducerRegistry from '../../Utilities/ReducerRegistry';
 
 ReducerRegistry.register({ CVEStore: CVEReducer });
 
@@ -12,11 +12,11 @@ export const fetchCVEListFromVMaaS = apiProps => ({
     })
 });
 
-export const fetchCVEsWithSystems = apiProps => ({
-    type: ActionTypes.FETCH_CVES_WITH_SYSTEMS,
+export const fetchAffectedSystemsByCVE = apiProps => ({
+    type: ActionTypes.FETCH_AFFECTED_SYSTEMS_BY_CVE,
     payload: new Promise(resolve => {
-        resolve(CVEHelper.getCVEsWithSystems(apiProps));
-    })
+        resolve(CVEHelper.getAffectedSystemsByCVE(apiProps));
+    }).then(result => result)
 });
 
 export const searchCVEs = value => ({

diff --git a/src/Store/Reducers/CVEStore.js b/src/Store/Reducers/CVEStore.js
@@ -1,15 +1,15 @@
-import * as ActionTypes from '../../Store/ActionTypes';
 import Immutable from 'seamless-immutable';
+import * as ActionTypes from '../../Store/ActionTypes';
 
 // Initial State
 const initialState = Immutable({
     cveList: {
         isLoading: true,
         items: {}
     },
-    cveListWithSystems: {
+    affectedSystemsByCVE: {
         isLoading: true,
-        items: []
+        payload: []
     },
     cveDetails: {
         isLoading: true,
@@ -39,13 +39,13 @@ export const CVEReducer = (state = initialState, action) => {
             newState = newState.setIn(['cveDetails', 'isLoading'], false);
             return newState;
 
-        case ActionTypes.FETCH_CVES_WITH_SYSTEMS + '_PENDING':
-            newState = state.setIn(['cveListWithSystems', 'isLoading'], true);
+        case ActionTypes.FETCH_AFFECTED_SYSTEMS_BY_CVE + '_PENDING':
+            newState = state.setIn(['affectedSystemsByCVE', 'isLoading'], true);
             return newState;
 
-        case ActionTypes.FETCH_CVES_WITH_SYSTEMS + '_FULFILLED':
-            newState = state.setIn(['cveListWithSystems', 'items'], action.payload);
-            newState = newState.setIn(['cveListWithSystems', 'isLoading'], false);
+        case ActionTypes.FETCH_AFFECTED_SYSTEMS_BY_CVE + '_FULFILLED':
+            newState = state.setIn(['affectedSystemsByCVE', 'payload'], action.payload);
+            newState = newState.setIn(['affectedSystemsByCVE', 'isLoading'], false);
             return newState;
 
         default:

diff --git a/src/Store/Selectors/CVESelectors.js b/src/Store/Selectors/CVESelectors.js
@@ -1,9 +1,9 @@
 import { createSelector } from 'reselect';
-import { createCveWithSystemsTable, createCveDetailsPage, createExposedSystemsTable } from '../../Helpers/CVE/CVEHelper';
+import { createCveDetailsPage, createCveWithSystemsTable, createExposedSystemsTable } from '../../Helpers/CVE/CVEHelper';
 
-const cveListWithSystemsSelector = state => state.CVEStore.cveListWithSystems.items;
+const cveListWithSystemsSelector = state => state.CVEStore.affectedSystemsByCVE;
 const cveDetailsPageSelector = state => state.CVEStore.cveDetails;
 
 export const sCvesWithSystemsTable = createSelector([cveListWithSystemsSelector], createCveWithSystemsTable);
 export const sCveDetailsPage = createSelector([cveDetailsPageSelector], createCveDetailsPage);
-export const sExposedSystemsTable = createSelector([cveDetailsPageSelector], createExposedSystemsTable);
+export const sExposedSystemsTable = createSelector([cveListWithSystemsSelector], createExposedSystemsTable);