From 72ec35e296f0319c08fa8ece40d95f791081ac4e Mon Sep 17 00:00:00 2001
From: Shahzad <shahzad31comp@gmail.com>
Date: Tue, 19 May 2020 04:43:59 +0200
Subject: [PATCH] fix page size issue

---
 .../overview/monitor_list/monitor_list.tsx       | 16 +---------------
 .../monitor_list/monitor_list_container.tsx      | 12 +++++++++++-
 2 files changed, 12 insertions(+), 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
index 1e0811d8b346b..a0e7e78bc0c64 100644
--- 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,16 +43,6 @@ 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 },
@@ -60,10 +50,6 @@ export const MonitorListComponent: React.FC<Props> = ({
   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
index 2336206efd7bf..9aac7c9af5a82 100644
--- 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();