Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor(@visx/text): rewrite Text with hook #946

Merged
merged 13 commits into from
Dec 4, 2020
Merged

Refactor(@visx/text): rewrite Text with hook #946

merged 13 commits into from
Dec 4, 2020

Conversation

susiwen8
Copy link
Contributor

@susiwen8 susiwen8 commented Nov 25, 2020

🚀 Enhancements

add @visx/text useText hook

🏠 Internal

rewrite @visx/text Text with useText hook

@susiwen8
Copy link
Contributor Author

@williaster Hi, I have rewrite Text by hook, please review it. Thanks

@coveralls
Copy link

coveralls commented Nov 25, 2020

Pull Request Test Coverage Report for Build 400037954

  • 44 of 44 (100.0%) changed or added relevant lines in 2 files are covered.
  • 9 unchanged lines in 4 files lost coverage.
  • Overall coverage increased (+1.6%) to 61.435%

Files with Coverage Reduction New Missed Lines %
packages/visx-shape/src/shapes/AreaClosed.tsx 1 72.0%
packages/visx-xychart/src/components/XYChart.tsx 1 93.44%
packages/visx-xychart/src/components/series/private/BaseBarGroup.tsx 3 76.42%
packages/visx-xychart/src/providers/TooltipProvider.tsx 4 81.48%
Totals Coverage Status
Change from base Build 383897138: 1.6%
Covered Lines: 1712
Relevant Lines: 2625

💛 - Coveralls

@susiwen8
Copy link
Contributor Author

@williaster Hi Chris, Did you got chance to review my code? :)

@williaster
Copy link
Collaborator

Sorry for the delay @susiwen8 , was gone on holiday last week and should be able to review today 👀 👍

Copy link
Collaborator

@williaster williaster left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the PR @susiwen8 ! It's looking great overall, I left a first round of comments and can take another look after that! 👀

packages/visx-text/package.json Outdated Show resolved Hide resolved
packages/visx-text/test/Text.test.tsx Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved

const transform = transforms.length > 0 ? transforms.join(' ') : '';

return [wordsByLines, startDy, transform];
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

since this hook has >2 return values, I'm wondering if we should return an object with named values instead. This shouldn't affect memoization of the values at all.

packages/visx-text/src/Text.tsx Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved
@susiwen8
Copy link
Contributor Author

susiwen8 commented Dec 3, 2020

@williaster Hi, any thoughts?

Copy link
Collaborator

@williaster williaster left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @susiwen this is looking GREAT 😎 Thanks for simplifying the logic per my previous comments 👌 .

I had one more small comment for a variable name, I'm also going to pull the branch to verify it functionally locally but then we should be able to get it in!

packages/visx-text/src/Text.tsx Show resolved Hide resolved
).toBe('title test');
shallow(<Label title="title test" resizeObserverPolyfill={ResizeObserver} />)
.find('visx-annotationlabel')
.forEach(item => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can you explain why this needed to be changed? in theory the API of Text shouldn't change with these changes right?

a .forEach is dangerous because if there are no matches for visx-annotationlabel, there would be no assertions and the test would "pass". so if this was needed we should add expect.hasAssertions() to the test.

Copy link
Contributor Author

@susiwen8 susiwen8 Dec 4, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@williaster That was little embarrassing, cause I'm not familiar with enzyme.... I have update label test case inspired by axis
https://github.com/airbnb/visx/blob/master/packages/visx-axis/test/Axis.test.tsx#L177

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no worries at all! 😅

packages/visx-text/src/hooks/useText.ts Outdated Show resolved Hide resolved
packages/visx-text/src/Text.tsx Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Show resolved Hide resolved
packages/visx-text/src/hooks/useText.ts Show resolved Hide resolved
@williaster
Copy link
Collaborator

Functionally looks good to me 👍 🎉

Performance-wise seems similar or even slightly better (we should have CI checks for this ideally :)

@williaster williaster added this to the 1.3.0 milestone Dec 3, 2020
Copy link
Collaborator

@williaster williaster left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks again @susiwen8 this is awesome 💯

This should land in 1.3.0 which we can get out early next week unless you need it for something sooner 👍

@williaster williaster merged commit c38aee7 into airbnb:master Dec 4, 2020
@susiwen8 susiwen8 deleted the useText branch December 4, 2020 23:02
@susiwen8
Copy link
Contributor Author

susiwen8 commented Dec 4, 2020

@williaster Thanks for guiding. I really learn something!😁

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants