feat(left sidebar): implement navigation

This commit is contained in:
Hristo Nedelkov 2024-03-07 13:15:02 +02:00 committed by Emil Ivanichkov
parent 17d5983490
commit 6072f8bc55
2 changed files with 8 additions and 1 deletions

View File

@ -58,6 +58,7 @@ const LeftSidebar = () => {
isSelected={button.isSelected} isSelected={button.isSelected}
isDisabled={button.isDisabled} isDisabled={button.isDisabled}
id={button.id} id={button.id}
path={button.path}
/> />
))} ))}
</YStack> </YStack>

View File

@ -1,6 +1,7 @@
import { IconButton } from '@status-im/components' import { IconButton } from '@status-im/components'
import { useDispatch } from 'react-redux' import { useDispatch } from 'react-redux'
import { Stack } from 'tamagui' import { Stack } from 'tamagui'
import { useNavigate } from 'react-router'
import { toggleButtonSelection } from '../../../redux/LeftSidebar/slice' import { toggleButtonSelection } from '../../../redux/LeftSidebar/slice'
@ -10,6 +11,7 @@ type IconButtonWithDotProps = {
isSelected: boolean isSelected: boolean
isDisabled?: boolean isDisabled?: boolean
id: string id: string
path: string
} }
const LeftSidebarIconButton = ({ const LeftSidebarIconButton = ({
@ -18,11 +20,15 @@ const LeftSidebarIconButton = ({
isSelected, isSelected,
isDisabled, isDisabled,
id, id,
path,
}: IconButtonWithDotProps) => { }: IconButtonWithDotProps) => {
const dispatch = useDispatch() const dispatch = useDispatch()
const navigate = useNavigate()
const onClickHandler = () => const onClickHandler = () => {
isDisabled ? null : dispatch(toggleButtonSelection(id)) isDisabled ? null : dispatch(toggleButtonSelection(id))
navigate(path)
}
return ( return (
<Stack style={{ position: 'relative', display: 'inline-block' }}> <Stack style={{ position: 'relative', display: 'inline-block' }}>