Skip to content

BulkSelect: Add internationalization (i18n) support #895

@rhamilto

Description

@rhamilto

Describe the problem

The BulkSelect component currently has hardcoded English strings with no way to internationalize them for applications that need to support multiple languages.

Current hardcoded strings

  • "Select none (0)"

  • "Select page (N)"

  • "Select all (N)"

  • "N selected"

Proposed solution

Add optional props to allow customization of all user-facing strings:

export interface BulkSelectProps {
  // ... existing props
  
  /** Custom label for "Select none" option */
  selectNoneLabel?: string;
  /** Custom label for "Select page" option */
  selectPageLabel?: string;
  /** Custom label for "Select all" option */
  selectAllLabel?: string;
  /** Custom label formatter for selected count */
  selectedLabel?: (count: number) => string;
}

Example usage

import { useTranslation } from 'react-i18next';

const MyComponent = () => {
  const { t } = useTranslation();
  
  return (
    <BulkSelect
      selectedCount={5}
      totalCount={100}
      onSelect={handleSelect}
      selectNoneLabel={t('Select none')}
      selectPageLabel={t('Select page')}
      selectAllLabel={t('Select all')}
      selectedLabel={(count) => t('{{count}} selected', { count })}
    />
  );
};

Alternatives considered

  1. Using a Context-based i18n approach similar to other PatternFly components
  2. Accepting string templates with placeholders (e.g., "Select page ({count})")

Impact

Applications using BulkSelect that need to support non-English languages or custom terminology currently have to either:

  • Accept English-only labels

  • Build their own bulk select component from scratch

  • Fork and modify the component

Related

This would align BulkSelect with other PatternFly components that support i18n.


Jira Issue: PF-3838

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    Status

    Needs triage

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions