From f924b0ae1b83026a8dd8ecf47edd3e8bd6c4f394 Mon Sep 17 00:00:00 2001
From: Pritesh Nandgaonkar <prit91@fb.com>
Date: Tue, 8 Oct 2019 11:58:25 -0700
Subject: [PATCH] Add support manager to display an error screen or litho form

Summary:
This diff shows the error screen when one of the following condition is met:

- Selected device is not android
- No clients are active for selected device
-  At least there is one client which supports inspector plugin.

For this I have added a SupportRequestManager class which loads the error screen or the litho form based on the above condition.

The UI is super basic. Will improve the design based on your feedback in the coming diffs.

Reviewed By: jknoxville

Differential Revision: D17790596

fbshipit-source-id: 2afc917c93c6e7321399633c5bf9d27a703742ee
---
 src/App.tsx                                          |  9 ++-------
 src/chrome/MainSidebar.tsx                           | 12 +++++++-----
 ...RequestForm.tsx => SupportRequestFormManager.tsx} |  5 ++++-
 src/reducers/connections.tsx                         |  2 +-
 4 files changed, 14 insertions(+), 14 deletions(-)
 rename src/fb-stubs/{SupportRequestForm.tsx => SupportRequestFormManager.tsx} (79%)

diff --git a/src/App.tsx b/src/App.tsx
index 0773afc35..4710cef6c 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -36,7 +36,6 @@ import BugReporter from './fb-stubs/BugReporter';
 import {State as Store} from './reducers/index';
 import {StaticView} from './reducers/connections';
 import PluginManager from './chrome/PluginManager';
-import BaseDevice from './devices/BaseDevice';
 import StatusBar from './chrome/StatusBar';
 import SettingsSheet from './chrome/SettingsSheet';
 const version = remote.app.getVersion();
@@ -52,8 +51,6 @@ type StateFromProps = {
   activeSheet: ActiveSheet;
   share: ShareType | null;
   staticView: StaticView;
-  clients: Array<Client>;
-  selectedDevice: null | BaseDevice;
 };
 
 type Props = StateFromProps & OwnProps;
@@ -125,7 +122,7 @@ export class App extends React.Component<Props> {
         <FlexRow grow={true}>
           {this.props.leftSidebarVisible && <MainSidebar />}
           {this.props.staticView != null ? (
-            React.createElement(this.props.staticView, this.props)
+            React.createElement(this.props.staticView)
           ) : (
             <PluginContainer logger={this.props.logger} />
           )}
@@ -140,14 +137,12 @@ export class App extends React.Component<Props> {
 export default connect<StateFromProps, {}, OwnProps, Store>(
   ({
     application: {leftSidebarVisible, activeSheet, share},
-    connections: {error, staticView, clients, selectedDevice},
+    connections: {error, staticView},
   }) => ({
     leftSidebarVisible,
     activeSheet,
     share: share,
     error,
     staticView,
-    clients,
-    selectedDevice,
   }),
 )(App);
diff --git a/src/chrome/MainSidebar.tsx b/src/chrome/MainSidebar.tsx
index 84c988698..34bd88563 100644
--- a/src/chrome/MainSidebar.tsx
+++ b/src/chrome/MainSidebar.tsx
@@ -44,7 +44,7 @@ import {
   SHOW_REMAINING_PLUGIN_IF_LESS_THAN,
 } from '../Client';
 import {StyledOtherComponent} from 'create-emotion-styled';
-import SupportRequestForm from '../fb-stubs/SupportRequestForm';
+import SupportRequestFormManager from '../fb-stubs/SupportRequestFormManager';
 
 const ListItem = styled('div')(({active}: {active?: boolean}) => ({
   paddingLeft: 10,
@@ -304,18 +304,20 @@ class MainSidebar extends PureComponent<Props> {
           )}
           {GK.get('flipper_support_requests') && (
             <ListItem
-              active={staticView != null && staticView === SupportRequestForm}
-              onClick={() => setStaticView(SupportRequestForm)}>
+              active={
+                staticView != null && staticView === SupportRequestFormManager
+              }
+              onClick={() => setStaticView(SupportRequestFormManager)}>
               <PluginIcon
                 color={colors.light50}
                 name={'app-dailies'}
                 isActive={
-                  staticView != null && staticView === SupportRequestForm
+                  staticView != null && staticView === SupportRequestFormManager
                 }
               />
               <PluginName
                 isActive={
-                  staticView != null && staticView === SupportRequestForm
+                  staticView != null && staticView === SupportRequestFormManager
                 }>
                 Litho Support Request
               </PluginName>
diff --git a/src/fb-stubs/SupportRequestForm.tsx b/src/fb-stubs/SupportRequestFormManager.tsx
similarity index 79%
rename from src/fb-stubs/SupportRequestForm.tsx
rename to src/fb-stubs/SupportRequestFormManager.tsx
index 93dc8d6b9..fc4c0d2d0 100644
--- a/src/fb-stubs/SupportRequestForm.tsx
+++ b/src/fb-stubs/SupportRequestFormManager.tsx
@@ -8,7 +8,10 @@
 import Text from '../ui/components/FlexRow';
 import React, {PureComponent} from 'react';
 
-export default class SupportRequestForm extends PureComponent<void, void> {
+export default class SupportRequestFormManager extends PureComponent<
+  void,
+  void
+> {
   render() {
     return <Text> Implement your own Bug creator </Text>;
   }
diff --git a/src/reducers/connections.tsx b/src/reducers/connections.tsx
index 1e69bcc25..40529dfb6 100644
--- a/src/reducers/connections.tsx
+++ b/src/reducers/connections.tsx
@@ -18,7 +18,7 @@ import {Actions} from '.';
 const WelcomeScreen = isHeadless()
   ? require('../chrome/WelcomeScreenHeadless').default
   : require('../chrome/WelcomeScreen').default;
-import SupportRequestForm from '../fb-stubs/SupportRequestForm';
+import SupportRequestForm from '../fb-stubs/SupportRequestFormManager';
 
 export type StaticView =
   | null