[Uptime] Implement EuiSuperDatePicker (#28217)

* Implement EuiSuperDatePicker, update components to use new state props. * Update backend to accept values from EuiSuperDatePicker. * Fix issues with implementation of super date picker. * Fix bug in autorefresh enablement. * Delete obsolete code. * Fix broken types. * Add comment to remind to delete code once it's obsolete. * Fix types. * Remove unused import. * Add polling for ErrorList component. * Update broken unit tests. * Change default autorefresh interval. * Add comments based on PR feedback. * Add comment based on PR feedback.
elastic · Jan 18, 2019 · 0cb9932 · 0cb9932
1 parent a861980
commit 0cb9932
Show file tree

Hide file tree

Showing 45 changed files with 3,178 additions and 852 deletions.
diff --git a/common/graphql/introspection.json b/common/graphql/introspection.json
diff --git a/x-pack/plugins/uptime/common/domain_types/monitors.ts b/x-pack/plugins/uptime/common/domain_types/monitors.ts
@@ -5,6 +5,6 @@
  */
 
 export interface UMGqlRange {
-  dateRangeStart: number;
-  dateRangeEnd: number;
+  dateRangeStart: string;
+  dateRangeEnd: string;
 }
diff --git a/x-pack/plugins/uptime/common/graphql/introspection.json b/x-pack/plugins/uptime/common/graphql/introspection.json
@@ -43,7 +43,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -53,7 +53,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               }
@@ -88,7 +88,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -98,7 +98,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -120,25 +120,41 @@
               {
                 "name": "dateRangeStart",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
+                },
                 "defaultValue": null
               },
               {
                 "name": "dateRangeEnd",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
+                },
                 "defaultValue": null
               },
               {
                 "name": "downCount",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "Int", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "Int", "ofType": null }
+                },
                 "defaultValue": null
               },
               {
                 "name": "windowSize",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "Int", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "Int", "ofType": null }
+                },
                 "defaultValue": null
               },
               {
@@ -159,19 +175,31 @@
               {
                 "name": "monitorId",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "String", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
+                },
                 "defaultValue": null
               },
               {
                 "name": "dateRangeStart",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
+                },
                 "defaultValue": null
               },
               {
                 "name": "dateRangeEnd",
                 "description": "",
-                "type": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null },
+                "type": {
+                  "kind": "NON_NULL",
+                  "name": null,
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
+                },
                 "defaultValue": null
               }
             ],
@@ -193,7 +221,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -203,7 +231,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -240,7 +268,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -250,7 +278,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               }
@@ -269,7 +297,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -279,7 +307,7 @@
                 "type": {
                   "kind": "NON_NULL",
                   "name": null,
-                  "ofType": { "kind": "SCALAR", "name": "UnsignedInteger", "ofType": null }
+                  "ofType": { "kind": "SCALAR", "name": "String", "ofType": null }
                 },
                 "defaultValue": null
               },
@@ -324,16 +352,6 @@
         "enumValues": null,
         "possibleTypes": null
       },
-      {
-        "kind": "SCALAR",
-        "name": "UnsignedInteger",
-        "description": "",
-        "fields": null,
-        "inputFields": null,
-        "interfaces": null,
-        "enumValues": null,
-        "possibleTypes": null
-      },
       {
         "kind": "OBJECT",
         "name": "PingResults",
@@ -1372,6 +1390,16 @@
         "enumValues": null,
         "possibleTypes": null
       },
+      {
+        "kind": "SCALAR",
+        "name": "UnsignedInteger",
+        "description": "",
+        "fields": null,
+        "inputFields": null,
+        "interfaces": null,
+        "enumValues": null,
+        "possibleTypes": null
+      },
       {
         "kind": "OBJECT",
         "name": "LatestMonitorsResult",

diff --git a/x-pack/plugins/uptime/common/graphql/types.ts b/x-pack/plugins/uptime/common/graphql/types.ts
@@ -399,51 +399,51 @@ export interface AllPingsQueryArgs {
 
   status?: string | null;
 
-  dateRangeStart: UnsignedInteger;
+  dateRangeStart: string;
 
-  dateRangeEnd: UnsignedInteger;
+  dateRangeEnd: string;
 }
 export interface GetMonitorsQueryArgs {
-  dateRangeStart: UnsignedInteger;
+  dateRangeStart: string;
 
-  dateRangeEnd: UnsignedInteger;
+  dateRangeEnd: string;
 
   filters?: string | null;
 }
 export interface GetSnapshotQueryArgs {
-  dateRangeStart?: UnsignedInteger | null;
+  dateRangeStart: string;
 
-  dateRangeEnd?: UnsignedInteger | null;
+  dateRangeEnd: string;
 
-  downCount?: number | null;
+  downCount: number;
 
-  windowSize?: number | null;
+  windowSize: number;
 
   filters?: string | null;
 }
 export interface GetMonitorChartsDataQueryArgs {
-  monitorId?: string | null;
+  monitorId: string;
 
-  dateRangeStart?: UnsignedInteger | null;
+  dateRangeStart: string;
 
-  dateRangeEnd?: UnsignedInteger | null;
+  dateRangeEnd: string;
 }
 export interface GetLatestMonitorsQueryArgs {
-  dateRangeStart: UnsignedInteger;
+  dateRangeStart: string;
 
-  dateRangeEnd: UnsignedInteger;
+  dateRangeEnd: string;
 
   monitorId?: string | null;
 }
 export interface GetFilterBarQueryArgs {
-  dateRangeStart: UnsignedInteger;
+  dateRangeStart: string;
 
-  dateRangeEnd: UnsignedInteger;
+  dateRangeEnd: string;
 }
 export interface GetErrorsListQueryArgs {
-  dateRangeStart: UnsignedInteger;
+  dateRangeStart: string;
 
-  dateRangeEnd: UnsignedInteger;
+  dateRangeEnd: string;
 
   filters?: string | null;
 }

diff --git a/x-pack/plugins/uptime/public/components/queries/empty_state/empty_state.tsx b/x-pack/plugins/uptime/public/components/queries/empty_state/empty_state.tsx
@@ -9,22 +9,19 @@ import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n/react';
 import React, { Fragment } from 'react';
 import { Query } from 'react-apollo';
+import { UptimeCommonProps } from '../../../uptime_app';
 import { getDocCountQuery } from './get_doc_count';
 
 interface EmptyStateProps {
-  autorefreshInterval: number;
-  autorefreshEnabled: boolean;
   children: JSX.Element[];
 }
 
-export const EmptyState = ({
-  autorefreshInterval,
-  autorefreshEnabled,
-  children,
-}: EmptyStateProps) => (
+type Props = EmptyStateProps & UptimeCommonProps;
+
+export const EmptyState = ({ autorefreshInterval, autorefreshIsPaused, children }: Props) => (
   <Query
     query={getDocCountQuery}
-    pollInterval={autorefreshEnabled ? autorefreshInterval : undefined}
+    pollInterval={autorefreshIsPaused ? undefined : autorefreshInterval}
   >
     {({ loading, error, data }) => {
       if (loading) {

diff --git a/x-pack/plugins/uptime/public/components/queries/error_list/error_list.tsx b/x-pack/plugins/uptime/public/components/queries/error_list/error_list.tsx
@@ -12,16 +12,27 @@ import moment from 'moment';
 import React, { Fragment } from 'react';
 import { Query } from 'react-apollo';
 import { Link } from 'react-router-dom';
+import { UptimeCommonProps } from '../../../uptime_app';
 import { getErrorListQuery } from './get_error_list';
 
 interface ErrorListProps {
-  dateRangeStart: number;
-  dateRangeEnd: number;
   filters?: string;
 }
 
-export const ErrorList = ({ dateRangeStart, dateRangeEnd, filters }: ErrorListProps) => (
-  <Query query={getErrorListQuery} variables={{ dateRangeStart, dateRangeEnd, filters }}>
+type Props = ErrorListProps & UptimeCommonProps;
+
+export const ErrorList = ({
+  dateRangeStart,
+  dateRangeEnd,
+  filters,
+  autorefreshInterval,
+  autorefreshIsPaused,
+}: Props) => (
+  <Query
+    query={getErrorListQuery}
+    variables={{ dateRangeStart, dateRangeEnd, filters }}
+    pollInterval={autorefreshIsPaused ? undefined : autorefreshInterval}
+  >
     {({ loading, error, data }) => {
       if (error) {
         return i18n.translate('xpack.uptime.errorList.errorMessage', {

diff --git a/x-pack/plugins/uptime/public/components/queries/error_list/get_error_list.ts b/x-pack/plugins/uptime/public/components/queries/error_list/get_error_list.ts
@@ -7,11 +7,7 @@
 import gql from 'graphql-tag';
 
 export const getErrorListQuery = gql`
-  query ErrorList(
-    $dateRangeStart: UnsignedInteger!
-    $dateRangeEnd: UnsignedInteger!
-    $filters: String
-  ) {
+  query ErrorList($dateRangeStart: String!, $dateRangeEnd: String!, $filters: String) {
     errorList: getErrorsList(
       dateRangeStart: $dateRangeStart
       dateRangeEnd: $dateRangeEnd

diff --git a/x-pack/plugins/uptime/public/components/queries/filter_bar/filter_bar.tsx b/x-pack/plugins/uptime/public/components/queries/filter_bar/filter_bar.tsx
@@ -10,19 +10,20 @@ import { i18n } from '@kbn/i18n';
 import { take } from 'lodash';
 import React from 'react';
 import { Query } from 'react-apollo';
+import { UptimeCommonProps } from '../../../uptime_app';
 import { getFilterBarQuery } from './get_filter_bar';
 import { filterBarSearchSchema } from './search_schema';
 
 interface FilterBarProps {
-  dateRangeStart: number;
-  dateRangeEnd: number;
   updateQuery: (query: object | undefined) => void;
 }
 
+type Props = FilterBarProps & UptimeCommonProps;
+
 const MAX_SELECTION_LENGTH = 20;
 const SEARCH_THRESHOLD = 2;
 
-export const FilterBar = ({ dateRangeEnd, dateRangeStart, updateQuery }: FilterBarProps) => (
+export const FilterBar = ({ dateRangeEnd, dateRangeStart, updateQuery }: Props) => (
   <Query query={getFilterBarQuery} variables={{ dateRangeStart, dateRangeEnd }}>
     {({ loading, error, data }) => {
       if (loading) {

diff --git a/x-pack/plugins/uptime/public/components/queries/filter_bar/get_filter_bar.ts b/x-pack/plugins/uptime/public/components/queries/filter_bar/get_filter_bar.ts
@@ -7,7 +7,7 @@
 import gql from 'graphql-tag';
 
 export const getFilterBarQuery = gql`
-  query FilterBar($dateRangeStart: UnsignedInteger!, $dateRangeEnd: UnsignedInteger!) {
+  query FilterBar($dateRangeStart: String!, $dateRangeEnd: String!) {
     filterBar: getFilterBar(dateRangeStart: $dateRangeStart, dateRangeEnd: $dateRangeEnd) {
       status
       port