diff options
Diffstat (limited to 'src/components/organisms/toolbar/toolbar.tsx')
| -rw-r--r-- | src/components/organisms/toolbar/toolbar.tsx | 37 |
1 files changed, 23 insertions, 14 deletions
diff --git a/src/components/organisms/toolbar/toolbar.tsx b/src/components/organisms/toolbar/toolbar.tsx index e4188fe..e196c09 100644 --- a/src/components/organisms/toolbar/toolbar.tsx +++ b/src/components/organisms/toolbar/toolbar.tsx @@ -2,26 +2,33 @@ import useClickOutside from '@utils/hooks/use-click-outside'; import { FC, useRef, useState } from 'react'; import MainNav, { type MainNavProps } from '../toolbar/main-nav'; import Search, { type SearchProps } from '../toolbar/search'; -import Settings from '../toolbar/settings'; +import Settings, { SettingsProps } from '../toolbar/settings'; import styles from './toolbar.module.scss'; -export type ToolbarProps = Pick<SearchProps, 'searchPage'> & { - /** - * Set additional classnames to the toolbar wrapper. - */ - className?: string; - /** - * The main nav items. - */ - nav: MainNavProps['items']; -}; +export type ToolbarProps = Pick<SearchProps, 'searchPage'> & + Pick<SettingsProps, 'ackeeStorageKey' | 'motionStorageKey'> & { + /** + * Set additional classnames to the toolbar wrapper. + */ + className?: string; + /** + * The main nav items. + */ + nav: MainNavProps['items']; + }; /** * Toolbar component * * Render the website toolbar. */ -const Toolbar: FC<ToolbarProps> = ({ className = '', nav, searchPage }) => { +const Toolbar: FC<ToolbarProps> = ({ + ackeeStorageKey, + className = '', + motionStorageKey, + nav, + searchPage, +}) => { const [isNavOpened, setIsNavOpened] = useState<boolean>(false); const [isSearchOpened, setIsSearchOpened] = useState<boolean>(false); const [isSettingsOpened, setIsSettingsOpened] = useState<boolean>(false); @@ -53,11 +60,13 @@ const Toolbar: FC<ToolbarProps> = ({ className = '', nav, searchPage }) => { ref={searchRef} /> <Settings + ackeeStorageKey={ackeeStorageKey} + className={`${styles.modal} ${styles['modal--settings']}`} isActive={isSettingsOpened} + motionStorageKey={motionStorageKey} + ref={settingsRef} setIsActive={setIsSettingsOpened} - className={`${styles.modal} ${styles['modal--settings']}`} tooltipClassName={styles.tooltip} - ref={settingsRef} /> </div> ); |
