Files
lez-programs/apps/amm/qml/chrome/NavBar.qml
T
r4bbit 627fcfa4e2 fix(apps/amm): make the AMM UI load in Basecamp
Stage Logos.Wallet at the plugin root as pure QML (Basecamp rejects the
  prefer :/qt/qml/... resource), move NavBar into qml/chrome/ so it stops
  colliding in Basecamp's shared import path, and add a QML_IMPORT_PATH
  wrapper so standalone still resolves the root module. Adds amm-ui-lgx /
  amm-module-lgx aliases for addressable Basecamp installs.
2026-08-20 15:21:28 +02:00

144 lines
4.6 KiB
QML

pragma ComponentBehavior: Bound
import QtQuick 2.15
import QtQuick.Layouts 1.15
import Logos.Theme
import Logos.Wallet
// Self-contained navigation bar — styling is independent of any view's theme.
// Use currentIndex to read the active tab; tabChanged(index) fires on selection.
Item {
id: root
property int currentIndex: 0
readonly property var tabs: [qsTr("Trade"), qsTr("Liquidity"), qsTr("Pools")]
// Wallet wiring, passed down from Main.qml.
property var backend: null
property var accountModel: null
// Address of the account currently selected in the header control.
readonly property string selectedAddress: accountControl.selectedAddress
signal tabChanged(int index)
implicitHeight: 56
Rectangle {
anchors.fill: parent
color: Theme.palette.background
// Bottom separator
Rectangle {
anchors.left: parent.left
anchors.right: parent.right
anchors.bottom: parent.bottom
height: 1
color: Theme.palette.borderSecondary
}
RowLayout {
anchors.fill: parent
anchors.leftMargin: 20
anchors.rightMargin: 20
spacing: 4
// App identity
Text {
text: qsTr("Logos AMM")
color: Theme.palette.text
font.pixelSize: 17
font.weight: Font.Bold
}
Item { Layout.fillWidth: true }
// Tab pills
Row {
Accessible.role: Accessible.PageTabList
Accessible.name: qsTr("Primary navigation")
spacing: 4
Repeater {
model: root.tabs
delegate: Rectangle {
id: tabButton
required property int index
required property string modelData
readonly property bool active: root.currentIndex === index
height: 36
width: tabLabel.implicitWidth + 28
radius: 18
color: active ? Theme.palette.backgroundSecondary : "transparent"
border.width: activeFocus ? 1 : 0
border.color: Theme.palette.text
activeFocusOnTab: true
Accessible.role: Accessible.PageTab
Accessible.name: tabLabel.text
function activate() {
root.currentIndex = index
root.tabChanged(index)
}
Behavior on color { ColorAnimation { duration: 150 } }
Keys.onReturnPressed: function(event) {
tabButton.activate()
event.accepted = true
}
Keys.onEnterPressed: function(event) {
tabButton.activate()
event.accepted = true
}
Keys.onSpacePressed: function(event) {
tabButton.activate()
event.accepted = true
}
Text {
id: tabLabel
anchors.centerIn: parent
text: tabButton.modelData
color: tabButton.active ? Theme.palette.text : Theme.palette.textSecondary
font.pixelSize: 14
font.weight: tabButton.active ? Font.Medium : Font.Normal
Behavior on color { ColorAnimation { duration: 150 } }
}
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: {
tabButton.forceActiveFocus()
tabButton.activate()
}
}
}
}
}
// Wallet / account control on the far right.
WalletControl {
id: accountControl
Layout.leftMargin: 12
wallet: root.backend
accountModel: root.accountModel
viewportWidth: root.width
watchCall: function(result, success, failure) {
logos.watch(result, success, failure)
}
}
}
}
}