FHL: Make Relay quack like Apollo

.eslintrc.json

@@ -36,7 +36,8 @@
         "varsIgnorePattern": "^_"
       }
     ],
-    "@typescript-eslint/no-empty-function": "off"
+    "@typescript-eslint/no-empty-function": "off",
+    "no-prototype-builtins": "off"
   },
 
   "overrides": [

examples/supermassive-todomvcs-apollo-style/.gitignore

@@ -0,0 +1,4 @@
+node_modules/
+dist/
+yarn-error.log
+stats/

examples/supermassive-todomvcs-apollo-style/.prettierrc

@@ -0,0 +1,4 @@
+{
+  "tabWidth": 2,
+  "useTabs": false
+}

examples/supermassive-todomvcs-apollo-style/CHANGELOG.json

@@ -0,0 +1,143 @@
+{
+  "name": "supermassive-todomvc-apollo-style",
+  "entries": [
+    {
+      "date": "Tue, 19 Dec 2023 10:42:14 GMT",
+      "tag": "supermassive-todomvc-apollo-style_v1.0.0",
+      "version": "1.0.0",
+      "comments": {
+        "undefined": [
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/apollo-react-relay-duct-tape to v1.0.23",
+            "commit": "324dc87a3bb3b6c549e3316efca692072256dec7"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/graphql-js-tag to v0.9.1",
+            "commit": "324dc87a3bb3b6c549e3316efca692072256dec7"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/supermassive to v3.2.7",
+            "commit": "324dc87a3bb3b6c549e3316efca692072256dec7"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/ts-transform-graphql-js-tag to v1.2.0",
+            "commit": "324dc87a3bb3b6c549e3316efca692072256dec7"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 04 Oct 2023 14:49:50 GMT",
+      "tag": "supermassive-todomvc-apollo-style_v1.0.0",
+      "version": "1.0.0",
+      "comments": {
+        "undefined": [
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/apollo-react-relay-duct-tape to v1.0.14",
+            "commit": "3e06badb76f78b85df97be32f596710627098870"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/graphql-js-tag to v0.9.1",
+            "commit": "3e06badb76f78b85df97be32f596710627098870"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/supermassive to v3.2.0",
+            "commit": "3e06badb76f78b85df97be32f596710627098870"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/ts-transform-graphql-js-tag to v1.1.1",
+            "commit": "3e06badb76f78b85df97be32f596710627098870"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 04 Oct 2023 13:51:41 GMT",
+      "tag": "supermassive-todomvc-apollo-style_v1.0.0",
+      "version": "1.0.0",
+      "comments": {
+        "undefined": [
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/apollo-react-relay-duct-tape to v1.0.14",
+            "commit": "c9c50e4c6bfb1bc50376cd5228b5ad8fe9cc2274"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/graphql-js-tag to v0.9.1",
+            "commit": "c9c50e4c6bfb1bc50376cd5228b5ad8fe9cc2274"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/supermassive to v3.2.0",
+            "commit": "c9c50e4c6bfb1bc50376cd5228b5ad8fe9cc2274"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/ts-transform-graphql-js-tag to v1.1.1",
+            "commit": "c9c50e4c6bfb1bc50376cd5228b5ad8fe9cc2274"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 04 Oct 2023 10:42:36 GMT",
+      "tag": "supermassive-todomvc-apollo-style_v1.0.0",
+      "version": "1.0.0",
+      "comments": {
+        "none": [
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/apollo-react-relay-duct-tape to v1.0.14",
+            "commit": "d73f011a40f790860efd1324823dbe5b24bf0927"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/graphql-js-tag to v0.9.1",
+            "commit": "d73f011a40f790860efd1324823dbe5b24bf0927"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/supermassive to v3.2.0",
+            "commit": "d73f011a40f790860efd1324823dbe5b24bf0927"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/ts-transform-graphql-js-tag to v1.1.1",
+            "commit": "d73f011a40f790860efd1324823dbe5b24bf0927"
+          },
+          {
+            "author": "beachball",
+            "package": "supermassive-todomvc-apollo-style",
+            "comment": "Bump @graphitation/graphql-codegen-relay-ir-plugin to v1.3.0",
+            "commit": "d73f011a40f790860efd1324823dbe5b24bf0927"
+          }
+        ]
+      }
+    }
+  ]
+}

examples/supermassive-todomvcs-apollo-style/codegen.yml

@@ -0,0 +1,45 @@
+schema: "./src/schema/typeDefs.graphql"
+documents: ["src/components/**/*.graphql"]
+generates:
+  ./src/__generated__/types.ts:
+    plugins:
+      - typescript
+      - add:
+          content: >
+            // THIS FILE IS GENERATED BY graphql-codegen. DO NOT MODIFY!
+
+            // RUN `yarn generate:interfaces` from the package root to update it
+
+            // See <PACKAGE_ROOT>/codegen.yml for details
+
+            /* eslint-disable */
+
+            // @ts-nocheck
+  ./src/components/:
+    preset: near-operation-file
+    presetConfig:
+      extension: .graphql.interface.ts
+      baseTypesPath: ./src/__generated__/types.ts
+    plugins:
+      - typescript-operations
+      - "@graphitation/graphql-codegen-relay-ir-plugin"
+      - add:
+          content: >
+            // THIS FILE IS GENERATED BY graphql-codegen. DO NOT MODIFY!
+
+            // RUN `yarn generate:interfaces` from the package root to update it
+
+            // See <PACKAGE_ROOT>/codegen.yml for details
+
+            /* eslint-disable */
+
+            // @ts-nocheck
+    config:
+      noGraphQLTag: true
+      immutableTypes: true
+      preResolveTypes: true
+      namingConvention: "keep"
+      dedupeOperationSuffix: true
+      avoidOptionals: { field: true }
+      nonOptionalTypename: true
+      skipTypeNameForRoot: true

examples/supermassive-todomvcs-apollo-style/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "supermassive-todomvc-apollo-style",
+  "main": "index.js",
+  "private": true,
+  "version": "1.0.0",
+  "scripts": {
+    "start": "graphql-codegen && yarn serve --progress --color --mode=development",
+    "build": "",
+    "serve": "webpack serve --config webpack.config.ts",
+    "extract-schema": "supermassive extract-schema ./src/schema/typeDefs.graphql",
+    "codegen": "graphql-codegen"
+  },
+  "dependencies": {
+    "@apollo/client": "^3.6.0",
+    "@babel/runtime": "^7.12.0",
+    "@graphitation/apollo-react-relay-duct-tape": "^0.7.0",
+    "@graphitation/graphql-codegen-supermassive-relay-ir-plugin": "link:../packages/graphql-codegen-supermassive-relay-ir-plugin",
+    "@graphitation/graphql-js-tag": "^0.9.0",
+    "@graphitation/supermassive": "^3.0.0",
+    "@graphitation/ts-transform-graphql-js-tag": "^1.1.0",
+    "concurrently": "^6.5.1",
+    "event-iterator": "^2.0.0",
+    "graphql": "^15.6.1",
+    "graphql-tools": "^8.2.0",
+    "html-webpack-plugin": "^5.3.2",
+    "lodash": "^4.17.21",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-relay": "^14.0.0",
+    "relay-compiler": "^12.0.0",
+    "relay-compiler-language-graphitation": "^0.8.2",
+    "relay-runtime": "^14.0.0",
+    "ts-loader": "^9.0.0",
+    "ts-node": "^10.4.0",
+    "uuid": "^8.3.2",
+    "webpack": "^5.76.0",
+    "webpack-cli": "^4.6.0",
+    "webpack-dev-server": "^3.1.14",
+    "webpack-graphql-loader": "^1.0.2",
+    "zen-observable": "^0.8.15"
+  },
+  "resolutions": {
+    "ansi-html": "^0.0.9",
+    "ansi-regex": "^5.0.1",
+    "cross-fetch": "^3.1.5",
+    "eventsource": "^2.0.2",
+    "graphql": "^15.6.1",
+    "glob-parent": "^6.0.2",
+    "mem": "^4.3.0",
+    "minimist": "^1.2.6",
+    "node-fetch": "^2.6.7",
+    "node-forge": "^1.3.1",
+    "yargs-parser": ">=13.1.2",
+    "typescript": "^4.9.5"
+  },
+  "devDependencies": {
+    "@graphitation/graphql-codegen-relay-ir-plugin": "^1.3.0",
+    "@graphql-codegen/cli": "^1.19.4",
+    "@graphql-codegen/import-types-preset": "^2.1.7",
+    "@graphql-codegen/near-operation-file-preset": "^2.4.1",
+    "@graphql-codegen/typed-document-node": "^2.3.3",
+    "@graphql-codegen/typescript": "^2.2.0",
+    "@graphql-codegen/typescript-operations": "^2.2.4",
+    "@graphql-codegen/typescript-react-apollo": "^3.3.3",
+    "@types/graphql": "^14.5.0",
+    "@types/lodash": "^4.14.175",
+    "@types/react": "^17.0.30",
+    "@types/react-dom": "^17.0.9",
+    "@types/react-relay": "14.1.1",
+    "@types/uuid": "^8.3.1",
+    "add": "^2.0.6",
+    "graphql-let": "^0.18.5",
+    "prettier": "^2.4.1",
+    "yarn": "^1.22.19"
+  }
+}

examples/supermassive-todomvcs-apollo-style/src/App.tsx

@@ -0,0 +1,63 @@
+import {
+  ApolloClient,
+  InMemoryCache,
+  from,
+  ApolloProvider,
+} from "@apollo/client";
+import { RelayApolloCache } from "../../../packages/relay-apollo-duct-tape/src/Cache";
+import React from "react";
+import { onError } from "@apollo/client/link/error";
+import TodoList from "./components/TodoList";
+import { asyncSplit } from "./schema/asyncSplit";
+
+const isProduction = false;
+
+// Log any GraphQL errors or network error that occurred
+const errorLink = onError(({ graphQLErrors, networkError }) => {
+  if (graphQLErrors)
+    graphQLErrors.forEach((error) => {
+      const { message, locations, path } = error;
+      console.log(
+        `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`
+      );
+      console.error(error);
+    });
+  if (networkError) {
+    console.log(`[Network error]: ${networkError}`);
+    console.error(networkError);
+  }
+});
+
+const client = new ApolloClient({
+  cache: new RelayApolloCache(),
+  link: from([
+    errorLink,
+    asyncSplit(
+      () => isProduction,
+      async () => {
+        const { supermassiveSchemaLink } = await import(
+          /* webpackChunkName: "supermassiveLink" */
+          "./schema/productionLink"
+        );
+        return supermassiveSchemaLink;
+      },
+      async () => {
+        const { executableSchemaLink } = await import(
+          /* webpackChunkName: "executableLink" */
+          "./schema/link"
+        );
+        return executableSchemaLink;
+      }
+    ),
+  ]),
+});
+
+function App() {
+  return (
+    <ApolloProvider client={client}>
+      <TodoList />
+    </ApolloProvider>
+  );
+}
+
+export default App;