import {Exir, jsx} from "../../vm_deprecated";
import Router from "../../vm_deprecated/router";
import {updateView} from "../../vm_deprecated/patch";
import {info} from "../../core";
import {renderDom} from "../../vm_deprecated/render-dom";

export default Exir.createView('Router', {
    props: {
        rootPath: "/",
        init: Function(),
    },
    state: {
        router: undefined,
        selectedDef: <div></div>,
        selected: undefined,
        rt: 0
    },
    render() {
        // return <div>{[this.state.selected || this.state.selectedDef]}</div>
        let rnd = this.state.selected || this.state.selectedDef
        // console.log('rnd', rnd)
        // rnd.$isDirty = true
        return <div>{rnd}</div>
        // return <>{}</>
    },
    onMount() {
        this.state.router = new Router("/", this.onRoute.bind(this))
        this.$children.forEach((child, i) => {
            this.state.router.add(child.props.path, i)
        })
        // this.state.selected = this.state.router.routes[0]
        this.props.init(this.state.router)
    },
    onUpdate() {
        info('ROUTER UPDATED', this.$node)
    },
    onRoute(curRoute) {
        console.log(curRoute)
        // console.log(this.$children[curRoute[1]])
        this.state.selected = this.$children[curRoute[1]].$node
        // this.$node = this.state.selected
        // this.$node.$isDirty = true
        this.$isDirty = true
        // // if (!this.state.selected.$node) {
        // //     console.log('no $node')
        // // }
        this.$update()
    },
    shouldUpdate() {
        return true;
    }
})