Implement codemods for createReducer and createSlice builder

packages/toolkit/codemods/jest.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  automock: false,
+  roots: ['v2.0/__tests__'],
+  transform: { '\\.ts$': ['ts-jest'] },
+}

packages/toolkit/codemods/v2.0/__testfixtures__/create-reducer-builder/basic.input.ts

@@ -0,0 +1,3 @@
+createReducer(initialState, {
+  [todoAdded]: (state, action) => {},
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-reducer-builder/basic.output.ts

@@ -0,0 +1,3 @@
+createReducer(initialState, builder => {
+  builder.addCase(todoAdded, (state, action) => {});
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-reducer-builder/chained.input.ts

@@ -0,0 +1,4 @@
+createReducer(initialState, {
+  [todoAdded]: (state, action) => {},
+  anotherTodoAdded: (state) => {},
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-reducer-builder/chained.output.ts

@@ -0,0 +1,3 @@
+createReducer(initialState, builder => {
+  builder.addCase(todoAdded, (state, action) => {}).addCase(anotherTodoAdded, (state) => {});
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-slice-builder/basic.input.ts

@@ -0,0 +1,5 @@
+createSlice({
+  extraReducers: {
+    [todoAdded]: (state, action) => {}
+  }
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-slice-builder/basic.output.ts

@@ -0,0 +1,5 @@
+createSlice({
+  extraReducers: builder => {
+    builder.addCase(todoAdded, (state, action) => {});
+  }
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-slice-builder/chained.input.ts

@@ -0,0 +1,6 @@
+createSlice({
+  extraReducers: {
+    [todoAdded]: (state, action) => {},
+    anotherTodoAdded: (state) => {},
+  },
+})

packages/toolkit/codemods/v2.0/__testfixtures__/create-slice-builder/chained.output.ts

@@ -0,0 +1,5 @@
+createSlice({
+  extraReducers: builder => {
+    builder.addCase(todoAdded, (state, action) => {}).addCase(anotherTodoAdded, (state) => {});
+  }
+})

packages/toolkit/codemods/v2.0/__tests__/createReducerBuilder.test.ts

@@ -0,0 +1,18 @@
+import { defineTest } from 'jscodeshift/src/testUtils'
+
+describe('replace object syntax for declaring case reducers with builder', () => {
+  defineTest(
+    __dirname,
+    `./createReducerBuilder`,
+    null,
+    `create-reducer-builder/basic`,
+    { parser: 'ts' }
+  )
+  defineTest(
+    __dirname,
+    `./createReducerBuilder`,
+    null,
+    `create-reducer-builder/chained`,
+    { parser: 'ts' }
+  )
+})

packages/toolkit/codemods/v2.0/__tests__/createSliceBuilder.test.ts

@@ -0,0 +1,18 @@
+import { defineTest } from 'jscodeshift/src/testUtils'
+
+describe('replace object syntax for declaring case reducers with builder', () => {
+  defineTest(
+    __dirname,
+    `./createSliceBuilder`,
+    null,
+    `create-slice-builder/basic`,
+    { parser: 'ts' }
+  )
+  defineTest(
+    __dirname,
+    `./createSliceBuilder`,
+    null,
+    `create-slice-builder/chained`,
+    { parser: 'ts' }
+  )
+})

packages/toolkit/codemods/v2.0/createReducerBuilder.ts

@@ -0,0 +1,40 @@
+// @ts-nocheck
+
+function wrapInAddCaseExpression(j, member, arrowArguments) {
+  return j.callExpression(
+    j.memberExpression(member, j.identifier('addCase'), false),
+    arrowArguments
+  )
+}
+
+export function reducerPropsToBuilderExpression(j, defNode) {
+  const [firstCase, ...restOfCases] = defNode.properties
+
+  const expressionStatement = restOfCases.reduce((acc, c) => {
+    return wrapInAddCaseExpression(j, acc, [c.key, c.value])
+  }, wrapInAddCaseExpression(j, j.identifier('builder'), [firstCase.key, firstCase.value]))
+
+  return j.arrowFunctionExpression(
+    [j.identifier('builder')],
+    j.blockStatement([j.expressionStatement(expressionStatement)])
+  )
+}
+
+export default function transformer(file, api) {
+  const j = api.jscodeshift
+
+  return j(file.source)
+    .find(j.CallExpression, {
+      callee: { name: 'createReducer' },
+      arguments: { 1: { type: 'ObjectExpression' } },
+    })
+    .forEach((path) => {
+      j(path).replaceWith(
+        j.callExpression(j.identifier('createReducer'), [
+          path.node.arguments[0],
+          reducerPropsToBuilderExpression(j, path.node.arguments[1]),
+        ])
+      )
+    })
+    .toSource()
+}

packages/toolkit/codemods/v2.0/createSliceBuilder.ts

@@ -0,0 +1,37 @@
+// @ts-nocheck
+import { reducerPropsToBuilderExpression } from './createReducerBuilder'
+
+export default function transformer(file, api) {
+  const j = api.jscodeshift
+
+  return j(file.source)
+    .find(j.CallExpression, {
+      callee: { name: 'createSlice' },
+      arguments: { 0: { type: 'ObjectExpression' } },
+    })
+    .filter((path) =>
+      path.node.arguments[0].properties.some(
+        (p) =>
+          p.key.name === 'extraReducers' && p.value.type === 'ObjectExpression'
+      )
+    )
+    .forEach((path) => {
+      j(path).replaceWith(
+        j.callExpression(j.identifier('createSlice'), [
+          j.objectExpression(
+            path.node.arguments[0].properties.map((p) => {
+              if (p.key.name === 'extraReducers') {
+                const expressionStatement = reducerPropsToBuilderExpression(
+                  j,
+                  p.value
+                )
+                return j.objectProperty(p.key, expressionStatement)
+              }
+              return p
+            })
+          ),
+        ])
+      )
+    })
+    .toSource()
+}

packages/toolkit/package.json

@@ -34,6 +34,7 @@
     "@testing-library/user-event": "^13.1.5",
     "@types/convert-source-map": "^1.5.1",
     "@types/jest": "^24.0.11",
+    "@types/jscodeshift": "^0.11.5",
     "@types/json-stringify-safe": "^5.0.0",
     "@types/nanoid": "^2.1.0",
     "@types/node": "^10.14.4",
@@ -60,6 +61,7 @@
     "fs-extra": "^9.1.0",
     "invariant": "^2.2.4",
     "jest": "^26.6.3",
+    "jscodeshift": "^0.13.1",
     "json-stringify-safe": "^5.0.1",
     "magic-string": "^0.25.7",
     "merge-source-map": "^1.1.0",
@@ -87,6 +89,7 @@
     "format:check": "prettier --list-different \"(src|examples)/**/*.{ts,tsx}\" \"docs/*/**.md\"",
     "lint": "eslint src examples",
     "test": "jest --runInBand",
+    "test:codemods": "jest --config codemods/jest.config.js",
     "type-tests": "yarn tsc -p src/tests && yarn tsc -p src/query/tests",
     "prepack": "npm run build-prepare"
   },