From 5a6d978536917d7a3c2f4e0cad8672c664875ea4 Mon Sep 17 00:00:00 2001
From: Sidharth Guglani <sidharthguglani@fb.com>
Date: Wed, 19 Jun 2019 09:04:58 -0700
Subject: [PATCH] Search with both name and id of the component in layout
 inspector and handle deeplinkpayload

Summary:
deepLinkPayload is passed as initialQuery to Search component and in componentDidMount we perform search if initially query is defined.

This does not handle the case if node is not present in the layout inspector tree.

Reviewed By: danielbuechele

Differential Revision: D15874343

fbshipit-source-id: c604baea16838f07e8f8bfc0f1e67c5e830dfe97
---
 .../plugins/litho/DebugComponentDescriptor.java       |  2 +-
 src/plugins/layout/Search.js                          | 11 +++++++++++
 src/plugins/layout/index.js                           |  8 +++++++-
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/android/src/main/java/com/facebook/flipper/plugins/litho/DebugComponentDescriptor.java b/android/src/main/java/com/facebook/flipper/plugins/litho/DebugComponentDescriptor.java
index ba5c7d8f8..6a6c08b7f 100644
--- a/android/src/main/java/com/facebook/flipper/plugins/litho/DebugComponentDescriptor.java
+++ b/android/src/main/java/com/facebook/flipper/plugins/litho/DebugComponentDescriptor.java
@@ -396,7 +396,7 @@ public class DebugComponentDescriptor extends NodeDescriptor<DebugComponent> {
   @Override
   public boolean matches(String query, DebugComponent node) throws Exception {
     NodeDescriptor descriptor = descriptorForClass(Object.class);
-    return descriptor.matches(query, node);
+    return descriptor.matches(query, node) || getId(node).equals(query);
   }
 
   private static void applyLayoutOverride(
diff --git a/src/plugins/layout/Search.js b/src/plugins/layout/Search.js
index 99a852340..a70a5d2ab 100644
--- a/src/plugins/layout/Search.js
+++ b/src/plugins/layout/Search.js
@@ -33,6 +33,7 @@ type Props = {
   onSearchResults: (searchResults: ElementSearchResultSet) => void,
   setPersistedState: (state: $Shape<PersistedState>) => void,
   persistedState: PersistedState,
+  initialQuery: ?string,
 };
 
 type State = {
@@ -67,6 +68,16 @@ export default class Search extends Component<Props, State> {
     }
   };
 
+  componentDidMount() {
+    if (this.props.initialQuery) {
+      const queryString = this.props.initialQuery
+        ? this.props.initialQuery
+        : '';
+      clearTimeout(this.timer);
+      this.timer = setTimeout(() => this.performSearch(queryString), 200);
+    }
+  }
+
   performSearch(query: string) {
     this.setState({
       outstandingSearchQuery: query,
diff --git a/src/plugins/layout/index.js b/src/plugins/layout/index.js
index ba26f3401..8ab629b52 100644
--- a/src/plugins/layout/index.js
+++ b/src/plugins/layout/index.js
@@ -94,7 +94,12 @@ export default class Layout extends FlipperPlugin<State, void, PersistedState> {
       }
     });
 
-    this.setState({init: true});
+    this.setState({
+      init: true,
+      selectedElement: this.props.deepLinkPayload
+        ? this.props.deepLinkPayload
+        : null,
+    });
   }
 
   onToggleTargetMode = () => {
@@ -201,6 +206,7 @@ export default class Layout extends FlipperPlugin<State, void, PersistedState> {
                   this.setState({searchResults})
                 }
                 inAXMode={this.state.inAXMode}
+                initialQuery={this.props.deepLinkPayload}
               />
             </Toolbar>