feat: Update, cleanup and move necessary dependencies to peerDependencies #485

voronianski · 2019-10-05T12:46:23Z

Addresses #453.

Approach and changes

move react, react-dom, @emotion/core, @emotion/styled and emotion-theming to package peerDependencies
move necessary dev dependencies from dependencies to devDependencies
update dependencies to latest minor and then to latest major whenever it's possible (by checking their release notes for breaking changes)
update code where it was needed to support updated dependencies
update deprecated storybook methods in all stories
run all test and build commands without errors

Questions

Not updated dependencies

Only 2 dependencies were not upgraded to latest:

commitizen                        latest  3.1.2  ❯  4.0.3  https://github.com/commitizen/cz-cli
react-docgen-annotation-resolver  latest  1.1.0  ❯  2.0.0  https://github.com/Jmeyering/react-docgen-annotation-resolver#readme

commitizen in their latest v4 removed support of Node v8 completely
react-docgen-annotation-resolver in its' latest v2 brings support for react-docgen v5 which is in beta yet

Actually updating commitizen seems to be not a problem in my opinion, as we're anyways developing Circuit being on latest version of Node.

Definition of done

connor-baer

This is A M A Z I N G! 💯👏 Thank you so much for taking care of the Storybook deprecation as well. That must have been a lot of work.

Let me know if my feedback is clear. I know there's not much documentation out there around peer dependencies.

build/global-styles

package.json

src/components/Sidebar/components/CloseButton/CloseButton.js

fernandofleury

👍 for @connor-baer suggestions

* feat(components): add ComponentsContext ISSUES CLOSED: #466 * feat(components): use Link from context in Sidebar * feat(components): use Link from context in Buttons * docs(components): write guidelines on how to override base components * docs(components): explain how to use the components in an app

* feat(theme): generate theme with custom properties * WIP: docs for static themeing * feat(scripts): CLI for static style extraction * refactor(components): make components work with static style extraction * test(scripts): add unit tests * refactor(scripts): simplify render function * feat(scripts): remove old static style extraction * test(scripts): add unit tests * feat(scripts): handle wrapped styled components * feat(scripts): extract styles from more components * feat(scripts): add a simple yarn script * refactor(components): make more components work with static style extraction * feat(scripts): extract styles from more components * docs(scripts): finish documentation * test(scripts): add tests for component types

* fix(components): pass href to nav link * fix(components): exclude inactive ButtonGroup styles

connor-baer

Thank you for fixing the peerDependencies! 👍

As we discussed on Slack, I'd like to split out the Storybook-related changes since they're not a breaking change and we need them for the migration to Storybook Docs. From what I can tell, those changes are mostly contained in these 2 commits:

I've cherry-picked those commits into a new branch: feature/storybook-docs. I'm not sure if it's easier to remove those commits from this PR (the first commit also contains dependency upgrades) or simply rebase on the new branch. WDYT?

fernandofleury

LGTM after sorting out the storybook issue

voronianski · 2019-10-21T16:14:27Z

Thank you for fixing the peerDependencies! 👍

As we discussed on Slack, I'd like to split out the Storybook-related changes since they're not a breaking change and we need them for the migration to Storybook Docs. From what I can tell, those changes are mostly contained in these 2 commits:

cleanup warnings + more deps updates

remove deprecacted storybook methods

I've cherry-picked those commits into a new branch: feature/storybook-docs. I'm not sure if it's easier to remove those commits from this PR (the first commit also contains dependency upgrades) or simply rebase on the new branch. WDYT?

Uh, it will be a bit hard to separate them... there are also these commits:

@connor-baer would it be easier to go with all storybook changes together in v2?

connor-baer · 2019-10-21T19:02:51Z

remove deprecacted storybook methods

I cherry-picked that one as well :)

add missed global withInfo

That change isn't necessary since Storybook Docs replaces the addon-info entirely.

Storybook Docs is not a breaking change so I'd like to release it in v1.x.

I think it's easiest to wait until #495 has been merged and then rebase. I'm happy to resolve the merge conflicts.

voronianski · 2019-10-21T20:05:22Z

I cherry-picked that one as well :)

ai, missed it somehow :)

I think it's easiest to wait until #495 has been merged and then rebase. I'm happy to resolve the merge conflicts.

