Conversation
|
|
||
| mediaQuery.addEventListener('change', updateMediaQuery); | ||
| return () => mediaQuery.removeEventListener('change', updateMediaQuery); | ||
| }, []); |
There was a problem hiding this comment.
В массив зависимостей возможно стоит включить query, чтобы хук реагировал на изменение входного параметра. Нужно протестировать этот момент
src/components/SideMenu/index.tsx
Outdated
| dimension?: SideMenuDimension; | ||
| //todo добавить описание потом | ||
| /** */ | ||
| bottomPanelContent?: string[]; |
There was a problem hiding this comment.
Переписать по аналогии с селектом на колбеки
renderTopPanel?: () => React.ReactNode;
renderBottomPanel?: () => React.ReactNode;
Результатом вызова колбека должен быть любой ReactNode, в примерах верхнюю и нижнюю панель можно показать в виде прямоугольной окрашенной области, как это сделано в макетах.
src/components/SideMenu/index.tsx
Outdated
| @@ -0,0 +1,111 @@ | |||
| import { forwardRef, useEffect, useMemo } from 'react'; | |||
| import { IconButton } from '../IconButton'; | |||
There was a problem hiding this comment.
Убрать лишние импорты IconButton и useMemo
src/components/SideMenu/index.tsx
Outdated
| /** Параметр максимального размера окна при достижении которого будет вызвана функция onToggle */ | ||
| closeMediaQuery?: string; | ||
| /** Функция которая будет выполняться при достижении closeMediaQuery */ | ||
| onToggle?: () => void; |
There was a problem hiding this comment.
Название лучше заменить на onClose, так как колбек срабатывает только при закрытии компонента
| if (!maxWidth || !isOpen || !closeMediaQuery || !onToggle) return; | ||
|
|
||
| onToggle(); | ||
| }, [maxWidth]); |
There was a problem hiding this comment.
Возможно стоит отрефакторить тело useEffect, чтобы не было инверсии (!), по ощущением так легче воспринимать код.
Например:
if (closeMediaQuery && onClose) {
if (maxWidth && isOpen) onClose();
}
2 participants
No description provided.