// LIBRARIES
import React, { Component } from 'react';
import { Switch, Route, Redirect } from 'react-router-dom';
 
// COMPONENTS

import MainContent from 'components/Dashboard/Layout/components/MainContent';
import BranchList from './List'
import CreateBranch from './Create'
import EditBranch from './Edit'
import { PAGE404 } from "components/PageError/index"
// import EditStation from './Location/Edit';
 
class StationLocator extends Component {
  state = {
    pageRoutes: [ 
      {
        path: `${this.props.match.url}`,
        name: "Branch List",
        component: BranchList,
      },
      {
        path: `${this.props.match.url}/create`,
        name: "Create Branch",
        component: CreateBranch,
      },
      {
        path: `${this.props.match.url}/view`,
        params: ':id',
        name: "Edit Branch",
        component: EditBranch,
      }, 
    ],  
  }

  render() {  
    const { pageRoutes } = this.state        
    console.log('here')
    return (
      <div style={{position: 'relative'}}>
        <MainContent pageRoutes={pageRoutes}>
          <Switch>
            <Route exact path = "/branches" component = { BranchList } />
            <Route exact path = "/branches/create" component = { CreateBranch } />
            <Route exact path = "/branches/view/:id" component = { EditBranch } />
            <PAGE404 />
          </Switch>
        </MainContent>
      </div>
    );
  }
}

export default StationLocator;