-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Feat(codemod): Add codemod for the Link underlined prop
- replacing the `isUnderlined` prop with a new `underlined` prop and set it to "always" if true
- Loading branch information
1 parent
a3ebd84
commit e79223a
Showing
5 changed files
with
118 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
# Web-React v3 Codemods | ||
|
||
This is a collection of codemods for updating Web-React v3 components. | ||
|
||
You can find instructions on how to run these codemods in the main package [README](https://github.com/lmc-eu/spirit-design-system/blob/main/packages/codemods/README.md). | ||
|
||
## Included Scripts | ||
|
||
### `v3/web-react/link-underlined-prop` — Link `isUnderlined` to `udnerlined` prop change | ||
|
||
This codemod updates the `Link` component by replacing the `isUnderlined` prop with a new `underlined` prop, setting it to "always". | ||
|
||
#### Usage | ||
|
||
```sh | ||
npx @lmc-eu/spirit-codemods -p <path> -t v3/web-react/link-underlined-prop | ||
``` | ||
|
||
#### Example | ||
|
||
```diff | ||
- <Link isUnderlined … /> | ||
+ <Link underlined="always" … /> | ||
``` |
12 changes: 12 additions & 0 deletions
12
...ages/codemods/src/transforms/v3/web-react/__testfixtures__/link-underlined-prop.input.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import React from 'react'; | ||
// @ts-ignore: No declaration -- The library is not installed; we don't need to install it for fixtures. | ||
import { Link } from '@lmc-eu/spirit-web-react'; | ||
|
||
export const MyComponent = () => ( | ||
<> | ||
<Link /> | ||
<Link isUnderlined /> | ||
<Link isUnderlined={true} /> | ||
<Link isUnderlined={false} /> | ||
</> | ||
); |
12 changes: 12 additions & 0 deletions
12
...ges/codemods/src/transforms/v3/web-react/__testfixtures__/link-underlined-prop.output.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
import React from 'react'; | ||
// @ts-ignore: No declaration -- The library is not installed; we don't need to install it for fixtures. | ||
import { Link } from '@lmc-eu/spirit-web-react'; | ||
|
||
export const MyComponent = () => ( | ||
<> | ||
<Link /> | ||
<Link underlined="always" /> | ||
<Link underlined="always" /> | ||
<Link /> | ||
</> | ||
); |
3 changes: 3 additions & 0 deletions
3
packages/codemods/src/transforms/v3/web-react/__tests__/link-underlined-prop.test.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
import { testTransform } from '../../../../../tests/testUtils'; | ||
|
||
testTransform(__dirname, 'link-underlined-prop'); |
67 changes: 67 additions & 0 deletions
67
packages/codemods/src/transforms/v3/web-react/link-underlined-prop.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
import { | ||
API, | ||
FileInfo, | ||
Collection, | ||
JSCodeshift, | ||
JSXElement, | ||
JSXAttribute, | ||
ImportDeclaration, | ||
JSXOpeningElement, | ||
} from 'jscodeshift'; | ||
|
||
const transform = (fileInfo: FileInfo, api: API): string => { | ||
const j: JSCodeshift = api.jscodeshift; | ||
const root: Collection<JSXElement> = j(fileInfo.source); | ||
|
||
// Find import statements for the specific module | ||
const importStatements: Collection<ImportDeclaration> = root.find(j.ImportDeclaration, { | ||
source: { | ||
value: (value: string): boolean => /^@lmc-eu\/spirit-web-react(\/.*)?$/.test(value), | ||
}, | ||
}); | ||
|
||
// Check if the module is imported | ||
if (importStatements.length > 0) { | ||
// Find Link components in the code | ||
const linkComponents: Collection<JSXOpeningElement> = root.find(j.JSXOpeningElement, { | ||
name: { | ||
type: 'JSXIdentifier', | ||
name: 'Link', | ||
}, | ||
}); | ||
|
||
linkComponents.forEach((path) => { | ||
if (path.node && path.node.attributes) { | ||
// Find the isUnderlined attribute | ||
path.node.attributes.forEach((attr, index) => { | ||
if (attr.type === 'JSXAttribute' && (attr as JSXAttribute).name.name === 'isUnderlined') { | ||
const jsxAttr = attr as JSXAttribute; | ||
// Check if the attribute value is true | ||
if ( | ||
jsxAttr.value === null || | ||
(jsxAttr.value?.type === 'JSXExpressionContainer' && | ||
jsxAttr.value.expression.type === 'BooleanLiteral' && | ||
jsxAttr.value.expression.value === true) || | ||
(jsxAttr.value?.type === 'Literal' && jsxAttr.value.value === true) | ||
) { | ||
// Change isUnderlined to underline="always" | ||
jsxAttr.name.name = 'underlined'; | ||
jsxAttr.value = j.literal('always'); | ||
} else if ( | ||
jsxAttr.value?.type === 'JSXExpressionContainer' && | ||
jsxAttr.value.expression.type === 'BooleanLiteral' && | ||
jsxAttr.value.expression.value === false | ||
) { | ||
// If isUnderlined is set to false, remove the attribute | ||
path.node.attributes?.splice(index, 1); | ||
} | ||
} | ||
}); | ||
} | ||
}); | ||
} | ||
|
||
return root.toSource(); | ||
}; | ||
|
||
export default transform; |