import { withWidth } from "@material-ui/core" ; import { Theme } from "@material-ui/core/styles" ; import { WithWidth } from "@material-ui/core/withWidth" ; import { makeStyles } from "@material-ui/styles" ; import * as React from "react" ; import { connect } from "react-redux" ; import { Route , Router } from "react-router-dom" ; import { RootState } from "./redux/rootReducer" ; import withRoot from "./withRoot" ; import PrivateRoute from 'hoc/privateRoute' ; import Login from "pages/Login/Login" ; import ListingPage from 'pages/Listing/ListingPage' ; function Routes ( ) { const classes = useStyles ( ) ; return ( < div className = { classes . content } > < Route exact = { true } path = "/" component = { Login } / > < PrivateRoute path = '/listing' component = { ListingPage } / > { } < /div>); } interface Props extends WithWidth { } function App ( props ? ) { const classes = useStyles ( ) ; if ( ! props ) { return null ; } return ( < Router > < div className = { classes . root } > < div className = { classes . appFrame } > < Routes /> < /div> < /div> < /Router>); } const drawerWidth = 240 ; const useStyles = makeStyles ( ( theme ) => ( { root : { width : "100%" , height : "100%" , zIndex : 1 , overflow : "hidden" , } , appFrame : { position : "relative" , display : "flex" , width : "100%" , height : "100%" , } , appBar : { zIndex : theme . zIndex . drawer + 1 , position : "absolute" , } , navIconHide : { [ theme . breakpoints . up ( "md" ) ] : { display : "none" , } , } , drawerHeader : theme . mixins . toolbar , drawerPaper : { width : 250 , backgroundColor : theme . palette . background . default , [ theme . breakpoints . up ( "md" ) ] : { width : drawerWidth , position : "relative" , height : "100%" , } , } , content : { backgroundColor : theme . palette . background . default , width : "100%" , height : "calc(100% - 56px)" , marginTop : 56 , [ theme . breakpoints . up ( "sm" ) ] : { height : "calc(100% - 64px)" , marginTop : 64 , } , } , } ) ) ; function mapStateToProps ( state ) { return { } ; } export default connect ( mapStateToProps ) ( withRoot ( withWidth ( ) ( App ) ) ) ;