Navbar.js

// import { click } from '@testing-library/user-event/dist/click'
import React, { Component } from 'react'
import { Link } from 'react-router-dom'

export class Navbar extends Component {
    render() {
        const click =()=>{
            document.title = `Home - NewsRider`;
          }
        return (
            <>
                <nav className="navbar fixed-top navbar-dark bg-dark navbar-expand-lg " >
                    <div className="container-fluid">
                        <Link className="navbar-brand" to="/">News Rider</Link>
                        <button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="toggle navigation">
                            <span className="navbar-toggler-icon"></span>
                        </button>
                        <div className="collapse navbar-collapse" id="navbarSupportedContent">
                            <ul className="navbar-nav me-auto mb-2 mb-lg-0">
                                <li className="nav-item">
                                    <Link className="nav-link " aria-current="page" to="/" onClick={click}>Home</Link>
                                </li>

                                {/* <li className="nav-item">
                                    <a className="nav-link" href="/about">About</a>
                                </li> */}
                                <li className="nav-item">  <Link className="nav-link" to="/Business">Business</Link> </li>
                                <li className="nav-item">  <Link className="nav-link" to="/Entertainment">Entertainment</Link></li>
                                <li className="nav-item">  <Link className="nav-link" to="/General">General </Link></li>
                                <li className="nav-item">  <Link className="nav-link" to="/Health">Health </Link></li>
                                <li className="nav-item">  <Link className="nav-link" to="/Science">Science</Link></li>
                                <li className="nav-item">  <Link className="nav-link" to="/Sports">Sports</Link></li>
                                <li className="nav-item">  <Link className="nav-link" to="/Technology">Technology</Link></li>


                            </ul>

                        </div>
                    </div>
                </nav>
            </>
        )
    }
}

export default Navbar