import React from 'react';
import Modularity from 'modularity-front';
import { Row, Col } from 'react-materialize';


import Button from '@material-ui/core/Button';

import Form from '../Modules/Form.js';
import Repository from '../Services/Repository.js';

import FilterModule from '../Modules/FilterModule';

import './FiltersPackage.css';

let Module = Modularity.Module;
class FiltersPackage extends Modularity.Module {
	constructor(props) {
		super(props);
		this.state = {
            model: []
		}

        let propertiesService = {
            Token: (t) => {
                this.Token.set(t);
                this.forceUpdate();
            }
        }

        this.Table.onUpdate(() => this.updateRepo())
        if(this.Table.value)this.updateRepo()
	}

    updateRepo() {
        this.productsRepo = new Repository(this.Table.value);
        this.Repository.set(this.productsRepo);
        this.productsRepo.model()
        .then((model) => {
            let res = [];
            for(var key in model) {
                model[key].Filter && res.push(model[key].Filter);
            }
            return res;
        })
        .then((model) => this.setState({model}));
    }

    setFilters(f) {
        if(!f)return;
        this.productsRepo.setFilters(f);
        this.Repository.set(this.productsRepo);
    }

	render() {
        return <div>
            Filter
            <FilterModule Inputs={this.state.model} Filters={(f) => this.setFilters(f)}/>
            {super.render()}
        </div>;
	}
}

FiltersPackage.Inputs = {
    Table: {
        type: Modularity.Module.Types.Text
    }
}

FiltersPackage.Outputs = {
    Token: {},
    Repository: {}
}

FiltersPackage.Category = "NikatlasPackages";
FiltersPackage.EditPosition = "top-center";
export default FiltersPackage;