import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import QtGraphicalEffects 1.0
import QtQml 2.15

import StatusQ.Controls 0.1
import StatusQ.Components 0.1
import StatusQ.Popups 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1

import AppLayouts.Wallet.controls 1.0

import utils 1.0
import shared.controls 1.0

StatusDraggableListItem {
    id: root

    property alias actionComponent: additionalActionsLoader.sourceComponent
    property int showcaseVisibility: Constants.ShowcaseVisibility.NoOne
    property bool blurState: false
    property bool contextMenuEnabled: true
    property string tooltipTextWhenContextMenuDisabled

    signal showcaseVisibilityRequested(int value)

    component ShowcaseVisibilityAction: StatusMenuItem {
        property int showcaseVisibility: Constants.ShowcaseVisibility.NoOne
        icon.name: ProfileUtils.visibilityIcon(showcaseVisibility)
        icon.color: Theme.palette.primaryColor1
    }

    layer.enabled: root.blurState
    layer.effect: fastBlur

    height: ProfileUtils.defaultDelegateHeight
    topInset: 0
    bottomInset: 0
    changeColorOnDragActive: false
    bgColor: Theme.palette.getColor(Theme.palette.statusAppLayout.rightPanelBackgroundColor, 0.7)

    icon.width: 40
    icon.height: 40

    draggable: true
    dragAxis: Drag.XAndYAxis

    actions: [
        Loader {
            id: additionalActionsLoader

            Layout.maximumWidth: root.width *.4
        },
        DisabledTooltipButton {
            interactive: root.contextMenuEnabled
            tooltipText: root.tooltipTextWhenContextMenuDisabled
            buttonComponent: StatusRoundButton {
                enabled: root.contextMenuEnabled
                icon.name: ProfileUtils.visibilityIcon(root.showcaseVisibility)
                width: 58
                height: 30
                border.width: 1
                border.color: Theme.palette.directColor7
                radius: 14
                highlighted: menuLoader.item && menuLoader.item.opened
                onClicked: {
                    menuLoader.active = true
                    menuLoader.item.popup(width - menuLoader.item.width, height)
                }

                ButtonGroup {
                    id: showcaseVisibilityGroup
                    exclusive: true
                    onClicked: function(button) {
                        const newVisibility = (button as ShowcaseVisibilityAction).showcaseVisibility
                        if (newVisibility !== root.showcaseVisibility)
                            root.showcaseVisibilityRequested(newVisibility)
                    }
                }

                Loader {
                    id: menuLoader
                    active: false
                    sourceComponent: StatusMenu {
                        onClosed: menuLoader.active = false
                        StatusMenuHeadline { text: qsTr("Show to") }

                        ShowcaseVisibilityAction {
                            ButtonGroup.group: showcaseVisibilityGroup
                            showcaseVisibility: Constants.ShowcaseVisibility.Everyone
                            text: qsTr("Everyone")
                            checked: root.showcaseVisibility === showcaseVisibility
                        }
                        ShowcaseVisibilityAction {
                            ButtonGroup.group: showcaseVisibilityGroup
                            showcaseVisibility: Constants.ShowcaseVisibility.Contacts
                            text: qsTr("Contacts")
                            checked: root.showcaseVisibility === showcaseVisibility
                        }
                        ShowcaseVisibilityAction {
                            ButtonGroup.group: showcaseVisibilityGroup
                            showcaseVisibility: Constants.ShowcaseVisibility.IdVerifiedContacts
                            text: qsTr("ID verified contacts")
                            checked: root.showcaseVisibility === showcaseVisibility
                        }

                        StatusMenuSeparator {}

                        ShowcaseVisibilityAction {
                            ButtonGroup.group: showcaseVisibilityGroup
                            showcaseVisibility: Constants.ShowcaseVisibility.NoOne
                            text: qsTr("No one")
                            checked: root.showcaseVisibility === showcaseVisibility
                        }
                    }
                }
            }
        }
    ]

    Component {
        id: fastBlur

        FastBlur {
            radius: 32
            transparentBorder: true
        }
    }
}