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..688d3cc67 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,8 +3,12 @@ import React from 'react'; import ReportHeader, {ReportTypes} from './common/ReportHeader'; import ReportLoader from './common/ReportLoader'; import pluralize from 'pluralize' +import FileEncryptionTable from './ransomware/FileEncryptionTable'; + +import '../../styles/pages/report/RansomwareReport.scss'; class RansomwareReport extends React.Component { + stillLoadingDataFromServer() { return Object.keys(this.props.report).length === 0; } @@ -13,6 +17,7 @@ class RansomwareReport extends React.Component { return (
{this.getExploitationStats()} +
) } @@ -20,9 +25,9 @@ class RansomwareReport extends React.Component { getExploitationStats() { return (
-

+

Propagation -

+ {this.getScannedVsExploitedStats()} {this.getExploitationStatsPerExploit()}
@@ -69,7 +74,7 @@ class RansomwareReport extends React.Component { } return ( -
+

{content} 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..cfb9ab3f3 --- /dev/null +++ b/monkey/monkey_island/cc/ui/src/components/report-components/ransomware/FileEncryptionTable.tsx @@ -0,0 +1,70 @@ +import React from 'react'; +import ReactTable from 'react-table'; +import {renderArray} from '../common/RenderArrays'; + + +type Props = { + tableData: [TableRow] +} + +type TableRow = { + exploits: [string], + total_attempts: number, + successful_encryptions: number, + hostname: string +} + +const pageSize = 10; + + +const FileEncryptionTable = (props: Props) => { + let defaultPageSize = props.tableData.length > pageSize ? pageSize : props.tableData.length; + let showPagination = props.tableData.length > pageSize; + return ( + <> +

+ File encryption +

+
+ +
+ + ); +} + +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 encrypted', + id: 'files_encrypted', + accessor: x => renderFileEncryptionStats(x.successful_encryptions, x.total_attempts)} + ] + } +]; + +function renderFileEncryptionStats(successful: number, total: number) { + let textClassName = '' + + if(successful > 0) { + if (successful === total) { + textClassName = 'text-danger' + } else { + textClassName = 'text-warning' + } + } else { + textClassName = 'text-success' + } + + return (

{successful} out of {total}

); +} + + +export default FileEncryptionTable; diff --git a/monkey/monkey_island/cc/ui/src/styles/pages/report/RansomwareReport.scss b/monkey/monkey_island/cc/ui/src/styles/pages/report/RansomwareReport.scss new file mode 100644 index 000000000..4d55ef8df --- /dev/null +++ b/monkey/monkey_island/cc/ui/src/styles/pages/report/RansomwareReport.scss @@ -0,0 +1,3 @@ +.ransomware-report .report-section-header { + margin-top: 40px; +}