Add codemod for Text component interface

[yangwooseong]

Self Checklist

• I wrote a PR title in English and added an appropriate label to the PR.
• I wrote the commit message in English and to follow the Conventional Commits specification.
• I added the changeset about the changes that needed to be released. (or didn't have to)
• I wrote or updated documentation related to the changes. (or didn't have to)
• I wrote or updated tests related to the changes. (or didn't have to)
• I tested the changes in various browsers. (or didn't have to)
  • Windows: Chrome, Edge, (Optional) Firefox
  • macOS: Chrome, Edge, Safari, (Optional) Firefox

Related Issue

• Fixes Writing code to convert Typography of TextProps.typo to typo string literal #1816

Summary

• Text 컴포넌트의 인터페이스를 변경하기 위한 codemod 를 추가합니다. 아래와 같이 변환됩니다.
• Refactor directory sturcture in bezier-codemod package #1844 base, from a1f267f

// As-is
import { Text, Typography } from '@channel.io/bezier-react'

<Text 
  typo={Typography.Size14}
  marginHorizontal={6}
>
  some text
</Text>

// To-be
import { Text } from '@channel.io/bezier-react'

<Text 
  typo="14"
  mx={6}
>
  some text
</Text>

// As-is
import { Text, styled, Typography } from '@channel.io/bezier-react'

const Title = styled(Text).attrs({
  typo: Typography.Size11,
  marginHorizontal: 6,
})``

// To-be
import { Text, styled } from '@channel.io/bezier-react'

const Title = styled(Text).attrs({
  typo: '11',
  mxl: 6,
})``

Details

• 컴포넌트의 prop 을 변경하는 유틸과 styled component 안에서 .attrs 뒤에 나오는 객체를 변경하는 유틸을 추가했습니다.

Breaking change? (Yes/No)

• No

References

• Writing code to convert Typography of TextProps.typo to typo string literal #1816

[changeset-bot]

🦋 Changeset detected

Latest commit: 356134e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@channel.io/bezier-codemod	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (f33060f) 86.37% compared to head (356134e) 86.37%.

Additional details and impacted files

@@           Coverage Diff           @@
##            alpha    #1849   +/-   ##
=======================================
  Coverage   86.37%   86.37%           
=======================================
  Files         275      275           
  Lines        3765     3765           
  Branches      795      795           
=======================================
  Hits         3252     3252           
  Misses        434      434           
  Partials       79       79           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[sungik-choi]

👍

[sungik-choi]

STYLED_ATTRS_TRANSFORM_MAP 같은 이름이 적합하지 않을까요? transform 구현이 바뀌면서 map에 typography도 추가되었으니까요

[sungik-choi]

마찬가지로 JSX_TRANSFORM_MAP ?

[sungik-choi]

뒤 문구는 왜 제거된건지 궁금합니다!

[yangwooseong]

transformEnumMemberToStringLiteral 를 사용하게 되면, Typography enum 을 모두 바꿔버립니다.

// As-is
import { styled, Text, Typogarphy } from '@channel.io/bezier-react'

const Title = styled(Text).attrs({
  typo: Typography.Size11,
})``

const Subtitle = styled(Text)`
  ${Typography.Size11}
`  

// To-be
import { styled, Text } from '@channel.io/bezier-react'

const Title = styled(Text).attrs({
  typo: '11',
})``

const Subtitle = styled(Text)`
  '11',
`  

그렇기 때문에 changeAttrProperty 함수로 바꾸었고, 이제 이런 케이스를 잘 핸들링할 수 있게 되어서 위 문구를 제거했습니다. ba57985 에서 관련 테스트 케이스를 추가했습니다.

[sungik-choi]

아 바로 이해됐습니다ㅎㅎ 감사합니다

[sungik-choi]

리베이스 한 번 부탁드릴게요

[sungik-choi]

Suggested change

	transformEnumTostringLiteralInBezier(sourceFile, ENUM_TRANSFORM_MAP)
	transformEnumToStringLiteralInBezier(sourceFile, ENUM_TRANSFORM_MAP)

마이너: typo. 지금 봤네요