Fixed re-enabling a still selected plugin

Summary: While testing manually discovered the sandy plugin infra din't cover the case that a plugin can be selected but not enabled at the same time. Added test and fixed that.

Reviewed By: nikoant

Differential Revision: D22308597

fbshipit-source-id: 6cef2b543013ee81cee449396d523dd9a657ad1c

desktop/flipper-plugin/src/index.ts

@@ -13,7 +13,7 @@ export {SandyPluginInstance, FlipperClient} from './plugin/Plugin';
 export {SandyPluginDefinition} from './plugin/SandyPluginDefinition';
 export {SandyPluginRenderer} from './plugin/PluginRenderer';
 export {SandyPluginContext, usePlugin} from './plugin/PluginContext';
-export {createState as createValue, useValue, Atom} from './state/atom';
+export {createState, useValue, Atom} from './state/atom';
 
 // It's not ideal that this exists in flipper-plugin sources directly,
 // but is the least pain for plugin authors.

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

@@ -149,7 +149,11 @@ export class SandyPluginInstance {
 
   // the plugin is deselected in the UI
   deactivate() {
-    this.assertNotDestroyed();
+    if (this.destroyed) {
+      // this can happen if the plugin is disabled while active in the UI.
+      // In that case deinit & destroy is already triggered from the STAR_PLUGIN action
+      return;
+    }
     const pluginId = this.definition.id;
     if (!this.realClient.isBackgroundPlugin(pluginId)) {
       this.realClient.deinitPlugin(pluginId);
@@ -174,7 +178,9 @@ export class SandyPluginInstance {
 
   destroy() {
     this.assertNotDestroyed();
-    this.disconnect();
+    if (this.connected) {
+      this.realClient.deinitPlugin(this.definition.id);
+    }
     this.events.emit('destroy');
     this.destroyed = true;
   }

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

@@ -18,24 +18,17 @@ type Props = {
 /**
  * Component to render a Sandy plugin container
  */
-export const SandyPluginRenderer = memo(
-  ({plugin}: Props) => {
-    useEffect(() => {
-      plugin.activate();
-      return () => {
-        plugin.deactivate();
-      };
-    }, [plugin]);
+export const SandyPluginRenderer = memo(({plugin}: Props) => {
+  useEffect(() => {
+    plugin.activate();
+    return () => {
+      plugin.deactivate();
+    };
+  }, [plugin]);
 
-    return (
-      <SandyPluginContext.Provider value={plugin}>
-        {createElement(plugin.definition.module.Component)}
-      </SandyPluginContext.Provider>
-    );
-  },
-  () => {
-    // One of the goals of the ModernPluginContainer is that we want to prevent it from rendering
-    // for any outside change. Whatever happens outside of us, we don't care. If it is relevant for use, we take care about it from the insde
-    return true;
-  },
-);
+  return (
+    <SandyPluginContext.Provider value={plugin}>
+      {createElement(plugin.definition.module.Component)}
+    </SandyPluginContext.Provider>
+  );
+});

desktop/flipper-plugin/src/test-utils/test-utils.tsx

@@ -117,8 +117,12 @@ export function startPlugin<Module extends FlipperPluginModule<any>>(
       // as from testing perspective the difference shouldn't matter
       return false;
     },
-    initPlugin(_pluginId: string) {},
-    deinitPlugin(_pluginId: string) {},
+    initPlugin(_pluginId: string) {
+      pluginInstance.connect();
+    },
+    deinitPlugin(_pluginId: string) {
+      pluginInstance.disconnect();
+    },
     call(
       api: string,
       method: string,
@@ -131,7 +135,7 @@ export function startPlugin<Module extends FlipperPluginModule<any>>(
 
   const pluginInstance = new SandyPluginInstance(fakeFlipper, definition);
   // we start connected
-  pluginInstance.connect();
+  pluginInstance.activate();
 
   const res: StartPluginResult<Module> = {
     module,