Fixed react warnings related to keys and <div/> in <p/>

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/scoutsuite/ResourceDropdown.js

@@ -43,7 +43,7 @@ export default function ResourceDropdown(props) {
     for (let i = 0; i < path_vars.length; i++) {
       display_path.push(path_vars[i])
       if (i !== path_vars.length - 1) {
-        display_path.push(<FontAwesomeIcon icon={faArrowRight}/>)
+        display_path.push(<FontAwesomeIcon icon={faArrowRight} key={'arrow-'+i}/>)
       }
     }
     return display_path;

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/scoutsuite/RuleDisplay.js

@@ -31,7 +31,8 @@ export default function RuleDisplay(props) {
       references.push(<a href={reference}
                          className={'reference-link'}
                          target={'_blank'}
-                         rel="noopener noreferrer">{reference}</a>)
+                         rel="noopener noreferrer"
+                         key={reference}>{reference}</a>)
     })
     return (
       <div className={'reference-list'}>
@@ -42,13 +43,15 @@ export default function RuleDisplay(props) {
 
   function getResources() {
     let resources = []
-    props.rule.items.forEach(item => {
+    for (let i = 0; i < props.rule.items.length; i++) {
+      let item = props.rule.items[i];
       let template_path = Object.prototype.hasOwnProperty.call(props.rule, 'display_path')
         ? props.rule.display_path : props.rule.path;
       resources.push(<ResourceDropdown resource_path={item}
                                        template_path={template_path}
-                                       scoutsuite_data={props.scoutsuite_data}/>)
-    })
+                                       scoutsuite_data={props.scoutsuite_data}
+                                       key={template_path+i}/>)
+    }
     return (
       <div className={'reference-list'}>
         <p className={'reference-list-title'}>Resources:</p>

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/scoutsuite/ScoutSuiteRuleModal.js

@@ -51,7 +51,8 @@ export default function ScoutSuiteRuleModal(props) {
       let dropdown = (<ScoutSuiteSingleRuleDropdown isCollapseOpen={openRuleId === rule.description}
                                                     toggleCallback={() => toggleRuleDropdown(rule.description)}
                                                     rule={rule}
-                                                    scoutsuite_data={props.scoutsuite_data}/>)
+                                                    scoutsuite_data={props.scoutsuite_data}
+                                                    key={rule.description+rule.path}/>)
       dropdowns.push(dropdown)
     });
     return dropdowns;
@@ -67,7 +68,7 @@ export default function ScoutSuiteRuleModal(props) {
           <hr/>
           <p>
             There {Pluralize('is', props.scoutsuite_rules.length)} {
-            <div className={'badge badge-primary'}>{props.scoutsuite_rules.length}</div>
+            <span className={'badge badge-primary'}>{props.scoutsuite_rules.length}</span>
           } ScoutSuite {Pluralize('rule', props.scoutsuite_rules.length)} associated with this finding.
           </p>
           {renderRuleDropdowns()}

monkey/monkey_island/cc/ui/src/components/report-components/zerotrust/scoutsuite/ScoutSuiteSingleRuleDropdown.js

@@ -15,7 +15,7 @@ export default function ScoutSuiteSingleRuleDropdown(props) {
 
   function getRuleCollapse() {
     return (
-      <div key={props.rule.description} className={classNames('collapse-item',
+      <div className={classNames('collapse-item',
         'rule-collapse', {'item--active': props.isCollapseOpen})}>
         <button className={classNames('btn-collapse', getDropdownClass())}
                 onClick={props.toggleCallback}>