App.tsx

import React from 'react';
import {HashRouter as Router, Route, Switch, NavLink as RNavLink} from "react-router-dom";
import {AllUsers} from "./User/AllUsers";
import {Container, Navbar, NavbarBrand, Nav, NavItem, NavLink} from "reactstrap";

class Index extends React.Component {
    render() {
        return <h2>Home</h2>;
    }
}


class App extends React.Component {

    render() {
        return (
            <Container>
                <Router>
                    <Navbar color={"light"} light={true} expand={"md"}>
                        <NavbarBrand href={"/"}>I'm a brand</NavbarBrand>
                        <Nav className={"mr-auto"} navbar={true}>
                            <NavItem>
                                <NavLink tag={RNavLink} exact to={"/"} activeClassName={"active"}>Index</NavLink>
                            </NavItem>
                            <NavItem>
                                <NavLink tag={RNavLink} to={"/users"} activeClassName={"active"}>Users</NavLink>
                            </NavItem>
                        </Nav>
                    </Navbar>
                    <Switch>
                        <Route path="/" exact component={Index}/>
                        <Route path="/users" component={AllUsers}/>
                    </Switch>
                </Router>
            </Container>
        );
    }
}

export default App;