diff --git a/monkey/monkey_island/cc/ui/src/components/configuration-components/PluginSelectorTemplate.tsx b/monkey/monkey_island/cc/ui/src/components/configuration-components/PluginSelectorTemplate.tsx
index de1c77e52b8..7a73042b0b4 100644
--- a/monkey/monkey_island/cc/ui/src/components/configuration-components/PluginSelectorTemplate.tsx
+++ b/monkey/monkey_island/cc/ui/src/components/configuration-components/PluginSelectorTemplate.tsx
@@ -1,48 +1,89 @@
-import {ObjectFieldTemplateProps} from '@rjsf/utils';
+import {getDefaultFormState, ObjectFieldTemplateProps} from '@rjsf/utils';
import React, {useState} from 'react';
-import {Dropdown} from 'react-bootstrap';
-
-const PluginSelector = (props) => {
- let selectOptions = [];
- for (const [name, plugin] of Object.entries(props.plugins)) {
- selectOptions.push(
- props.onClick(name)}
- eventKey={`plugin['title']`}>
- {plugin['title']}
- )}
-
- return (
-
-
- Select a plugin
-
-
- {selectOptions}
-
-
- )
-}
+import ChildCheckboxContainer from '../ui-components/ChildCheckbox';
+import {AdvancedMultiSelectHeader} from '../ui-components/AdvancedMultiSelect';
+import {MasterCheckboxState} from '../ui-components/MasterCheckbox';
export default function PluginSelectorTemplate(props: ObjectFieldTemplateProps) {
- function getPluginDisplay(plugin, allPlugins){
+ let [selectedPlugin, setSelectedPlugin] = useState(null);
+
+ function getPluginDisplay(plugin, allPlugins) {
let selectedPlugin = allPlugins.filter((pluginInArray) => pluginInArray.name == plugin)
- if(selectedPlugin.length === 1){
+ if (selectedPlugin.length === 1) {
return {selectedPlugin[0].content}
}
}
- let [element, setElement] = useState(null);
+ function getOptions() {
+ let selectorOptions = [];
+ for (let [name, schema] of Object.entries(props.schema.properties)) {
+ selectorOptions.push({label: schema.title, value: name});
+ }
+ return selectorOptions;
+ }
+
+ function togglePluggin(pluginName) {
+ let plugins = new Set(props.formContext.selectedExploiters);
+ if (props.formContext.selectedExploiters.has(pluginName)) {
+ plugins.delete(pluginName);
+ } else {
+ plugins.add(pluginName);
+ }
+ props.formContext.setSelectedExploiters(plugins)
+ }
+
+ function getMasterCheckboxState(selectValues) {
+ if (Object.keys(selectValues).length === 0) {
+ return MasterCheckboxState.NONE;
+ }
+
+ if (Object.keys(selectValues).length !== getOptions().length) {
+ return MasterCheckboxState.MIXED;
+ }
+
+ return MasterCheckboxState.ALL;
+ }
+
+ function generateDefaultConfig() {
+ return getDefaultFormState(props.registry.schemaUtils.validator,
+ props.schema, {}, props.registry.rootSchema, true);
+ }
+
+ function onMasterPluginCheckboxClick() {
+ let checkboxState = getMasterCheckboxState(props.formContext.selectedExploiters);
+ if (checkboxState == MasterCheckboxState.ALL) {
+ props.formContext.setSelectedExploiters({});
+ } else {
+ props.formContext.setSelectedExploiters(generateDefaultConfig());
+ }
+ }
+
+ function isPluginSafe(itemKey) {
+ let itemSchema = Object.entries(props.schema.properties).filter(e => e[0] == itemKey)[0][1];
+ return itemSchema['safe'];
+ }
+
return (
-
- {props.title}
- {props.description}
-
{
- setElement(pluginName)
- }}/>
- {getPluginDisplay(element, props.properties)}
+
+
{
+ }}/>
+
+
+ {getPluginDisplay(selectedPlugin, props.properties)}