Implement codemods for createReducer and createSlice builder

packages/rtk-codemods/README.md

@@ -0,0 +1,3 @@
+# RTK Codemods
+
+This needs some actual content and needs to be an actual package.

packages/rtk-codemods/jest.config.js

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

packages/rtk-codemods/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "@reduxjs/rtk-codemods",
+  "version": "0.0.1",
+  "author": {
+    "name": "Lenz Weber",
+    "email": "mail@phryneas.de",
+    "url": "https://phryneas.de/"
+  },
+  "license": "MIT",
+  "type": "module",
+  "scripts": {
+    "test:codemods": "jest --config codemods/jest.config.js"
+  },
+  "dependencies": {
+    "jest": "^27",
+    "jscodeshift": "^0.13.1"
+  },
+  "devDependencies": {
+    "@types/jest": "^27",
+    "@types/jscodeshift": "^0.11.5"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "src",
+    "dist"
+  ]
+}

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

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

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

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

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

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

packages/rtk-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/rtk-codemods/v2.0/__testfixtures__/create-slice-builder/basic.input.ts

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

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

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

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

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

packages/rtk-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/rtk-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/rtk-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/rtk-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/rtk-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()
+}