Add codemod for removing unstable_ prefix

Author: devjiwonchoi

packages/next-codemod/lib/utils.ts

@@ -132,4 +132,9 @@ export const TRANSFORMER_INQUIRER_CHOICES = [
     value: 'middleware-to-proxy',
     version: '15.6.0-canary.54',
   },
+  {
+    title: 'Remove `unstable_` prefix from stabilized API',
+    value: 'remove-unstable-prefix',
+    version: '16.0.0-canary.10',
+  },
 ]

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/alias.input.tsx

@@ -0,0 +1,26 @@
+// @ts-nocheck
+import { unstable_cacheTag as cacheTagImport, unstable_cacheLife as cacheLifeImport } from 'next/cache'
+const { unstable_cacheTag: cacheTagRequire, unstable_cacheLife: cacheLifeRequire } = require('next/cache')
+// Alias with same API name, alias should be removed.
+import { unstable_cacheTag as cacheTag, unstable_cacheLife as cacheLife } from 'next/cache'
+const { unstable_cacheTag: cacheTag, unstable_cacheLife: cacheLife } = require('next/cache')
+
+export function MyComponent() {
+  const cacheTagImportTag = cacheTagImport('foo')
+  const cacheLifeImportLife = cacheLifeImport('1 hour')
+  const cacheTagRequireTag = cacheTagRequire('bar')
+  const cacheLifeRequireLife = cacheLifeRequire('2 hours')
+  const cacheTagAlias = cacheTag('redundant')
+  const cacheLifeAlias = cacheLife('redundant-time')
+
+  return (
+    <div>
+      <p>Using cache tag: {cacheTagImportTag}</p>
+      <p>Using cache life: {cacheLifeImportLife}</p>
+      <p>Using another tag: {cacheTagRequireTag}</p>
+      <p>Using another life: {cacheLifeRequireLife}</p>
+      <p>Using same alias tag: {cacheTagAlias}</p>
+      <p>Using same alias life: {cacheLifeAlias}</p>
+    </div>
+  )
+}

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/alias.output.tsx

@@ -0,0 +1,26 @@
+// @ts-nocheck
+import { cacheTag as cacheTagImport, cacheLife as cacheLifeImport } from 'next/cache'
+const { cacheTag: cacheTagRequire, cacheLife: cacheLifeRequire } = require('next/cache')
+// Alias with same API name, alias should be removed.
+import { cacheTag, cacheLife } from 'next/cache'
+const { cacheTag, cacheLife } = require('next/cache')
+
+export function MyComponent() {
+  const cacheTagImportTag = cacheTagImport('foo')
+  const cacheLifeImportLife = cacheLifeImport('1 hour')
+  const cacheTagRequireTag = cacheTagRequire('bar')
+  const cacheLifeRequireLife = cacheLifeRequire('2 hours')
+  const cacheTagAlias = cacheTag('redundant')
+  const cacheLifeAlias = cacheLife('redundant-time')
+
+  return (
+    <div>
+      <p>Using cache tag: {cacheTagImportTag}</p>
+      <p>Using cache life: {cacheLifeImportLife}</p>
+      <p>Using another tag: {cacheTagRequireTag}</p>
+      <p>Using another life: {cacheLifeRequireLife}</p>
+      <p>Using same alias tag: {cacheTagAlias}</p>
+      <p>Using same alias life: {cacheLifeAlias}</p>
+    </div>
+  )
+}

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/bracket-notation.input.tsx

@@ -0,0 +1,19 @@
+// @ts-nocheck
+/* eslint-disable */
+const cache = require('next/cache')
+const dynamicCache = await import('next/cache')
+
+// Bracket notation property access with string literals
+const tag = cache['unstable_cacheTag']('my-tag')
+const life = dynamicCache['unstable_cacheLife']('2 hours')
+
+// Direct bracket notation access on require
+const directTag = require('next/cache')['unstable_cacheTag']
+
+// Bracket notation property access inside a function
+function testCache() {
+  const tag2 = cache['unstable_cacheTag']('tag2')
+  const life2 = dynamicCache['unstable_cacheLife']('life2')
+
+  return { tag2, life2 }
+}

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/bracket-notation.output.tsx

@@ -0,0 +1,19 @@
+// @ts-nocheck
+/* eslint-disable */
+const cache = require('next/cache')
+const dynamicCache = await import('next/cache')
+
+// Bracket notation property access with string literals
+const tag = cache["cacheTag"]('my-tag')
+const life = dynamicCache["cacheLife"]('2 hours')
+
+// Direct bracket notation access on require
+const directTag = require('next/cache')["cacheTag"]
+
+// Bracket notation property access inside a function
+function testCache() {
+  const tag2 = cache["cacheTag"]('tag2')
+  const life2 = dynamicCache["cacheLife"]('life2')
+
+  return { tag2, life2 }
+}

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/dynamic-import.input.tsx

@@ -0,0 +1,20 @@
+// @ts-nocheck
+/* eslint-disable */
+async function loadCache() {
+  // Dynamic import with destructuring
+  const { unstable_cacheTag, unstable_cacheLife } = await import('next/cache')
+
+  // Dynamic import with property access
+  const cache = await import('next/cache')
+  const directTag = cache.unstable_cacheTag
+  const directLife = cache.unstable_cacheLife
+
+  return { directTag, directLife }
+}
+
+// Dynamic import without await
+const cachePromise = import('next/cache').then(({ unstable_cacheTag, unstable_cacheLife }) => {
+  const tag = unstable_cacheTag('async-tag')
+  const life = unstable_cacheLife('3 hours')
+  return { tag, life }
+})

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/dynamic-import.output.tsx

@@ -0,0 +1,20 @@
+// @ts-nocheck
+/* eslint-disable */
+async function loadCache() {
+  // Dynamic import with destructuring
+  const { cacheTag, cacheLife } = await import('next/cache')
+
+  // Dynamic import with property access
+  const cache = await import('next/cache')
+  const directTag = cache.cacheTag
+  const directLife = cache.cacheLife
+
+  return { directTag, directLife }
+}
+
+// Dynamic import without await
+const cachePromise = import('next/cache').then(({ cacheTag, cacheLife }) => {
+  const tag = cacheTag('async-tag')
+  const life = cacheLife('3 hours')
+  return { tag, life }
+})

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/dynamic-require.input.tsx

@@ -0,0 +1,17 @@
+// @ts-nocheck
+/* eslint-disable */
+function loadCache() {
+  // Dynamic require with destructuring
+  const { unstable_cacheTag, unstable_cacheLife } = require('next/cache')
+
+  // Dynamic require with property access
+  const cache = require('next/cache')
+  const directTag = cache.unstable_cacheTag
+  const directLife = cache.unstable_cacheLife
+
+  // Direct property access on require
+  const tag = require('next/cache').unstable_cacheTag('my-tag')
+  const life = require('next/cache').unstable_cacheLife('2 hours')
+
+  return { tag, life, directTag, directLife }
+}

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/dynamic-require.output.tsx

@@ -0,0 +1,17 @@
+// @ts-nocheck
+/* eslint-disable */
+function loadCache() {
+  // Dynamic require with destructuring
+  const { cacheTag, cacheLife } = require('next/cache')
+
+  // Dynamic require with property access
+  const cache = require('next/cache')
+  const directTag = cache.cacheTag
+  const directLife = cache.cacheLife
+
+  // Direct property access on require
+  const tag = require('next/cache').cacheTag('my-tag')
+  const life = require('next/cache').cacheLife('2 hours')
+
+  return { tag, life, directTag, directLife }
+}

packages/next-codemod/transforms/__testfixtures__/remove-unstable-prefix/export-statements.input.tsx

@@ -0,0 +1,11 @@
+// @ts-nocheck
+/* eslint-disable */
+
+// Re-export unstable APIs from next/cache
+export { unstable_cacheTag, unstable_cacheLife, revalidatePath} from 'next/cache'
+
+// Re-export with aliases
+export { unstable_cacheTag as createTag, unstable_cacheLife as createLife } from 'next/cache'
+
+// Default export should not be affected
+export { default as cache } from 'next/cache'