Produce tsc typings for "flipper" package

Summary: This diffs refactors tsc projects structure and structure of our custom typings to allow producing typescript typings for "flipper" package. In next diffs I'm going to use the produced typings to check compatibility of plugins with certain versions of Flipper, e.g. to check whether plugin is compatible with current "stable" and "insiders" version.

Reviewed By: passy

Differential Revision: D26997158

fbshipit-source-id: a0416c7139bf08ec9d175730da4c4c2a8768eeb7

desktop/app/package.json

@@ -9,6 +9,10 @@
   "category": "facebook-intern",
   "privileged": true,
   "license": "MIT",
+  "scripts": {
+    "reset": "rimraf lib *.tsbuildinfo",
+    "build": "tsc -b"
+  },
   "dependencies": {
     "@ant-design/icons": "^4.5.0",
     "@emotion/css": "^11.0.0",

desktop/app/src/global.ts

@@ -8,10 +8,7 @@
  */
 
 import {StoreEnhancerStoreCreator} from 'redux';
-import {ResizeObserver} from './ResizeObserver.d';
-import {Store} from '../app/src/reducers';
-
-export {};
+import {Store} from './reducers';
 
 declare global {
   interface StoreEnhancerStateSanitizer {
@@ -28,7 +25,5 @@ declare global {
     Flipper: {
       init: () => void;
     };
-
-    ResizeObserver: ResizeObserver;
   }
 }

desktop/app/src/store.tsx

@@ -7,6 +7,7 @@
  * @format
  */
 
+import './global';
 import {createStore} from 'redux';
 import reducers, {Actions, State as StoreState, Store} from './reducers/index';
 import {stateSanitizer} from './utils/reduxDevToolsConfig';

desktop/app/tsconfig.json

@@ -0,0 +1,32 @@
+{
+  "extends": "../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "lib",
+    "rootDir": "src",
+    "esModuleInterop": true,
+    "emitDeclarationOnly": true
+  },
+  "references": [
+    {
+      "path": "../doctor"
+    },
+    {
+      "path": "../flipper-plugin"
+    },
+    {
+      "path": "../plugin-lib"
+    },
+    {
+      "path": "../test-utils"
+    },
+    {
+      "path": "../plugins/navigation"
+    }
+  ],
+  "exclude": [
+    "**/node_modules/",
+    "**/__tests__/",
+    "**/lib/",
+    "**/fb/"
+  ]
+}

desktop/babel-transformer/tsconfig.json

@@ -3,7 +3,5 @@
   "compilerOptions": {
     "outDir": "lib",
     "rootDir": "src"
-  },
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*"]
+  }
 }

desktop/doctor/tsconfig.json

@@ -3,7 +3,5 @@
   "compilerOptions": {
     "outDir": "lib",
     "rootDir": "src"
-  },
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*"]
+  }
 }

desktop/eslint-plugin-flipper/tsconfig.json

@@ -3,7 +3,5 @@
   "compilerOptions": {
     "outDir": "lib",
     "rootDir": "src"
-  },
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*"]
+  }
 }

desktop/flipper-plugin/src/ui/datatable/TableRow.tsx

@@ -9,7 +9,7 @@
 
 import React, {CSSProperties, memo} from 'react';
 import styled from '@emotion/styled';
-import {theme} from 'flipper-plugin';
+import {theme} from '../theme';
 import type {RenderContext} from './DataTable';
 import {Width} from '../../utils/widthUtils';
 import {DataFormatter} from '../DataFormatter';

desktop/flipper-plugin/tsconfig.json

@@ -8,11 +8,5 @@
     {
       "path": "../plugin-lib"
     }
-  ],
-  "include": [
-    "src"
-  ],
-  "exclude": [
-    "node_modules",
   ]
 }

desktop/jest.config.js

@@ -15,10 +15,8 @@ module.exports = {
   setupFiles: ['<rootDir>/scripts/jest-setup.js'],
   moduleNameMapper: {
     '^flipper$': '<rootDir>/app/src',
-    '^flipper-doctor$': '<rootDir>/doctor/src',
-    '^flipper-pkg$': '<rootDir>/pkg/src',
-    '^flipper-pkg-lib$': '<rootDir>/pkg-lib/src',
     '^flipper-plugin$': '<rootDir>/flipper-plugin/src',
+    '^flipper-(pkg|pkg-lib|doctor|test-utils)$': '<rootDir>/$1/src',
   },
   clearMocks: true,
   coverageReporters: ['json-summary', 'lcov', 'html'],

desktop/package.json

@@ -115,6 +115,7 @@
     "@types/redux-mock-store": "^1.0.1",
     "@types/redux-persist": "^4.3.1",
     "@types/requestidlecallback": "^0.3.1",
+    "@types/resize-observer-browser": "^0.1.5",
     "@types/rsocket-core": "^0.0.5",
     "@types/rsocket-tcp-server": "^0.0.2",
     "@types/socket.io": "^2.1.13",
@@ -241,7 +242,7 @@
     "publish-packages": "./ts-node scripts/publish-packages.ts",
     "reset": "yarn rm-dist && yarn rm-temp && yarn rm-metro-cache && yarn cache clean && yarn rm-bundle && yarn rm-modules",
     "resolve-plugin-dir": "./ts-node scripts/resolve-plugin-dir.ts",
-    "rm-bundle": "rimraf static/main.bundle.* **/lib **/*.tsbuildinfo",
+    "rm-bundle": "rimraf static/main.bundle.* **/dist/bundle.* **/lib **/*.tsbuildinfo",
     "rm-dist": "rimraf ../dist",
     "rm-metro-cache": "rimraf $TMPDIR/metro-cache*",
     "rm-modules": "rimraf **/*/node_modules node_modules",
@@ -275,7 +276,8 @@
       "e2e",
       "plugin-lib",
       "test-utils",
-      "eslint-plugin-flipper"
+      "eslint-plugin-flipper",
+      "types"
     ]
   }
 }

