diff --git a/monkey/monkey_island/cc/ui/src/components/report-components/RansomwareReport.js b/monkey/monkey_island/cc/ui/src/components/report-components/RansomwareReport.js index bb24dcaa1..a7a05db5a 100644 --- a/monkey/monkey_island/cc/ui/src/components/report-components/RansomwareReport.js +++ b/monkey/monkey_island/cc/ui/src/components/report-components/RansomwareReport.js @@ -3,10 +3,25 @@ import React from 'react'; import ReportHeader, {ReportTypes} from './common/ReportHeader'; import ReportLoader from './common/ReportLoader'; import pluralize from 'pluralize' +import FileEncryptionTable from './ransomware/FileEncryptionTable'; class RansomwareReport extends React.Component { + + constructor(props) { + super(props); + this.state = { + report: props.report + }; + } + + componentDidUpdate(prevProps) { + if (this.props.report !== prevProps.report) { + this.setState({report: this.props.report}) + } + } + stillLoadingDataFromServer() { - return Object.keys(this.props.report).length === 0; + return Object.keys(this.state.report).length === 0; } generateReportContent() { @@ -19,6 +34,11 @@ class RansomwareReport extends React.Component { getExploitationStats() { return ( +
+ This report shows information about the ransomware simulation run by Infection Monkey. +
+Yes
); + } else { + return (No
); + } +} + +export default renderBool; diff --git a/monkey/monkey_island/cc/ui/src/components/report-components/ransomware/FileEncryptionTable.tsx b/monkey/monkey_island/cc/ui/src/components/report-components/ransomware/FileEncryptionTable.tsx new file mode 100644 index 000000000..306cb5cc3 --- /dev/null +++ b/monkey/monkey_island/cc/ui/src/components/report-components/ransomware/FileEncryptionTable.tsx @@ -0,0 +1,50 @@ +import React from 'react'; +import ReactTable from 'react-table'; +import {renderArray} from '../common/RenderArrays'; +import renderBool from "../common/RenderBool"; + + +const columns = [ + { + Header: 'Ransomware info', + columns: [ + {Header: 'Machine', id: 'machine', accessor: x => x.hostname}, + {Header: 'Exploits', id: 'exploits', accessor: x => renderArray(x.exploits)}, + {Header: 'Files got encrypted?', id: 'files_encrypted', accessor: x => renderBool(x.files_encrypted)} + ] + } +]; + +const pageSize = 10; + +type TableRow = { + exploits: [string], + files_encrypted: boolean, + hostname: string +} + +type Props = { + tableData: [TableRow] +} + +const FileEncryptionTable = (props: Props) => { + let defaultPageSize = props.tableData.length > pageSize ? pageSize : props.tableData.length; + let showPagination = props.tableData.length > pageSize; + return ( + <> +