feat: refactor: add helpers for summary/body placement in NotificationBody

This commit is contained in:
Hannes
2026-09-01 23:59:36 +02:00
parent 2df40a2a76
commit b59eb012ba
4 changed files with 237 additions and 194 deletions
+176 -157
View File
@@ -10,7 +10,7 @@ import "./notificationServer"
PanelWindow {
id: root
implicitWidth: screen.width/5
implicitHeight: screen.height - Config.barHeight(screen.height)*2
implicitHeight: screen.height - Config.barHeight(screen.height)
color: "transparent"
visible: true
focusable: true
@@ -101,14 +101,14 @@ PanelWindow {
// text: NotificationS.trackedNotifications.values[0]
// }
Component.onCompleted: {
for (var notification in NotificationS.trackedNotifications.values) {
console.log("[NotificationHistory]: " + notification.appName + " Notifications")
}
for (var i =0; i < NotificationS.notificationNum; i++) {
console.log("[NotificationHistory]: " + NotificationS.trackedNotifications.values[i].appName + " Notifications")
}
}
// Component.onCompleted: {
// for (var notification in NotificationS.trackedNotifications.values) {
// console.log("[NotificationHistory]: " + notification.appName + " Notifications")
// }
// for (var i =0; i < NotificationS.notificationNum; i++) {
// console.log("[NotificationHistory]: " + NotificationS.trackedNotifications.values[i].appName + " Notifications")
// }
// }
Column{
id: bgColumn
@@ -119,7 +119,7 @@ PanelWindow {
Rectangle {
id: topBar
width: parent.width
height: bigFontSize*1.25
height: bigFontSize*2.5
color: textBGColor
radius: Config.screen_big_radius_fun(screen.height)
border.width: Config.border_width
@@ -135,20 +135,28 @@ PanelWindow {
Text{
text: "Notifications:"
font.family: Config.font
font.pixelSize: bigFontSize
font.pixelSize: topBar.height*0.75
color: textColor
}
}
// Row{
// id: backgroundCenter
// anchors.centerIn: parent
// spacing: Config.screen_small_bar_spacing_fun(screen.height)
// }
Row{
id: backgroundCenter
anchors.centerIn: parent
spacing: Config.screen_small_bar_spacing_fun(screen.height)
id: backgroundRight
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: Config.screen_spacing_fun(screen.height)
spacing: Config.screen_spacing_fun(screen.height)
Text{
text: NotificationS.soundEnabled ? "󰂚" : "󰂛"
font.family: Config.font
font.pixelSize: bigFontSize
font.pixelSize: topBar.height*0.75
color: textColor
}
@@ -156,7 +164,7 @@ PanelWindow {
id: notificationVolumeSwitch
implicitWidth: notificationVolumeSwitch.height*2
implicitHeight: bigFontSize
implicitHeight: topBar.height*0.75
anchors.verticalCenter: parent.verticalCenter
checked: NotificationS.soundEnabled
@@ -199,19 +207,12 @@ PanelWindow {
console.log("NotificationS.soundEnabled:", NotificationS.soundEnabled)
}
}
}
Row{
id: backgroundRight
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: Config.screen_spacing_fun(screen.height)
spacing: Config.screen_spacing_fun(screen.height)
MouseArea {
id: closeArea
width: bigFontSize
height: bigFontSize
width: closeArea.height
height: topBar.height*0.75
anchors.verticalCenter: parent.verticalCenter
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
Rectangle{
@@ -221,15 +222,16 @@ PanelWindow {
border.width: Config.border_width
border.color: closeArea.containsMouse ? "white" : textColor
Text{
text: ""
text: ""
anchors.centerIn: parent
font.family: Config.font
font.pixelSize: bigFontSize
font.pixelSize: closeArea.height - Config.spacing
color: closeArea.containsMouse ? "white" : textColor
}
}
onClicked: {
closeNHistory()
root.clearAll()
// closeNHistory()
}
}
}
@@ -268,161 +270,178 @@ PanelWindow {
width: flick.width
spacing: Config.spacing
// ── Grouped view ──────────────────────────────
// Uses root.grouped (sorted by appName). Each group
// shows a header with appName + count + expand/collapse
// + clear-group button. The notifications themselves
// are rendered via NotificationBody.qml with
// isHistory:true (no auto-timeout, no click-to-close).
// ── Grouped view (only groups with >1 notification are grouped) ──
// Uses root.grouped (sorted by appName). Each app group with
// more than one notification is rendered as a collapsible
// card with a header (appName + count + expand/collapse +
// clear-group). Singletons are rendered directly as a
// NotificationBody without a header.
Repeater {
id: groupedRepeater
model: root.grouped
delegate: Rectangle {
id: groupDelegate
delegate: Item {
id: delegateRoot
required property var modelData
required property int index
property var group: modelData
// collapsed by default (expandedGroups[appName] === true means expanded)
// to default to expanded use: root.expandedGroups[group.appName] !== false
property bool isGrouped: group.notes.length > 1
property bool isExpanded: root.expandedGroups[group.appName] === true
width: contentColumn.width
implicitHeight: groupColumn.implicitHeight + Config.spacing * 2
color: Qt.alpha(Colors.surfaceContainerHigh, 0.45)
radius: Config.screen_big_radius_fun(root.screen.height)
border.width: Config.border_width
border.color: root.textColor
clip: true
// height adapts to which component is visible
implicitHeight: isGrouped ? groupedCard.implicitHeight : singleBody.implicitHeight
height: implicitHeight
Column {
id: groupColumn
anchors.fill: parent
anchors.margins: Config.spacing
spacing: Config.spacing
// ── Singleton: plain NotificationBody ──
NotificationBody {
id: singleBody
visible: !delegateRoot.isGrouped
width: parent.width
screen: root.screen
notification: delegateRoot.group.notes[0]
isHistory: true
onDismissed: function(notification, dismiss) {
if (notification && notification.tracked) notification.dismiss()
else if (notification && notification.close) notification.close()
}
}
// Header row
Rectangle {
id: groupHeader
width: parent.width
height: Math.max(appNameText.implicitHeight, countText.implicitHeight, expandIcon.implicitHeight, clearGroupIcon.implicitHeight) + Config.spacing * 1.5
color: root.bGColor
radius: Config.radius
border.width: Config.border_width
border.color: root.textColor
// ── Grouped card (count > 1) ──
Rectangle {
id: groupedCard
visible: delegateRoot.isGrouped
width: parent.width
implicitHeight: groupColumn.implicitHeight + Config.spacing * 2
color: Qt.alpha(Colors.surfaceContainerHigh, 0.45)
radius: Config.screen_big_radius_fun(root.screen.height)
border.width: Config.border_width
border.color: root.textColor
clip: true
MouseArea {
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: root.toggleGroup(group.appName)
}
Column {
id: groupColumn
anchors.fill: parent
anchors.margins: Config.spacing
spacing: Config.spacing
Row {
id: headerLeft
anchors.left: parent.left
anchors.leftMargin: Config.spacing
anchors.verticalCenter: parent.verticalCenter
spacing: Config.spacing
Text {
id: expandIcon
text: groupDelegate.isExpanded ? "󰅀" : "󰅂"
font.family: Config.font
font.pixelSize: root.fontSize
color: root.textColor
anchors.verticalCenter: parent.verticalCenter
}
Text {
id: appNameText
text: group.appName
font.family: Config.font
font.pixelSize: root.fontSize
font.bold: true
color: root.textColor
elide: Text.ElideRight
maximumLineCount: 1
}
Text {
id: countText
text: "(" + group.notes.length + ")"
font.family: Config.font
font.pixelSize: Config.screen_height_to_font_tiny(root.screen.height)
color: Qt.alpha(root.textColor, 0.8)
anchors.verticalCenter: parent.verticalCenter
}
}
Row {
id: headerRight
anchors.right: parent.right
anchors.rightMargin: Config.spacing
anchors.verticalCenter: parent.verticalCenter
spacing: Config.spacing
Rectangle {
id: groupHeader
width: parent.width
height: Math.max(appNameText.implicitHeight, countText.implicitHeight, expandIcon.implicitHeight, clearGroupIcon.implicitHeight) + Config.spacing * 1.5
color: root.bGColor
radius: Config.radius
border.width: Config.border_width
border.color: root.textColor
MouseArea {
id: clearGroupArea
width: clearGroupIcon.implicitWidth + Config.spacing
height: clearGroupIcon.implicitHeight + Config.spacing * 0.6
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: function(mouse) {
mouse.accepted = true
root.clearGroup(group.appName)
onClicked: root.toggleGroup(group.appName)
}
Row {
id: headerLeft
anchors.left: parent.left
anchors.leftMargin: Config.spacing
anchors.verticalCenter: parent.verticalCenter
spacing: Config.spacing
Text {
id: expandIcon
text: delegateRoot.isExpanded ? "󰅀" : "󰅂"
font.family: Config.font
font.pixelSize: root.fontSize
color: root.textColor
anchors.verticalCenter: parent.verticalCenter
}
Rectangle {
anchors.fill: parent
radius: Config.radius
color: clearGroupArea.containsMouse ? Colors.errorContainer : "transparent"
border.width: Config.border_width
border.color: clearGroupArea.containsMouse ? Colors.error : root.textColor
Text {
id: clearGroupIcon
anchors.centerIn: parent
text: "󰆴"
font.family: Config.font
font.pixelSize: root.fontSize
color: clearGroupArea.containsMouse ? Colors.error_fg : root.textColor
Text {
id: appNameText
text: group.appName
font.family: Config.font
font.pixelSize: root.fontSize
font.bold: true
color: root.textColor
elide: Text.ElideRight
maximumLineCount: 1
}
Text {
id: countText
text: "(" + group.notes.length + ")"
font.family: Config.font
font.pixelSize: Config.screen_height_to_font_tiny(root.screen.height)
color: Qt.alpha(root.textColor, 0.8)
anchors.verticalCenter: parent.verticalCenter
}
}
Row {
id: headerRight
anchors.right: parent.right
anchors.rightMargin: Config.spacing
anchors.verticalCenter: parent.verticalCenter
spacing: Config.spacing
MouseArea {
id: clearGroupArea
width: bigFontSize + Config.spacing
height: bigFontSize + Config.spacing
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: function(mouse) {
mouse.accepted = true
root.clearGroup(group.appName)
}
Rectangle{
anchors.fill: parent
radius: Config.screen_big_radius_fun(screen.height)
color: clearGroupArea.containsMouse ? "red" : textBGColor
border.width: Config.border_width
border.color: clearGroupArea.containsMouse ? "white" : textColor
Text{
id: clearGroupIcon
anchors.centerIn: parent
text: ""
font.family: Config.font
font.pixelSize: bigFontSize
color: clearGroupArea.containsMouse ? "white" : textColor
}
}
}
}
}
}
// Expanded list of NotificationBody items
Column {
id: notificationsColumn
width: parent.width
spacing: Config.spacing
visible: groupDelegate.isExpanded
Repeater {
model: group.notes
delegate: NotificationBody {
required property var modelData
required property int index
width: notificationsColumn.width
screen: root.screen
notification: modelData
isHistory: true
onDismissed: function(notification, dismiss) {
if (notification && notification.tracked) {
notification.dismiss()
} else if (notification && notification.close) {
notification.close()
Column {
id: notificationsColumn
width: parent.width
spacing: Config.spacing
visible: delegateRoot.isExpanded
Repeater {
model: group.notes
delegate: NotificationBody {
required property var modelData
required property int index
width: notificationsColumn.width
screen: root.screen
notification: modelData
isHistory: true
onDismissed: function(notification, dismiss) {
if (notification && notification.tracked) notification.dismiss()
else if (notification && notification.close) notification.close()
}
}
}
}
}
// Hint when collapsed
Text {
visible: !groupDelegate.isExpanded && group.notes.length > 0
width: parent.width
text: group.notes.length + " notification" + (group.notes.length > 1 ? "s hidden" : " hidden") + " — click header to expand"
font.family: Config.font
font.pixelSize: Config.screen_height_to_font_tiny(root.screen.height)
color: Qt.alpha(root.textColor, 0.6)
elide: Text.ElideRight
horizontalAlignment: Text.AlignHCenter
Text {
visible: !delegateRoot.isExpanded && group.notes.length > 1
width: parent.width
text: group.notes.length + " notification" + (group.notes.length > 1 ? "s hidden" : " hidden") + " — click header to expand"
font.family: Config.font
font.pixelSize: Config.screen_height_to_font_tiny(root.screen.height)
color: Qt.alpha(root.textColor, 0.6)
elide: Text.ElideRight
horizontalAlignment: Text.AlignHCenter
}
}
}
}