controlcenter: remove qt5compat dep

This commit is contained in:
2 * r + 2 * t 2026-01-28 19:20:12 +11:00
parent 7097cdcab8
commit 6c1765c2e1
2 changed files with 166 additions and 97 deletions

View file

@ -12,7 +12,6 @@ import qs.utils
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
DeviceDetails {
id: root
@ -20,7 +19,8 @@ DeviceDetails {
required property Session session
readonly property var vpnProvider: root.session.vpn.active
readonly property bool providerEnabled: {
if (!vpnProvider || vpnProvider.index === undefined) return false;
if (!vpnProvider || vpnProvider.index === undefined)
return false;
const provider = Config.utilities.vpn.provider[vpnProvider.index];
return provider && typeof provider === "object" && provider.enabled === true;
}
@ -49,7 +49,8 @@ DeviceDetails {
label: qsTr("Enable this provider")
checked: root.providerEnabled
toggle.onToggled: {
if (!root.vpnProvider) return;
if (!root.vpnProvider)
return;
const providers = [];
const index = root.vpnProvider.index;
@ -171,9 +172,12 @@ DeviceDetails {
showTopMargin: true
label: qsTr("Status")
value: {
if (!root.providerEnabled) return qsTr("Disabled");
if (VPN.connecting) return qsTr("Connecting...");
if (VPN.connected) return qsTr("Connected");
if (!root.providerEnabled)
return qsTr("Disabled");
if (VPN.connecting)
return qsTr("Connecting...");
if (VPN.connected)
return qsTr("Connected");
return qsTr("Enabled (Not connected)");
}
}
@ -209,16 +213,36 @@ DeviceDetails {
scale: 0.7
enter: Transition {
ParallelAnimation {
NumberAnimation { property: "opacity"; from: 0; to: 1; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial }
NumberAnimation { property: "scale"; from: 0.7; to: 1; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial }
Anim {
property: "opacity"
from: 0
to: 1
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
}
Anim {
property: "scale"
from: 0.7
to: 1
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
}
}
exit: Transition {
ParallelAnimation {
NumberAnimation { property: "opacity"; from: 1; to: 0; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial }
NumberAnimation { property: "scale"; from: 1; to: 0.7; duration: Appearance.anim.durations.expressiveFastSpatial; easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial }
Anim {
property: "opacity"
from: 1
to: 0
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
}
Anim {
property: "scale"
from: 1
to: 0.7
duration: Appearance.anim.durations.expressiveFastSpatial
easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial
}
}
@ -230,17 +254,15 @@ DeviceDetails {
color: Qt.rgba(0, 0, 0, 0.4 * editVpnDialog.opacity)
}
background: StyledRect {
color: Colours.palette.m3surfaceContainerHigh
radius: Appearance.rounding.large
layer.enabled: true
layer.effect: DropShadow {
color: Qt.rgba(0, 0, 0, 0.3)
radius: 16
samples: 33
verticalOffset: 4
Elevation {
anchors.fill: parent
radius: parent.radius
level: 3
z: -1
}
}
@ -271,8 +293,12 @@ DeviceDetails {
border.width: 1
border.color: displayNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} }
Behavior on border.color { CAnim {} }
Behavior on color {
CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField {
id: displayNameField
@ -303,8 +329,12 @@ DeviceDetails {
border.width: 1
border.color: interfaceNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} }
Behavior on border.color { CAnim {} }
Behavior on color {
CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField {
id: interfaceNameField
@ -317,9 +347,8 @@ DeviceDetails {
}
}
Item { Layout.preferredHeight: Appearance.spacing.normal }
RowLayout {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true
spacing: Appearance.spacing.normal

View file

@ -3,16 +3,13 @@ pragma ComponentBehavior: Bound
import ".."
import qs.components
import qs.components.controls
import qs.components.containers
import qs.components.effects
import qs.services
import qs.config
import qs.utils
import Quickshell
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
ColumnLayout {
id: root
@ -48,7 +45,7 @@ ColumnLayout {
Config.utilities.vpn.provider = providers;
Config.save();
Qt.callLater(function() {
Qt.callLater(function () {
VPN.toggle();
});
}
@ -160,9 +157,12 @@ ColumnLayout {
StyledText {
Layout.fillWidth: true
text: {
if (modelData.enabled && VPN.connected) return qsTr("Connected");
if (modelData.enabled && VPN.connecting) return qsTr("Connecting...");
if (modelData.enabled) return qsTr("Enabled");
if (modelData.enabled && VPN.connected)
return qsTr("Connected");
if (modelData.enabled && VPN.connecting)
return qsTr("Connecting...");
if (modelData.enabled)
return qsTr("Enabled");
return qsTr("Disabled");
}
color: modelData.enabled ? (VPN.connected ? Colours.palette.m3primary : Colours.palette.m3onSurface) : Colours.palette.m3outline
@ -210,7 +210,7 @@ ColumnLayout {
Config.utilities.vpn.provider = providers;
Config.save();
Qt.callLater(function() {
Qt.callLater(function () {
VPN.toggle();
});
}
@ -285,15 +285,39 @@ ColumnLayout {
enter: Transition {
ParallelAnimation {
NumberAnimation { property: "opacity"; from: 0; to: 1; duration: Appearance.anim.durations.normal; easing.bezierCurve: Appearance.anim.curves.emphasized }
NumberAnimation { property: "scale"; from: 0.7; to: 1; duration: Appearance.anim.durations.normal; easing.bezierCurve: Appearance.anim.curves.emphasized }
Anim {
property: "opacity"
from: 0
to: 1
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
Anim {
property: "scale"
from: 0.7
to: 1
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
}
}
exit: Transition {
ParallelAnimation {
NumberAnimation { property: "opacity"; from: 1; to: 0; duration: Appearance.anim.durations.small; easing.bezierCurve: Appearance.anim.curves.emphasized }
NumberAnimation { property: "scale"; from: 1; to: 0.7; duration: Appearance.anim.durations.small; easing.bezierCurve: Appearance.anim.curves.emphasized }
Anim {
property: "opacity"
from: 1
to: 0
duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized
}
Anim {
property: "scale"
from: 1
to: 0.7
duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized
}
}
}
@ -346,7 +370,7 @@ ColumnLayout {
id: transitionToForm
ParallelAnimation {
NumberAnimation {
Anim {
target: selectionContent
property: "opacity"
to: 0
@ -362,7 +386,7 @@ ColumnLayout {
}
ParallelAnimation {
NumberAnimation {
Anim {
target: formContent
property: "opacity"
to: 1
@ -376,16 +400,15 @@ ColumnLayout {
color: Colours.palette.m3surfaceContainerHigh
radius: Appearance.rounding.large
layer.enabled: true
layer.effect: DropShadow {
color: Qt.rgba(0, 0, 0, 0.3)
radius: 16
samples: 33
verticalOffset: 4
Elevation {
anchors.fill: parent
radius: parent.radius
level: 3
z: -1
}
Behavior on implicitHeight {
NumberAnimation {
Anim {
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
@ -396,7 +419,7 @@ ColumnLayout {
implicitHeight: vpnDialog.currentState === "selection" ? selectionContent.implicitHeight : formContent.implicitHeight
Behavior on implicitHeight {
NumberAnimation {
Anim {
duration: Appearance.anim.durations.normal
easing.bezierCurve: Appearance.anim.curves.emphasized
}
@ -411,7 +434,7 @@ ColumnLayout {
opacity: vpnDialog.currentState === "selection" ? 1 : 0
Behavior on opacity {
NumberAnimation {
Anim {
duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized
}
@ -431,9 +454,8 @@ ColumnLayout {
font.pointSize: Appearance.font.size.small
}
Item { Layout.preferredHeight: Appearance.spacing.small }
TextButton {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true
text: qsTr("NetBird")
inactiveColour: Colours.tPalette.m3surfaceContainerHigh
@ -443,7 +465,11 @@ ColumnLayout {
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
providers.push(Config.utilities.vpn.provider[i]);
}
providers.push({ name: "netbird", displayName: "NetBird", interface: "wt0" });
providers.push({
name: "netbird",
displayName: "NetBird",
interface: "wt0"
});
Config.utilities.vpn.provider = providers;
Config.save();
vpnDialog.closeWithAnimation();
@ -460,7 +486,11 @@ ColumnLayout {
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
providers.push(Config.utilities.vpn.provider[i]);
}
providers.push({ name: "tailscale", displayName: "Tailscale", interface: "tailscale0" });
providers.push({
name: "tailscale",
displayName: "Tailscale",
interface: "tailscale0"
});
Config.utilities.vpn.provider = providers;
Config.save();
vpnDialog.closeWithAnimation();
@ -477,7 +507,11 @@ ColumnLayout {
for (let i = 0; i < Config.utilities.vpn.provider.length; i++) {
providers.push(Config.utilities.vpn.provider[i]);
}
providers.push({ name: "warp", displayName: "Cloudflare WARP", interface: "CloudflareWARP" });
providers.push({
name: "warp",
displayName: "Cloudflare WARP",
interface: "CloudflareWARP"
});
Config.utilities.vpn.provider = providers;
Config.save();
vpnDialog.closeWithAnimation();
@ -494,9 +528,8 @@ ColumnLayout {
}
}
Item { Layout.preferredHeight: Appearance.spacing.small }
TextButton {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true
text: qsTr("Cancel")
inactiveColour: Colours.palette.m3secondaryContainer
@ -514,7 +547,7 @@ ColumnLayout {
opacity: vpnDialog.currentState === "form" ? 1 : 0
Behavior on opacity {
NumberAnimation {
Anim {
duration: Appearance.anim.durations.small
easing.bezierCurve: Appearance.anim.curves.emphasized
}
@ -544,8 +577,12 @@ ColumnLayout {
border.width: 1
border.color: displayNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} }
Behavior on border.color { CAnim {} }
Behavior on color {
CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField {
id: displayNameField
@ -576,8 +613,12 @@ ColumnLayout {
border.width: 1
border.color: interfaceNameField.activeFocus ? Colours.palette.m3primary : Qt.alpha(Colours.palette.m3outline, 0.3)
Behavior on color { CAnim {} }
Behavior on border.color { CAnim {} }
Behavior on color {
CAnim {}
}
Behavior on border.color {
CAnim {}
}
StyledTextField {
id: interfaceNameField
@ -590,9 +631,8 @@ ColumnLayout {
}
}
Item { Layout.preferredHeight: Appearance.spacing.normal }
RowLayout {
Layout.topMargin: Appearance.spacing.normal
Layout.fillWidth: true
spacing: Appearance.spacing.normal