import React from 'react'
import { Container } from 'reactstrap';
import Stepper from '../components/Stepper'
import Header from '../components/Header'
export default class MainPage extends React.Component {

    constructor(props) {
        super(props);

        this.state = {
            filters: {}
        }

        this.updateFilterState = this.updateFilterState.bind(this);
        this.resetFilterState = this.resetFilterState.bind(this);
    }

   
    updateFilterState(newFilter) {
        this.setState({ filters: Object.assign(this.state.filters, newFilter) })
    }

    resetFilterState() {
        this.setState({ filters: {} })
    }

    render() {
        return (
            <Container fluid className='main-container p-0'>
                <Header/>
                <Stepper 
                    filters={this.state.filters} 
                    updateFilterState={this.updateFilterState} 
                    resetFilterState={this.resetFilterState} />
            </Container>
        )
    }

}