import QtQuick
import QtQuick.Layouts
import qs.Common
import qs.Widgets

// Sneedchat (SockChat) login is ordinary XenForo username+password, plus an
// optional TOTP secret for accounts with 2FA - see backend/sockchat/auth.rs.
// Unlike Discord's QR flow there's nothing to scan, but like Discord, the
// actual login (Tor bootstrap + auth + a possible proof-of-work solve) can
// take anywhere from instant to over a minute, so this only ever renders a
// status string fed by sockChatLoginStatus/sockChatLoginResult events - see
// ChatView.qml's handling of those, mirrored from its Discord equivalent.
ColumnLayout {
    id: root

    signal connectRequested(string username, string password, string totpSecret)

    property string statusText: ""
    property bool pending: false

    onStatusTextChanged: root.pending = false

    spacing: Theme.spacingXS

    RowLayout {
        Layout.fillWidth: true
        spacing: Theme.spacingXS

        DankTextField {
            id: usernameField
            Layout.fillWidth: true
            placeholderText: "username"
        }

        DankTextField {
            id: passwordField
            Layout.preferredWidth: 160
            placeholderText: "password"
            echoMode: TextInput.Password
        }
    }

    DankTextField {
        id: totpField
        Layout.fillWidth: true
        placeholderText: "TOTP secret (only if 2FA is enabled)"
    }

    DankButton {
        text: root.pending ? "Connecting..." : "Connect"
        enabled: !root.pending
        onClicked: {
            if (!usernameField.text || !passwordField.text) {
                root.statusText = "Username and password are required.";
                return;
            }
            root.pending = true;
            root.statusText = "";
            root.connectRequested(usernameField.text, passwordField.text, totpField.text);
            passwordField.text = "";
            totpField.text = "";
        }
    }

    StyledText {
        Layout.fillWidth: true
        visible: root.statusText !== ""
        text: root.statusText
        wrapMode: Text.WordWrap
        color: Theme.surfaceVariantText
    }
}