desktop/pkg-lib/tsconfig.json

@@ -11,12 +11,5 @@
     {
       "path": "../plugin-lib"
     }
-  ],
-  "include": [
-    "src"
-  ],
-  "exclude": [
-    "node_modules",
-    "**/__tests__/*"
   ]
 }

desktop/pkg/tsconfig.json

@@ -6,10 +6,14 @@
     "esModuleInterop": true
   },
   "references": [
-    {"path": "../pkg-lib"},
-    {"path": "../plugin-lib"},
-    {"path": "../test-utils"}
-  ],
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*"]
+    {
+      "path": "../pkg-lib"
+    },
+    {
+      "path": "../plugin-lib"
+    },
+    {
+      "path": "../test-utils"
+    }
+  ]
 }

desktop/plugin-lib/tsconfig.json

@@ -3,8 +3,5 @@
   "compilerOptions": {
     "outDir": "lib",
     "rootDir": "src"
-  },
-  "references": [{"path": "../test-utils"}],
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*"]
+  }
 }

desktop/plugins/navigation/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "lib",
+    "rootDir": ".",
+    "esModuleInterop": true
+  }
+}

desktop/plugins/network/package.json

@@ -22,8 +22,8 @@
     "xml-beautifier": "^0.4.0"
   },
   "peerDependencies": {
-    "flipper": "0.0.0",
-    "flipper-plugin": "0.0.0"
+    "flipper": "*",
+    "flipper-plugin": "*"
   },
   "devDependencies": {
     "@types/pako": "^1.0.1",

desktop/scripts/gen-type-index.ts

@@ -0,0 +1,47 @@
+/**
+ * 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 {rootDir} from './paths';
+import path from 'path';
+import fs from 'fs-extra';
+
+async function genTypeIndex() {
+  const typesDir = path.join(rootDir, 'types');
+  const filePaths = (await fs.readdir(typesDir))
+    .filter(
+      (filePath) => filePath.endsWith('.d.ts') && filePath !== 'index.d.ts',
+    )
+    .sort();
+  await fs.writeFile(
+    path.join(typesDir, 'index.d.ts'),
+    // @lint-ignore-every LICENSELINT
+    `/**
+ * 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
+ */
+
+${filePaths
+  .map((filePath) => `/// <reference path="${filePath}" />`)
+  .join('\n')}
+`,
+  );
+}
+
+genTypeIndex()
+  .then(() => {
+    process.exit(0);
+  })
+  .catch((err: any) => {
+    console.error(err);
+    process.exit(1);
+  });

desktop/test-utils/tsconfig.json

@@ -3,7 +3,5 @@
   "compilerOptions": {
     "outDir": "lib",
     "rootDir": "src"
-  },
-  "include": ["src"],
-  "exclude": ["node_modules", "**/__tests__/*"]
+  }
 }

desktop/tsc-root/tsconfig.json

@@ -6,6 +6,9 @@
         {
             "path": "../plugin-lib"
         },
+        {
+            "path": "../flipper-plugin"
+        },
         {
             "path": "../pkg"
         },

desktop/tsconfig.base.json

@@ -1,13 +1,18 @@
 {
   "compilerOptions": {
     "module": "commonjs",
-    "lib": ["es7", "dom", "es2019"],
+    "lib": [
+      "es7",
+      "dom",
+      "es2019"
+    ],
     "esModuleInterop": true,
     "target": "ES2019",
     "removeComments": true,
     "preserveConstEnums": true,
     "sourceMap": true,
     "declaration": true,
+    "declarationMap": true,
     "jsx": "react",
     "moduleResolution": "node",
     "skipLibCheck": true,
@@ -18,12 +23,15 @@
     "allowJs": true,
     "rootDir": ".",
     "paths": {
-      "flipper": ["./app/src"],
-      "flipper-plugin": ["./flipper-plugin/src"],
-      "eslint-plugin-flipper": ["./eslint-plugin-flipper/src"],
-      "flipper-*": ["./*/src"],
-      "@js-shared/*": ["../../js-shared/*"],
-      "*": ["./*", "./types/*"]
-    }
+      "@js-shared/*": [
+        "../../js-shared/*"
+      ]
     }
+  },
+  "exclude": [
+    "**/lib/",
+    "**/dist/",
+    "**/node_modules/",
+    "**/__tests__/"
+  ]
 }

desktop/tsconfig.json

@@ -6,5 +6,9 @@
     "composite": false,
     "allowJs": false
   },
-  "exclude": ["**/node_modules/", "**/*.spec.ts"]
+  "exclude": [
+    "**/node_modules/",
+    "**/lib/",
+    "**/dist/"
+  ]
 }

desktop/types/ResizeObserver.d.ts

@@ -1,51 +0,0 @@
-/**
- * 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
- */
-
-export interface ResizeObserver {
-  new (callback: ResizeObserverCallback): ResizeObserver;
-  observe: (target: Element) => void;
-  unobserve: (target: Element) => void;
-  disconnect: () => void;
-}
-
-interface ResizeObserverCallback {
-  (entries: ResizeObserverEntry[], observer: ResizeObserver): void;
-}
-
-export interface ResizeObserverEntry {
-  /**
-   * @param target The Element whose size has changed.
-   */
-  new (target: Element): ResizeObserverEntry;
-
-  /**
-   * The Element whose size has changed.
-   */
-  readonly target: Element;
-
-  /**
-   * Element's content rect when ResizeObserverCallback is invoked.
-   */
-  readonly contentRect: DOMRectReadOnly;
-}
-
-interface DOMRectReadOnly {
-  // static fromRect(other: DOMRectInit | undefined): DOMRectReadOnly;
-
-  readonly x: number;
-  readonly y: number;
-  readonly width: number;
-  readonly height: number;
-  readonly top: number;
-  readonly right: number;
-  readonly bottom: number;
-  readonly left: number;
-
-  toJSON: () => any;
-}

desktop/types/index.d.ts

@@ -0,0 +1,29 @@
+/**
+ * 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
+ */
+
+/// <reference path="JSONStream.d.ts" />
+/// <reference path="ReactDebounceRender.d.ts" />
+/// <reference path="XmlBeautifier.d.ts" />
+/// <reference path="adbkit-logcat.d.ts" />
+/// <reference path="adbkit.d.ts" />
+/// <reference path="ansi-to-html.d.ts" />
+/// <reference path="decompress-targz.d.ts" />
+/// <reference path="decompress-unzip.d.ts" />
+/// <reference path="download-tarball.d.ts" />
+/// <reference path="json-format-highlight.d.ts" />
+/// <reference path="line-replace.d.ts" />
+/// <reference path="live-plugin-manager.d.ts" />
+/// <reference path="memoize-weak.d.ts" />
+/// <reference path="metro-cache.d.ts" />
+/// <reference path="metro-resolver.d.ts" />
+/// <reference path="metro.d.ts" />
+/// <reference path="nodejs.d.ts" />
+/// <reference path="npm-api.d.ts" />
+/// <reference path="openssl-wrapper.d.ts" />
+/// <reference path="string-natural-compare.d.ts" />

desktop/types/memoize-weak.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 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
+ */
+
+declare module 'memoize-weak' {
+  export default function memoize<T extends (...args: any) => any>(
+    fn: T,
+  ): T & {
+    clear(...args: Parameters<T> | []): void;
+  };
+}

desktop/types/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@types/flipper-custom-typings",
+  "version": "0.0.0",
+  "private": "true",
+  "description": "Custom typings for untyped Flipper dependencies",
+  "repository": "facebook/flipper",
+  "license": "MIT",
+  "bugs": "https://github.com/facebook/flipper/issues",
+  "homepage": "https://github.com/facebook/flipper",
+  "keywords": [
+    "Flipper"
+  ],
+  "author": "Facebook, Inc",
+  "scripts": {
+    "postinstall": "../ts-node ../scripts/gen-type-index.ts"
+  }
+}

desktop/yarn.lock

@@ -2527,6 +2527,11 @@
   resolved "https://registry.yarnpkg.com/@types/requestidlecallback/-/requestidlecallback-0.3.1.tgz#34bb89753b1cdc72d0547522527b1cb0f02b5ec4"
   integrity sha512-BnnRkgWYijCIndUn+LgoqKHX/hNpJC5G03B9y7mZya/C2gUQTSn75fEj3ZP1/Rl2E6EYeXh2/7/8UNEZ4X7HuQ==
 
+"@types/resize-observer-browser@^0.1.5":
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/@types/resize-observer-browser/-/resize-observer-browser-0.1.5.tgz#36d897708172ac2380cd486da7a3daf1161c1e23"
+  integrity sha512-8k/67Z95Goa6Lznuykxkfhq9YU3l1Qe6LNZmwde1u7802a3x8v44oq0j91DICclxatTr0rNnhXx7+VTIetSrSQ==
+
 "@types/retry@*":
   version "0.12.0"
   resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.0.tgz#2b35eccfcee7d38cd72ad99232fbd58bffb3c84d"