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

import VerticalNavbar from '../Modules/VerticalNavbar.js';

import LoadedModules from '../Services/LoadedModulesService.js';

let Module = Modularity.Module;
class VerticalNavbarPackage extends Modularity.Module {
	constructor(props) {
		super(props);
		this.state = {
            modules: this.NavItems.value,
            APIModules: []
		}

        let propertiesService = {
            APIURL: 'CrudModules',
            Modules: (modules) => this.setState({ APIModules: modules ||[] })
        }

        this.NavItems.onUpdate((modules) => this.setState({modules}));

        this.back_service = new LoadedModules(propertiesService);
	}
	render() {
        let allmods = [...this.state.modules, ...this.state.APIModules ];
        return  [<VerticalNavbar key={Math.random()} NavItems={allmods}/>,
            super.render()];
	}
}

VerticalNavbarPackage.Inputs = {
    Expanded: {
        type: Module.Types.Boolean, 
        defaultValue: true
    },
    NavItems: {
        type:Module.Types.Array,
        defaultValue: [
            {
                link:"home",
                text:"Home",
                icon:"fa-home",
            }
        ],
        arrType:Module.Types.Object
    }
}

VerticalNavbarPackage.Outputs = {
}

VerticalNavbarPackage.Category = "NikatlasPackages";
VerticalNavbarPackage.EditPosition = "center";
export default VerticalNavbarPackage;