chore(v5): tidy up codemods (#8141)

* rename codemods, fix help, etc

* changes

* add test for rest syntax

packages/codemods/src/codemods/v5.x.x/cellQueryResult/__testfixtures__/restSyntax.input.ts

@@ -0,0 +1,33 @@
+import type { FindAuthorQuery, FindAuthorQueryVariables } from 'types/graphql'
+
+import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
+
+import Author from 'src/components/Author'
+
+export const QUERY = gql`
+  query FindAuthorQuery($id: Int!) {
+    author: user(id: $id) {
+      email
+      fullName
+    }
+  }
+`
+
+export const Loading = () => <span>Loading...</span>
+
+export const Empty = () => <span>Empty</span>
+
+export const Failure = ({
+  error,
+}: CellFailureProps<FindAuthorQueryVariables>) => (
+  <span style={{ color: 'red' }}>Error: {error?.message}</span>
+)
+
+export const Success = ({
+  author,
+  ...props
+}: CellSuccessProps<FindAuthorQuery, FindAuthorQueryVariables>) => (
+  <span className="author-cell">
+    <Author author={author} {...props} />
+  </span>
+)

packages/codemods/src/codemods/v5.x.x/cellQueryResult/__testfixtures__/restSyntax.output.ts

@@ -0,0 +1,33 @@
+import type { FindAuthorQuery, FindAuthorQueryVariables } from 'types/graphql'
+
+import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
+
+import Author from 'src/components/Author'
+
+export const QUERY = gql`
+  query FindAuthorQuery($id: Int!) {
+    author: user(id: $id) {
+      email
+      fullName
+    }
+  }
+`
+
+export const Loading = () => <span>Loading...</span>
+
+export const Empty = () => <span>Empty</span>
+
+export const Failure = ({
+  error,
+}: CellFailureProps<FindAuthorQueryVariables>) => (
+  <span style={{ color: 'red' }}>Error: {error?.message}</span>
+)
+
+export const Success = ({
+  author,
+  ...props
+}: CellSuccessProps<FindAuthorQuery, FindAuthorQueryVariables>) => (
+  <span className="author-cell">
+    <Author author={author} {...props} />
+  </span>
+)

packages/codemods/src/codemods/v5.x.x/cellQueryResult/cellQueryResult.ts

@@ -43,11 +43,11 @@ export default function transform(file: FileInfo, api: API) {
           if (firstParameter.type === 'ObjectPattern') {
             const previouslySpreadPropertiesInUse =
               firstParameter.properties.filter((property: Property) => {
-                if (property.key.type !== 'Identifier') {
-                  throw new Error(
-                    'Unable to process a parameter within the cell function'
-                  )
+                // skip rest params
+                if (property.type === 'RestElement') {
+                  return false
                 }
+
                 return nonSpreadVariables.includes(property.key.name)
               })
             if (previouslySpreadPropertiesInUse.length > 0) {

packages/codemods/src/codemods/v5.x.x/cellQueryResult/cellQueryResult.yargs.ts

@@ -7,7 +7,7 @@ import runTransform from '../../../lib/runTransform'
 
 export const command = 'cell-query-result'
 export const description =
-  '(v4.x.x->v5.x.x) Updates cells to use the queryResult property'
+  '(v4.x.x->v5.x.x) Updates cells to use the `queryResult` property'
 
 export const handler = () => {
   task('cellQueryResult', async ({ setOutput }) => {

packages/codemods/src/codemods/v5.x.x/detectEmptyCells/detectEmptyCells.ts

@@ -1,11 +1,13 @@
+import type { TaskInnerAPI } from 'tasuku'
+
 import {
   findCells,
   fileToAst,
   getCellGqlQuery,
   parseGqlQueryToAst,
 } from '../../../lib/cells'
 
-async function detectEmptyCells() {
+async function detectEmptyCells(taskContext: TaskInnerAPI) {
   const cellPaths = findCells()
 
   const susceptibleCells = cellPaths.filter((cellPath) => {
@@ -22,17 +24,22 @@ async function detectEmptyCells() {
   })
 
   if (susceptibleCells.length > 0) {
-    console.log(
+    taskContext.setOutput(
       [
-        'You have Cells that are susceptible to the new isDataEmpty behavior:',
+        'You have Cells that are susceptible to the new `isDataEmpty` behavior:',
         '',
         susceptibleCells.map((c) => `• ${c}`).join('\n'),
         '',
-        "The new behavior is documented in detail here. It's most likely what you want, but consider whether it affects you.",
+        'The new behavior is documented in detail on the forums: https://community.redwoodjs.com/t/redwood-v5-0-0-rc-is-now-available/4715.',
+        "It's most likely what you want, but consider whether it affects you.",
         "If you'd like to revert to the old behavior, you can override the `isDataEmpty` function.",
       ].join('\n')
     )
+  } else {
+    taskContext.setOutput(
+      "None of your project's Cells are susceptible to the new `isDataEmpty` behavior."
+    )
   }
 }
 
-export default detectEmptyCells
+export { detectEmptyCells }

packages/codemods/src/codemods/v5.x.x/detectEmptyCells/detectEmptyCells.yargs.ts

@@ -1,17 +1,24 @@
-import task, { TaskInnerAPI } from 'tasuku'
+import task from 'tasuku'
 
-import detectEmptyCells from './detectEmptyCells'
+import { detectEmptyCells } from './detectEmptyCells'
 
 export const command = 'detect-empty-cells'
-export const description = '(v4.x.x->v5.0.0) Detects empty cells and warns'
+
+export const description =
+  '(v4.x.x->v5.x.x) Detects Cells susceptible to the new Empty behavior'
 
 export const handler = () => {
-  task('detectEmptyCells', async ({ setError }: TaskInnerAPI) => {
-    try {
-      await detectEmptyCells()
-      console.log()
-    } catch (e: any) {
-      setError('Failed to detect empty cells in your project \n' + e?.message)
+  task(
+    'Detecting Cells susceptible to the new Empty behavior',
+    async (taskContext) => {
+      try {
+        await detectEmptyCells(taskContext)
+      } catch (e: any) {
+        taskContext.setError(
+          'Failed to detect cells susceptible to the new Empty behavior in your project \n' +
+            e?.message
+        )
+      }
     }
-  })
+  )
 }

packages/codemods/src/codemods/v5.x.x/renameValidateWith/__testfixtures__/default.input.js

@@ -3,9 +3,3 @@ validateWith(() => {
     throw "You'll have to be more creative than that"
   }
 })
-
-validateWith(() => {
-  if (input.name === 'Name') {
-    throw new Error("You'll have to be more creative than that")
-  }
-})

packages/codemods/src/codemods/v5.x.x/renameValidateWith/__testfixtures__/default.output.js

@@ -3,9 +3,3 @@ validateWithSync(() => {
     throw "You'll have to be more creative than that"
   }
 })
-
-validateWithSync(() => {
-  if (input.name === 'Name') {
-    throw new Error("You'll have to be more creative than that")
-  }
-})

packages/codemods/src/codemods/v5.x.x/renameValidateWith/__tests__/renameValidateWith.test.ts

@@ -1,5 +1,5 @@
 describe('renameValidateWith', () => {
-  it('Converts validateWith to validateWithSync', async () => {
+  it('Renames `validateWith` to `validateWithSync`', async () => {
     await matchTransformSnapshot('renameValidateWith', 'default')
   })
 })

packages/codemods/src/codemods/v5.x.x/renameValidateWith/renameValidateWith.yargs.ts

@@ -1,29 +1,33 @@
 import path from 'path'
 
-import task, { TaskInnerAPI } from 'tasuku'
+import task from 'tasuku'
 
 import getFilesWithPattern from '../../../lib/getFilesWithPattern'
 import getRWPaths from '../../../lib/getRWPaths'
 import runTransform from '../../../lib/runTransform'
 
 export const command = 'rename-validate-with'
+
 export const description =
-  '(v4.x.x->v5.x.x) Converts validateWith to validateWithSync'
+  '(v4.x.x->v5.x.x) Renames validateWith to validateWithSync'
 
 export const handler = () => {
-  task('Rename Validate With', async ({ setOutput }: TaskInnerAPI) => {
-    const rwPaths = getRWPaths()
+  task(
+    'Renaming `validateWith` to `validateWithSync`',
+    async ({ setOutput }) => {
+      const redwoodProjectPaths = getRWPaths()
 
-    const files = getFilesWithPattern({
-      pattern: 'validateWith',
-      filesToSearch: [rwPaths.api.src],
-    })
+      const files = getFilesWithPattern({
+        pattern: 'validateWith',
+        filesToSearch: [redwoodProjectPaths.api.src],
+      })
 
-    await runTransform({
-      transformPath: path.join(__dirname, 'renameValidateWith.js'),
-      targetPaths: files,
-    })
+      await runTransform({
+        transformPath: path.join(__dirname, 'renameValidateWith.js'),
+        targetPaths: files,
+      })
 
-    setOutput('All done! Run `yarn rw lint --fix` to prettify your code')
-  })
+      setOutput('All done! Run `yarn rw lint --fix` to prettify your code')
+    }
+  )
 }

packages/codemods/src/codemods/v5.x.x/updateAuth0ToV2/__tests__/updateAuth0ToV2.test.ts

@@ -0,0 +1,5 @@
+describe('updateAuth0ToV2', () => {
+  it('updates the web-side auth file to the v2 SDK', async () => {
+    await matchTransformSnapshot('updateAuth0ToV2', 'default')
+  })
+})

packages/codemods/src/codemods/v5.x.x/updateAuth0/updateAuth0.yargs.ts → packages/codemods/src/codemods/v5.x.x/updateAuth0ToV2/updateAuth0ToV2.yargs.ts

@@ -1,18 +1,19 @@
 import path from 'path'
 
 import execa from 'execa'
-import task, { TaskInnerAPI } from 'tasuku'
+import task from 'tasuku'
 
 import getRWPaths from '../../../lib/getRWPaths'
 import isTSProject from '../../../lib/isTSProject'
 import runTransform from '../../../lib/runTransform'
 
-export const command = 'update-auth0'
+export const command = 'update-auth0-to-v2'
+
 export const description =
-  '(v4.x.x->v5.x.x) For Auth0 users; updates the web-side auth.ts,js file'
+  '(v4.x.x->v5.x.x) Updates the web-side auth.{ts,js} file to the v2 SDK'
 
 export const handler = () => {
-  task('Update Auth0', async ({ setOutput }: TaskInnerAPI) => {
+  task('Updating Auth0 to v2', async ({ setOutput }) => {
     const authFile = isTSProject ? 'auth.ts' : 'auth.js'
 
     try {
@@ -26,7 +27,7 @@ export const handler = () => {
     }
 
     await runTransform({
-      transformPath: path.join(__dirname, 'updateAuth0.js'),
+      transformPath: path.join(__dirname, 'updateAuth0ToV2.js'),
       targetPaths: [path.join(getRWPaths().web.src, authFile)],
     })
 

packages/codemods/src/codemods/v5.x.x/updateNodeEngineTo18/README.md

@@ -0,0 +1,3 @@
+# Update Node Engine to 18
+
+This codemod updates the `engines.node` key in a project's root `package.json` to `"=18.x"`.

packages/codemods/src/codemods/v5.x.x/updateNodeEngines/updateNodeEngines.ts → packages/codemods/src/codemods/v5.x.x/updateNodeEngineTo18/updateNodeEngineTo18.ts

@@ -3,13 +3,13 @@ import path from 'path'
 
 import getRWPaths from '../../../lib/getRWPaths'
 
-async function updateNodeEngines() {
+async function updateNodeEngineTo18() {
   const packageJSONPath = path.join(getRWPaths().base, 'package.json')
-  const packageJSON = JSON.parse(fs.readFileSync(packageJSONPath, 'utf8'))
+  const packageJSON = JSON.parse(fs.readFileSync(packageJSONPath, 'utf-8'))
 
   packageJSON.engines.node = '=18.x'
 
   fs.writeFileSync(packageJSONPath, JSON.stringify(packageJSON, null, 2))
 }
 
-export { updateNodeEngines }
+export { updateNodeEngineTo18 }

packages/codemods/src/codemods/v5.x.x/updateNodeEngineTo18/updateNodeEngineTo18.yargs.ts

@@ -0,0 +1,21 @@
+import task from 'tasuku'
+
+import { updateNodeEngineTo18 } from './updateNodeEngineTo18'
+
+export const command = 'update-node-engine-to-18'
+
+export const description =
+  '(v4.x.x->v5.x.x) Updates `engines.node` to `"=18.x"` in your project\'s root package.json'
+
+export const handler = () => {
+  task(
+    'Updating `engines.node` to `"=18.x"` in root package.json',
+    async ({ setError }) => {
+      try {
+        await updateNodeEngineTo18()
+      } catch (e: any) {
+        setError('Failed to codemod your project \n' + e?.message)
+      }
+    }
+  )
+}

packages/codemods/src/codemods/v5.x.x/upgradeToReact18/upgradeToReact18.ts

@@ -37,7 +37,7 @@ function checkAndTransformReactRoot(taskContext: TaskInnerAPI) {
         '',
         reactRootHTML,
         '',
-        'React expects to control this DOM node completely. This codemod has moved the children outside the react root',
+        'React expects to control this DOM node completely. This codemod has moved the children outside the react root,',
         'but consider moving them into a layout.',
       ].join('\n')
     )

packages/codemods/src/codemods/v5.x.x/upgradeToReact18/upgradeToReact18.yargs.ts

@@ -7,7 +7,8 @@ import {
 
 export const command = 'upgrade-to-react-18'
 
-export const description = '(v4.x.x->v5.0.0) Upgrade to React 18'
+export const description =
+  '(v4.x.x->v5.0.0) Upgrades a project to React 18 and checks the react root'
 
 export const handler = () => {
   task('Check and transform react root', async (taskContext) => {