ui/qml/widgets/ProfileRow.qml

import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.3
import CustomQmlTypes 1.0
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4

import "../opaque" as Opaque
import "../opaque/styles"
import "../opaque/theme"

RowLayout {
    id: root
    property alias handle: prow.handle
    property alias displayName: prow.displayName
    property alias image: prow.image
    property alias tag: prow.tag
    property alias badgeColor: prow.badgeColor
    property var rowClicked: {}
    property var editClicked: {}

    Opaque.PortraitRow {
        id: prow
        badgeColor: Theme.portraitProfileBadgeColor
        Layout.fillWidth: true
        portraitBorderColor: Theme.portraitOnlineBorderColor
        portraitColor: Theme.portraitOnlineBackgroundColor
        nameColor: Theme.portraitOnlineTextColor
        onionColor: Theme.portraitOnlineTextColor

        badgeContent: Image {// Profle Type
            id: profiletype
            source: tag == "v1-userPassword" ? gcd.assetPath + "core/lock-24px.webp" : gcd.assetPath + "core/lock_open-24px.webp"
            height: Theme.badgeTextSize * gcd.themeScale
            width: height
        }

        onClicked: rowClicked(handle)
    }

    Opaque.Icon {// Edit BUTTON
        id: btnEdit
        source: gcd.assetPath + "core/edit-24px.webp"
        Layout.minimumWidth: 80
        Layout.fillHeight: true
        backgroundColor: Theme.backgroundMainColor
        hilightBackgroundColor: Theme.backgroundHilightElementColor
        iconColor: Theme.altTextColor

        anchors.verticalCenter: parent.verticalCenter
        // Layout.alignment: Qt.AlignVCenter


        height: root.height / 2
        width: root.height / 2
        size: root.height / 2

        onClicked: editClicked(handle, displayName, tag, image)
    }
}