import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Layouts 1.13
import "../../../imports"
import "../../../shared"
import "."

SplitView {
    property var appSettings

    id: walletView
    Layout.fillHeight: true
    Layout.fillWidth: true

    handle: SplitViewHandle {}

    Component.onCompleted: this.restoreState(appSettings.walletSplitView)
    Component.onDestruction: appSettings.walletSplitView = this.saveState()

    LeftTab {
        id: leftTab
        SplitView.preferredWidth: Theme.leftTabPrefferedSize
        SplitView.minimumWidth: Theme.leftTabMinimumWidth
        SplitView.maximumWidth: Theme.leftTabMaximumWidth
    }

    Item {
        id: walletContainer
        anchors.top: parent.top
        anchors.topMargin: 0
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 0
        anchors.right: parent.right
        anchors.rightMargin: 0
        anchors.left: leftTab.right
        anchors.leftMargin: 0

        WalletHeader {
            id: walletHeader
            changeSelectedAccount: leftTab.changeSelectedAccount
        }

        RowLayout {
            id: walletInfoContainer
            anchors.bottom: parent.bottom
            anchors.bottomMargin: 0
            anchors.left: parent.left
            anchors.leftMargin: 0
            anchors.right: parent.right
            anchors.rightMargin: 0
            anchors.top: walletHeader.bottom
            anchors.topMargin: 23

            Item {
                id: walletInfoContent
                Layout.fillHeight: true
                Layout.fillWidth: true

                TabBar {
                    id: walletTabBar
                    anchors.right: parent.right
                    anchors.rightMargin: Theme.bigPadding
                    anchors.left: parent.left
                    anchors.leftMargin: Theme.bigPadding
                    anchors.top: parent.top
                    anchors.topMargin: Theme.padding
                    height: assetBtn.height

                    StatusTabButton {
                        id: assetBtn
                        btnText: "Assets"
                    }
                    StatusTabButton {
                        id: collectiblesBtn
                        anchors.left: assetBtn.right
                        anchors.leftMargin: 32
                        btnText: "Collectibles"
                        onClicked: {
                          walletModel.loadCollectiblesForAccount(walletModel.currentAccount.address)
                        }
                    }
                    StatusTabButton {
                        id: historyBtn
                        anchors.left: collectiblesBtn.right
                        anchors.leftMargin: 32
                        btnText: "History"
                        onClicked: {
                          walletModel.loadTransactionsForAccount(walletModel.currentAccount.address)
                        }
                    }
                }

                StackLayout {
                    id: stackLayout
                    anchors.rightMargin: Theme.bigPadding
                    anchors.leftMargin: Theme.bigPadding
                    anchors.top: walletTabBar.bottom
                    anchors.right: parent.right
                    anchors.bottom: parent.bottom
                    anchors.left: parent.left
                    anchors.topMargin: Theme.bigPadding
                    currentIndex: walletTabBar.currentIndex

                    AssetsTab {
                        id: assetsTab
                    }
                    CollectiblesTab {
                        id: collectiblesTab
                    }
                    HistoryTab {
                        id: historyTab
                    }
                }
            }
        }
    }
}
/*##^##
Designer {
    D{i:0;autoSize:true;formeditorColor:"#ffffff";height:770;width:1152}
}
##^##*/