[Breaking] Drop Flow type support in favor of TypeScript

Author: jack-guy

.babelrc

@@ -4,7 +4,7 @@
             "@babel/preset-env",
             {
                 "targets": {
-                    "node": "10"
+                    "node": "22"
                 }
             }
         ],

.gitignore

@@ -6,3 +6,4 @@ npm-debug.log*
 venv
 yarn-debug.log*
 yarn-error.log*
+.yarnrc

API_DOCS.md

@@ -132,7 +132,7 @@ To use this feature, there are several restrictions. (Please open an issue if yo
     ```
 
 2. In the response, `properties` are spread at the same level as the `responseKey`. (Check out `getFilmsV2` in [swapi example](./examples/swapi/swapi.js).)
-3. All `properties` must be optional in the response object. The flow types currently don't handle the nullability of these properties correctly, so to enforce this, we recommend a build step to ensure that the underlying types are always set as maybe types.
+3. All `properties` must be optional in the response object. The TypeScript types currently don't handle the nullability of these properties correctly, so to enforce this, we recommend a build step to ensure that the underlying types are always set as maybe types.
 4. The resource must have a one-to-one correspondence between the input "properties" and the output "properties".
     - e.g. if we request property "name", the response must have "name" in it, and no extra data associated with it.
 
@@ -158,7 +158,7 @@ resources:
             responseKey: ?string              (non-optional when propertyBatchKey is used)
 
 typings:
-    language: flow
+    language: typescript
     embedResourcesType:
         imports: string
         ResourcesType: string
@@ -199,7 +199,7 @@ Use this to generate type definitions for the generated DataLoaders. At this tim
 
 | Key                                | Value Description                                                                                                                              |
 | ---------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------- |
-| `language`                         | Must be 'flow' until we support other options.                                                                                                 |
+| `language`                         | Must be 'typescript' until we support other options.                                                                                           |
 | `embedResourcesType.imports`       | Lets you inject an arbitrary import statement into the generated file, to help you write the type statement below.                             |
 | `embedResourcesType.ResourcesType` | Inject code to describe the shape of the resources object you're going to pass into `getLoaders`. Should start with `type ResourcesType = ...` |
 |                                    |

Makefile

@@ -8,15 +8,13 @@ venv: Makefile requirements-dev.txt
 	virtualenv venv --python=$(PYTHON3)
 	venv/bin/pip install -r requirements-dev.txt
 
-node_modules: package.json yarn.lock
+node_modules: package.json
 	yarn
 
 build: node_modules
 	yarn build
 	# Generate the .d.ts files
 	node_modules/.bin/tsc --project tsconfig.json --checkJs false --emitDeclarationOnly || true
-	# TODO: Loop through everything in the lib folder to create the flow types
-	yarn flowgen --add-flow-header lib/runtimeHelpers.d.ts --output-file lib/runtimeHelpers.js.flow
 
 .PHONY: test
 test: build venv node_modules

README.md

@@ -1,5 +1,7 @@
 # 🤖 dataloader-codegen
 
+## Now with TypeScript!
+
 [![npm](https://img.shields.io/npm/v/dataloader-codegen.svg)](https://yarn.pm/dataloader-codegen)
 [![Build Status](https://api.travis-ci.com/Yelp/dataloader-codegen.svg?branch=master)](https://travis-ci.com/github/Yelp/dataloader-codegen)
 
@@ -14,7 +16,7 @@ Read more about the motivation behind this library in our recent blog post: http
 -   🚚 Supports Batched + Non Batched Resources
 -   ✨ Predictable DataLoader Interfaces
 -   🐛 Error Handling
--   🔒 Type Safety (Flow)
+-   🔒 Type Safety (TypeScript)
 -   🔧 Resource Middleware
 
 ## Install

__tests__/genType.test.js

@@ -0,0 +1,26 @@
+import { getResourceTypeReference, getNewKeyTypeFromBatchKeySetType, getLoaderTypeKey } from '../src/genType';
+
+it('getResourceTypeReference converts a resource path to a valid reference', () => {
+    expect(getResourceTypeReference(null, ['foo', 'bar', 'baz'])).toBe("ResourcesType['foo']['bar']['baz']");
+});
+
+it('getNewKeyTypeFromBatchKeySetType returns a newKey type with a valid value', () => {
+    expect(getNewKeyTypeFromBatchKeySetType('bKey', "ResourcesType['foo']['bar']['baz']")).toBe(
+        `Parameters<ResourcesType['foo']['bar']['baz']['bKey']['has']>[0]`,
+    );
+});
+
+it('getLoaderTypeKey forces a nullable batchKey to be strictly non-nullable', () => {
+    expect(
+        getLoaderTypeKey(
+            {
+                isBatchResource: true,
+                newKey: 'test_id',
+                batchKey: 'test_ids',
+            },
+            ['a', 'b'],
+        ),
+    ).toBe(
+        `Omit<Parameters<ResourcesType['a']['b']>[0], 'test_ids'> & { test_id: NonNullable<Parameters<ResourcesType['a']['b']>[0]['test_ids']>[0] }`,
+    );
+});

__tests__/genTypeFlow.test.js

@@ -9,14 +9,16 @@ import { getConfig } from '../src/config';
 
 const BABEL_CONFIG = {
     presets: [
-        '@babel/preset-flow',
+        '@babel/preset-typescript',
         [
             '@babel/preset-env',
             {
                 modules: 'commonjs',
             },
         ],
     ],
+    // Babel needs this dummy file name to determine it's a TypeScript file
+    filename: 'file.ts',
 };
 
 const RUNTIME_HELPERS = path.resolve(__dirname, '..', 'src', 'runtimeHelpers.ts');
@@ -45,7 +47,7 @@ expect.extend({
 async function createDataLoaders(config, cb) {
     await tmp.withFile(
         async ({ path }) => {
-            const loadersCode = await babel.transformAsync(codegen(config, RUNTIME_HELPERS), BABEL_CONFIG);
+            const loadersCode = await babel.transformAsync(await codegen(config, RUNTIME_HELPERS), BABEL_CONFIG);
             fs.writeFileSync(path, 'const regeneratorRuntime = require("regenerator-runtime");');
             fs.appendFileSync(path, loadersCode.code);
             // Import the generated code into memory :scream:
@@ -1608,3 +1610,49 @@ test('batch endpoint with propertyBatchKey with reorderResultsByKey handles resp
         ]);
     });
 });
+
+test('embeds resource types', async () => {
+    // For the sake of coverage we pass in these test comments which will get interpolated in the generated code
+    // but otherwise we don't need to test them.
+    const config = {
+        resources: {
+            foo: {
+                isBatchResource: false,
+                docsLink: 'example.com/docs/foo',
+            },
+        },
+        typings: {
+            embedResourcesType: {
+                imports: '// test foo',
+                ResourcesType: '// test bar',
+            },
+        },
+    };
+
+    const resources = {
+        foo: jest
+            .fn()
+            .mockReturnValueOnce(
+                Promise.resolve({
+                    message: 'knock knock',
+                    message_suffix: '!',
+                }),
+            )
+            .mockReturnValueOnce(
+                Promise.resolve({
+                    message: "who's there",
+                    message_suffix: '?',
+                }),
+            ),
+    };
+
+    await createDataLoaders(config, async (getLoaders) => {
+        const loaders = getLoaders(resources);
+
+        const results = await loaders.foo.loadMany([{ bar_id: 1 }, { bar_id: 2 }]);
+        expect(results).toEqual([
+            { message: 'knock knock', message_suffix: '!' },
+            { message: "who's there", message_suffix: '?' },
+        ]);
+    });
+});

__tests__/implementation.test.js

@@ -4,10 +4,10 @@
             "@babel/preset-env",
             {
                 "targets": {
-                    "node": "8"
+                    "node": "22"
                 }
             }
         ],
-        "@babel/preset-flow"
+        "@babel/preset-typescript"
     ]
 }

examples/swapi/.babelrc

@@ -1 +1,2 @@
 build
+.yarnrc

examples/swapi/.flowconfig

@@ -1,13 +1,10 @@
 node_modules: package.json
 	yarn
 
-.PHONY: swapi-loaders.js
-swapi-loaders.js:
-	node ../../lib/index.js --config swapi.dataloader-config.yaml --output swapi-loaders.js
-
-flow-typed: node_modules
-	yarn flow-typed install
+.PHONY: swapi-loaders.ts
+swapi-loaders.ts:
+	node ../../lib/index.js --config swapi.dataloader-config.yaml --output swapi-loaders.ts
 
 .PHONY: build
 build: node_modules
-	yarn babel *.js -d build
+	yarn babel *.ts -d build -x .ts

examples/swapi/.gitignore

@@ -19,7 +19,7 @@ Build the example:
 $ cd examples/swapi
 $ yarn
 $ yarn link dataloader-codegen
-$ make swapi-loaders.js
+$ make swapi-loaders.ts
 $ make build
 # Prints out a GraphQL query result:
 $ node build/swapi-server.js