From d52a6eab578460f83bd98a5e1d7fe38f41b8c897 Mon Sep 17 00:00:00 2001
From: Shay Nehmad <shay.nehmad@guardicore.com>
Date: Mon, 19 Aug 2019 18:09:05 +0300
Subject: [PATCH] Separated sections to methods for readability

---
 .../components/pages/ZeroTrustReportPage.js   | 81 ++++++++++---------
 1 file changed, 44 insertions(+), 37 deletions(-)

diff --git a/monkey/monkey_island/cc/ui/src/components/pages/ZeroTrustReportPage.js b/monkey/monkey_island/cc/ui/src/components/pages/ZeroTrustReportPage.js
index b859e306b..0b9855707 100644
--- a/monkey/monkey_island/cc/ui/src/components/pages/ZeroTrustReportPage.js
+++ b/monkey/monkey_island/cc/ui/src/components/pages/ZeroTrustReportPage.js
@@ -61,44 +61,10 @@ class ZeroTrustReportPageComponent extends AuthComponent {
     if (this.stillLoadingDataFromServer()) {
       content = <ReportLoader loading={true}/>;
     } else {
-      const overviewSection = <div id="overview-section">
-        <h2>Overview</h2>
-        <Grid fluid={true}>
-          <Row className="show-grid">
-            <Col xs={8} sm={8} md={8} lg={8}>
-              <PillarsOverview pillarsToStatuses={this.state.pillars.pillarsToStatuses} grades={this.state.pillars.grades}/>
-            </Col>
-            <Col xs={4} sm={4} md={4} lg={4}>
-              <MonkeysStillAliveWarning allMonkeysAreDead={this.state.allMonkeysAreDead}/>
-              <SecurityIssuesGlance issuesFound={this.anyIssuesFound()}/>
-              <StatusesToPillarsSummary statusesToPillars={this.state.pillars.statusesToPillars} />
-            </Col>
-          </Row>
-        </Grid>
-      </div>;
-
-      const directivesSection = <div id="directives-overview">
-        <h2>Directives</h2>
-        {
-          Object.keys(this.state.directives).map((pillar) =>
-            <SinglePillarDirectivesStatus
-              key={pillar}
-              pillar={pillar}
-              directivesStatus={this.state.directives[pillar]}
-              pillarsToStatuses={this.state.pillars.pillarsToStatuses}/>
-          )
-        }
-      </div>;
-
-      const findingSection = <div id="findings-overview">
-        <h2>Findings</h2>
-        <FindingsTable pillarsToStatuses={this.state.pillars.pillarsToStatuses} findings={this.state.findings}/>
-      </div>;
-
       content = <div id="MainContentSection">
-        {overviewSection}
-        {directivesSection}
-        {findingSection}
+        {this.generateOverviewSection()}
+        {this.generateDirectivesSection()}
+        {this.generateFindingsSection()}
       </div>;
     }
 
@@ -119,6 +85,47 @@ class ZeroTrustReportPageComponent extends AuthComponent {
     )
   }
 
+  generateFindingsSection() {
+    return (<div id="findings-overview">
+      <h2>Findings</h2>
+      <FindingsTable pillarsToStatuses={this.state.pillars.pillarsToStatuses} findings={this.state.findings}/>
+    </div>);
+  }
+
+  generateDirectivesSection() {
+    return (<div id="directives-overview">
+      <h2>Directives</h2>
+      {
+        Object.keys(this.state.directives).map((pillar) =>
+          <SinglePillarDirectivesStatus
+            key={pillar}
+            pillar={pillar}
+            directivesStatus={this.state.directives[pillar]}
+            pillarsToStatuses={this.state.pillars.pillarsToStatuses}/>
+        )
+      }
+    </div>);
+  }
+
+  generateOverviewSection() {
+    return (<div id="overview-section">
+      <h2>Overview</h2>
+      <Grid fluid={true}>
+        <Row className="show-grid">
+          <Col xs={8} sm={8} md={8} lg={8}>
+            <PillarsOverview pillarsToStatuses={this.state.pillars.pillarsToStatuses}
+                             grades={this.state.pillars.grades}/>
+          </Col>
+          <Col xs={4} sm={4} md={4} lg={4}>
+            <MonkeysStillAliveWarning allMonkeysAreDead={this.state.allMonkeysAreDead}/>
+            <SecurityIssuesGlance issuesFound={this.anyIssuesFound()}/>
+            <StatusesToPillarsSummary statusesToPillars={this.state.pillars.statusesToPillars}/>
+          </Col>
+        </Row>
+      </Grid>
+    </div>);
+  }
+
   stillLoadingDataFromServer() {
     return typeof this.state.findings === "undefined" || typeof this.state.pillars === "undefined" || typeof this.state.directives === "undefined";
   }