Introduce useLogger hook

Summary: In the Flipper chrome there is a lot of `logger={logger}` prop drilling. Let's not do that anymore in the future by using a proper hook, which is exposed from `flipper-plugin`.

Reviewed By: passy

Differential Revision: D25421304

fbshipit-source-id: 01ec8563c67f7e2fac359c2f8216eba722bff8d9

desktop/flipper-plugin/src/__tests__/api.node.tsx

@@ -38,6 +38,7 @@ test('Correct top level API exposed', () => {
       "sleep",
       "styled",
       "theme",
+      "useLogger",
       "usePlugin",
       "useTrackedCallback",
       "useValue",
@@ -57,9 +58,12 @@ test('Correct top level API exposed', () => {
       "Draft",
       "FlipperLib",
       "LogLevel",
+      "LogTypes",
+      "Logger",
       "MenuEntry",
       "NormalizedMenuEntry",
       "PluginClient",
+      "TrackType",
     ]
   `);
 });

desktop/flipper-plugin/src/index.ts

@@ -62,6 +62,13 @@ export {
 } from './ui/Tracked';
 
 export {sleep} from './utils/sleep';
+export {
+  LogTypes,
+  TrackType,
+  Logger,
+  useLogger,
+  _LoggerContext,
+} from './utils/Logger';
 
 // It's not ideal that this exists in flipper-plugin sources directly,
 // but is the least pain for plugin authors.

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

@@ -0,0 +1,67 @@
+/**
+ * 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 {createContext, useContext} from 'react';
+
+export type LogTypes = 'error' | 'warn' | 'info' | 'debug';
+export type TrackType =
+  | 'duration'
+  | 'usage'
+  | 'performance'
+  | 'success-rate'
+  | 'operation-cancelled';
+
+export interface Logger {
+  track(type: TrackType, event: string, data?: any, plugin?: string): void;
+
+  trackTimeSince(
+    mark: string,
+    eventName?: string | null | undefined,
+    data?: any,
+  ): void;
+
+  info(data: any, category: string): void;
+
+  warn(data: any, category: string): void;
+
+  error(data: any, category: string): void;
+
+  debug(data: any, category: string): void;
+}
+
+export const _LoggerContext = createContext<Logger>({
+  track() {},
+  trackTimeSince() {},
+  info() {
+    // eslint-disable-next-line
+    console.log.apply(console, arguments as any);
+  },
+  warn() {
+    // eslint-disable-next-line
+    console.warn.apply(console, arguments as any);
+  },
+  error() {
+    // eslint-disable-next-line
+    console.error.apply(console, arguments as any);
+  },
+  debug() {
+    // eslint-disable-next-line
+    console.debug.apply(console, arguments as any);
+  },
+});
+
+/**
+ * Provides the default logger that can be used for console logging,
+ * error reporting and performance measurements.
+ * In internal Facebook builds this is wired up to the internal statistic reporting.
+ * Prefer using `logger` over using `console` directly.
+ */
+export function useLogger(): Logger {
+  return useContext(_LoggerContext);
+}