import { DEFAULT_NFT_TYPES } from "../config/chain_config";
import JCWallet from "../JCWallet";
import ButtonGroup, { BTN_SELECT_INDEX_CHANGE } from "./ButtonGroup";
import TextBtn from "./TextBtn";
import WalletBase from "./WallerBase";

const {ccclass, property} = cc._decorator;

@ccclass
export default class TokenTab extends WalletBase {

    
    @property({
        type: ButtonGroup
    })
    btnGroup: ButtonGroup = null

    @property({
        type: cc.Prefab
    })
    btnPreb: cc.Prefab = null
    // LIFE-CYCLE CALLBACKS:

    // onLoad () {}
    private titles = ['tokens']

    start () {
        super.start()
        this.btnGroup.resetBtns()
        this.btnGroup.node.on(BTN_SELECT_INDEX_CHANGE, 
            this.onTokenTypeChange.bind(this))
        this.showAllBtn();
    }

    onDestroy() {
        this.btnGroup.node.off(BTN_SELECT_INDEX_CHANGE)
    }

    // update (dt) {}
    showAllBtn() {
        this.titles.length = 1
        const chain = this.wallet.currentChain.id
        let nftData: any = DEFAULT_NFT_TYPES[chain]
        if (nftData) {
            for (let key in nftData) {
                this.titles.push(key)
            }
        }
        console.log('show all token tab: ', this.titles)
        for (let i = 0, l = this.titles.length; i < l; i++) {
            const btn = cc.instantiate(this.btnPreb)
            const btnM: TextBtn = btn.getComponent(TextBtn)
            this.btnGroup.addBtn(btnM);
            btnM.title = this.titles[i]
            btnM.index = i
            btnM.selected = i === 0
        }
    }

    onTokenTypeChange(data: {index: number}) {
        console.log('on token change: ', JSON.stringify(data))
        let type = this.titles[data.index]
        this.wallet.updateListType(type)
    }
}