diff --git a/x-pack/plugins/observability/public/pages/home/index.tsx b/x-pack/plugins/observability/public/pages/home/index.tsx
index 349533346f2ad6..4310cd1aa4485b 100644
--- a/x-pack/plugins/observability/public/pages/home/index.tsx
+++ b/x-pack/plugins/observability/public/pages/home/index.tsx
@@ -3,7 +3,7 @@
  * or more contributor license agreements. Licensed under the Elastic License;
  * you may not use this file except in compliance with the Elastic License.
  */
-import React from 'react';
+import React, { useEffect } from 'react';
 import { useHistory } from 'react-router-dom';
 import { fetchHasData } from '../../data_handler';
 import { useFetcher } from '../../hooks/use_fetcher';
@@ -15,12 +15,14 @@ export function HomePage() {
   const values = Object.values(data);
   const hasSomeData = values.length ? values.some((hasData) => hasData) : null;
 
-  if (hasSomeData === true) {
-    history.push({ pathname: '/overview' });
-  }
-  if (hasSomeData === false) {
-    history.push({ pathname: '/landing' });
-  }
+  useEffect(() => {
+    if (hasSomeData === true) {
+      history.push({ pathname: '/overview' });
+    }
+    if (hasSomeData === false) {
+      history.push({ pathname: '/landing' });
+    }
+  }, [hasSomeData, history]);
 
   return <></>;
 }