diff --git a/src/components/AsideHeader/README.md b/src/components/AsideHeader/README.md index b6e4e693..a0623486 100644 --- a/src/components/AsideHeader/README.md +++ b/src/components/AsideHeader/README.md @@ -137,6 +137,7 @@ export const Aside: FC = () => { | onClosePanel | Callback will be called when closing panel. You can add panels via `PanelItems` prop | `() => void;` | | | onMenuItemsChanged | Callback will be called when updating list of the menuItems in `AllPagesPanel` | `(items: Array) => void` | | | onMenuMoreClick | Callback will be called when some items don't fit and "more" button is clicked | `() => void;` | | +| onAllPagesClick | Callback will be called when "All pages" button is clicked | `() => void;` | | | openModalSubscriber | Function notifies `AsideHeader` about Modals visibility changes | `( (open: boolean) => void) => void` | | | panelItems | Items for `Drawer` component. Used for show additional information over main content | [`Array`](./../Drawer/README.md#draweritem-props) | `[]` | | renderContent | Function rendering the main content at the right of the `AsideHeader` | `(data: {size: number}) => React.ReactNode` | | diff --git a/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx b/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx index e91c275f..f8ae42af 100644 --- a/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx +++ b/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx @@ -296,6 +296,7 @@ export const AsideHeaderShowcase: React.FC = ({ setCompact(v); }} onMenuMoreClick={() => console.log('onMenuMoreClick')} + onAllPagesClick={() => console.log('onAllPagesClick')} /> ); diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx index 4e81f3b8..32a1b48a 100644 --- a/src/components/AsideHeader/types.tsx +++ b/src/components/AsideHeader/types.tsx @@ -45,6 +45,7 @@ export interface AsideHeaderGeneralProps extends QAProps { onClosePanel?: () => void; onChangeCompact?: (compact: boolean) => void; onMenuMoreClick?: () => void; + onAllPagesClick?: () => void; openModalSubscriber?: (subscriber: OpenModalSubscriber) => void; } diff --git a/src/components/AsideHeader/useAsideHeaderInnerContextValue.tsx b/src/components/AsideHeader/useAsideHeaderInnerContextValue.tsx index 4c1cc2e4..5f97c7d8 100644 --- a/src/components/AsideHeader/useAsideHeaderInnerContextValue.tsx +++ b/src/components/AsideHeader/useAsideHeaderInnerContextValue.tsx @@ -11,7 +11,7 @@ const EMPTY_MENU_ITEMS: MenuItem[] = []; export const useAsideHeaderInnerContextValue = ( props: AsideHeaderProps & {size: number}, ): AsideHeaderInnerContextType => { - const {size, onClosePanel, menuItems, panelItems, onMenuItemsChanged} = props; + const {size, onClosePanel, menuItems, panelItems, onMenuItemsChanged, onAllPagesClick} = props; const [innerVisiblePanel, setInnerVisiblePanel] = useState(); const ALL_PAGES_MENU_ITEM = React.useMemo(() => { return getAllPagesMenuItem(); @@ -59,10 +59,11 @@ export const useAsideHeaderInnerContextValue = ( { ...ALL_PAGES_MENU_ITEM, current: innerVisiblePanel === InnerPanels.AllPages, + onItemClick: onAllPagesClick, }, ] : menuItems || EMPTY_MENU_ITEMS, - [allPagesIsAvailable, menuItems, innerVisiblePanel, ALL_PAGES_MENU_ITEM], + [allPagesIsAvailable, menuItems, innerVisiblePanel, ALL_PAGES_MENU_ITEM, onAllPagesClick], ); const innerPanelItems = useMemo(() => {