Расширение функционального компонента React Stateful

из-за выпуска React Hooks я хотел попытаться «обновить» один или два компонента React в новый компонент Stateful Function с помощью Hooks.

Итак, я хотел обновить свой компонент «GenerciTooltip», позвольте мне объяснить: прямо сейчас это GenericComponent → class GenericTooltip<T> extends React.Component<T, {}>. Это построено таким образом, потому что он заботится только о положении всплывающей подсказки по центру относительно ее содержимого и добавляет маленькую стрелку в нижней части всплывающей подсказки (фактически, в этом GenericTooltip<T> Компоненте был реализован только componentDidUpdate() метод и его определил переменную tooltipRef.

Затем для каждого типа диаграммы, которую я реализую, я создаю определенный компонент, и это потому, что разные диаграммы могут отображать разные данные внутри всплывающей подсказки. Итак, давайте возьмем в качестве примера круговую диаграмму: я написал компонент PieChartTooltip, который выглядит следующим образом → class PieChartTooltip extends GenericTooltip<IPieChartTooltipProps>. Как видите, каждый конкретный компонент всплывающей подсказки расширяет компонент GenericTooltip. В этих конкретных компонентах всплывающей подсказки я реализовал только метод render().

Итак, в конце концов, в то время как компонент GenericTooltip заботится об улучшении положения всплывающей подсказки, специальный компонент всплывающей подсказки заботится о том, чтобы отобразить то, что подходит для диаграммы.

Теперь .. Я хотел бы преобразовать компонент GenericTooltip и конкретный компонент всплывающей подсказки, используя новые хуки, но .. Можно ли добиться чего-то подобного? Я имею в виду, что я больше не могу использовать ключевое слово extends.

Благодарить

Обновлено: Вот коды и коробка → https://codesandbox.io/s/p54wor9k5j Это упрощенная версия моего кода, но она показывает все, что нужно для моего вопроса (реальная реализация методов не очень важна, я думаю)