p17860254
/
monkey
forked from p15670423/monkey
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

ui: separate MasterCheckbox and ChildCheckbox into their own files

This commit is contained in:
Mike Salvatore 2021-01-14 08:37:52 -05:00
parent 73dd8ddcc9
commit 8d024b9002
3 changed files with 76 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

65
monkey/monkey_island/cc/ui/src/components/ui-components/AdvancedMultiSelect.js
View File

@ -1,20 +1,13 @@
import React from "react";
import {Card, Button, Form} from 'react-bootstrap';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faCheckSquare} from '@fortawesome/free-solid-svg-icons';
import {faMinusSquare} from '@fortawesome/free-solid-svg-icons';
import {faSquare} from '@fortawesome/free-regular-svg-icons';
import React from 'react';
import {Form} from 'react-bootstrap';
import {cloneDeep} from 'lodash';
import {getComponentHeight} from './utils/HeightCalculator';
import {resolveObjectPath} from './utils/ObjectPathResolver';
import InfoPane from './InfoPane';
const MasterCheckboxState = {
NONE: 0,
MIXED: 1,
ALL: 2
}
import {MasterCheckbox, MasterCheckboxState} from './MasterCheckbox';
import ChildCheckbox from './ChildCheckbox';
function getFullDefinitionByKey(refString, registry, itemKey) {
let fullArray = getFullDefinitionsFromRegistry(refString, registry);
@ -143,52 +136,4 @@ class AdvancedMultiSelect extends React.Component {
}
}
function MasterCheckbox(props) {
const {
title,
disabled,
onClick,
checkboxState
} = props;
let newCheckboxIcon = faCheckSquare;
if (checkboxState === MasterCheckboxState.NONE) {
newCheckboxIcon = faSquare;
} else if (checkboxState === MasterCheckboxState.MIXED) {
newCheckboxIcon = faMinusSquare;
}
return (
<Card.Header>
<Button key={`${title}-button`} variant={'link'} disabled={disabled} onClick={onClick}>
<FontAwesomeIcon icon={newCheckboxIcon}/>
</Button>
<span className={'header-title'}>{title}</span>
</Card.Header>
);
}
function ChildCheckbox(props) {
const {
onPaneClick,
onClick,
value,
disabled,
label,
checkboxState
} = props;
return (
<Form.Group onClick={() => onPaneClick(value)}>
<Button value={value} variant={'link'} disabled={disabled} onClick={() => onClick(value)}>
<FontAwesomeIcon icon={checkboxState ? faCheckSquare : faSquare}/>
</Button>
<span className={'option-text'}>
{label}
</span>
</Form.Group>
);
}
export default AdvancedMultiSelect;

30
monkey/monkey_island/cc/ui/src/components/ui-components/ChildCheckbox.js Normal file
View File

@ -0,0 +1,30 @@
import React from 'react';
import {Button, Form} from 'react-bootstrap';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faCheckSquare} from '@fortawesome/free-solid-svg-icons';
import {faSquare} from '@fortawesome/free-regular-svg-icons';
function ChildCheckbox(props) {
const {
onPaneClick,
onClick,
value,
disabled,
label,
checkboxState
} = props;
return (
<Form.Group onClick={() => onPaneClick(value)}>
<Button value={value} variant={'link'} disabled={disabled} onClick={() => onClick(value)}>
<FontAwesomeIcon icon={checkboxState ? faCheckSquare : faSquare}/>
</Button>
<span className={'option-text'}>
{label}
</span>
</Form.Group>
);
}
export default ChildCheckbox;

41
monkey/monkey_island/cc/ui/src/components/ui-components/MasterCheckbox.js Normal file
View File

@ -0,0 +1,41 @@
import React from 'react';
import {Card, Button} from 'react-bootstrap';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import {faCheckSquare} from '@fortawesome/free-solid-svg-icons';
import {faMinusSquare} from '@fortawesome/free-solid-svg-icons';
import {faSquare} from '@fortawesome/free-regular-svg-icons';
const MasterCheckboxState = {
NONE: 0,
MIXED: 1,
ALL: 2
}
function MasterCheckbox(props) {
const {
title,
disabled,
onClick,
checkboxState
} = props;
let newCheckboxIcon = faCheckSquare;
if (checkboxState === MasterCheckboxState.NONE) {
newCheckboxIcon = faSquare;
} else if (checkboxState === MasterCheckboxState.MIXED) {
newCheckboxIcon = faMinusSquare;
}
return (
<Card.Header>
<Button key={`${title}-button`} variant={'link'} disabled={disabled} onClick={onClick}>
<FontAwesomeIcon icon={newCheckboxIcon}/>
</Button>
<span className={'header-title'}>{title}</span>
</Card.Header>
);
}
export {MasterCheckboxState, MasterCheckbox};