Fix remove redundant onClick event in favor of Link component (#8540)

Fixes: #8531 

1. Summary
There is `onClick` event handler defined for `NavigationDrawerItem`
component, and inside the handler, if `to` is not empty, we trigger
another navigation when it's already handled by `Link` component from
`react-router-dom`

2. Solution
Removed extra navigation logic from `NavigationDrawerItem`'s `onClick`
handler

3. Screen Recording


https://github.com/user-attachments/assets/cfefdd51-1663-4d96-acd2-57783ae9877f
This commit is contained in:
Khuddite 2024-11-18 03:41:14 -05:00 committed by GitHub
parent ef5cc80440
commit ade1c57ff4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -8,8 +8,7 @@ import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
import isPropValid from '@emotion/is-prop-valid';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { isNonEmptyString } from '@sniptt/guards';
import { Link, useNavigate } from 'react-router-dom';
import { Link } from 'react-router-dom';
import { useRecoilState } from 'recoil';
import {
IconComponent,
@ -168,7 +167,6 @@ export const NavigationDrawerItem = ({
const theme = useTheme();
const isMobile = useIsMobile();
const isSettingsPage = useIsSettingsPage();
const navigate = useNavigate();
const [isNavigationDrawerExpanded, setIsNavigationDrawerExpanded] =
useRecoilState(isNavigationDrawerExpandedState);
const showBreadcrumb = indentationLevel === 2;
@ -182,10 +180,6 @@ export const NavigationDrawerItem = ({
onClick();
return;
}
if (isNonEmptyString(to)) {
navigate(to);
}
};
return (