diff --git a/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.input.js b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.input.js new file mode 100644 index 000000000000000..a3360c1c1b113e7 --- /dev/null +++ b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.input.js @@ -0,0 +1,26 @@ +import Link from 'next/link'; + +const CustomLink = ({ + href, + title, + children, +}) => { + return ( + + + + {children} + + + + + ); +}; + +export default CustomLink; \ No newline at end of file diff --git a/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.output.js b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.output.js new file mode 100644 index 000000000000000..80f6859410b863c --- /dev/null +++ b/packages/next-codemod/transforms/__testfixtures__/new-link/styled-jsx.output.js @@ -0,0 +1,26 @@ +import Link from 'next/link'; + +const CustomLink = ({ + href, + title, + children, +}) => { + return ( + + + + {children} + + + + + ); +}; + +export default CustomLink; \ No newline at end of file diff --git a/packages/next-codemod/transforms/__tests__/new-link.test.js b/packages/next-codemod/transforms/__tests__/new-link.test.js index 36724ec0e7df080..a9fac98fe3db7a2 100644 --- a/packages/next-codemod/transforms/__tests__/new-link.test.js +++ b/packages/next-codemod/transforms/__tests__/new-link.test.js @@ -9,7 +9,8 @@ const fixtures = [ 'excludes-links-with-legacybehavior-prop', 'children-interpolation', 'spread-props', - 'link-string' + 'link-string', + 'styled-jsx', ] for (const fixture of fixtures) { diff --git a/packages/next-codemod/transforms/new-link.ts b/packages/next-codemod/transforms/new-link.ts index 95f5c7dee5880f8..ab84eaf918e9f5f 100644 --- a/packages/next-codemod/transforms/new-link.ts +++ b/packages/next-codemod/transforms/new-link.ts @@ -22,6 +22,13 @@ export default function transformer(file: FileInfo, api: API) { } const linkElements = $j.findJSXElements(variableName) + const hasStylesJSX = $j.findJSXElements('style').some((stylePath) => { + const $style = j(stylePath) + const hasJSXProp = + $style.find(j.JSXAttribute, { name: { name: 'jsx' } }).size() !== 0 + + return hasJSXProp + }) linkElements.forEach((linkPath) => { const $link = j(linkPath).filter((childPath) => { @@ -37,6 +44,15 @@ export default function transformer(file: FileInfo, api: API) { return } + // If file has