create RestrictMenuItem and add team assign link

src/components/Navigation/MainMenu.tsx

@@ -1,8 +1,9 @@
 import { FC, useCallback, useState } from "react"
 import { useSelector } from "react-redux"
 import classnames from "classnames"
-import { isUserConnected, routerSelector } from "../../store/auth"
+import { isUserConnected, routerSelector, selectUserRoles } from "../../store/auth"
 import styles from "./styles.module.scss"
+import ROLES from "../../utils/roles.constants"
 
 interface MenuItemProps {
     name: string
@@ -19,6 +20,15 @@ const MenuItem: FC<MenuItemProps> = ({ name, pathname }): JSX.Element => {
     )
 }
 
+interface RestrictMenuItemProps extends MenuItemProps {
+    role: string
+}
+
+const RestrictMenuItem: FC<RestrictMenuItemProps> = ({ name, pathname, role }): JSX.Element => {
+    const roles = useSelector(selectUserRoles)
+    return roles.includes(role) ? <MenuItem name={name} pathname={pathname} /> : <div />
+}
+
 const MainMenu: FC = (): JSX.Element => {
     const connected = useSelector(isUserConnected)
     const [opened, setOpened] = useState(false)
@@ -42,6 +52,11 @@ const MainMenu: FC = (): JSX.Element => {
                 <MenuItem name="Questions" pathname="/" />
                 <MenuItem name="Annonces" pathname="/annonces" />
                 <MenuItem name="Mon profil" pathname="/profil" />
+                <RestrictMenuItem
+                    role={ROLES.ASSIGNER}
+                    name="Gestion équipes"
+                    pathname="/team-assign"
+                />
                 <button type="button" className={styles.close} onClick={onClose}>
                     ×
                 </button>