alright then let's do it this way

* cleanup warnings + more deps updates Co-authored-by: Dmitri Voronianski <dmitri.voronianski@sumup.com> * remove deprecacted storybook methods * feat(docs): upgrade to Storybook 5.2 * feat(docs): update Storybook config and tweak theme * feat(docs): configure addon-docs Co-authored-by: lucent1090 <lucent1090@gmail.com> * feat(docs): remove Storybook group enums * feat(docs): run codemod to add component parameter https://github.com/storybookjs/storybook/blob/next/lib/codemod/README.md#add-component-parameters * feat(docs): run codemod to transform stories to CSF https://github.com/storybookjs/storybook/blob/next/lib/codemod/README.md#storiesof-to-csf * feat(docs): simplify Storybook configs * fix(components): update snapshots * fix(docs): update image paths * feat(docs): add a11y and viewport addons

connor-baer · 2019-10-25T21:16:18Z

I've rebased on the lastest canary so this PR is now clean of Storybook changes.

I've temporarily changed the base branch to canary to see the actual changes. The PR should be merged into alpha though. Since this will be the first commit for v2, we need to follow the following steps:

Recreate alpha from canary.
Immediately after pushing alpha to GitHub, merge this PR into it. Include the following text in the squash commit message (ie. the commit body, not the title): BREAKING CHANGE: Upgraded minimum React version to v16.8.6.

This is important to ensure that semantic-release picks up the breaking change and publishes the prerelease version under 2.0.0-alpha.

* fix: update Storybook This resolves and issue with the theme being undefined. * feat(docs): add doc blocks * feat(docs): add markdown styles This is hopefully just a temporary hack. * feat(docs): migrate Badge * feat(docs): migrate colors * feat(docs): migrate fonts * feat(docs): migrate spacing * feat(docs): migrate grid * feat(docs): migrate media queries * feat(docs): migrate typography * feat(docs): migrate static styles * feat(docs): migrate theme reference * feat(docs): migrate welcome * feat(docs): migrate getting started * refactor(docs): rename asset folder * feat(docs): migrate Blockquote * feat(docs): migrate Button * feat(docs): remove Docz * feat(docs): explicitely sort stories * feat(docs): migrate Hr * fix(scripts): install babel-cli This was lost when docz was removed. * feat(docs): migrate Image * feat(docs): migrate Card * feat(docs): migrate List * feat(docs): migrate Tag * feat(docs): migrate Toggle * feat(docs): migrate Selector * feat(docs): migrate Tabs * feat(docs): migrate ProgressBar * feat(docs): migrate Tooltip * feat(docs): migrate Table * feat(docs): migrate Sidebar * feat(docs): migrate Calendar * feat(docs): migrate Message * feat(docs): migrate Icons * feat(docs): migrate InlineNotification * feat(docs): migrate Pagination * feat(docs): migrate Text, Heading, and SubHeading * feat(docs): migrate Modal * feat(docs): migrate Input, Label * feat(docs): migrate TextArea * feat(docs): migrate SearchInput * feat(docs): migrate AutoCompleteInput * feat(docs): migrate CurrencyInput * feat(docs): migrate Select * feat(docs): migrate Checkbox * feat(docs): migrate RadioButton * feat(components): deprecate the State component * refactor(docs): clean up other stories * feat(docs): customize MDX components * feat(docs): tweak story sorting * feat(docs): update the logo header * feat(docs): add Link component * feat(docs): update GitHub repo URL

* feat(tests): use storyshots for snapshot tests * fix(tests): remove story wrapper from storyshots * fix(tests): disable test decorator for storyshots * test(components): update snapshots

we need to create a dist/static directory in this script for the build:stylesheets script to save the css

Remove flex from the Sidebar Footer and position to the bottom with margin: auto. This fixes a Safari bug where the top padding was squashed (see PR). This commit also adds a parent element to the story to make the Sidebar behave more like a production app."

