[Uptime] Disable sorting on EuiInMemoryTable instances (#30430)

All these tables are for large datasets, which makes the sorting misleading. After we have the states index we can query things in such a way that we can enable sorting (and pagination!). Till then we should disable these to better adhere to the principle of least surprise.
elastic · Feb 14, 2019 · 8584e8a · 8584e8a
1 parent dfc18a7
commit 8584e8a
Show file tree

Hide file tree

Showing 6 changed files with 3 additions and 30 deletions.
diff --git a/...gins/uptime/public/components/functional/__tests__/__snapshots__/error_list.test.tsx.snap b/...gins/uptime/public/components/functional/__tests__/__snapshots__/error_list.test.tsx.snap
@@ -25,35 +25,29 @@ exports[`ErrorList component renders the error list without errors 1`] = `
           Object {
             "field": "type",
             "name": "Error type",
-            "sortable": true,
           },
           Object {
             "field": "monitorId",
             "name": "Monitor ID",
             "render": [Function],
-            "sortable": true,
             "width": "25%",
           },
           Object {
             "field": "count",
             "name": "Count",
-            "sortable": true,
           },
           Object {
             "field": "timestamp",
             "name": "Latest error",
             "render": [Function],
-            "sortable": true,
           },
           Object {
             "field": "statusCode",
             "name": "Status code",
-            "sortable": true,
           },
           Object {
             "field": "latestMessage",
             "name": "Latest message",
-            "sortable": true,
             "width": "40%",
           },
         ]
@@ -108,7 +102,7 @@ exports[`ErrorList component renders the error list without errors 1`] = `
         }
       }
       responsive={true}
-      sorting={true}
+      sorting={false}
     />
   </EuiPanel>
 </Fragment>

diff --git a/...ns/uptime/public/components/functional/__tests__/__snapshots__/monitor_list.test.tsx.snap b/...ns/uptime/public/components/functional/__tests__/__snapshots__/monitor_list.test.tsx.snap
@@ -26,13 +26,11 @@ exports[`MonitorList component renders a monitor list without errors 1`] = `
             "field": "ping.monitor.status",
             "name": "Status",
             "render": [Function],
-            "sortable": true,
           },
           Object {
             "field": "ping.timestamp",
             "name": "Last updated",
             "render": [Function],
-            "sortable": true,
           },
           Object {
             "field": "ping.monitor.id",
@@ -47,7 +45,6 @@ exports[`MonitorList component renders a monitor list without errors 1`] = `
           Object {
             "field": "ping.monitor.ip",
             "name": "IP",
-            "sortable": true,
           },
           Object {
             "field": "upSeries",
@@ -1284,7 +1281,7 @@ exports[`MonitorList component renders a monitor list without errors 1`] = `
         }
       }
       responsive={true}
-      sorting={true}
+      sorting={false}
     />
   </EuiPanel>
 </Fragment>

diff --git a/...ugins/uptime/public/components/functional/__tests__/__snapshots__/ping_list.test.tsx.snap b/...ugins/uptime/public/components/functional/__tests__/__snapshots__/ping_list.test.tsx.snap
@@ -101,13 +101,11 @@ exports[`PingList component renders sorted list without errors 1`] = `
             "field": "monitor.status",
             "name": "Status",
             "render": [Function],
-            "sortable": true,
           },
           Object {
             "field": "timestamp",
             "name": "Timestamp",
             "render": [Function],
-            "sortable": true,
           },
           Object {
             "field": "monitor.ip",
@@ -123,7 +121,6 @@ exports[`PingList component renders sorted list without errors 1`] = `
             "field": "monitor.duration.us",
             "name": "Duration ms",
             "render": [Function],
-            "sortable": true,
           },
           Object {
             "field": "error.type",
@@ -347,7 +344,7 @@ exports[`PingList component renders sorted list without errors 1`] = `
         }
       }
       responsive={true}
-      sorting={true}
+      sorting={false}
     />
   </EuiPanel>
 </Fragment>

