Bug 1509216 - Convert Perfherder compare and comparesubtests views t…

…o react (#4811)

Move compare files to new directory, set up validation HOC and
create components for compare view and compare subtests views

tests/ui/unit/react/compare_table_test.jsx

@@ -6,7 +6,7 @@ import {
   waitForElement,
 } from 'react-testing-library';
 
-import CompareTableControls from '../../../../ui/perfherder/CompareTableControls';
+import CompareTableControls from '../../../../ui/perfherder/compare/CompareTableControls';
 import { filterText } from '../../../../ui/perfherder/constants';
 
 // TODO addtional tests:

ui/css/intermittent-failures.css

@@ -98,28 +98,3 @@ ul {
   list-style-type: none;
   text-align: left;
 }
-
-.loading {
-  position: fixed;
-  z-index: 999;
-  height: 2em;
-  width: 2em;
-  overflow: show;
-  margin: auto;
-  top: 0;
-  left: 0;
-  bottom: 0;
-  right: 0;
-}
-
-/* overlay */
-.loading:before {
-  content: '';
-  display: block;
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(20, 19, 19, 0.3);
-}

ui/css/treeherder-global.css

@@ -458,7 +458,7 @@ h4 {
 }
 
 .max-width-default {
-  max-width: 1200px;
+  max-width: 1250px;
 }
 
 /* Custom widths for compare table cells */
@@ -481,3 +481,32 @@ h4 {
 .dropdown-menu-height {
   max-height: 300px;
 }
+
+.pointer {
+  cursor: pointer;
+}
+
+.loading {
+  position: fixed;
+  z-index: 999;
+  height: 2em;
+  width: 2em;
+  overflow: show;
+  margin: auto;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+}
+
+/* overlay */
+.loading:before {
+  content: '';
+  display: block;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(20, 19, 19, 0.3);
+}

ui/entry-perf.js

@@ -52,16 +52,14 @@ import './js/perf';
 
 // Perf JS
 import './js/filters';
-import './js/controllers/perf/compare';
 import './js/controllers/perf/graphs';
 import './js/controllers/perf/alerts';
-import './js/components/perf/compare';
 import './js/components/loading';
 import './js/perfapp';
-import './perfherder/CompareSelectorView';
-import './perfherder/RevisionInformation';
-import './perfherder/CompareSubtestDistributionView';
-import './perfherder/CompareTableControls';
+import './perfherder/compare/CompareSelectorView';
+import './perfherder/compare/CompareView';
+import './perfherder/compare/CompareSubtestDistributionView';
+import './perfherder/compare/CompareSubtestsView';
 
 config.showMissingIcons = true;
 

ui/helpers/constants.js

@@ -221,7 +221,10 @@ export const phAlertStatusMap = {
   CONFIRMING: { id: 5, text: 'confirming' },
 };
 
-export const compareDefaultTimeRange = 86400 * 2;
+export const compareDefaultTimeRange = {
+  value: 86400 * 2,
+  text: 'Last 2 days',
+};
 
 export const thBugSuggestionLimit = 20;