diff --git a/packages/next-codemod/transforms/__testfixtures__/new-link/handle-duplicate-props.input.js b/packages/next-codemod/transforms/__testfixtures__/new-link/handle-duplicate-props.input.js new file mode 100644 index 000000000000000..f45a3bcb4081822 --- /dev/null +++ b/packages/next-codemod/transforms/__testfixtures__/new-link/handle-duplicate-props.input.js @@ -0,0 +1,9 @@ +import Link from 'next/link' + +export default function Page() { + return ( + + Link + + ); +} diff --git a/packages/next-codemod/transforms/__testfixtures__/new-link/handle-duplicate-props.output.js b/packages/next-codemod/transforms/__testfixtures__/new-link/handle-duplicate-props.output.js new file mode 100644 index 000000000000000..4d77892e2f23f8b --- /dev/null +++ b/packages/next-codemod/transforms/__testfixtures__/new-link/handle-duplicate-props.output.js @@ -0,0 +1,9 @@ +import Link from 'next/link' + +export default function Page() { + return ( + + Link + + ); +} \ 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 a9fac98fe3db7a2..60241c76d395884 100644 --- a/packages/next-codemod/transforms/__tests__/new-link.test.js +++ b/packages/next-codemod/transforms/__tests__/new-link.test.js @@ -11,6 +11,7 @@ const fixtures = [ 'spread-props', 'link-string', 'styled-jsx', + 'handle-duplicate-props' ] for (const fixture of fixtures) { diff --git a/packages/next-codemod/transforms/new-link.ts b/packages/next-codemod/transforms/new-link.ts index ab84eaf918e9f5f..b0ca0de49c02cdb 100644 --- a/packages/next-codemod/transforms/new-link.ts +++ b/packages/next-codemod/transforms/new-link.ts @@ -86,13 +86,24 @@ export default function transformer(file: FileInfo, api: API) { const hasProps = props.length > 0 if (hasProps) { - // Add props to - $link.get('attributes').value.push(...props) + // Add only unique props to (skip duplicate props) + const linkPropNames = $link + .get('attributes') + .value.map((linkProp) => linkProp?.name?.name) + const uniqueProps = [] + + props.forEach((anchorProp) => { + if (!linkPropNames.includes(anchorProp?.name?.name)) { + uniqueProps.push(anchorProp) + } + }) + + $link.get('attributes').value.push(...uniqueProps) + // Remove props from props.length = 0 } - // const childrenProps = $childrenWithA.get('children') $childrenWithA.replaceWith(childrenProps.value) })