Datagrid component - i18n handling

[holmansze]

Epic: 1607

WKC datagrid handles i18n internally. In Carbon for IBM Products, components expects translated strings to be passed via props. I've made the initial changes to turn these strings into props, and default them to the English translation in WKC datagrid.

We need to do a review to ensure all these strings can be passed from the consumer.

Here's one example:

WKC datagrid:

import { useIntl, defineMessages } from 'react-intl';

...

const messages = defineMessages({
  selectAllRows: {
    id: 'wkc-shared-ui.src.components.datagrid.Datagrid.DataGridSelectAll.selectAllRows',
    defaultMessage: 'Select all',
  },
  selectAllPageRows: {
    id: 'wkc-shared-ui.src.components.datagrid.Datagrid.DataGridSelectAll.selectAllPageRows',
    defaultMessage: 'Select all on page',
  },
});

...

  let allPageRowsLabel = intl.formatMessage(messages.selectAllPageRows);
  let allRowsLabel = intl.formatMessage(messages.selectAllRows);
...

IBM Products Datagrid:

const SelectAllWithToggle = ({
  tableId,
  isFetching,
  isAllRowsSelected,
  selectAllToggle,
  getToggleAllPageRowsSelectedProps,
  getToggleAllRowsSelectedProps,
  allPageRowsLabel = 'Select all on page',
  allRowsLabel = 'Select all',
}) => {
...

In this case, we need to ensure there is a way for consumer to pass allPageRowsLabel and allRowsLabel from top-level.

[elycheea]

@matthewgallo Can you add notes on how we normally handle this?

[matthewgallo]

Yes, so typically the way we've handled components with strings/labels/etc. is by adding a string prop for each that the consumer will pass to the component. This allows our library to not require any kind of translation service. For the datagrid component to follow these standards, we'll need to replace some of the hard coded strings within the component and create props for them.