codemod: fix merging react imports logic (#70706)

vercel · Oct 2, 2024 · 39e06c7 · 39e06c7
1 parent 3853a7f
commit 39e06c7
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 12 deletions.
diff --git a/...ansforms/__testfixtures__/next-async-request-api-dynamic-props/access-props-04.output.tsx b/...ansforms/__testfixtures__/next-async-request-api-dynamic-props/access-props-04.output.tsx
@@ -1,7 +1,6 @@
-'use client';
-import { use } from "react";
+'use client'
 
-import { useState } from 'react'
+import { useState, use } from 'react';
 
 export default function Page(props: { params: Promise<{ slug: string }> }) {
   const params = use(props.params);

diff --git a/...ansforms/__testfixtures__/next-async-request-api-dynamic-props/access-props-05.output.tsx b/...ansforms/__testfixtures__/next-async-request-api-dynamic-props/access-props-05.output.tsx
@@ -1,7 +1,6 @@
-'use client';
-import { use } from "react";
+'use client'
 
-import { useState } from 'react'
+import { useState, use } from 'react';
 
 interface PageProps {
   params: Promise<{ slug: string }>

diff --git a/packages/next-codemod/transforms/lib/async-request-api/utils.ts b/packages/next-codemod/transforms/lib/async-request-api/utils.ts
@@ -182,22 +182,19 @@ export function insertReactUseImport(root: Collection<any>, j: API['j']) {
   if (!hasReactUseImport) {
     const reactImportDeclaration = root.find(j.ImportDeclaration, {
       source: {
-        type: 'Literal',
         value: 'react',
       },
     })
 
     if (reactImportDeclaration.size() > 0) {
+      const importNode = reactImportDeclaration.get().node
+
       // Add 'use' to existing 'react' import declaration
-      reactImportDeclaration
-        .get()
-        .node.specifiers.push(j.importSpecifier(j.identifier('use')))
+      importNode.specifiers.push(j.importSpecifier(j.identifier('use')))
     } else {
       // Final all type imports to 'react'
-
       const reactImport = root.find(j.ImportDeclaration, {
         source: {
-          type: 'Literal',
           value: 'react',
         },
       })