From 55936a83a1ea953c25e16595342461b41986cb71 Mon Sep 17 00:00:00 2001
From: Marco Antonio Ghiani <marcoantonio.ghiani01@gmail.com>
Date: Wed, 6 Sep 2023 10:46:13 +0200
Subject: [PATCH] [Log Explorer] Fix broken data grid on columns update
 (#165679)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## 📓  Summary

Closes #165558

The issue was caused by a particular condition caused by the overridden
`data` service that the plugin injects in the Discover App.
Reverse engineering from the blank screen when updating the columns:
1. The `DiscoverHistogramLayout` is rendered conditionally only [when a
`searchSessionId`
exists](https://github.com/elastic/kibana/blob/main/src/plugins/discover/public/application/main/components/layout/discover_histogram_layout.tsx#L47).
2. The `searchSessionId` is initialized with a default value and exists
until [the `data.search.session.clear()` function is
invoked](https://github.com/elastic/kibana/blob/main/src/plugins/discover/public/application/main/discover_main_app.tsx#L82).
3. Being this effect cleanup callback is invoked when
`data.search.session` changes in its reference, the issue is caused by
the [injected
service](https://github.com/elastic/kibana/blob/main/x-pack/plugins/log_explorer/public/components/log_explorer/log_explorer.tsx#L52-L62).
4. The root cause is that each time a property is read from the proxied
`data` service, new nested Proxies are created, triggering the useEffect
cleanup function since the new Proxy has a new reference.

The implemented solution adds an enhanced version of
`createPropertyGetProxy` that keeps the created proxy as a singleton,
storing the original value in a cache by a passed key.

---------

Co-authored-by: Marco Antonio Ghiani <marcoantonio.ghiani@elastic.co>
---
 .../components/log_explorer/log_explorer.tsx  | 20 +++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/x-pack/plugins/log_explorer/public/components/log_explorer/log_explorer.tsx b/x-pack/plugins/log_explorer/public/components/log_explorer/log_explorer.tsx
index 10bd9039751f1..fa76cadeb727b 100644
--- a/x-pack/plugins/log_explorer/public/components/log_explorer/log_explorer.tsx
+++ b/x-pack/plugins/log_explorer/public/components/log_explorer/log_explorer.tsx
@@ -6,7 +6,7 @@
  */
 
 import { ScopedHistory } from '@kbn/core-application-browser';
-import { DataPublicPluginStart, ISearchStart, ISessionService } from '@kbn/data-plugin/public';
+import { DataPublicPluginStart } from '@kbn/data-plugin/public';
 import { DiscoverStart } from '@kbn/discover-plugin/public';
 import React from 'react';
 import {
@@ -50,13 +50,17 @@ export const createLogExplorer = ({
  * are no-ops.
  */
 const createDataServiceProxy = (data: DataPublicPluginStart) => {
+  const noOpEnableStorage = () => {};
+
+  const sessionServiceProxy = createPropertyGetProxy(data.search.session, {
+    enableStorage: () => noOpEnableStorage,
+  });
+
+  const searchServiceProxy = createPropertyGetProxy(data.search, {
+    session: () => sessionServiceProxy,
+  });
+
   return createPropertyGetProxy(data, {
-    search: (searchService: ISearchStart) =>
-      createPropertyGetProxy(searchService, {
-        session: (sessionService: ISessionService) =>
-          createPropertyGetProxy(sessionService, {
-            enableStorage: () => () => {},
-          }),
-      }),
+    search: () => searchServiceProxy,
   });
 };