From d0a3cb5f745a09f000255ccb476e5423a10a9565 Mon Sep 17 00:00:00 2001
From: Sidharth Guglani <sidharthguglani@fb.com>
Date: Wed, 7 Aug 2019 06:13:36 -0700
Subject: [PATCH] Add button to navigate to Yoga Performance Plugin from Layout
 Inspector

Summary:
Add button in layout inspector to navigate to yoga performance plugin for analyzing a particular component.
We send component id in payload to yoga plugin which then uses to highlight the corresponding component in yoga plugin

Reviewed By: davidaurelio

Differential Revision: D16561301

fbshipit-source-id: 950fb3ea501283fec0a3036fb2796c178014f1f5
---
 src/plugins/layout/index.js | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/src/plugins/layout/index.js b/src/plugins/layout/index.js
index 24ed9347e..8f4fbecb4 100644
--- a/src/plugins/layout/index.js
+++ b/src/plugins/layout/index.js
@@ -21,6 +21,8 @@ import {
   Sidebar,
   DetailSidebar,
   VerticalRule,
+  Button,
+  GK,
 } from 'flipper';
 import Inspector from './Inspector';
 import ToolbarIcon from './ToolbarIcon';
@@ -180,6 +182,8 @@ export default class Layout extends FlipperPlugin<State, void, PersistedState> {
 
     const divider = this.state.inAXMode && <VerticalRule />;
 
+    const showAnalyzeYogaPerformanceButton = GK.get('flipper_yogaperformance');
+
     return (
       <FlexColumn grow={true}>
         {this.state.init && (
@@ -235,6 +239,19 @@ export default class Layout extends FlipperPlugin<State, void, PersistedState> {
                 onValueChanged={this.onDataValueChanged}
                 logger={this.props.logger}
               />
+              {showAnalyzeYogaPerformanceButton &&
+              element &&
+              element.decoration === 'litho' ? (
+                <Button
+                  icon={'share-external'}
+                  compact={true}
+                  style={{marginTop: 8, marginRight: 12}}
+                  onClick={() => {
+                    this.props.selectPlugin('YogaPerformance', element.id);
+                  }}>
+                  Analyze Yoga Performance
+                </Button>
+              ) : null}
             </DetailSidebar>
           </>
         )}