react error boundaries

Author: danieldelcore

community/react/error-boundaries/README.md

@@ -0,0 +1,25 @@
+# react#error-boundaries
+
+Renames the experimental `unstable_handleError` lifecycle hook to `componentDidCatch`.
+
+```js
+/* INPUT */
+import React from "react";
+
+export class ComponentOne extends React.Component {
+  unstable_handleError(error) {}
+  render() {
+    return <div />;
+  }
+}
+
+/* OUTPUT */
+import React from "react";
+
+export class ComponentOne extends React.Component {
+  componentDidCatch(error) {}
+  render() {
+    return <div />;
+  }
+}
+```

community/react/error-boundaries/transform.spec.ts

@@ -0,0 +1,69 @@
+import { applyTransform } from '@codeshift/test-utils';
+import * as transformer from './transform';
+
+describe('react#error-boundaries transform', () => {
+  it('should transform class to error boundary', async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+import React from "react";
+
+export class ComponentOne extends React.Component {
+  unstable_handleError(error) {}
+  render() {
+    return <div />;
+  }
+}
+
+export class ComponentTwo extends React.Component {
+  unstable_handleError = error => {};
+  render() {
+    return <div />;
+  }
+}
+`,
+      { parser: 'tsx' },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      import React from "react"; export class ComponentOne extends React.Component
+      { componentDidCatch(error) {} render() { return
+      <div />; } } export class ComponentTwo extends React.Component { componentDidCatch
+      = error => {}; render() { return
+      <div />; } }
+    `);
+  });
+
+  it('should transform createClass to error boundary', async () => {
+    const result = await applyTransform(
+      transformer,
+      `
+var React = require("react");
+var createClass = require("create-react-class");
+
+var ComponentOne = createClass({
+  render: function() {
+    return <div />;
+  },
+  unstable_handleError: function(error) {}
+});
+
+var ComponentTwo = createClass({
+  render() {
+    return <div />;
+  },
+  unstable_handleError(error) {}
+});
+`,
+      { parser: 'tsx' },
+    );
+
+    expect(result).toMatchInlineSnapshot(`
+      var React = require("react"); var createClass = require("create-react-class");
+      var ComponentOne = createClass({ render: function() { return
+      <div />; }, componentDidCatch: function(error) {} }); var ComponentTwo = createClass({
+      render() { return
+      <div />; }, componentDidCatch(error) {} });
+    `);
+  });
+});

community/react/error-boundaries/transform.ts

@@ -0,0 +1,16 @@
+import { API, FileInfo, Options } from 'jscodeshift';
+
+export default function transformer(
+  file: FileInfo,
+  { jscodeshift: j }: API,
+  options: Options,
+) {
+  return j(file.source)
+    .find(j.Identifier)
+    .forEach(path => {
+      if (path.node.name === 'unstable_handleError') {
+        j(path).replaceWith(j.identifier('componentDidCatch'));
+      }
+    })
+    .toSource(options.printOptions);
+}