Introduce onConnect / onDisconnect hooks

Summary:
Introduced hooks that are called whenever the plugin is connected / disconnected to it's counter part on the device.

There is some logic duplication between `PluginContainer` for old plugins, and `PluginRenderer` for new plugins, mostly caused by the fact that those lifecycles are triggered from the UI rather than from the reducers, but I figured refactoring that to be too risky.

Reviewed By: jknoxville

Differential Revision: D22232337

fbshipit-source-id: a384c45731a4c8d9b8b532a83e2becf49ce807c2

desktop/flipper-plugin/src/plugin/Plugin.tsx

@@ -24,13 +24,32 @@ export interface FlipperClient<
    * the onDestroy event is fired whenever a client is unloaded from Flipper, or a plugin is disabled.
    */
   onDestroy(cb: () => void): void;
+
+  /**
+   * the onConnect event is fired whenever the plugin is connected to it's counter part on the device.
+   * For most plugins this event is fired if the user selects the plugin,
+   * for background plugins when the initial connection is made.
+   */
+  onConnect(cb: () => void): void;
+
+  /**
+   * The counterpart of the `onConnect` handler.
+   * Will also be fired before the plugin is cleaned up if the connection is currently active:
+   * - when the client disconnects
+   * - when the plugin is disabled
+   */
+  onDisconnect(cb: () => void): void;
 }
 
 /**
  * Internal API exposed by Flipper, and wrapped by FlipperPluginInstance to be passed to the
  * Plugin Factory. For internal purposes only
  */
-interface RealFlipperClient {}
+interface RealFlipperClient {
+  isBackgroundPlugin(pluginId: string): boolean;
+  initPlugin(pluginId: string): void;
+  deinitPlugin(pluginId: string): void;
+}
 
 export type FlipperPluginFactory<
   Events extends EventsContract,
@@ -49,6 +68,7 @@ export class SandyPluginInstance {
   /** the plugin instance api as used inside components and such  */
   instanceApi: any;
 
+  connected = false;
   events = new EventEmitter();
 
   constructor(
@@ -61,19 +81,48 @@ export class SandyPluginInstance {
       onDestroy: (cb) => {
         this.events.on('destroy', cb);
       },
+      onConnect: (cb) => {
+        this.events.on('connect', cb);
+      },
+      onDisconnect: (cb) => {
+        this.events.on('disconnect', cb);
+      },
     };
     this.instanceApi = definition.module.plugin(this.client);
   }
 
+  // the plugin is selected in the UI
   activate() {
-    // TODO: T68683507
+    const pluginId = this.definition.id;
+    if (!this.realClient.isBackgroundPlugin(pluginId)) {
+      this.realClient.initPlugin(pluginId); // will call connect() if needed
+    }
   }
 
+  // the plugin is deselected in the UI
   deactivate() {
-    // TODO: T68683507
+    const pluginId = this.definition.id;
+    if (!this.realClient.isBackgroundPlugin(pluginId)) {
+      this.realClient.deinitPlugin(pluginId);
+    }
+  }
+
+  connect() {
+    if (!this.connected) {
+      this.connected = true;
+      this.events.emit('connect');
+    }
+  }
+
+  disconnect() {
+    if (this.connected) {
+      this.connected = false;
+      this.events.emit('disconnect');
+    }
   }
 
   destroy() {
+    this.disconnect();
     this.events.emit('destroy');
   }
 

desktop/flipper-plugin/src/plugin/PluginContext.tsx

@@ -8,16 +8,8 @@
  */
 
 import {createContext} from 'react';
+import {SandyPluginInstance} from './Plugin';
 
-export type SandyPluginContext = {
-  deactivate(): void;
-};
-
-// TODO: to be filled in later with testing and such
-const stubPluginContext: SandyPluginContext = {
-  deactivate() {},
-};
-
-export const SandyPluginContext = createContext<SandyPluginContext>(
-  stubPluginContext,
-);
+export const SandyPluginContext = createContext<
+  SandyPluginInstance | undefined
+>(undefined);

desktop/flipper-plugin/src/plugin/PluginRenderer.tsx

@@ -21,7 +21,10 @@ type Props = {
 export const SandyPluginRenderer = memo(
   ({plugin}: Props) => {
     useEffect(() => {
-      plugin.deactivate();
+      plugin.activate();
+      return () => {
+        plugin.deactivate();
+      };
     }, [plugin]);
 
     return (