fix page size issue

elastic · May 19, 2020 · 72ec35e · 72ec35e
1 parent 71420ff
commit 72ec35e
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 16 deletions.
diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list.tsx b/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list.tsx
@@ -14,7 +14,7 @@ import {
   EuiPanel,
   EuiSpacer,
 } from '@elastic/eui';
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import styled from 'styled-components';
 import { HistogramPoint } from '../../../../common/runtime_types';
 import { MonitorSummary } from '../../../../common/runtime_types';
@@ -43,27 +43,13 @@ const TruncatedEuiLink = styled(EuiLink)`
   text-overflow: ellipsis;
 `;
 
-const DEFAULT_PAGE_SIZE = 10;
-const LOCAL_STORAGE_KEY = 'xpack.uptime.monitorList.pageSize';
-const getPageSizeValue = () => {
-  const value = parseInt(localStorage.getItem(LOCAL_STORAGE_KEY) ?? '', 10);
-  if (isNaN(value)) {
-    return DEFAULT_PAGE_SIZE;
-  }
-  return value;
-};
-
 export const MonitorListComponent: React.FC<Props> = ({
   filters,
   monitorList: { list, error, loading },
   linkParameters,
   pageSize,
   setPageSize,
 }) => {
-  useEffect(() => {
-    setPageSize(getPageSizeValue());
-  }, [setPageSize]);
-
   const [drawerIds, updateDrawerIds] = useState<string[]>([]);
 
   const items = list.summaries ?? [];

diff --git a/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list_container.tsx b/x-pack/plugins/uptime/public/components/overview/monitor_list/monitor_list_container.tsx
@@ -17,10 +17,20 @@ export interface MonitorListProps {
   linkParameters?: string;
 }
 
+const DEFAULT_PAGE_SIZE = 10;
+const LOCAL_STORAGE_KEY = 'xpack.uptime.monitorList.pageSize';
+const getPageSizeValue = () => {
+  const value = parseInt(localStorage.getItem(LOCAL_STORAGE_KEY) ?? '', 10);
+  if (isNaN(value)) {
+    return DEFAULT_PAGE_SIZE;
+  }
+  return value;
+};
+
 export const MonitorList: React.FC<MonitorListProps> = props => {
   const { filters } = props;
 
-  const [pageSize, setPageSize] = useState<number>(10);
+  const [pageSize, setPageSize] = useState<number>(getPageSizeValue);
 
   const dispatch = useDispatch();