-
Notifications
You must be signed in to change notification settings - Fork 291
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
feat(react-intl): Bump react-intl package [BREAKING CHANGE] #3466
Conversation
|
[OUTDATED, solved in PR #3461] @greg-in-a-box @jstoffan @box/webapp It turned out that the A. Creating a temporary workaround by generating |
you can upgrade to |
I have to add resolution for |
@greg-in-a-box Great! I can see that |
@greg-in-a-box During the upgrade, I noticed that many strings in the code have changed, but the |
@greg-in-a-box @box/desktop-owners I'm wondering if the script |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@soygitana, the change itself looks good, but I'm wondering if we can drop all the cruft supporting legacy versions of react-intl.
Please also update the PR title and commit messages to something other than chore
and ensure it's marked as a BREAKING CHANGE
per the semantic conventions.
@@ -372,6 +372,7 @@ | |||
} | |||
}, | |||
"resolutions": { | |||
"ip": "1.1.8" | |||
"ip": "1.1.8", | |||
"**/react-intl/**/@types/react": "^16.9.18" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should this be some version of 17 to match our other repositories?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@soygitana, what was the reasoning for the decision here?
@@ -1,4 +1,5 @@ | |||
// @flow | |||
// @deprecated, use FormattedMessage from react-intl v6 instead. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we delete these components at this point since the upgrade itself is already a breaking change?
src/components/time/ReadableTime.js
Outdated
@@ -79,7 +79,7 @@ const ReadableTime = ({ | |||
const timeDiff = timestamp - Date.now(); | |||
if (Math.abs(timeDiff) <= relativeThreshold) { | |||
if (intl.formatRelativeTime) { | |||
// react-intl v3 | |||
// react-intl >= 3 | |||
output = intl.formatRelativeTime(timeDiff); | |||
} else { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we remove all support for legacy versions?
@jstoffan Regarding supporting legacy versions of react-intl:
❗ @greg-in-a-box @jstoffan Let's determine whether this pull request is necessary. Dawid has added support for react-intl v6 (to solve issue in Notes), which includes a breaking change related to formatRelative. If we remove support for react-intl v2 in this (#3466) pull request and ensure proper support for v6, I believe this pull request can be closed, correct? |
BREAKING CHANGE: upgrade the major version of the react-intl dependency
21396eb
to
9b3c5a2
Compare
In order to address issues related to Please refer to the screenshot for context: PresenceAvatarTooltipContent component Currently on MASTER (assuming After fix in this PR: PresenceCollaborator component Currently on MASTER (assuming After fix in this PR: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM. Once this merges, consumers will be required to upgrade to get new changes to BUIE. Are we ready to upgrade our other first-party repositories in short order?
@@ -372,6 +372,7 @@ | |||
} | |||
}, | |||
"resolutions": { | |||
"ip": "1.1.8" | |||
"ip": "1.1.8", | |||
"**/react-intl/**/@types/react": "^16.9.18" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@soygitana, what was the reasoning for the decision here?
src/features/virtualized-table-renderers/lastModifiedByCellRenderer.js
Outdated
Show resolved
Hide resolved
@jstoffan Currently, only repositories with pending merges are EUA + Workflow (open pull requests); all other repositories have been merged and are functioning correctly in production. I had a conversation with @greg-in-a-box, and he mentioned that a stable release of BUIE was just made last week. He also indicated that there won't be a stable release of BUIE anytime soon (please correct me if I'm wrong, @greg-in-a-box). From our understanding, only annotations and preview require a stable version of BUIE (correct?). Can we delay updating those two packages, or is it necessary to do so before deploying our internal repositories? |
@jstoffan |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM. Please verify that any remaining internal teams who upgrade BUIE regularly are ready to upgrade react-intl as well.
Co-authored-by: Trevor <7311041+tjuanitas@users.noreply.github.com> fix(docgen): update view const name fix(dogen): update to use new camel case for the product name fix(docgen): rename props name fix(docgen): address code review comments fix(docgen): fix prop fix(docgen): address code review comments fix(docgen): address code review comments fix(docgen): update snapshots fix(docgen): lint errors fix(docgen): lint errors fix(docgen): disable tab on file change fix(docgen): remove vscode specific comment fix(docgen): convert tag properties to camel case fix(docgen): disable docgen tab on file move by default fix(docgen): split sidebar into components, fix response parsing fix(docgen): tests fix(docgen): import path fix(docgen): casing of import file fix(docgen): move accidentally moved css file back fix(docgen): styles and header fix(docgen): input styles fix(docgen): remove search input fix(docgen): use react intl fix(docgen): move tags section into component, use translated strings fix(docgen): add the translation string fix(docgen): update tests fix(docgen): add loading and empty state feat(docgen): align the empty and error states with designs fix(docgen): update snapshots fix(docgen): convert docgen sidebar to a functional component fix(docgen): remove comments fix(docgen): convert to typescript fix(docgen): spacing fix(docgen): tests fix(docgen): autoimport fix(docgen): use sass variables for colors and font sizes fix(docgen): svg props, use existing loading state chore(docgen): add error state test fix(docgen): ts error fix(docgen): error message chore(docgen): update snapshot chore(docgen): update response fields to snake case chore(react-beautiful-dnd): Bump react-beautiful-dnd (box#3487) chore(react-textarea-autosize): Bump react-textarea-autosize (box#3488) chore(npm): override draft-js (box#3486) chore(npm): override draft-js react-tether Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> fix(content-explorer): Remove lingering contentPreviewProps (box#3489) fix(content-explorer): Remove lingering contentPreview prop chore: upgrade webpack and babel packages (box#3491) * chore: upgrade webpack and babel packages * fix: override terser-webpack-plugin versions feat(modal): enable responsive behavior (box#3492) Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> feat(usm): enable responsive behavior (box#3494) * feat(usm): enable responsive behavior * refactor: organize styles and specificity fix(content-explorer): show pagination count for small devices (box#3498) feat(content-sidebar): enable responsiveness for Preview and Sidebar (box#3497) Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> chore(jest): Bump jest to ^29.7.0 (box#3493) * chore(jest): Bump jest to 29.5.0 * chore(snapshots): updated tests * chore(jest): feedback * chore(jest): ci cd config feat(content-explorer): allow not using Portal when rendering modal (box#3501) * feat(content-explorer): allow not using Portal when rendering modal * feat(content-explorer): update test component renderer chore(ci): moved flow to its own job (box#3504) chore(mocha): removed mocha (box#3506) feat(react-intl): Bump react-intl package [BREAKING CHANGE] (box#3466) * feat(react-intl): upgrade package BREAKING CHANGE: upgrade the major version of the react-intl dependency * fix: fix intl type * fix: fix message syntax * fix: fix comments and i18n readme file * fix: fix react-intl version comments * fix: use IntlShape as a type in js files * Fix: correct type import for IntlShape * fix: add resolution * fix: use exact version to match other repos * Fix: correct type import for IntlShape * fix: remove all support for legacy versions * fix: add relativeTime helper function * fix: fix relative time in PresenceAvatarTooltipContent component * fix: fix relativeTime in PresenceCollaborator component * fix: use inclusive inequalities in relativeTime helper * fix: remove unnecessary modulo operations * fix: fix relative time in ReadableTime + fix snapshots * fix: fix relative time in lastModifiedByCellRenderer * fix: fix tests * fix: use js * fix: fix import * fix: fix else statement * fix: revert import reorder fix(i18n): update translations (box#3508) fix(i18n): update translations (box#3509) feat(docgen): map tags to json paths and render a json tree, fix tests chore(docgen): fix lint error chore(chromatic): Enabling Chromatic (box#3503) * chore(chromatic): Enabling Chromatic * chore(chromatic): clean --------- Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> fix(docgen): use translations fix(docgen): add translation strings fix(docgen): tests to use translated strings refactor(docgen): move metadata fetching logic out of BUIE fix(docgen): check if docgen tempalte only if feature is enabled fix(docgen): run the is docgen check on prop change fix(docgen): make props optional, remove duplicate props fix(docgen): address some of the code review comments fix(docgen): address some of the code review comments fix(docgen): add tests to sidebar fix(docgen): add tests to sidebar nav fix(docgen): add tests to sidebar utils fix(docgen): update copy fix(docgen): update translations fix(docgen): update json tag conversion logic fix(docgen): remove test data fix(docgen): remove test data fix(docgen): update tests with fixed nesting fix(docgen): move docgen props into docGenSidebarProps property fix(docgen): ts warnings chore(codeowners): add design system as owner for styles (box#3511) fix(docgen): address code review comments fix(docgen): update snapshot fix(docgen): address more code review comments fix(docgen): address code review comments fix(docgen): address code review comments fix(docgen): use suit convention fix(docgen): use different icon fix(docgen): use suit convention fix(docgen): remove unnecessary optional checks, add default value fix(docgen): update css class name fix(docgen): display error state fix(docgen): test fix(docgen): fix styles fix(docgen): update metadata fix(docgen): address more code review comments fix(docgen): move mocks into a mock file fix(docgen): rename the prop in sidebar nav
fix(docgen): styles and header fix(docgen): input styles fix(docgen): remove search input fix(docgen): use react intl fix(docgen): move tags section into component, use translated strings fix(docgen): add the translation string fix(docgen): update tests fix(docgen): add loading and empty state feat(docgen): align the empty and error states with designs fix(docgen): update snapshots fix(docgen): convert docgen sidebar to a functional component fix(docgen): remove comments fix(docgen): convert to typescript fix(docgen): spacing fix(docgen): tests fix(docgen): autoimport fix(docgen): use sass variables for colors and font sizes fix(docgen): svg props, use existing loading state chore(docgen): add error state test fix(docgen): ts error fix(docgen): error message chore(docgen): update snapshot chore(docgen): update response fields to snake case chore(react-beautiful-dnd): Bump react-beautiful-dnd (box#3487) chore(react-textarea-autosize): Bump react-textarea-autosize (box#3488) chore(npm): override draft-js (box#3486) chore(npm): override draft-js react-tether Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> fix(content-explorer): Remove lingering contentPreviewProps (box#3489) fix(content-explorer): Remove lingering contentPreview prop chore: upgrade webpack and babel packages (box#3491) * chore: upgrade webpack and babel packages * fix: override terser-webpack-plugin versions feat(modal): enable responsive behavior (box#3492) Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> feat(usm): enable responsive behavior (box#3494) * feat(usm): enable responsive behavior * refactor: organize styles and specificity fix(content-explorer): show pagination count for small devices (box#3498) feat(content-sidebar): enable responsiveness for Preview and Sidebar (box#3497) Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> chore(jest): Bump jest to ^29.7.0 (box#3493) * chore(jest): Bump jest to 29.5.0 * chore(snapshots): updated tests * chore(jest): feedback * chore(jest): ci cd config feat(content-explorer): allow not using Portal when rendering modal (box#3501) * feat(content-explorer): allow not using Portal when rendering modal * feat(content-explorer): update test component renderer chore(ci): moved flow to its own job (box#3504) chore(mocha): removed mocha (box#3506) feat(react-intl): Bump react-intl package [BREAKING CHANGE] (box#3466) * feat(react-intl): upgrade package BREAKING CHANGE: upgrade the major version of the react-intl dependency * fix: fix intl type * fix: fix message syntax * fix: fix comments and i18n readme file * fix: fix react-intl version comments * fix: use IntlShape as a type in js files * Fix: correct type import for IntlShape * fix: add resolution * fix: use exact version to match other repos * Fix: correct type import for IntlShape * fix: remove all support for legacy versions * fix: add relativeTime helper function * fix: fix relative time in PresenceAvatarTooltipContent component * fix: fix relativeTime in PresenceCollaborator component * fix: use inclusive inequalities in relativeTime helper * fix: remove unnecessary modulo operations * fix: fix relative time in ReadableTime + fix snapshots * fix: fix relative time in lastModifiedByCellRenderer * fix: fix tests * fix: use js * fix: fix import * fix: fix else statement * fix: revert import reorder fix(i18n): update translations (box#3508) fix(i18n): update translations (box#3509) feat(docgen): map tags to json paths and render a json tree, fix tests chore(docgen): fix lint error chore(chromatic): Enabling Chromatic (box#3503) * chore(chromatic): Enabling Chromatic * chore(chromatic): clean --------- Co-authored-by: mergify[bot] <37929162+mergify[bot]@users.noreply.github.com> fix(docgen): use translations fix(docgen): add translation strings fix(docgen): tests to use translated strings refactor(docgen): move metadata fetching logic out of BUIE fix(docgen): check if docgen tempalte only if feature is enabled fix(docgen): run the is docgen check on prop change fix(docgen): make props optional, remove duplicate props fix(docgen): address some of the code review comments fix(docgen): address some of the code review comments fix(docgen): add tests to sidebar fix(docgen): add tests to sidebar nav fix(docgen): add tests to sidebar utils fix(docgen): update copy fix(docgen): update translations fix(docgen): update json tag conversion logic fix(docgen): remove test data fix(docgen): remove test data fix(docgen): update tests with fixed nesting fix(docgen): move docgen props into docGenSidebarProps property fix(docgen): ts warnings chore(codeowners): add design system as owner for styles (box#3511) fix(docgen): address code review comments fix(docgen): update snapshot fix(docgen): address more code review comments fix(docgen): address code review comments fix(docgen): address code review comments fix(docgen): use suit convention fix(docgen): use different icon fix(docgen): use suit convention fix(docgen): remove unnecessary optional checks, add default value fix(docgen): update css class name fix(docgen): display error state fix(docgen): test fix(docgen): fix styles fix(docgen): update metadata fix(docgen): address more code review comments fix(docgen): move mocks into a mock file fix(docgen): rename the prop in sidebar nav
* feat(react-intl): upgrade package BREAKING CHANGE: upgrade the major version of the react-intl dependency * fix: fix intl type * fix: fix message syntax * fix: fix comments and i18n readme file * fix: fix react-intl version comments * fix: use IntlShape as a type in js files * Fix: correct type import for IntlShape * fix: add resolution * fix: use exact version to match other repos * Fix: correct type import for IntlShape * fix: remove all support for legacy versions * fix: add relativeTime helper function * fix: fix relative time in PresenceAvatarTooltipContent component * fix: fix relativeTime in PresenceCollaborator component * fix: use inclusive inequalities in relativeTime helper * fix: remove unnecessary modulo operations * fix: fix relative time in ReadableTime + fix snapshots * fix: fix relative time in lastModifiedByCellRenderer * fix: fix tests * fix: use js * fix: fix import * fix: fix else statement * fix: revert import reorder
BREAKING CHANGE
IMPORTANT:
Changes:
react-intl
lib has been upgrade to v6.4.2I have to change syntax of some messages and update related snapshots. Single quote which were use to wrap {placeholder} have been replaced by double quote. This is related to Message Format syntax changes in later versions of react-intl. Escape character has been changed to apostrophe ('). (a9984c3)
e.g.: now "'{foo}'" will output: "{foo}" in the formatted output instead of interpreting it as a foo argument.
❗ From now, please do not wrap {placeholder} in single quote. If you want to use quotes please use double quote (“{name}”).
formatRelativeTime
has been fixed (check comment ⬇️ for details)Legacy support has been completely removed.
Testing:
Make sure application and strings are not broken when language is changed.
For more information, please check: