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

import MainContent from 'components/Dashboard/Layout/components/MainContent';
import FuelList from './List/index.js'
import CreateFuel from './Create/index.js'
import EditFuel from './Edit/index.js'
import { PAGE404 } from "components/PageError/index"
// import EditStation from './Location/Edit';
 
class Fuels extends Component {
  state = {
    pageRoutes: [ 
      {
        path: `${this.props.match.url}`,
        name: "Fuel Lists",
        component: FuelList,
      },
      {
        path: `${this.props.match.url}/create`,
        name: "Create Fuel",
        component: CreateFuel,
      },
      {
        path: `${this.props.match.url}/view`,
        params: ':id',
        name: "Edit Fuels",
        component: EditFuel,
      }, 
    ],  
  }

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

export default Fuels;