…elected (#507) Addresses [PMNTSS-205].

Mocks document.createRange which is used by popper.js, dependency of react-popper.

codecov-io · 2019-11-09T13:12:37Z

Codecov Report

Merging #485 into alpha will increase coverage by 3.5%.
The diff coverage is 89.36%.

@@            Coverage Diff            @@
##            alpha     #485     +/-   ##
=========================================
+ Coverage   76.15%   79.66%   +3.5%     
=========================================
  Files         167      172      +5     
  Lines        2453     2478     +25     
  Branches      435      445     +10     
=========================================
+ Hits         1868     1974    +106     
+ Misses        467      388     -79     
+ Partials      118      116      -2

Impacted Files	Coverage Δ
src/components/Sidebar/Sidebar.js	`100% <ø> (ø)`	⬆️
src/components/Hamburger/Hamburger.js	`100% <ø> (ø)`	⬆️
src/components/Message/components/Button/Button.js	`100% <ø> (ø)`	⬆️
src/components/SearchInput/SearchInput.js	`100% <ø> (ø)`	⬆️
src/components/Selector/Selector.js	`100% <ø> (ø)`	⬆️
src/components/CurrencyInput/CurrencyInput.js	`100% <ø> (ø)`	⬆️
.../components/AutoCompleteInput/AutoCompleteInput.js	`84.37% <ø> (ø)`	⬆️
...mponents/SideNav/components/Modal/isOverflowing.js	`0% <ø> (ø)`	⬆️
...oadingButton/components/LoadingIcon/LoadingIcon.js	`100% <ø> (ø)`	⬆️
src/components/Label/Label.js	`100% <ø> (ø)`	⬆️
... and 73 more

connor-baer · 2019-11-10T03:06:55Z

🎉 This PR is included in version 2.0.0-alpha.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

…cies (#485) * move dependencies, peers and devs * update snapshots and tests related * cleanup warnings + more deps updates * update transition group * update leftover dependencies * move out foundry deps, update peer deps * fix accessibility errors in CloseButton of Sidebar * fix(configs): fix tests using popper.js Mocks document.createRange which is used by popper.js, dependency of react-popper. * test(components): update storyshots BREAKING CHANGE: Upgraded minimum React version to v16.8.6

github-actions · 2020-06-08T08:45:17Z

🎉 This PR is included in version 2.0.0-beta.1 🎉

The release is available on:

Your semantic-release bot 📦🚀

github-actions · 2020-07-30T16:37:14Z

🎉 This PR is included in version 2.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

voronianski added the 🛠️ tech Changes to the tech stack or infrastructure label Oct 5, 2019

voronianski added this to the v2.0 milestone Oct 5, 2019

voronianski requested review from connor-baer, felixjung and fernandofleury October 5, 2019 12:46

voronianski added the ready for review label Oct 5, 2019

voronianski changed the title ~~tech: Update/cleanup dependencies and move necessary modules to peerDependencies~~ feat: Update, cleanup and move necessary dependencies to peerDependencies Oct 7, 2019

connor-baer changed the base branch from canary to alpha October 7, 2019 13:27

connor-baer requested changes Oct 7, 2019

View reviewed changes

build/global-styles Outdated Show resolved Hide resolved

package.json Outdated Show resolved Hide resolved

package.json Outdated Show resolved Hide resolved

package.json Show resolved Hide resolved

src/components/Sidebar/components/CloseButton/CloseButton.js Outdated Show resolved Hide resolved

fernandofleury reviewed Oct 11, 2019

View reviewed changes

connor-baer added 6 commits October 14, 2019 11:30

fix(configs): automatically deploy Storybook and Docz from CI (#488)

abe5527

feat(components): add mobile styles for Messages (#489)

070f408

fix(components): pass href to NavItem link (#492)

d0bad70

* fix(components): pass href to nav link * fix(components): exclude inactive ButtonGroup styles

fix(components): prevent interactions on disabled Selector (#493)

119e83e

voronianski requested review from fernandofleury and connor-baer October 18, 2019 17:40

connor-baer requested changes Oct 19, 2019

View reviewed changes

fernandofleury suggested changes Oct 21, 2019

View reviewed changes

fernandofleury removed the request for review from felixjung October 22, 2019 09:38

connor-baer force-pushed the tech/update-dependencies branch from c51e175 to 2e007f7 Compare October 25, 2019 21:00

connor-baer changed the base branch from alpha to canary October 25, 2019 21:03

connor-baer approved these changes Oct 25, 2019

View reviewed changes

fernandofleury approved these changes Oct 27, 2019

View reviewed changes

connor-baer and others added 16 commits October 28, 2019 20:25

feat(tests): configure StoryShots (#498)

7a197d1

* feat(tests): use storyshots for snapshot tests * fix(tests): remove story wrapper from storyshots * fix(tests): disable test decorator for storyshots * test(components): update snapshots

fix(scripts): fix predeploy script (#503)

ffc4cef

we need to create a dist/static directory in this script for the build:stylesheets script to save the css

fix(docs): import test decorator correctly (#504)

c203b43

fix(scripts): prevent Storybook from overwriting the static CSS (#505)

52e29ce

fix(components): show border styles when CardList.Item component is s…

facc2b5

…elected (#507) Addresses [PMNTSS-205].

fix: use correct license in package.json (#508)

ce944f4

move dependencies, peers and devs

57d3a18

update snapshots and tests related

ac2f8b9

cleanup warnings + more deps updates

a3393f2

update transition group

0944679

update leftover dependencies

c4b883e

move out foundry deps, update peer deps

0905fc6

fix accessibility errors in CloseButton of Sidebar

d88e4db

fix(configs): fix tests using popper.js

541cd60

Mocks document.createRange which is used by popper.js, dependency of react-popper.

connor-baer force-pushed the tech/update-dependencies branch from 535a459 to 541cd60 Compare November 9, 2019 13:12

test(components): update storyshots

0d54ffd

sumup-oss deleted a comment from codecov bot Nov 9, 2019

connor-baer changed the base branch from canary to alpha November 10, 2019 02:51

connor-baer merged commit 6d77b04 into alpha Nov 10, 2019

connor-baer deleted the tech/update-dependencies branch November 10, 2019 02:54

connor-baer added the released label Nov 10, 2019

connor-baer mentioned this pull request Nov 10, 2019

Move dependencies to peer dependencies #453

Closed

github-actions bot added the released on @beta label Jun 8, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Update, cleanup and move necessary dependencies to peerDependencies #485

feat: Update, cleanup and move necessary dependencies to peerDependencies #485

voronianski commented Oct 5, 2019 •

edited by connor-baer

Loading

connor-baer left a comment

fernandofleury left a comment

connor-baer left a comment •

edited

Loading

fernandofleury left a comment

voronianski commented Oct 21, 2019 •

edited

Loading

connor-baer commented Oct 21, 2019 •

edited

Loading

voronianski commented Oct 21, 2019 •

edited

Loading

connor-baer commented Oct 25, 2019 •

edited

Loading

codecov-io commented Nov 9, 2019 •

edited

Loading

connor-baer commented Nov 10, 2019

github-actions bot commented Jun 8, 2020

github-actions bot commented Jul 30, 2020

feat: Update, cleanup and move necessary dependencies to peerDependencies #485

feat: Update, cleanup and move necessary dependencies to peerDependencies #485

Conversation

voronianski commented Oct 5, 2019 • edited by connor-baer Loading

Approach and changes

Questions

Not updated dependencies

Definition of done

connor-baer left a comment

Choose a reason for hiding this comment

fernandofleury left a comment

Choose a reason for hiding this comment

connor-baer left a comment • edited Loading

Choose a reason for hiding this comment

fernandofleury left a comment

Choose a reason for hiding this comment

voronianski commented Oct 21, 2019 • edited Loading

connor-baer commented Oct 21, 2019 • edited Loading

voronianski commented Oct 21, 2019 • edited Loading

connor-baer commented Oct 25, 2019 • edited Loading

codecov-io commented Nov 9, 2019 • edited Loading

Codecov Report

connor-baer commented Nov 10, 2019

github-actions bot commented Jun 8, 2020

github-actions bot commented Jul 30, 2020

voronianski commented Oct 5, 2019 •

edited by connor-baer

Loading

connor-baer left a comment •

edited

Loading

voronianski commented Oct 21, 2019 •

edited

Loading

connor-baer commented Oct 21, 2019 •

edited

Loading

voronianski commented Oct 21, 2019 •

edited

Loading

connor-baer commented Oct 25, 2019 •

edited

Loading

codecov-io commented Nov 9, 2019 •

edited

Loading