Component not showing up in react router with laravel

I am new to React and I am trying to display a react route using react router dom but the matching component is not coming up. I have looked at answers from other OS questions related but no help. Here is my app.js file

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import AdminLogin from './AdminLogin';


export default class AdminApp
 extends Component {
   render() {
     return (
        <Router>
            <Switch>
                <div className="App">
                        <Route path="/" exact={true}  component = {AdminLogin} />
                </div>
            </Switch>
        </Router>
    );
}
}

if (document.getElementById('app')) {
    ReactDOM.render(<AdminApp />, document.getElementById('app'));
}

When i inspect my html file i get this

<div id="app">
    <div class="App" location="[object Object]" computedmatch="[object Object]"></div>
</div>

this is my adminLogin component

import React, {Component} from 'react';
import {adminLogin} from './UserFunctions';

export default class AdminLogin extends Component {
    constructor(){
    super()
    this.state = {
        email: '',
        password: '',
        errors: {}
    }
    this.onChange = this.onChange.bind(this);
    this.onSubmit = this.onSubmit.bind(this);
}

onChange(e){
    this.setState({ [e.target.name]: e.target.value })
}

onSubmit(e){
    e.preventDefault;
    const user = {
        email : this.state.email,
        password : this.state.password
    }

    adminLogin(user).then(res => {
        if(res) {
            this.props.history.push('/dashboard');
        }
    })
}


render(){
    return (
        <div className="kt-grid kt-grid--ver kt-grid--root">
            <div className="kt-grid kt-grid--hor kt-grid--root  kt-login>
                  <h1>Login Now</h1>
            </div>
        </div>
    )
}

}