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

    Type

    No type

    Projects

    Status

    Needs triage

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions