Add Watch Bug Information Debugger as a connectionless plugin

Differential Revision: D19211198

fbshipit-source-id: 0a63fe8077141b5221254a668ef4c0e83c7d33ea

src/chrome/MainSidebar.tsx

@@ -54,6 +54,7 @@ import {BackgroundColorProperty} from 'csstype';
 import SupportRequestFormManager from '../fb-stubs/SupportRequestFormManager';
 import SupportRequestDetails from '../fb-stubs/SupportRequestDetails';
 import SupportRequestFormV2 from '../fb-stubs/SupportRequestFormV2';
+import WatchTools from '../fb-stubs/WatchTools';
 
 type FlipperPlugins = typeof FlipperPlugin[];
 type PluginsByCategory = [string, FlipperPlugins][];
@@ -254,11 +255,13 @@ type DispatchFromProps = {
 type Props = OwnProps & StateFromProps & DispatchFromProps;
 type State = {
   showSupportForm: boolean;
+  showWatchDebugRoot: boolean;
   showAllPlugins: boolean;
 };
 class MainSidebar extends PureComponent<Props, State> {
   state: State = {
     showSupportForm: GK.get('support_requests_v2'),
+    showWatchDebugRoot: GK.get('watch_team_flipper_clientless_access'),
     showAllPlugins: false,
   };
   static getDerivedStateFromProps(props: Props, state: State) {
@@ -373,6 +376,25 @@ class MainSidebar extends PureComponent<Props, State> {
             </ListItem>
           )}
         </Plugins>
+        {this.state.showWatchDebugRoot &&
+          (function() {
+            const active = isStaticViewActive(staticView, WatchTools);
+            return (
+              <ListItem
+                active={active}
+                style={{
+                  borderTop: `1px solid ${colors.blackAlpha10}`,
+                }}
+                onClick={() => setStaticView(WatchTools)}>
+                <PluginIcon
+                  color={colors.light50}
+                  name={'watch-tv'}
+                  isActive={active}
+                />
+                <PluginName isActive={active}>Watch</PluginName>
+              </ListItem>
+            );
+          })()}
         {this.renderNotificationsEntry()}
         {this.state.showSupportForm &&
           (function() {

src/fb-stubs/WatchTools.tsx

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ */
+
+import React, {Component} from 'react';
+import {Text} from '../ui';
+
+export default class extends Component<void, void> {
+  render() {
+    return <Text>Debug Videos on Watch Bugs.</Text>;
+  }
+}