import QtQuick
import QtQuick.Controls
import QtQuick.Layouts

// The model's reasoning stream, collapsed by default: it is context, not the
// answer.
Rectangle {
    id: block
    property string text: ""
    property bool complete: false
    property bool expanded: false

    radius: Theme.radius
    color: Theme.surfaceAlt
    border.width: 1
    border.color: Theme.border
    implicitHeight: layout.implicitHeight + Theme.pad
    opacity: 0.9

    ColumnLayout {
        id: layout
        anchors {
            left: parent.left
            right: parent.right
            top: parent.top
            leftMargin: Theme.pad
            rightMargin: Theme.pad
            topMargin: Theme.pad / 2
        }
        spacing: 2

        RowLayout {
            spacing: Theme.gap
            /* A handler, not a MouseArea: a layout decides the geometry of its
             * children, and anchoring one of them is undefined behavior. */
            TapHandler {
                cursorShape: Qt.PointingHandCursor
                onTapped: block.expanded = !block.expanded
            }
            ThemeIcon {
                name: block.expanded ? "arrow-down" : "arrow-right"
                glyph: block.expanded ? "▾" : "▸"
                size: Theme.smallSize + 2
                color: Theme.textDim
            }
            Text {
                text: block.complete ? "thinking" : "thinking…"
                color: Theme.textDim
                font.pixelSize: Theme.smallSize
                font.bold: true
            }
            Text {
                Layout.fillWidth: true
                elide: Text.ElideRight
                visible: !block.expanded
                text: block.text.replace(/\s+/g, " ").trim()
                color: Theme.textFaint
                font.pixelSize: Theme.smallSize
            }
        }
        Text {
            Layout.fillWidth: true
            Layout.topMargin: 4
            visible: block.expanded
            text: block.text
            color: Theme.textDim
            font.pixelSize: Theme.smallSize
            font.italic: true
            wrapMode: Text.Wrap
            textFormat: Text.PlainText
        }
    }
}