Как типизировать generic component?

Коротко: Generic component переиспользует UI с разными типами данных, сохраняя тип item и callbacks.

Что важно сказать на собеседовании: На собеседовании важно связать эту тему с реальной render-моделью React: где источник данных, что вызывает обновление, какие побочные эффекты допустимы и как это влияет на поддержку интерфейса.

Пример (TypeScript/TSX):

type SelectProps<T> = {
  items: T[];
  getLabel: (item: T) => string;
  onSelect: (item: T) => void;
};

function Select<T>({ items, getLabel, onSelect }: SelectProps<T>) {
  return <>{items.map((item) => <button onClick={() => onSelect(item)}>{getLabel(item)}</button>)}</>;
}

Типичные ошибки: Типичная ошибка — отвечать только синтаксисом и не объяснять, как решение поведёт себя при повторном render, смене props, unmount или росте данных.

Практический контекст: В практике это встречается в формах, списках, dashboards, личных кабинетах и компонентах design-system; сильный ответ показывает не только API, но и границы применения.