Create ESLint rule to discourage usage of navigate() and prefer Link (#5642)

### Description
Create ESLint rule to discourage usage of navigate() and prefer Link


### Refs
#5468 

### Demo

![Capture-2024-05-29-112852](https://github.com/twentyhq/twenty/assets/140154534/28378c09-86bb-49d3-9e9a-49aa1c07ad11)

![Capture-2024-05-29-112843](https://github.com/twentyhq/twenty/assets/140154534/2c05ea92-e19b-49ae-acb9-07f6ec9182ab)

Fixes #5468

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: Matheus <matheus_benini@hotmail.com>
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
This commit is contained in:
gitstart-twenty
2024-06-04 11:04:57 -04:00
committed by GitHub
parent 234e062232
commit bb7d94a455
18 changed files with 317 additions and 132 deletions

View File

@ -1,5 +1,4 @@
import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { Key } from 'ts-key-enum';
import {
IconBaselineDensitySmall,
@ -27,6 +26,7 @@ import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenu
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { UndecoratedLink } from '@/ui/navigation/link/components/UndecoratedLink';
import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
import { MenuItemNavigate } from '@/ui/navigation/menu-item/components/MenuItemNavigate';
import { MenuItemToggle } from '@/ui/navigation/menu-item/components/MenuItemToggle';
@ -50,8 +50,6 @@ export const RecordIndexOptionsDropdownContent = ({
}: RecordIndexOptionsDropdownContentProps) => {
const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
const navigate = useNavigate();
const { closeDropdown } = useDropdown(RECORD_INDEX_OPTIONS_DROPDOWN_ID);
const [currentMenu, setCurrentMenu] = useState<
@ -68,13 +66,9 @@ export const RecordIndexOptionsDropdownContent = ({
objectNameSingular: objectNameSingular,
});
const handleEditClick = () => {
navigate(
getSettingsPagePath(SettingsPath.ObjectDetail, {
objectSlug: objectNamePlural,
}),
);
};
const settingsUrl = getSettingsPagePath(SettingsPath.ObjectDetail, {
objectSlug: objectNamePlural,
});
useScopedHotkeys(
[Key.Escape],
@ -194,13 +188,12 @@ export const RecordIndexOptionsDropdownContent = ({
</>
)}
<DropdownMenuSeparator />
<DropdownMenuItemsContainer>
<MenuItem
onClick={handleEditClick}
LeftIcon={IconSettings}
text="Edit Fields"
/>
</DropdownMenuItemsContainer>
<UndecoratedLink to={settingsUrl}>
<DropdownMenuItemsContainer>
<MenuItem LeftIcon={IconSettings} text="Edit Fields" />
</DropdownMenuItemsContainer>
</UndecoratedLink>
</>
)}