Details
-
Story
-
Status: Closed (View Workflow)
-
P3
-
Resolution: Done
-
None
-
None
-
-
stripes-force Sprint 53, stripes-force Sprint 54
Description
Problem
- We're having to force strings into columnMapping instead of the preferred ergonomics of <FormattedMessage> because sorting breaks.
- See https://github.com/folio-org/ui-data-import/pull/20
- We should figure out a way to accept a node like <FormattedMessage>.
Spike outcomes
- Evaluate the two options
- Ability to pass node as MCL (table) column header
- Derive multiple translation stripes from a single formatting component
- Will post results in JIRA description and of course PR
Outcome
Approach
The new <IntlConsumer> component allows apps to declaratively switch from using the injectIntl HOC.
Example transition...
Old code:
// Some comments here import { injectIntl } from 'react-intl'; //... <SearchAndSort columnMapping={{ name: this.props.intl.formatMessage({ id: 'module.mappedName' }), status: this.props.intl.formatMessage({ id: 'module.mappedStatus' }), ... }} /> export injectIntl(ThisComponent)
New Code
// import new component form stripes-core import { IntlConsumer } from '@folio/stripes/core'; //... <IntlConsumer> { intl => ( <SearchAndSort columnMapping={{ name: intl.formatMessage({ id: 'module.mappedName' }), status: intl.formatMessage({ id: 'module.mappedStatus' }), ... }} /> )} </IntlConsumer> // remove the injectIntl HOC... export default ThisComponent;
TestRail: Results
Attachments
Issue Links
- blocks
-
UIIN-403
Inventory App (excluding edit-folder): Use documented react-intl patterns instead of stripes.intl
-
- Closed
-
- relates to
-
UIDATIMP-69
Data import settings page's 4th pane for File Extensions: Header actions
-
- Closed
-