diff --git a/x-pack/plugins/uptime/public/components/functional/error_list.tsx b/x-pack/plugins/uptime/public/components/functional/error_list.tsx
@@ -35,49 +35,42 @@ export const ErrorList = ({ loading, errorList }: ErrorListProps) => (
             name: i18n.translate('xpack.uptime.errorList.errorTypeColumnLabel', {
               defaultMessage: 'Error type',
             }),
-            sortable: true,
           },
           {
             field: 'monitorId',
             name: i18n.translate('xpack.uptime.errorList.monitorIdColumnLabel', {
               defaultMessage: 'Monitor ID',
             }),
             render: (id: string) => <Link to={`/monitor/${id}`}>{id}</Link>,
-            sortable: true,
             width: '25%',
           },
           {
             field: 'count',
             name: i18n.translate('xpack.uptime.errorList.CountColumnLabel', {
               defaultMessage: 'Count',
             }),
-            sortable: true,
           },
           {
             field: 'timestamp',
             name: i18n.translate('xpack.uptime.errorList.latestErrorColumnLabel', {
               defaultMessage: 'Latest error',
             }),
-            sortable: true,
             render: (timestamp: string) => moment(timestamp).fromNow(),
           },
           {
             field: 'statusCode',
             name: i18n.translate('xpack.uptime.errorList.statusCodeColumnLabel', {
               defaultMessage: 'Status code',
             }),
-            sortable: true,
           },
           {
             field: 'latestMessage',
             name: i18n.translate('xpack.uptime.errorList.latestMessageColumnLabel', {
               defaultMessage: 'Latest message',
             }),
-            sortable: true,
             width: '40%',
           },
         ]}
-        sorting={true}
         pagination={{ initialPageSize: 10, pageSizeOptions: [5, 10, 20, 50] }}
       />
     </EuiPanel>

diff --git a/x-pack/plugins/uptime/public/components/functional/monitor_list.tsx b/x-pack/plugins/uptime/public/components/functional/monitor_list.tsx
@@ -69,15 +69,13 @@ export const MonitorList = ({ dangerColor, loading, monitors, primaryColor }: Mo
                     })}
               </EuiHealth>
             ),
-            sortable: true,
           },
           {
             field: 'ping.timestamp',
             name: i18n.translate('xpack.uptime.monitorList.lastUpdatedColumnLabel', {
               defaultMessage: 'Last updated',
             }),
             render: (timestamp: string) => moment(timestamp).fromNow(),
-            sortable: true,
           },
           {
             field: 'ping.monitor.id',
@@ -108,7 +106,6 @@ export const MonitorList = ({ dangerColor, loading, monitors, primaryColor }: Mo
             name: i18n.translate('xpack.uptime.monitorList.ipColumnLabel', {
               defaultMessage: 'IP',
             }),
-            sortable: true,
           },
           {
             field: 'upSeries',
@@ -151,7 +148,6 @@ export const MonitorList = ({ dangerColor, loading, monitors, primaryColor }: Mo
         loading={loading}
         items={monitors}
         pagination={monitorListPagination}
-        sorting={true}
       />
     </EuiPanel>
   </Fragment>

diff --git a/x-pack/plugins/uptime/public/components/functional/ping_list.tsx b/x-pack/plugins/uptime/public/components/functional/ping_list.tsx
@@ -60,14 +60,12 @@ export const PingList = ({
               })}
         </EuiHealth>
       ),
-      sortable: true,
     },
     {
       field: 'timestamp',
       name: i18n.translate('xpack.uptime.pingList.timestampColumnLabel', {
         defaultMessage: 'Timestamp',
       }),
-      sortable: true,
       render: (timestamp: string) => moment(timestamp).fromNow(),
     },
     {
@@ -91,7 +89,6 @@ export const PingList = ({
         description: 'The "ms" in the default message is an abbreviation for milliseconds',
       }),
       render: (duration: number) => duration / 1000,
-      sortable: true,
     },
     {
       field: 'error.type',
@@ -182,7 +179,6 @@ export const PingList = ({
           columns={columns}
           items={pings}
           pagination={{ initialPageSize: 10, pageSizeOptions: [5, 10, 20, 100] }}
-          sorting={true}
         />
       </EuiPanel>
     </Fragment>