github.com/quickfeed/quickfeed@v0.0.0-20240507093252-ed8ca812a09c/public/src/components/navbar/NavBarLink.tsx (about)

     1  import React from "react"
     2  import { Link, useHistory } from "react-router-dom"
     3  
     4  export interface NavLink {
     5      link: { text: string, to: string }
     6      icons?: ({ text: string | number, classname: string } | null)[],
     7      jsx?: JSX.Element
     8  }
     9  
    10  const NavBarLink = (props: NavLink): JSX.Element => {
    11      const history = useHistory()
    12  
    13      const icons: JSX.Element[] = []
    14      if (props.icons) {
    15          props.icons.forEach((icon, index) => {
    16              if (icon) {
    17                  icons.push(
    18                      <div key={index} id="icon" className={icon.classname + " ml-2"}>
    19                          {icon.text}
    20                      </div>
    21                  )
    22              }
    23          })
    24      }
    25      return (
    26          <li onClick={() => history.push(props.link.to)}>
    27              <div className="col" id="title">
    28                  <Link to={props.link.to}>{props.link.text}</Link>
    29              </div>
    30              <div className="col">
    31                  {icons ? icons : null}
    32                  {props.jsx ? props.jsx : null}
    33              </div>
    34          </li>
    35      )
    36  }
    37  
    38  export default NavBarLink