Merge pull request #30 from delta-reporter/filter-by-status

Filter by status
delta-reporter · Jul 31, 2020 · 9a8ef48 · 9a8ef48
2 parents 59038ea + eb535b1
commit 9a8ef48
Show file tree

Hide file tree

Showing 15 changed files with 631 additions and 743 deletions.
diff --git a/components/templates/DeltaViewForLaunches.tsx b/components/templates/DeltaViewForLaunches.tsx
@@ -6,7 +6,7 @@ import Router from "next/router"
 let pyramidData = []
 let roseData = []
 
-export function testRunButtonsDeltaView(testRunStats: any) {
+export function testRunButtonsDefaultView(testRunStats: any) {
   return testRunStats.map(testRun => (
     <Button
       key={testRun.test_run_id}
@@ -31,7 +31,7 @@ export function testRunButtonsDeltaView(testRunStats: any) {
   ))
 }
 
-export function testRunPyramidDeltaView(testRunStats: any, launchId: number) {
+export function testRunButtonsDeltaPyramidView(testRunStats: any, launchId: number) {
   const deltaViewStyle = { height: "190px", width: "800px" }
 
   // The param echarts could be pass into this function as well

diff --git a/components/templates/ListOfSuites.tsx b/components/templates/ListOfSuites.tsx
@@ -7,9 +7,9 @@ import {
 } from "../../components/templates"
 import {
   Typography,
-  ExpansionPanel,
-  ExpansionPanelSummary,
-  ExpansionPanelDetails,
+  Accordion,
+  AccordionDetails,
+  AccordionSummary,
   List,
   ListItem,
 } from "@material-ui/core"
@@ -59,10 +59,11 @@ const useStyles = makeStyles(theme => ({
 
 type Props = {
   children: SuiteAndTest[]
+  stats
 }
 
 export const ListOfSuites = function(props: Props) {
-  const { children } = props
+  const { children, stats } = props
   const classes = useStyles(props)
   const [testInfoSection, setTestInfoSection] = useState(["No test selected"])
   const [highlightedTest, setHighlightedTest] = useState(0)
@@ -72,6 +73,16 @@ export const ListOfSuites = function(props: Props) {
     setHighlightedTest(testId)
   }
 
+  function setStats() {
+    let settingStats = []
+    if(stats.includes("2")) settingStats.push("passed")
+    if(stats.includes("1")) settingStats.push("failed")
+    if(stats.includes("3")) settingStats.push("incomplete")
+    if(stats.includes("5")) settingStats.push("skipped")
+    return settingStats
+  }
+  let statsArray = setStats()
+
   const [expandedSuite, setExpandedSuite] = React.useState<string | false>(
     false
   )
@@ -98,13 +109,13 @@ export const ListOfSuites = function(props: Props) {
         {children.map(testRun => (
           <div key={testRun.test_run_id}>
             {testRun.test_suites.map(suite => (
-              <ExpansionPanel // list of expandable suites
+              <Accordion // list of expandable suites
                 key={suite.test_suite_history_id}
                 expanded={expandedSuite === suite.name}
                 onChange={expandCollapseSuite(suite.name)}
                 TransitionProps={{ unmountOnExit: true }}
               >
-                <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
+                <AccordionSummary expandIcon={<ExpandMoreIcon />}>
                   {showStatusIcon(suite.test_suite_status)}
                   <Typography className={classes.nameOfTestOrSuite}>
                     {suite.name}
@@ -113,10 +124,11 @@ export const ListOfSuites = function(props: Props) {
                     suite.tests_passed,
                     suite.tests_failed,
                     suite.tests_incomplete,
-                    suite.tests_skipped
+                    suite.tests_skipped,
+                    statsArray
                   )}
-                </ExpansionPanelSummary>
-                <ExpansionPanelDetails>
+                </AccordionSummary>
+                <AccordionDetails>
                   {/* Expandable tests list for each suite */}
                   <List key={suite.test_suite_history_id} dense>
                     {suite.tests.map(test => (
@@ -143,8 +155,8 @@ export const ListOfSuites = function(props: Props) {
                       </a>
                     ))}
                   </List>
-                </ExpansionPanelDetails>
-              </ExpansionPanel>
+                </AccordionDetails>
+              </Accordion>
             ))}
           </div>
         ))}

diff --git a/components/templates/Test.tsx b/components/templates/Test.tsx
@@ -2,8 +2,8 @@ import React from "react"
 import { makeStyles } from "@material-ui/core/styles"
 import { Paper, Typography, Button } from "@material-ui/core"
 import {
-  TestErrorMessageExpansionPanel,
-  TestMediaExpansionPanel,
+  TestErrorMessageAccordion,
+  TestMediaAccordion,
 } from "./TestExpandablePanels"
 import { TestResolution } from "./TestResolution"
 import { showStatusText, HistoricalTests } from "."
@@ -73,7 +73,7 @@ export const TestExpanded = function(props: TestProps) {
     <div
       key={children.test_history_id}
       className={classes.root}
-      style={{ paddingLeft: "50px", paddingRight: "50px" }}
+      style={{ paddingLeft: "50px", paddingRight: "50px", paddingBottom: "50px"}}
     >
       {children.name ? ( // when page is just loaded and no test selected - half page to be blank
         <Paper className={classes.paperNoPadding} elevation={0}>
@@ -138,13 +138,13 @@ export const TestExpanded = function(props: TestProps) {
                     </span>
                   </Typography>
 
-                  <TestErrorMessageExpansionPanel>
+                  <TestErrorMessageAccordion>
                     {children}
-                  </TestErrorMessageExpansionPanel>
+                  </TestErrorMessageAccordion>
                   {children.media ? ( // check if there is any media for this test
-                    <TestMediaExpansionPanel key={children.file_id}>
+                    <TestMediaAccordion key={children.file_id}>
                       {children}
-                    </TestMediaExpansionPanel>
+                    </TestMediaAccordion>
                   ) : (
                     <div></div>
                   )}

diff --git a/components/templates/TestExpandablePanels.tsx b/components/templates/TestExpandablePanels.tsx
@@ -1,8 +1,8 @@
 import React from "react"
 import ExpandMoreIcon from "@material-ui/icons/ExpandMore"
-import MuiExpansionPanel from "@material-ui/core/ExpansionPanel"
-import MuiExpansionPanelSummary from "@material-ui/core/ExpansionPanelSummary"
-import MuiExpansionPanelDetails from "@material-ui/core/ExpansionPanelDetails"
+import MuiAccordion from "@material-ui/core/Accordion"
+import MuiAccordionSummary from "@material-ui/core/AccordionSummary"
+import MuiAccordionDetails from "@material-ui/core/AccordionDetails"
 import {
   Typography,
   List,
@@ -29,7 +29,7 @@ const ExpandablePanel = withStyles({
     },
   },
   expanded: {},
-})(MuiExpansionPanel)
+})(MuiAccordion)
 
 const CollapsedLineSummary = withStyles({
   root: {
@@ -46,20 +46,20 @@ const CollapsedLineSummary = withStyles({
     },
   },
   expanded: {},
-})(MuiExpansionPanelSummary)
+})(MuiAccordionSummary)
 
 const PanelDetails = withStyles(theme => ({
   root: {
     padding: theme.spacing(2),
     width: "100%",
   },
-}))(MuiExpansionPanelDetails)
+}))(MuiAccordionDetails)
 
 interface TestProps {
   children: any
 }
 
-export const TestErrorMessageExpansionPanel = function(props: TestProps) {
+export const TestErrorMessageAccordion = function(props: TestProps) {
   const { children } = props
 
   const [expandedErrorPanel, setExpandedErrorPanel] = React.useState<
@@ -113,7 +113,7 @@ export const TestErrorMessageExpansionPanel = function(props: TestProps) {
   )
 }
 
-export const TestMediaExpansionPanel = function(props: TestProps) {
+export const TestMediaAccordion = function(props: TestProps) {
   const { children } = props
 
   const [mediaExpandedPanel, setMediaExpandedPanel] = React.useState<

diff --git a/components/templates/TestHistory.tsx b/components/templates/TestHistory.tsx
@@ -4,17 +4,17 @@ import ExpandMoreIcon from "@material-ui/icons/ExpandMore"
 import Container from "@material-ui/core/Container"
 import {
   Typography,
-  ExpansionPanel,
-  ExpansionPanelSummary,
-  ExpansionPanelDetails,
+  Accordion,
+  AccordionDetails,
+  AccordionSummary,
   Tooltip,
 } from "@material-ui/core"
 import {
   showStatusText,
   showResolutionText,
   showDateText,
-  TestErrorMessageExpansionPanel,
-  TestMediaExpansionPanel,
+  TestErrorMessageAccordion,
+  TestMediaAccordion,
 } from "."
 
 const fetcher = url => fetch(url).then(res => res.json())
@@ -67,13 +67,13 @@ export const HistoricalTests = function(props: TestProps) {
         {loading
           ? "Loading historical tests..."
           : data.map(test => (
-              <ExpansionPanel
+              <Accordion
                 key={test.test_history_id}
                 expanded={historicalTestsExpandedPanel === test.test_history_id}
                 onChange={expandCollapsePanel(test.test_history_id)}
                 TransitionProps={{ unmountOnExit: true }}
               >
-                <ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
+                <AccordionSummary expandIcon={<ExpandMoreIcon />}>
                   <Typography color="textPrimary">
                     {showStatusText(test.status)}{" "}
                     {showDateText(test.end_datetime)}
@@ -94,8 +94,8 @@ export const HistoricalTests = function(props: TestProps) {
                       <div></div>
                     )}
                   </Typography>
-                </ExpansionPanelSummary>
-                <ExpansionPanelDetails>
+                </AccordionSummary>
+                <AccordionDetails>
                   <Container maxWidth="sm">
                     {test.error_type ? (
                       <Typography
@@ -116,22 +116,22 @@ export const HistoricalTests = function(props: TestProps) {
                       <div></div>
                     )}
                     {test.trace ? (
-                      <TestErrorMessageExpansionPanel>
+                      <TestErrorMessageAccordion>
                         {test}
-                      </TestErrorMessageExpansionPanel>
+                      </TestErrorMessageAccordion>
                     ) : (
                       <div>Happy days :)</div>
                     )}
                     {test.media ? (
-                      <TestMediaExpansionPanel key={test.file_id}>
+                      <TestMediaAccordion key={test.file_id}>
                         {test}
-                      </TestMediaExpansionPanel>
+                      </TestMediaAccordion>
                     ) : (
                       <div></div>
                     )}
                   </Container>
-                </ExpansionPanelDetails>
-              </ExpansionPanel>
+                </AccordionDetails>
+              </Accordion>
             ))}
       </div>
     )