import React from 'react';
import Modularity from 'modularity-front';

import Repository from './Repository';

let { RendererInput, OutputLink } = Modularity.ModuleUtilities;

class CrudService extends Modularity.Module {
	constructor(props) {
		super(props);

		this.Table.onUpdate(() => this.updateService());
		this.Token.onUpdate(() => this.updateService());
		this.Filters.onUpdate((value) => {
			console.log(value, this.Filters.value);
			this.updateService()
		});
		this.updateService();
	}

	updateService() {
		if(this.Table.value) {
			console.log("F", this.Filters.value)
			let service = new Repository(this.Table.value, this.Token.value,this.Filters.value);
			this.Service.set(service);
		}
	}

	render() {
		return <div>
				{this.__renderID()}
				<div className='col s12'>					
					{this.__factoryInput(this.Token)}
				</div>
				<div className='col s12'>					
					{this.__factoryInput(this.Table)}
				</div>
				<div className='col s12'>					
					{this.__factoryInput(this.Filters)}
				</div>
				<div className='col s12'>					
					<OutputLink output={this.Service} />
				</div>

			</div>;
	}
}


CrudService.Outputs = {
	Service: {}
}

CrudService.Inputs = {
	Table: {
		type: Modularity.Module.Types.Text,
		defaultValue: "products"
	},
	Filters:{
		type: Modularity.Module.Types.Link,
	},
	Token: {
		type: Modularity.Module.Types.Text,
		defaultValue: "123123"
	}
}

CrudService.Category = "Services"
export default CrudService;