[Flight] Add rudimentary FS binding

packages/react-fs/README.md

@@ -0,0 +1,12 @@
+# react-fs
+
+This package is meant to be used alongside yet-to-be-released, experimental React features. It's unlikely to be useful in any other context.
+
+**Do not use in a real application.** We're publishing this early for
+demonstration purposes.
+
+**Use it at your own risk.**
+
+# No, Really, It Is Unstable
+
+The API ~~may~~ will change wildly between versions.

packages/react-fs/index.browser.js

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ *
+ * @flow
+ */
+
+throw new Error(
+  'This entry point is not yet supported in the browser environment',
+);

packages/react-fs/index.js

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ *
+ * @flow
+ */
+
+'use strict';
+
+export * from './index.node';

packages/react-fs/index.node.js

@@ -0,0 +1,12 @@
+/**
+ * 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.
+ *
+ * @flow
+ */
+
+'use strict';
+
+export * from './src/ReactFilesystem';

packages/react-fs/npm/index.browser.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-fs.browser.production.min.js');
+} else {
+  module.exports = require('./cjs/react-fs.browser.development.js');
+}

packages/react-fs/npm/index.js

@@ -0,0 +1,3 @@
+'use strict';
+
+module.exports = require('./index.node');

packages/react-fs/npm/index.node.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./cjs/react-fs.node.production.min.js');
+} else {
+  module.exports = require('./cjs/react-fs.node.development.js');
+}

packages/react-fs/package.json

@@ -0,0 +1,23 @@
+{
+  "private": true,
+  "name": "react-fs",
+  "description": "React bindings for the filesystem",
+  "version": "0.0.0",
+  "repository": {
+    "type" : "git",
+    "url" : "https://github.com/facebook/react.git",
+    "directory": "packages/react-fs"
+  },
+  "files": [
+    "LICENSE",
+    "README.md",
+    "build-info.json",
+    "index.js",
+    "index.node.js",
+    "index.browser.js",
+    "cjs/"
+  ],
+  "browser": {
+    "./index.js": "./index.browser.js"
+  }
+}

packages/react-fs/src/ReactFilesystem.js

@@ -0,0 +1,108 @@
+/**
+ * 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.
+ *
+ * @flow
+ */
+
+import type {Wakeable, Thenable} from 'shared/ReactTypes';
+
+import {unstable_getCacheForType} from 'react';
+import * as fs from 'fs/promises';
+
+const Pending = 0;
+const Resolved = 1;
+const Rejected = 2;
+
+type PendingResult = {|
+  status: 0,
+  value: Wakeable,
+|};
+
+type ResolvedResult<T> = {|
+  status: 1,
+  value: T,
+|};
+
+type RejectedResult = {|
+  status: 2,
+  value: mixed,
+|};
+
+type Result<T> = PendingResult | ResolvedResult<T> | RejectedResult;
+
+function toResult<T>(thenable: Thenable<T>): Result<T> {
+  const result: Result<T> = {
+    status: Pending,
+    value: thenable,
+  };
+  thenable.then(
+    value => {
+      if (result.status === Pending) {
+        const resolvedResult = ((result: any): ResolvedResult<T>);
+        resolvedResult.status = Resolved;
+        resolvedResult.value = value;
+      }
+    },
+    err => {
+      if (result.status === Pending) {
+        const rejectedResult = ((result: any): RejectedResult);
+        rejectedResult.status = Rejected;
+        rejectedResult.value = err;
+      }
+    },
+  );
+  return result;
+}
+
+function readResult<T>(result: Result<T>): T {
+  if (result.status === Resolved) {
+    return result.value;
+  } else {
+    throw result.value;
+  }
+}
+
+function createReadFileCache(): Map<string, Result<Buffer>> {
+  return new Map();
+}
+
+export function readFile(
+  path: string,
+  options:
+    | string
+    | {
+        encoding?: string | null,
+        // Ignored:
+        flag?: string,
+        signal?: mixed,
+      },
+): string | Buffer {
+  const map = unstable_getCacheForType(createReadFileCache);
+  let entry = map.get(path);
+  if (!entry) {
+    const thenable = fs.readFile(path);
+    entry = toResult(thenable);
+    map.set(path, entry);
+  }
+  const result: Buffer = readResult(entry);
+  if (!options) {
+    return result;
+  }
+  const encoding = typeof options === 'string' ? options : options.encoding;
+  if (typeof encoding !== 'string') {
+    return result;
+  }
+  const textCache =
+    (result: any)._reactTextCache || ((result: any)._reactTextCache = []);
+  for (let i = 0; i < textCache.length; i += 2) {
+    if (textCache[i] === encoding) {
+      return textCache[i + 1];
+    }
+  }
+  const text = result.toString((encoding: any));
+  textCache.push(encoding, text);
+  return text;
+}

scripts/flow/environment.js

@@ -70,6 +70,16 @@ declare module 'EventListener' {
 declare function __webpack_chunk_load__(id: string): Promise<mixed>;
 declare function __webpack_require__(id: string): any;
 
+declare module 'fs/promises' {
+  declare var readFile: (
+    path: string,
+    options?:
+      | ?string
+      | {
+          encoding?: ?string,
+        },
+  ) => Promise<Buffer>;
+}
 declare module 'pg' {
   declare var Pool: (
     options: mixed,

scripts/rollup/bundles.js

@@ -153,6 +153,24 @@ const bundles = [
     externals: ['react', 'http', 'https'],
   },
 
+  /******* React FS Browser (experimental, new) *******/
+  {
+    bundleTypes: [NODE_DEV, NODE_PROD],
+    moduleType: ISOMORPHIC,
+    entry: 'react-fs/index.browser',
+    global: 'ReactFilesystem',
+    externals: [],
+  },
+
+  /******* React FS Node (experimental, new) *******/
+  {
+    bundleTypes: [NODE_DEV, NODE_PROD],
+    moduleType: ISOMORPHIC,
+    entry: 'react-fs/index.node',
+    global: 'ReactFilesystem',
+    externals: ['react', 'fs/promises'],
+  },
+
   /******* React PG Browser (experimental, new) *******/
   {
     bundleTypes: [NODE_DEV, NODE_PROD],