Merge branch 'main' into feat/llm-chat-tab

Modules/Notifications/Sidebar/Content.qml

@@ -10,13 +10,12 @@ import qs.Services
 Item {
 	id: root
 
-	required property Props props
-	required property var visibilities
+	required property ScreenState screenState
 
 	Connections {
 		function onIsWindowChanged(): void {
 			if (ChatState.isWindow)
-				root.props.currentTab = 0;
+				root.screenState.dashboardTab = 0;
 		}
 
 		target: ChatState
@@ -31,7 +30,7 @@ Item {
 		Tabs {
 			Layout.fillWidth: true
 			Layout.preferredHeight: ChatState.isWindow || !Config.llm.enabled ? 0 : implicitHeight
-			dashState: root.props
+			screenState: root.screenState
 			nonAnimWidth: layout.width
 			visible: height > 0
 		}
@@ -47,9 +46,9 @@ Item {
 				anchors.bottom: parent.bottom
 				anchors.top: parent.top
 				implicitWidth: parent.width
-				opacity: root.props.currentTab === 0 ? 1 : 0
+				opacity: root.screenState.dashboardTab === 0 ? 1 : 0
 				visible: opacity > 0
-				x: root.props.currentTab === 0 ? 0 : -root.width
+				x: root.screenState.dashboardTab === 0 ? 0 : -root.width
 
 				Behavior on opacity {
 					Anim {}
@@ -64,8 +63,7 @@ Item {
 					radius: Tokens.rounding.small
 
 					NotifDock {
-						props: root.props
-						visibilities: root.visibilities
+						screenState: root.screenState
 					}
 				}
 			}
@@ -82,9 +80,9 @@ Item {
 				sourceComponent: Item {
 					id: chatPage
 
-					opacity: root.props.currentTab === 1 ? 1 : 0
+					opacity: root.screenState.dashboardTab === 1 ? 1 : 0
 					visible: opacity > 0
-					x: root.props.currentTab === 0 ? root.width : 0
+					x: root.screenState.dashboardTab === 0 ? root.width : 0
 					z: 1
 
 					Behavior on opacity {

Modules/Notifications/Sidebar/Notif.qml

@@ -15,8 +15,7 @@ CustomRect {
 	required property bool expanded
 	required property NotifServer.Notif modelData
 	readonly property real nonAnimHeight: expanded ? summary.implicitHeight + expandedContent.implicitHeight + expandedContent.anchors.topMargin + Tokens.padding.medium * 2 : summaryHeightMetrics.height
-	required property Props props
-	required property PersistentProperties visibilities
+	required property ScreenState screenState
 
 	color: {
 		const c = root.modelData?.urgency === "critical" ? Colors.palette.m3secondaryContainer : Colors.layer(Colors.palette.m3surfaceContainerHigh, 2);
@@ -137,7 +136,7 @@ CustomRect {
 
 			onLinkActivated: link => {
 				Qt.openUrlExternally(link);
-				root.visibilities.sidebar = false;
+				root.screenState.sidebar = false;
 			}
 		}
 

Modules/Notifications/Sidebar/NotifDock.qml

@@ -14,8 +14,7 @@ Item {
 	id: root
 
 	readonly property int notifCount: NotifServer.list.reduce((acc, n) => n.closed ? acc : acc + 1, 0)
-	required property Props props
-	required property var visibilities
+	required property ScreenState screenState
 
 	anchors.fill: parent
 	anchors.margins: Tokens.padding.small
@@ -38,19 +37,15 @@ Item {
 			anchors.leftMargin: root.notifCount > 0 ? 0 : -width - titleText.anchors.leftMargin
 			anchors.verticalCenter: parent.verticalCenter
 			color: Colors.palette.m3outline
-			font.family: "CaskaydiaCove NF"
-			font.pointSize: 13
-			font.weight: 500
+			font: Tokens.font.label.large
 			opacity: root.notifCount > 0 ? 1 : 0
 			text: root.notifCount
 
 			Behavior on anchors.leftMargin {
-				Anim {
-				}
+				Anim {}
 			}
 			Behavior on opacity {
-				Anim {
-				}
+				Anim {}
 			}
 		}
 
@@ -63,9 +58,7 @@ Item {
 			anchors.verticalCenter: parent.verticalCenter
 			color: Colors.palette.m3outline
 			elide: Text.ElideRight
-			font.family: "CaskaydiaCove NF"
-			font.pointSize: 13
-			font.weight: 500
+			font: Tokens.font.label.large
 			text: root.notifCount > 0 ? qsTr("notification%1").arg(root.notifCount === 1 ? "" : "s") : qsTr("Notifications")
 		}
 	}
@@ -87,8 +80,7 @@ Item {
 			opacity: root.notifCount > 0 ? 0 : 1
 
 			Behavior on opacity {
-				Anim {
-				}
+				Anim {}
 			}
 			sourceComponent: ColumnLayout {
 				spacing: 20
@@ -96,9 +88,7 @@ Item {
 				CustomText {
 					Layout.alignment: Qt.AlignHCenter
 					color: Colors.palette.m3outlineVariant
-					font.family: "CaskaydiaCove NF"
-					font.pointSize: 18
-					font.weight: 500
+					font: Tokens.font.headline.builders.small.width(90).build()
 					text: qsTr("No Notifications")
 				}
 			}
@@ -120,8 +110,7 @@ Item {
 				id: notifList
 
 				container: view
-				props: root.props
-				visibilities: root.visibilities
+				screenState: root.screenState
 			}
 		}
 	}
@@ -162,20 +151,17 @@ Item {
 		scale: root.notifCount > 0 ? 1 : 0.5
 
 		Behavior on opacity {
-			Anim {
-			}
+			Anim {}
 		}
 		Behavior on scale {
-			Anim {
-			}
+			Anim {}
 		}
 		sourceComponent: IconButton {
 			id: clearBtn
 
-			font.pointSize: Math.round(18 * 1.2)
+			font: Tokens.font.icon.large
 			icon: "clear_all"
-			padding: 8
-			radius: Tokens.rounding.full
+			isRound: true
 
 			onClicked: clearTimer.start()
 

Modules/Notifications/Sidebar/NotifDockList.qml

@@ -12,8 +12,7 @@ LazyListView {
 	id: root
 
 	required property Flickable container
-	required property Props props
-	required property PersistentProperties visibilities
+	required property ScreenState screenState
 
 	anchors.left: parent?.left
 	anchors.right: parent?.right
@@ -118,8 +117,7 @@ LazyListView {
 
 				container: root.container
 				modelData: notif.modelData
-				props: root.props
-				visibilities: root.visibilities
+				screenState: root.screenState
 			}
 		}
 	}

Modules/Notifications/Sidebar/NotifGroup.qml

@@ -16,7 +16,7 @@ CustomRect {
 	readonly property list<var> activeNotifs: notifs.filter(n => !n.closed)
 	readonly property string appIcon: activeNotifs.find(n => n.appIcon.length > 0)?.appIcon ?? ""
 	required property Flickable container
-	readonly property bool expanded: props.expandedNotifs.includes(modelData)
+	readonly property bool expanded: screenState.expandedNotifs.includes(modelData)
 	readonly property string image: activeNotifs.find(n => n.image.length > 0)?.image ?? ""
 	required property string modelData
 	readonly property int nonAnimHeight: {
@@ -26,7 +26,7 @@ CustomRect {
 	}
 	readonly property int notifCount: activeNotifs.length
 	readonly property list<var> notifs: NotifServer.list.filter(n => n.appName === modelData)
-	required property Props props
+	required property ScreenState screenState
 	readonly property int urgency: {
 		if (activeNotifs.find(n => n.urgency === NotificationUrgency.Critical))
 			return NotificationUrgency.Critical;
@@ -34,14 +34,13 @@ CustomRect {
 			return NotificationUrgency.Normal;
 		return NotificationUrgency.Low;
 	}
-	required property PersistentProperties visibilities
 
 	function toggleExpand(expand: bool): void {
 		if (expand) {
 			if (!expanded)
-				props.expandedNotifs.push(modelData);
+				screenState.expandedNotifs.push(modelData);
 		} else if (expanded) {
-			props.expandedNotifs.splice(props.expandedNotifs.indexOf(modelData), 1);
+			screenState.expandedNotifs.splice(screenState.expandedNotifs.indexOf(modelData), 1);
 		}
 	}
 
@@ -59,7 +58,7 @@ CustomRect {
 
 	Component.onDestruction: {
 		if (notifCount === 0 && expanded)
-			props.expandedNotifs.splice(props.expandedNotifs.indexOf(modelData), 1);
+			screenState.expandedNotifs.splice(screenState.expandedNotifs.indexOf(modelData), 1);
 	}
 
 	RowLayout {
@@ -233,8 +232,7 @@ CustomRect {
 				container: root.container
 				expanded: root.expanded
 				notifs: root.notifs
-				props: root.props
-				visibilities: root.visibilities
+				screenState: root.screenState
 
 				onRequestToggleExpand: expand => root.toggleExpand(expand)
 			}

Modules/Notifications/Sidebar/NotifGroupList.qml

@@ -14,8 +14,7 @@ LazyListView {
 	required property Flickable container
 	required property bool expanded
 	required property list<var> notifs
-	required property Props props
-	required property PersistentProperties visibilities
+	required property ScreenState screenState
 
 	signal requestToggleExpand(expand: bool)
 
@@ -122,8 +121,7 @@ LazyListView {
 				anchors.fill: parent
 				expanded: root.expanded
 				modelData: notif.modelData
-				props: root.props
-				visibilities: root.visibilities
+				screenState: root.screenState
 			}
 		}
 	}

Modules/Notifications/Sidebar/Props.qml

@@ -1,9 +0,0 @@
-import Quickshell
-import ZShell.Llm
-
-PersistentProperties {
-	property int currentTab: 0
-	property list<string> expandedNotifs: []
-
-	reloadableId: "sidebar"
-}

Modules/Notifications/Sidebar/Tabs.qml

@@ -12,7 +12,7 @@ Item {
 	id: root
 
 	readonly property alias count: bar.count
-	required property PersistentProperties dashState
+	required property ScreenState screenState
 	required property real nonAnimWidth
 
 	implicitHeight: bar.implicitHeight + indicator.implicitHeight + indicator.anchors.topMargin + separator.implicitHeight
@@ -24,7 +24,7 @@ Item {
 		anchors.right: parent.right
 		anchors.top: parent.top
 		background: null
-		currentIndex: root.dashState.currentTab
+		currentIndex: root.screenState.dashboardTab
 		implicitHeight: contentHeight
 
 		contentItem: RowLayout {
@@ -62,12 +62,10 @@ Item {
 		}
 
 		Behavior on implicitWidth {
-			Anim {
-			}
+			Anim {}
 		}
 		Behavior on x {
-			Anim {
-			}
+			Anim {}
 		}
 
 		CustomRect {
@@ -110,7 +108,7 @@ Item {
 				color: tab.current ? Colors.palette.m3onPrimary : Colors.palette.m3onSurface
 				radius: Tokens.rounding.small
 
-				onClicked: root.dashState.currentTab = tab.TabBar.index
+				onClicked: root.screenState.dashboardTab = tab.TabBar.index
 			}
 
 			MaterialIcon {
@@ -124,8 +122,7 @@ Item {
 				text: tab.iconName
 
 				Behavior on fill {
-					Anim {
-					}
+					Anim {}
 				}
 			}
 

Modules/Notifications/Sidebar/Utils/Cards/Record.qml

@@ -11,8 +11,7 @@ import qs.Services
 CustomRect {
 	id: root
 
-	required property var props
-	required property PersistentProperties visibilities
+	required property ScreenState screenState
 
 	Layout.fillWidth: true
 	color: Colors.tPalette.m3surfaceContainer
@@ -46,7 +45,7 @@ CustomRect {
 					anchors.horizontalCenterOffset: -0.5
 					anchors.verticalCenterOffset: 1.5
 					color: Recorder.running ? Colors.palette.m3onSecondary : Colors.palette.m3onSecondaryContainer
-					font.pointSize: Tokens.font.size.large
+					fontStyle: Tokens.font.icon.large
 					text: "screen_record"
 				}
 			}
@@ -58,7 +57,7 @@ CustomRect {
 				CustomText {
 					Layout.fillWidth: true
 					elide: Text.ElideRight
-					font.pointSize: Tokens.font.size.normal
+					font: Tokens.font.body.medium
 					text: qsTr("Screen Recorder")
 				}
 
@@ -66,13 +65,13 @@ CustomRect {
 					Layout.fillWidth: true
 					color: Colors.palette.m3onSurfaceVariant
 					elide: Text.ElideRight
-					font.pointSize: Tokens.font.size.small
+					font: Tokens.font.body.small
 					text: Recorder.paused ? qsTr("Recording paused") : Recorder.running ? qsTr("Recording running") : qsTr("Recording off")
 				}
 			}
 
 			SplitButton {
-				active: menuItems.find(m => root.props.recordingMode === m.icon + m.text) ?? menuItems[0]
+				active: menuItems.find(m => root.screenState.recordingMode === m.icon + m.text) ?? menuItems[0]
 				enabled: !Recorder.running
 				menuOnTop: true
 
@@ -107,7 +106,7 @@ CustomRect {
 					}
 				]
 
-				menu.onItemSelected: item => root.props.recordingMode = item.icon + item.text
+				menu.onItemSelected: item => root.screenState.recordingMode = item.icon + item.text
 			}
 		}
 
@@ -126,8 +125,7 @@ CustomRect {
 
 				enabled: false
 
-				Anim {
-				}
+				Anim {}
 			}
 			Behavior on running {
 				SequentialAnimation {
@@ -155,8 +153,7 @@ CustomRect {
 						value: true
 					}
 
-					PropertyAction {
-					}
+					PropertyAction {}
 
 					PropertyAction {
 						property: "enabled"
@@ -190,8 +187,7 @@ CustomRect {
 		id: recordingList
 
 		RecordingList {
-			props: root.props
-			visibilities: root.visibilities
+			screenState: root.screenState
 		}
 	}
 
@@ -208,8 +204,7 @@ CustomRect {
 				radius: Tokens.rounding.full
 
 				Behavior on implicitWidth {
-					Anim {
-					}
+					Anim {}
 				}
 				SequentialAnimation on opacity {
 					alwaysRunToEnd: true
@@ -237,13 +232,13 @@ CustomRect {
 					anchors.centerIn: parent
 					animate: true
 					color: Recorder.paused ? Colors.palette.m3onTertiary : Colors.palette.m3onError
-					font.family: Config.appearance.font.family.mono
+					font: Tokens.font.mono.small
 					text: Recorder.paused ? "PAUSED" : "REC"
 				}
 			}
 
 			CustomText {
-				font.pointSize: Tokens.font.size.normal
+				font: Tokens.font.body.medium
 				text: {
 					const elapsed = Recorder.elapsed;
 
@@ -267,8 +262,9 @@ CustomRect {
 
 			IconButton {
 				checked: Recorder.paused
-				font.pointSize: Tokens.font.size.large
+				font: Tokens.font.icon.medium
 				icon: Recorder.paused ? "play_arrow" : "pause"
+				isRound: true
 				isToggle: true
 				label.animate: true
 				type: IconButton.Tonal
@@ -280,8 +276,9 @@ CustomRect {
 			}
 
 			IconButton {
-				font.pointSize: Tokens.font.size.large
+				font: Tokens.font.icon.medium
 				icon: "stop"
+				isRound: true
 				inactiveColor: Colors.palette.m3error
 				inactiveOnColor: Colors.palette.m3onError
 

Modules/Notifications/Sidebar/Utils/Cards/RecordingList.qml

@@ -14,8 +14,7 @@ import qs.Services
 ColumnLayout {
 	id: root
 
-	required property var props
-	required property PersistentProperties visibilities
+	required property ScreenState screenState
 
 	spacing: 0
 
@@ -23,30 +22,30 @@ ColumnLayout {
 		Layout.fillWidth: true
 		cursorShape: Qt.PointingHandCursor
 
-		onClicked: root.props.recordingListExpanded = !root.props.recordingListExpanded
+		onClicked: root.screenState.recordingListExpanded = !root.screenState.recordingListExpanded
 
 		RowLayout {
 			spacing: Tokens.spacing.small
 
 			MaterialIcon {
 				Layout.alignment: Qt.AlignVCenter
-				font.pointSize: Tokens.font.size.large
+				fontStyle: Tokens.font.icon.large
 				text: "list"
 			}
 
 			CustomText {
 				Layout.alignment: Qt.AlignVCenter
 				Layout.fillWidth: true
-				font.pointSize: Tokens.font.size.normal
+				font: Tokens.font.body.medium
 				text: qsTr("Recordings")
 			}
 
 			IconButton {
-				icon: root.props.recordingListExpanded ? "unfold_less" : "unfold_more"
+				icon: root.screenState.recordingListExpanded ? "unfold_less" : "unfold_more"
 				label.animate: true
 				type: IconButton.Text
 
-				onClicked: root.props.recordingListExpanded = !root.props.recordingListExpanded
+				onClicked: root.screenState.recordingListExpanded = !root.screenState.recordingListExpanded
 			}
 		}
 	}
@@ -57,7 +56,7 @@ ColumnLayout {
 		Layout.fillWidth: true
 		Layout.rightMargin: -Tokens.spacing.small
 		clip: true
-		implicitHeight: (Tokens.font.size.larger + Tokens.padding.extraSmall) * (root.props.recordingListExpanded ? 10 : 3)
+		implicitHeight: (Tokens.font.body.large.pointSize + Tokens.padding.extraSmall) * (root.screenState.recordingListExpanded ? 10 : 3)
 
 		CustomScrollBar.vertical: CustomScrollBar {
 			flickable: list
@@ -109,7 +108,7 @@ ColumnLayout {
 				type: IconButton.Text
 
 				onClicked: {
-					root.visibilities.sidebar = false;
+					root.screenState.sidebar = false;
 					if (Config.launcher.uwsm)
 						Quickshell.execDetached(["app2unit", "--", ...Config.general.apps.playback, recording.modelData.path]);
 					else
@@ -122,7 +121,7 @@ ColumnLayout {
 				type: IconButton.Text
 
 				onClicked: {
-					root.visibilities.sidebar = false;
+					root.screenState.sidebar = false;
 					if (Config.launcher.uwsm)
 						Quickshell.execDetached(["app2unit", "--", ...Config.general.apps.explorer, recording.modelData.path]);
 					else
@@ -174,11 +173,11 @@ ColumnLayout {
 
 				MaterialIcon {
 					Layout.alignment: Qt.AlignHCenter
-					Layout.preferredHeight: root.props.recordingListExpanded ? implicitHeight : 0
+					Layout.preferredHeight: root.screenState.recordingListExpanded ? implicitHeight : 0
 					color: Colors.palette.m3outline
-					font.pointSize: Tokens.font.size.extraLarge
-					opacity: root.props.recordingListExpanded ? 1 : 0
-					scale: root.props.recordingListExpanded ? 1 : 0
+					fontStyle: Tokens.font.icon.extraLarge
+					opacity: root.screenState.recordingListExpanded ? 1 : 0
+					scale: root.screenState.recordingListExpanded ? 1 : 0
 					text: "scan_delete"
 
 					Behavior on Layout.preferredHeight {
@@ -197,10 +196,10 @@ ColumnLayout {
 
 					MaterialIcon {
 						Layout.alignment: Qt.AlignHCenter
-						Layout.preferredWidth: !root.props.recordingListExpanded ? implicitWidth : 0
+						Layout.preferredWidth: !root.screenState.recordingListExpanded ? implicitWidth : 0
 						color: Colors.palette.m3outline
-						opacity: !root.props.recordingListExpanded ? 1 : 0
-						scale: !root.props.recordingListExpanded ? 1 : 0
+						opacity: !root.screenState.recordingListExpanded ? 1 : 0
+						scale: !root.screenState.recordingListExpanded ? 1 : 0
 						text: "scan_delete"
 
 						Behavior on Layout.preferredWidth {

Modules/Notifications/Sidebar/Utils/Cards/Toggles.qml

@@ -38,8 +38,8 @@ CustomRect {
 			return true;
 		});
 	}
+	required property ScreenState screenState
 	readonly property int splitIndex: Math.ceil(quickToggles.length / 2)
-	required property PersistentProperties visibilities
 
 	color: Colors.tPalette.m3surfaceContainer
 	implicitHeight: layout.implicitHeight + Tokens.padding.extraLargeIncreased
@@ -53,7 +53,7 @@ CustomRect {
 		spacing: Tokens.spacing.medium
 
 		CustomText {
-			font.pointSize: Tokens.font.size.normal
+			font: Tokens.font.body.medium
 			text: qsTr("Quick Toggles")
 		}
 
@@ -166,8 +166,8 @@ CustomRect {
 						isToggle: false
 
 						onClicked: {
-							root.visibilities.sidebar = false;
-							root.visibilities.settings = true;
+							root.screenState.sidebar = false;
+							root.screenState.settings = true;
 						}
 					}
 				}

Modules/Notifications/Sidebar/Utils/Content.qml

@@ -1,14 +1,14 @@
 import Quickshell
 import QtQuick
 import QtQuick.Layouts
-import qs.Modules.Notifications.Sidebar.Utils.Cards
 import ZShell.Config
+import qs.Components
+import qs.Modules.Notifications.Sidebar.Utils.Cards
 
 Item {
 	id: root
 
-	required property PersistentProperties props
-	required property var visibilities
+	required property ScreenState screenState
 
 	implicitHeight: layout.implicitHeight
 	implicitWidth: layout.implicitWidth
@@ -22,14 +22,13 @@ Item {
 		IdleInhibit {}
 
 		Record {
-			props: root.props
-			visibilities: root.visibilities
+			screenState: root.screenState
 			z: 1
 		}
 
 		Toggles {
 			Layout.fillWidth: true
-			visibilities: root.visibilities
+			screenState: root.screenState
 		}
 	}
 }

Modules/Notifications/Sidebar/Utils/IdleInhibit.qml

@@ -15,8 +15,7 @@ CustomRect {
 	radius: Tokens.rounding.small
 
 	Behavior on implicitHeight {
-		Anim {
-		}
+		Anim {}
 	}
 
 	RowLayout {
@@ -39,7 +38,7 @@ CustomRect {
 
 				anchors.centerIn: parent
 				color: IdleInhibitor.enabled ? Colors.palette.m3onSecondary : Colors.palette.m3onSecondaryContainer
-				font.pointSize: 18
+				fontStyle: Tokens.font.icon.large
 				text: "coffee"
 			}
 		}
@@ -51,7 +50,7 @@ CustomRect {
 			CustomText {
 				Layout.fillWidth: true
 				elide: Text.ElideRight
-				font.pointSize: 13
+				font: Tokens.font.body.medium
 				text: qsTr("Keep Awake")
 			}
 
@@ -59,7 +58,7 @@ CustomRect {
 				Layout.fillWidth: true
 				color: Colors.palette.m3onSurfaceVariant
 				elide: Text.ElideRight
-				font.pointSize: 11
+				font: Tokens.font.body.small
 				text: IdleInhibitor.enabled ? qsTr("Preventing sleep mode") : qsTr("Normal power management")
 			}
 		}
@@ -83,16 +82,13 @@ CustomRect {
 		scale: IdleInhibitor.enabled ? 1 : 0.5
 
 		Behavior on anchors.bottomMargin {
-			Anim {
-			}
+			Anim {}
 		}
 		Behavior on opacity {
-			Anim {
-			}
+			Anim {}
 		}
 		Behavior on scale {
-			Anim {
-			}
+			Anim {}
 		}
 		sourceComponent: CustomRect {
 			color: Colors.palette.m3primary
@@ -105,7 +101,7 @@ CustomRect {
 
 				anchors.centerIn: parent
 				color: Colors.palette.m3onPrimary
-				font.pointSize: Math.round(11 * 0.9)
+				font: Tokens.font.body.builders.small.size(Math.round(Tokens.font.body.small.pointSize * 0.9)).build()
 				text: qsTr("Active since %1").arg(Qt.formatTime(IdleInhibitor.enabledSince, Config.services.useTwelveHourClock ? "hh:mm a" : "hh:mm"))
 			}
 		}

Modules/Notifications/Sidebar/Utils/Wrapper.qml

@@ -9,16 +9,9 @@ Item {
 	id: root
 
 	property real offsetScale: shouldBeActive ? 0 : 1
-	readonly property PersistentProperties props: PersistentProperties {
-		property string recordingConfirmDelete
-		property bool recordingListExpanded: false
-		property string recordingMode
-
-		reloadableId: "utilities"
-	}
-	readonly property bool shouldBeActive: visibilities.sidebar && !sidebar.chatActive
+	required property ScreenState screenState
+	readonly property bool shouldBeActive: screenState.sidebar && !sidebar.chatActive
 	required property Item sidebar
-	required property var visibilities
 
 	anchors.bottomMargin: (-implicitHeight - 5) * offsetScale
 	implicitHeight: content.implicitHeight + Tokens.padding.small * 2
@@ -43,8 +36,7 @@ Item {
 
 		sourceComponent: Content {
 			implicitWidth: root.implicitWidth - 8 * 2
-			props: root.props
-			visibilities: root.visibilities
+			screenState: root.screenState
 		}
 	}
 }

Modules/Notifications/Sidebar/Wrapper.qml

@@ -11,13 +11,11 @@ import QtQuick
 Item {
 	id: root
 
+	readonly property bool chatActive: screenState.sidebarTab === 1
 	property real offsetScale: shouldBeActive ? 0 : 1
 	required property var panels
-	readonly property Props props: Props {
-	}
-	readonly property bool shouldBeActive: root.visibilities.sidebar && Config.sidebar.enabled
-	readonly property bool chatActive: props.currentTab === 1
-	required property var visibilities
+	required property ScreenState screenState
+	readonly property bool shouldBeActive: root.screenState.sidebar && Config.sidebar.enabled
 
 	anchors.rightMargin: (-implicitWidth - 5) * offsetScale
 	implicitWidth: Config.sidebar.sizes.width
@@ -54,8 +52,7 @@ Item {
 
 		sourceComponent: Content {
 			implicitWidth: Config.sidebar.sizes.width - Tokens.padding.small * 2
-			props: root.props
-			visibilities: root.visibilities
+			screenState: root.screenState
 		}
 	}
 }