internal: use existing button controls

Instead of SimpleButton
This commit is contained in:
2 * r + 2 * t 2025-11-15 17:15:02 +11:00
parent 19fb58d249
commit 6a92f985d8
9 changed files with 122 additions and 242 deletions

View file

@ -2,6 +2,7 @@ import ".."
import qs.services
import qs.config
import QtQuick
import QtQuick.Layouts
StyledRect {
id: root
@ -53,7 +54,7 @@ StyledRect {
}
}
Row {
RowLayout {
id: row
anchors.centerIn: parent
@ -62,7 +63,8 @@ StyledRect {
MaterialIcon {
id: iconLabel
anchors.verticalCenter: parent.verticalCenter
Layout.alignment: Qt.AlignVCenter
Layout.topMargin: Math.round(fontInfo.pointSize * 0.0575)
color: root.internalChecked ? root.activeOnColour : root.inactiveOnColour
fill: root.internalChecked ? 1 : 0
@ -74,7 +76,8 @@ StyledRect {
StyledText {
id: label
anchors.verticalCenter: parent.verticalCenter
Layout.alignment: Qt.AlignVCenter
Layout.topMargin: -Math.round(iconLabel.fontInfo.pointSize * 0.0575)
color: root.internalChecked ? root.activeOnColour : root.inactiveOnColour
}
}

View file

@ -105,17 +105,16 @@ Item {
}
}
SimpleButton {
IconTextButton {
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.normal
color: Colours.palette.m3primaryContainer
onColor: Colours.palette.m3onPrimaryContainer
inactiveColour: Colours.palette.m3primaryContainer
inactiveOnColour: Colours.palette.m3onPrimaryContainer
verticalPadding: Appearance.padding.small
text: qsTr("Open settings")
icon: "settings"
onClicked: {
root.wrapper.detach("audio");
}
onClicked: root.wrapper.detach("audio")
}
}
}

View file

@ -165,17 +165,16 @@ ColumnLayout {
}
}
SimpleButton {
IconTextButton {
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.normal
color: Colours.palette.m3primaryContainer
onColor: Colours.palette.m3onPrimaryContainer
inactiveColour: Colours.palette.m3primaryContainer
inactiveOnColour: Colours.palette.m3onPrimaryContainer
verticalPadding: Appearance.padding.small
text: qsTr("Open settings")
icon: "settings"
onClicked: {
root.wrapper.detach("bluetooth");
}
onClicked: root.wrapper.detach("bluetooth")
}
component Toggle: RowLayout {

View file

@ -111,10 +111,8 @@ ColumnLayout {
}
StyledRect {
id: connectBtn
implicitWidth: implicitHeight
implicitHeight: connectIcon.implicitHeight + Appearance.padding.small
implicitHeight: wirelessConnectIcon.implicitHeight + Appearance.padding.small
radius: Appearance.rounding.full
color: Qt.alpha(Colours.palette.m3primary, networkItem.modelData.active ? 1 : 0)
@ -136,7 +134,7 @@ ColumnLayout {
// Check if network is secure
if (networkItem.modelData.isSecure) {
// Try to connect first - will show password dialog if password is needed
Nmcli.connectToNetwork(networkItem.modelData.ssid, "", networkItem.modelData.bssid, (result) => {
Nmcli.connectToNetwork(networkItem.modelData.ssid, "", networkItem.modelData.bssid, result => {
if (result && result.needsPassword) {
// Password is required - show password dialog
root.passwordNetwork = networkItem.modelData;
@ -159,7 +157,7 @@ ColumnLayout {
}
MaterialIcon {
id: connectIcon
id: wirelessConnectIcon
anchors.centerIn: parent
animate: true
@ -205,12 +203,14 @@ ColumnLayout {
MaterialIcon {
id: scanIcon
Layout.topMargin: Math.round(fontInfo.pointSize * 0.0575)
animate: true
text: "wifi_find"
color: Colours.palette.m3onPrimaryContainer
}
StyledText {
Layout.topMargin: -Math.round(scanIcon.fontInfo.pointSize * 0.0575)
text: qsTr("Rescan networks")
color: Colours.palette.m3onPrimaryContainer
}
@ -303,8 +303,6 @@ ColumnLayout {
}
StyledRect {
id: connectBtn
implicitWidth: implicitHeight
implicitHeight: connectIcon.implicitHeight + Appearance.padding.small
@ -354,8 +352,7 @@ ColumnLayout {
if (Nmcli.active && root.connectingToSsid === Nmcli.active.ssid) {
root.connectingToSsid = "";
// Close password dialog if we successfully connected
if (root.showPasswordDialog && root.passwordNetwork &&
Nmcli.active.ssid === root.passwordNetwork.ssid) {
if (root.showPasswordDialog && root.passwordNetwork && Nmcli.active.ssid === root.passwordNetwork.ssid) {
root.showPasswordDialog = false;
root.passwordNetwork = null;
if (root.wrapper.currentName === "wirelesspassword") {

View file

@ -41,14 +41,14 @@ ColumnLayout {
}
spacing: Appearance.spacing.normal
implicitWidth: 400
implicitHeight: content.implicitHeight + Appearance.padding.large * 2
visible: shouldBeVisible || isClosing
enabled: shouldBeVisible && !isClosing
focus: enabled
Component.onCompleted: {
if (shouldBeVisible) {
Qt.callLater(() => {
@ -57,7 +57,7 @@ ColumnLayout {
}, 150);
}
}
onShouldBeVisibleChanged: {
if (shouldBeVisible) {
Qt.callLater(() => {
@ -67,9 +67,7 @@ ColumnLayout {
}
}
Keys.onEscapePressed: {
closeDialog();
}
Keys.onEscapePressed: closeDialog()
StyledRect {
Layout.fillWidth: true
@ -109,7 +107,7 @@ ColumnLayout {
}
}
Keys.onEscapePressed: closeDialog();
Keys.onEscapePressed: root.closeDialog()
ColumnLayout {
id: content
@ -149,7 +147,7 @@ ColumnLayout {
color: Colours.palette.m3outline
font.pointSize: Appearance.font.size.small
}
Timer {
interval: 50
running: root.shouldBeVisible && (!root.network || !root.network.ssid)
@ -217,12 +215,12 @@ ColumnLayout {
if (!activeFocus) {
forceActiveFocus();
}
// Clear error when user starts typing
if (connectButton.hasError && event.text && event.text.length > 0) {
connectButton.hasError = false;
}
if (event.key === Qt.Key_Enter || event.key === Qt.Key_Return) {
if (connectButton.enabled) {
connectButton.clicked();
@ -253,7 +251,7 @@ ColumnLayout {
}
}
}
Component.onCompleted: {
if (root.shouldBeVisible) {
Qt.callLater(() => {
@ -265,9 +263,7 @@ ColumnLayout {
StyledRect {
anchors.fill: parent
radius: Appearance.rounding.normal
color: passwordContainer.activeFocus
? Qt.lighter(Colours.tPalette.m3surfaceContainer, 1.05)
: Colours.tPalette.m3surfaceContainer
color: passwordContainer.activeFocus ? Qt.lighter(Colours.tPalette.m3surfaceContainer, 1.05) : Colours.tPalette.m3surfaceContainer
border.width: passwordContainer.activeFocus || connectButton.hasError ? 4 : (root.shouldBeVisible ? 1 : 0)
border.color: {
if (connectButton.hasError) {
@ -401,31 +397,31 @@ ColumnLayout {
Layout.fillWidth: true
spacing: Appearance.spacing.normal
SimpleButton {
TextButton {
id: cancelButton
Layout.fillWidth: true
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
color: Colours.palette.m3secondaryContainer
onColor: Colours.palette.m3onSecondaryContainer
inactiveColour: Colours.palette.m3secondaryContainer
inactiveOnColour: Colours.palette.m3onSecondaryContainer
text: qsTr("Cancel")
onClicked: closeDialog();
onClicked: root.closeDialog()
}
SimpleButton {
TextButton {
id: connectButton
Layout.fillWidth: true
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
color: Colours.palette.m3primary
onColor: Colours.palette.m3onPrimary
text: qsTr("Connect")
enabled: passwordContainer.passwordBuffer.length > 0 && !connecting
property bool connecting: false
property bool hasError: false
Layout.fillWidth: true
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
inactiveColour: Colours.palette.m3primary
inactiveOnColour: Colours.palette.m3onPrimary
text: qsTr("Connect")
enabled: passwordContainer.passwordBuffer.length > 0 && !connecting
onClicked: {
if (!root.network || connecting) {
return;
@ -445,40 +441,35 @@ ColumnLayout {
text = qsTr("Connecting...");
// Connect to network
Nmcli.connectToNetwork(
root.network.ssid,
password,
root.network.bssid || "",
(result) => {
if (result && result.success) {
// Connection successful, monitor will handle the rest
} else if (result && result.needsPassword) {
// Shouldn't happen since we provided password
connectionMonitor.stop();
connecting = false;
hasError = true;
enabled = true;
text = qsTr("Connect");
passwordContainer.passwordBuffer = "";
// Delete the failed connection
if (root.network && root.network.ssid) {
Nmcli.forgetNetwork(root.network.ssid, () => {});
}
} else {
// Connection failed immediately - show error
connectionMonitor.stop();
connecting = false;
hasError = true;
enabled = true;
text = qsTr("Connect");
passwordContainer.passwordBuffer = "";
// Delete the failed connection
if (root.network && root.network.ssid) {
Nmcli.forgetNetwork(root.network.ssid, () => {});
}
Nmcli.connectToNetwork(root.network.ssid, password, root.network.bssid || "", result => {
if (result && result.success)
// Connection successful, monitor will handle the rest
{} else if (result && result.needsPassword) {
// Shouldn't happen since we provided password
connectionMonitor.stop();
connecting = false;
hasError = true;
enabled = true;
text = qsTr("Connect");
passwordContainer.passwordBuffer = "";
// Delete the failed connection
if (root.network && root.network.ssid) {
Nmcli.forgetNetwork(root.network.ssid);
}
} else {
// Connection failed immediately - show error
connectionMonitor.stop();
connecting = false;
hasError = true;
enabled = true;
text = qsTr("Connect");
passwordContainer.passwordBuffer = "";
// Delete the failed connection
if (root.network && root.network.ssid) {
Nmcli.forgetNetwork(root.network.ssid);
}
}
);
});
// Start monitoring connection
connectionMonitor.start();
@ -494,8 +485,7 @@ ColumnLayout {
}
// Check if we're connected to the target network (case-insensitive SSID comparison)
const isConnected = root.network && Nmcli.active && Nmcli.active.ssid &&
Nmcli.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim();
const isConnected = root.network && Nmcli.active && Nmcli.active.ssid && Nmcli.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim();
if (isConnected) {
// Successfully connected - give it a moment for network list to update
@ -530,7 +520,7 @@ ColumnLayout {
passwordContainer.passwordBuffer = "";
// Delete the failed connection
if (root.network && root.network.ssid) {
Nmcli.forgetNetwork(root.network.ssid, () => {});
Nmcli.forgetNetwork(root.network.ssid);
}
}
}
@ -545,7 +535,7 @@ ColumnLayout {
onTriggered: {
repeatCount++;
checkConnectionStatus();
root.checkConnectionStatus();
}
onRunningChanged: {
@ -559,7 +549,7 @@ ColumnLayout {
target: Nmcli
function onActiveChanged() {
if (root.shouldBeVisible) {
checkConnectionStatus();
root.checkConnectionStatus();
}
}
function onConnectionFailed(ssid: string) {
@ -571,7 +561,7 @@ ColumnLayout {
connectButton.text = qsTr("Connect");
passwordContainer.passwordBuffer = "";
// Delete the failed connection
Nmcli.forgetNetwork(ssid, () => {});
Nmcli.forgetNetwork(ssid);
}
}
}
@ -580,64 +570,17 @@ ColumnLayout {
if (isClosing) {
return;
}
isClosing = true;
passwordContainer.passwordBuffer = "";
connectButton.connecting = false;
connectButton.hasError = false;
connectButton.text = qsTr("Connect");
connectionMonitor.stop();
// Return to network popout
if (root.wrapper.currentName === "wirelesspassword") {
root.wrapper.currentName = "network";
}
}
component SimpleButton: StyledRect {
id: button
property color onColor: Colours.palette.m3onSurface
property alias disabled: stateLayer.disabled
property alias text: label.text
property alias enabled: stateLayer.enabled
property string icon: ""
implicitWidth: rowLayout.implicitWidth + Appearance.padding.normal * 2
implicitHeight: rowLayout.implicitHeight + Appearance.padding.small
radius: Appearance.rounding.small
StateLayer {
id: stateLayer
color: parent.onColor
function onClicked(): void {
if (parent.enabled !== false) {
parent.clicked();
}
}
}
RowLayout {
id: rowLayout
anchors.centerIn: parent
spacing: Appearance.spacing.small
MaterialIcon {
id: iconItem
visible: button.icon.length > 0
text: button.icon
color: button.onColor
font.pointSize: Appearance.font.size.large
}
StyledText {
id: label
Layout.leftMargin: button.icon.length > 0 ? Appearance.padding.smaller : 0
color: parent.parent.onColor
}
}
signal clicked
}
}

View file

@ -1,50 +0,0 @@
import qs.components
import qs.components.controls
import qs.components.effects
import qs.config
import QtQuick
import QtQuick.Layouts
StyledRect {
id: root
property color onColor: Colours.palette.m3onSurface
property alias disabled: stateLayer.disabled
property alias text: label.text
property alias enabled: stateLayer.enabled
property string icon: ""
implicitWidth: rowLayout.implicitWidth + Appearance.padding.normal * 2
implicitHeight: rowLayout.implicitHeight + Appearance.padding.small * 2
radius: Appearance.rounding.normal
StateLayer {
id: stateLayer
color: parent.onColor
function onClicked(): void {
if (parent.enabled !== false) {
parent.clicked();
}
}
}
RowLayout {
id: rowLayout
anchors.centerIn: parent
spacing: Appearance.spacing.small
MaterialIcon {
id: iconItem
visible: root.icon.length > 0
text: root.icon
color: root.onColor
}
StyledText {
id: label
color: parent.parent.onColor
}
}
signal clicked
}

View file

@ -69,7 +69,7 @@ Item {
if (!Nmcli.wirelessDeviceDetails || Nmcli.wirelessDeviceDetails === null) {
// Network is active but we don't have details yet, fetch them
Nmcli.getWirelessDeviceDetails("", () => {
// After fetching, check if we got details - if not, timer will try again
// After fetching, check if we got details - if not, timer will try again
});
} else {
// We have details, can stop the timer
@ -89,7 +89,7 @@ Item {
if (network && network.ssid) {
const isActive = network.active || (Nmcli.active && Nmcli.active.ssid === network.ssid);
if (isActive) {
Nmcli.getWirelessDeviceDetails("", () => {});
Nmcli.getWirelessDeviceDetails("");
} else {
Nmcli.wirelessDeviceDetails = null;
}
@ -134,14 +134,14 @@ Item {
checked: root.network?.active ?? false
toggle.onToggled: {
if (checked) {
handleConnect();
root.handleConnect();
} else {
Nmcli.disconnectFromNetwork();
}
}
}
SimpleButton {
TextButton {
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.normal
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
@ -151,8 +151,8 @@ Item {
}
return Nmcli.hasSavedProfile(root.network.ssid);
}
color: Colours.palette.m3errorContainer
onColor: Colours.palette.m3onErrorContainer
inactiveColour: Colours.palette.m3errorContainer
inactiveOnColour: Colours.palette.m3onErrorContainer
text: qsTr("Forget Network")
onClicked: {
@ -160,7 +160,7 @@ Item {
if (root.network.active) {
Nmcli.disconnectFromNetwork();
}
Nmcli.forgetNetwork(root.network.ssid, () => {});
Nmcli.forgetNetwork(root.network.ssid);
}
}
}
@ -214,7 +214,6 @@ Item {
deviceDetails: Nmcli.wirelessDeviceDetails
}
}
}
}
@ -236,26 +235,21 @@ Item {
if (hasSavedProfile) {
Nmcli.connectToNetwork(root.network.ssid, "", root.network.bssid, null);
} else {
Nmcli.connectToNetworkWithPasswordCheck(
root.network.ssid,
root.network.isSecure,
(result) => {
if (result.needsPassword) {
if (Nmcli.pendingConnection) {
Nmcli.connectionCheckTimer.stop();
Nmcli.immediateCheckTimer.stop();
Nmcli.immediateCheckTimer.checkCount = 0;
Nmcli.pendingConnection = null;
}
root.session.network.showPasswordDialog = true;
root.session.network.pendingNetwork = root.network;
Nmcli.connectToNetworkWithPasswordCheck(root.network.ssid, root.network.isSecure, result => {
if (result.needsPassword) {
if (Nmcli.pendingConnection) {
Nmcli.connectionCheckTimer.stop();
Nmcli.immediateCheckTimer.stop();
Nmcli.immediateCheckTimer.checkCount = 0;
Nmcli.pendingConnection = null;
}
},
root.network.bssid
);
root.session.network.showPasswordDialog = true;
root.session.network.pendingNetwork = root.network;
}
}, root.network.bssid);
}
} else {
Nmcli.connectToNetwork(root.network.ssid, "", root.network.bssid, null);
}
}
}
}

View file

@ -48,7 +48,7 @@ Item {
MouseArea {
anchors.fill: parent
onClicked: closeDialog();
onClicked: closeDialog()
}
}
@ -94,7 +94,7 @@ Item {
}
}
Keys.onEscapePressed: closeDialog();
Keys.onEscapePressed: closeDialog()
ColumnLayout {
id: content
@ -314,25 +314,25 @@ Item {
Layout.fillWidth: true
spacing: Appearance.spacing.normal
SimpleButton {
TextButton {
id: cancelButton
Layout.fillWidth: true
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
color: Colours.palette.m3secondaryContainer
onColor: Colours.palette.m3onSecondaryContainer
inactiveColour: Colours.palette.m3secondaryContainer
inactiveOnColour: Colours.palette.m3onSecondaryContainer
text: qsTr("Cancel")
onClicked: closeDialog();
onClicked: root.closeDialog()
}
SimpleButton {
TextButton {
id: connectButton
Layout.fillWidth: true
Layout.minimumHeight: Appearance.font.size.normal + Appearance.padding.normal * 2
color: Colours.palette.m3primary
onColor: Colours.palette.m3onPrimary
inactiveColour: Colours.palette.m3primary
inactiveOnColour: Colours.palette.m3onPrimary
text: qsTr("Connect")
enabled: passwordContainer.passwordBuffer.length > 0 && !connecting
@ -354,24 +354,19 @@ Item {
text = qsTr("Connecting...");
// Connect to network
Nmcli.connectToNetwork(
root.network.ssid,
password,
root.network.bssid || "",
(result) => {
if (result && result.success) {
// Connection successful, monitor will handle the rest
} else if (result && result.needsPassword) {
// Shouldn't happen since we provided password
connectionMonitor.stop();
connecting = false;
enabled = true;
text = qsTr("Connect");
} else {
// Connection failed, monitor will handle timeout
}
}
);
Nmcli.connectToNetwork(root.network.ssid, password, root.network.bssid || "", result => {
if (result && result.success)
// Connection successful, monitor will handle the rest
{} else if (result && result.needsPassword) {
// Shouldn't happen since we provided password
connectionMonitor.stop();
connecting = false;
enabled = true;
text = qsTr("Connect");
} else
// Connection failed, monitor will handle timeout
{}
});
// Start monitoring connection
connectionMonitor.start();
@ -387,8 +382,7 @@ Item {
}
// Check if we're connected to the target network (case-insensitive SSID comparison)
const isConnected = root.network && Nmcli.active && Nmcli.active.ssid &&
Nmcli.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim();
const isConnected = root.network && Nmcli.active && Nmcli.active.ssid && Nmcli.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim();
if (isConnected) {
// Successfully connected - give it a moment for network list to update
@ -459,7 +453,7 @@ Item {
if (isClosing) {
return;
}
isClosing = true;
passwordContainer.passwordBuffer = "";
connectButton.connecting = false;

View file

@ -3,6 +3,7 @@ pragma Singleton
import qs.config
import Quickshell
import Quickshell.Services.Notifications
import QtQuick
Singleton {
id: root