diff --git a/monkey/monkey_island/cc/ui/src/components/Main.tsx b/monkey/monkey_island/cc/ui/src/components/Main.tsx index 7635f3e4c..5216245d7 100644 --- a/monkey/monkey_island/cc/ui/src/components/Main.tsx +++ b/monkey/monkey_island/cc/ui/src/components/Main.tsx @@ -29,6 +29,8 @@ import {CompletedSteps} from "./side-menu/CompletedSteps"; import Timeout = NodeJS.Timeout; import IslandHttpClient from "./IslandHttpClient"; import _ from "lodash"; +import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"; +import {faFileCode, faLightbulb} from "@fortawesome/free-solid-svg-icons"; let notificationIcon = require('../images/notification-logo-512x512.png'); @@ -180,18 +182,35 @@ class AppComponent extends AuthComponent { getDefaultReport() { if(this.state.islandMode === 'ransomware'){ - return Routes.RansomwareReport + return Routes.RansomwareReport; } else { - return Routes.SecurityReport + return Routes.SecurityReport; } } + getIslandModeTitle(){ + if(this.state.islandMode === 'ransomware'){ + return this.formIslandModeTitle("Ransomware", faFileCode); + } else { + return this.formIslandModeTitle("Custom", faLightbulb); + } + } + + formIslandModeTitle(title, icon){ + return (<> +
+ {title} +
+ ) + } + render() { let defaultSideNavProps = {completedSteps: this.state.completedSteps, onStatusChange: this.updateStatus, islandMode: this.state.islandMode, - defaultReport: this.getDefaultReport()} + defaultReport: this.getDefaultReport(), + sideNavHeader: this.getIslandModeTitle()} return ( diff --git a/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx b/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx index 450103bb9..f4f1aef20 100644 --- a/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx +++ b/monkey/monkey_island/cc/ui/src/components/SideNavComponent.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, {ReactFragment} from 'react'; import {NavLink} from 'react-router-dom'; import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; import {faCheck} from '@fortawesome/free-solid-svg-icons/faCheck'; @@ -18,11 +18,15 @@ const infectionMonkeyImage = require('../images/infection-monkey.svg'); type Props = { disabled?: boolean, completedSteps: CompletedSteps, - defaultReport: string + defaultReport: string, + header?: ReactFragment } -const SideNavComponent = ({disabled, completedSteps, defaultReport}: Props) => { +const SideNavComponent = ({disabled, + completedSteps, + defaultReport, + header=null}: Props) => { return ( <> @@ -34,6 +38,14 @@ const SideNavComponent = ({disabled, completedSteps, defaultReport}: Props) => {