Chore(front): Create a custom eslint rule for Props naming (#1904)

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: Matheus <matheus_benini@hotmail.com>
Co-authored-by: bosiraphael <raphael.bosi@gmail.com>

front/src/modules/ui/menu-item/components/MenuItemCommand.tsx

@@ -79,7 +79,7 @@ const StyledMenuItemCommandContainer = styled(Command.Item)`
   }
 `;
 
-export type MenuItemProps = {
+export type MenuItemCommandProps = {
   LeftIcon?: IconComponent;
   text: string;
   command: string;
@@ -93,7 +93,7 @@ export const MenuItemCommand = ({
   command,
   className,
   onClick,
-}: MenuItemProps) => {
+}: MenuItemCommandProps) => {
   const theme = useTheme();
 
   return (

front/src/modules/ui/menu-item/components/MenuItemMultiSelect.tsx

@@ -13,7 +13,7 @@ const StyledLeftContentWithCheckboxContainer = styled.div`
   gap: ${({ theme }) => theme.spacing(2)};
 `;
 
-type OwnProps = {
+type MenuItemMultiSelectProps = {
   LeftIcon?: IconComponent;
   selected: boolean;
   text: string;
@@ -27,7 +27,7 @@ export const MenuItemMultiSelect = ({
   selected,
   className,
   onSelectChange,
-}: OwnProps) => {
+}: MenuItemMultiSelectProps) => {
   const handleOnClick = () => {
     onSelectChange?.(!selected);
   };

front/src/modules/ui/menu-item/components/MenuItemMultiSelectAvatar.tsx

@@ -16,7 +16,7 @@ const StyledLeftContentWithCheckboxContainer = styled.div`
   gap: ${({ theme }) => theme.spacing(2)};
 `;
 
-type OwnProps = {
+type MenuItemMultiSelectAvatarProps = {
   avatar?: ReactNode;
   selected: boolean;
   text: string;
@@ -30,7 +30,7 @@ export const MenuItemMultiSelectAvatar = ({
   selected,
   className,
   onSelectChange,
-}: OwnProps) => {
+}: MenuItemMultiSelectAvatarProps) => {
   const handleOnClick = () => {
     onSelectChange?.(!selected);
   };

front/src/modules/ui/menu-item/components/MenuItemNavigate.tsx

@@ -9,7 +9,7 @@ import {
   StyledMenuItemLeftContent,
 } from '../internals/components/StyledMenuItemBase';
 
-export type MenuItemProps = {
+export type MenuItemNavigateProps = {
   LeftIcon?: IconComponent;
   text: string;
   onClick?: () => void;
@@ -21,7 +21,7 @@ export const MenuItemNavigate = ({
   text,
   className,
   onClick,
-}: MenuItemProps) => {
+}: MenuItemNavigateProps) => {
   const theme = useTheme();
 
   return (

front/src/modules/ui/menu-item/components/MenuItemSelect.tsx

@@ -39,7 +39,7 @@ export const StyledMenuItemSelect = styled(StyledMenuItemBase)<{
   }}
 `;
 
-type OwnProps = {
+type MenuItemSelectProps = {
   LeftIcon: IconComponent | null | undefined;
   selected: boolean;
   text: string;
@@ -57,7 +57,7 @@ export const MenuItemSelect = ({
   onClick,
   disabled,
   hovered,
-}: OwnProps) => {
+}: MenuItemSelectProps) => {
   const theme = useTheme();
 
   return (

front/src/modules/ui/menu-item/components/MenuItemSelectAvatar.tsx

@@ -11,7 +11,7 @@ import {
 
 import { StyledMenuItemSelect } from './MenuItemSelect';
 
-type OwnProps = {
+type MenuItemSelectAvatarProps = {
   avatar: ReactNode;
   selected: boolean;
   text: string;
@@ -31,7 +31,7 @@ export const MenuItemSelectAvatar = ({
   disabled,
   hovered,
   testId,
-}: OwnProps) => {
+}: MenuItemSelectAvatarProps) => {
   const theme = useTheme();
 
   return (

front/src/modules/ui/menu-item/components/MenuItemSelectColor.tsx

@@ -20,7 +20,7 @@ const StyledColorSample = styled.div<{ colorName: ThemeColor }>`
   width: 12px;
 `;
 
-type OwnProps = {
+type MenuItemSelectColorProps = {
   selected: boolean;
   text: string;
   className?: string;
@@ -38,7 +38,7 @@ export const MenuItemSelectColor = ({
   onClick,
   disabled,
   hovered,
-}: OwnProps) => {
+}: MenuItemSelectColorProps) => {
   const theme = useTheme();
 
   return (

front/src/modules/ui/menu-item/components/MenuItemToggle.tsx

@@ -4,7 +4,7 @@ import { Toggle } from '@/ui/input/components/Toggle';
 import { MenuItemLeftContent } from '../internals/components/MenuItemLeftContent';
 import { StyledMenuItemBase } from '../internals/components/StyledMenuItemBase';
 
-type OwnProps = {
+type MenuItemToggleProps = {
   LeftIcon?: IconComponent;
   toggled: boolean;
   text: string;
@@ -18,7 +18,7 @@ export const MenuItemToggle = ({
   toggled,
   className,
   onToggleChange,
-}: OwnProps) => {
+}: MenuItemToggleProps) => {
   const handleOnClick = () => {
     onToggleChange?.(!toggled);
   };