Add codemods for breaking API changes.

Author: ghengeveld

README.md

@@ -50,9 +50,10 @@ error states, without assumptions about the shape of your data or the type of re
 
 [abortable fetch]: https://developers.google.com/web/updates/2017/09/abortable-fetch
 
-> ## Upgrading to v6
+> ## Upgrading to v8
 >
-> Version 6 comes with a breaking change. See [Upgrading](#upgrading) for details.
+> Version 8 comes with breaking changes. See [Upgrading](#upgrading) for details.
+> A [codemod](https://github.com/ghengeveld/react-async/tree/master/codemods) is available.
 
 # Table of Contents
 
@@ -121,11 +122,26 @@ yarn add react-async
 
 ### Upgrading
 
+#### Upgrade to v8
+
+All standalone helper components were renamed to avoid import naming collision.
+
+- `<Initial>` was renamed to `<IfInitial>`.
+- `<Pending>` was renamed to `<IfPending>`.
+- `<Fulfilled>` was renamed to `<IfFulfilled>`.
+- `<Rejected>` was renamed to `<IfRejected`.
+- `<Settled>` was renamed to `<IfSettled>`.
+
+> A [codemod](https://github.com/ghengeveld/react-async/tree/master/codemods) is available to automate the upgrade.
+
 #### Upgrade to v6
 
 - `<Async.Pending>` was renamed to `<Async.Initial>`.
+- Some of the other helpers were also renamed, but the old ones remain as alias.
 - Don't forget to deal with any custom instances of `<Async>` when upgrading.
 
+> A [codemod](https://github.com/ghengeveld/react-async/tree/master/codemods) is available to automate the upgrade.
+
 #### Upgrade to v4
 
 - `deferFn` now receives an `args` array as the first argument, instead of arguments to `run` being spread at the front

codemods/README.md

@@ -0,0 +1,33 @@
+# React Async codemods
+
+These codemods enable you to automatically upgrade your codebase to handle breaking changes in
+React Async's API.
+
+## Warning
+
+Be aware: **codemods transform your source code in place**. Make sure that your files are in
+version control before running a codemod.
+
+These codemods come without warranty. They will work fine most of the time, but you should always
+verify their output. Also, **do not run a codemod more than once.**
+
+## Running a codemod
+
+These codemods are based on [jscodeshift](https://github.com/facebook/jscodeshift). Refer to their
+docs for specifics.
+
+```bash
+npx jscodeshift <target_dir> -t <transform_script>
+```
+
+Where `<target_dir>` should be replaced with the path to your project's source directory and
+`<transform_script>` should be replaced by the URL of the codemod.
+
+For example:
+
+```bash
+npx jscodeshift . -t https://raw.githubusercontent.com/ghengeveld/react-async/master/codemods/v6.js
+```
+
+This will apply the codemod for [v6](https://github.com/ghengeveld/react-async/blob/master/codemods/v6.js)
+to the current working directory (`.`).

codemods/v6.js

@@ -0,0 +1,54 @@
+/**
+ * This renames:
+ * - <Async.Pending> to <Async.Initial>
+ * - <Async.Loading> to <Async.Pending>
+ * - <Async.Resolved> to <Async.Fulfilled>
+ *
+ * This includes any custom instances created with createInstance().
+ */
+
+export default function transform({ path, source }, api) {
+  if (path.includes("/node_modules/")) return
+
+  const j = api.jscodeshift
+  const root = j(source)
+
+  const renameJsxMembers = parentName => {
+    root
+      .find(j.JSXMemberExpression, { object: { name: parentName }, property: { name: "Pending" } })
+      .forEach(node => (node.value.property.name = "Initial"))
+    root
+      .find(j.JSXMemberExpression, { object: { name: parentName }, property: { name: "Loading" } })
+      .forEach(node => (node.value.property.name = "Pending"))
+    root
+      .find(j.JSXMemberExpression, { object: { name: parentName }, property: { name: "Resolved" } })
+      .forEach(node => (node.value.property.name = "Fulfilled"))
+  }
+
+  // Rename instances using default import
+  root
+    .find(j.ImportDeclaration, { source: { value: "react-async" } })
+    .find(j.ImportDefaultSpecifier)
+    .forEach(node => renameJsxMembers(node.value.local.name))
+
+  // Rename instances using named `Async` import
+  root
+    .find(j.ImportDeclaration, { source: { value: "react-async" } })
+    .find(j.ImportSpecifier, { imported: { name: "Async" } })
+    .forEach(node => renameJsxMembers(node.value.local.name))
+
+  // Rename instances created with `createInstance`
+  root
+    .find(j.ImportDeclaration, { source: { value: "react-async" } })
+    .find(j.ImportSpecifier, { imported: { name: "createInstance" } })
+    .forEach(node => {
+      const createInstance = node.value.local.name
+      root
+        .find(j.VariableDeclarator)
+        .filter(node => node.value.init.type === "CallExpression")
+        .filter(node => node.value.init.callee.name === createInstance)
+        .forEach(node => renameJsxMembers(node.value.id.name))
+    })
+
+  return root.toSource()
+}

codemods/v8.js

@@ -0,0 +1,33 @@
+/**
+ * This renames the standalone helper components:
+ * - <Initial> to <IfInitial>
+ * - <Pending> to <IfPending>
+ * - <Fulfilled> to <IfFulfilled>
+ * - <Rejected> to <IfRejected>
+ * - <Settled> to <IfSettled>
+ */
+
+const helperNames = ["Initial", "Pending", "Fulfilled", "Rejected", "Settled"]
+
+export default function transform({ path, source }, api) {
+  if (path.includes("/node_modules/")) return
+
+  const j = api.jscodeshift
+  const root = j(source)
+
+  // Rename imports
+  root
+    .find(j.ImportDeclaration, { source: { value: "react-async" } })
+    .find(j.ImportSpecifier)
+    .filter(node => helperNames.includes(node.value.imported.name))
+    .forEach(node => (node.value.imported.name = `If${node.value.imported.name}`))
+
+  // Rename JSX elements
+  root
+    .find(j.JSXIdentifier)
+    .filter(node => helperNames.includes(node.value.name))
+    .filter(node => node.parentPath.value.type !== "JSXMemberExpression")
+    .forEach(node => (node.value.name = `If${node.value.name}`))
+
+  return root.toSource()
+}