-
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 Link underline prop
- replacing the `isUnderlined` prop with a new `underline` prop and set it to "always" if true
- Loading branch information
1 parent
0f6cd05
commit 8e2ffb6
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-underline-prop` — Link `isUnderlined` to `underline` prop change | ||
|
||
This codemod updates the `Link` component by replacing the `isUnderlined` prop with a new `underline` prop, setting it to "always". | ||
|
||
#### Usage | ||
|
||
```sh | ||
npx @lmc-eu/spirit-codemods -p <path> -t v3/web-react/link-underline-prop | ||
``` | ||
|
||
#### Example | ||
|
||
```diff | ||
- <Link isUnderlined … /> | ||
+ <Link underline="always" … /> | ||
``` |
12 changes: 12 additions & 0 deletions
12
packages/codemods/src/transforms/v3/web-react/__testfixtures__/link-underline-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
...ages/codemods/src/transforms/v3/web-react/__testfixtures__/link-underline-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 underline="always" /> | ||
<Link underline="always" /> | ||
<Link /> | ||
</> | ||
); |
3 changes: 3 additions & 0 deletions
3
packages/codemods/src/transforms/v3/web-react/__tests__/link-underline-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-underline-prop'); |
67 changes: 67 additions & 0 deletions
67
packages/codemods/src/transforms/v3/web-react/link-underline-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 = 'underline'; | ||
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; |