mirror of
https://github.com/noctalia-dev/noctalia-shell.git
synced 2026-05-11 17:08:27 +08:00
Merge pull request #1403 from notiant/patch-8
Make NotificationHistoryPanel height adaptable & remove reloading animations
This commit is contained in:
Lemmy
@@ -89,67 +89,185 @@ SmartPanel {
|
||||
}
|
||||
}
|
||||
|
||||
// Adapter not available of disabled
|
||||
NBox {
|
||||
id: disabledBox
|
||||
visible: !(BluetoothService.adapter && BluetoothService.adapter.enabled)
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: disabledColumn.implicitHeight + Style.marginXL
|
||||
|
||||
// Center the content within this rectangle
|
||||
ColumnLayout {
|
||||
id: disabledColumn
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "bluetooth-off"
|
||||
pointSize: 48
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.disabled")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.enable-message")
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
NScrollView {
|
||||
visible: BluetoothService.adapter && BluetoothService.adapter.enabled
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
horizontalPolicy: ScrollBar.AlwaysOff
|
||||
verticalPolicy: ScrollBar.AsNeeded
|
||||
clip: true
|
||||
contentWidth: availableWidth
|
||||
|
||||
ColumnLayout {
|
||||
id: devicesList
|
||||
width: parent.width
|
||||
spacing: Style.marginM
|
||||
|
||||
// Adapter not available of disabled
|
||||
NBox {
|
||||
id: disabledBox
|
||||
visible: !(BluetoothService.adapter && BluetoothService.adapter.enabled)
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: disabledColumn.implicitHeight + Style.marginXL
|
||||
|
||||
// Center the content within this rectangle
|
||||
ColumnLayout {
|
||||
id: disabledColumn
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "bluetooth-off"
|
||||
pointSize: 48
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.disabled")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.enable-message")
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Fallback - No devices, scanning
|
||||
NBox {
|
||||
id: scanningBox
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: scanningColumn.implicitHeight + Style.marginXL
|
||||
visible: {
|
||||
if (!(BluetoothService.adapter && BluetoothService.adapter.enabled && BluetoothService.adapter.devices) || !BluetoothService.scanningActive) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var availableCount = BluetoothService.adapter.devices.values.filter(dev => {
|
||||
return dev && !dev.paired && !dev.pairing && !dev.blocked && (dev.signalStrength === undefined || dev.signalStrength > 0);
|
||||
}).length;
|
||||
return (availableCount === 0);
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
id: scanningColumn
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
spacing: Style.marginXS
|
||||
|
||||
NIcon {
|
||||
icon: "refresh"
|
||||
pointSize: Style.fontSizeXXL * 1.5
|
||||
color: Color.mPrimary
|
||||
|
||||
RotationAnimation on rotation {
|
||||
running: true
|
||||
loops: Animation.Infinite
|
||||
from: 0
|
||||
to: 360
|
||||
duration: Style.animationSlow * 4
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.scanning")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurface
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.pairing-mode")
|
||||
pointSize: Style.fontSizeM
|
||||
color: Color.mOnSurfaceVariant
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Empty state when no devices
|
||||
NBox {
|
||||
id: emptyBox
|
||||
visible: {
|
||||
if (!(BluetoothService.adapter && BluetoothService.adapter.enabled && BluetoothService.adapter.devices) || BluetoothService.scanningActive)
|
||||
return false;
|
||||
|
||||
var availableCount = BluetoothService.adapter.devices.values.filter(dev => {
|
||||
return dev && !dev.blocked && (dev.signalStrength === undefined || dev.signalStrength > 0);
|
||||
}).length;
|
||||
return (availableCount === 0);
|
||||
}
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: emptyColumn.implicitHeight + Style.marginXL
|
||||
|
||||
ColumnLayout {
|
||||
id: emptyColumn
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "bluetooth"
|
||||
pointSize: 48
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.no-devices")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NButton {
|
||||
text: I18n.tr("tooltips.refresh-devices")
|
||||
icon: "refresh"
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
onClicked: {
|
||||
BluetoothService.toggleDiscovery();
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Connected devices
|
||||
BluetoothDevicesList {
|
||||
label: I18n.tr("bluetooth.panel.connected-devices")
|
||||
@@ -162,7 +280,7 @@ SmartPanel {
|
||||
return BluetoothService.sortDevices(filtered);
|
||||
}
|
||||
model: items
|
||||
visible: items.length > 0
|
||||
visible: items.length > 0 && BluetoothService.adapter && BluetoothService.adapter.enabled
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
@@ -178,7 +296,7 @@ SmartPanel {
|
||||
return BluetoothService.sortDevices(filtered);
|
||||
}
|
||||
model: items
|
||||
visible: items.length > 0
|
||||
visible: items.length > 0 && BluetoothService.adapter && BluetoothService.adapter.enabled
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
@@ -259,129 +377,11 @@ SmartPanel {
|
||||
return BluetoothService.sortDevices(filtered);
|
||||
}
|
||||
model: items
|
||||
visible: items.length > 0
|
||||
visible: items.length > 0 && BluetoothService.adapter && BluetoothService.adapter.enabled
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
// Empty state when no devices
|
||||
NBox {
|
||||
visible: {
|
||||
if (!(BluetoothService.adapter && BluetoothService.adapter.devices) || BluetoothService.scanningActive)
|
||||
return false;
|
||||
|
||||
var availableCount = BluetoothService.adapter.devices.values.filter(dev => {
|
||||
return dev && !dev.blocked && (dev.signalStrength === undefined || dev.signalStrength > 0);
|
||||
}).length;
|
||||
return (availableCount === 0);
|
||||
}
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: emptyColumn.implicitHeight + Style.marginXL
|
||||
|
||||
ColumnLayout {
|
||||
id: emptyColumn
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "bluetooth"
|
||||
pointSize: 48
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.no-devices")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NButton {
|
||||
text: I18n.tr("tooltips.refresh-devices")
|
||||
icon: "refresh"
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
onClicked: {
|
||||
BluetoothService.toggleDiscovery();
|
||||
}
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Fallback - No devices, scanning
|
||||
NBox {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: scanningColumn.implicitHeight + Style.marginXL
|
||||
visible: {
|
||||
if (!(BluetoothService.adapter && BluetoothService.adapter.devices) || !BluetoothService.scanningActive) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var availableCount = BluetoothService.adapter.devices.values.filter(dev => {
|
||||
return dev && !dev.paired && !dev.pairing && !dev.blocked && (dev.signalStrength === undefined || dev.signalStrength > 0);
|
||||
}).length;
|
||||
return (availableCount === 0);
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
id: scanningColumn
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
spacing: Style.marginXS
|
||||
|
||||
NIcon {
|
||||
icon: "refresh"
|
||||
pointSize: Style.fontSizeXXL * 1.5
|
||||
color: Color.mPrimary
|
||||
|
||||
RotationAnimation on rotation {
|
||||
running: true
|
||||
loops: Animation.Infinite
|
||||
from: 0
|
||||
to: 360
|
||||
duration: Style.animationSlow * 4
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.scanning")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurface
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("bluetooth.panel.pairing-mode")
|
||||
pointSize: Style.fontSizeM
|
||||
color: Color.mOnSurfaceVariant
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -24,6 +24,15 @@ SmartPanel {
|
||||
id: panelContent
|
||||
color: "transparent"
|
||||
|
||||
// Calculate content height based on header + tabs (if visible) + content
|
||||
property real calculatedHeight: {
|
||||
if (NotificationService.historyList.count === 0) {
|
||||
return headerBox.implicitHeight + scrollView.implicitHeight + (Style.marginL * 2) + Style.marginM;
|
||||
}
|
||||
return headerBox.implicitHeight + scrollView.implicitHeight + (Style.marginL * 2) + Style.marginM;
|
||||
}
|
||||
property real contentPreferredHeight: Math.min(root.preferredHeight, Math.ceil(calculatedHeight))
|
||||
|
||||
// State (lazy-loaded with panelContent)
|
||||
property var rangeCounts: [0, 0, 0, 0]
|
||||
property var lastKnownDate: null // Track the current date to detect day changes
|
||||
@@ -90,6 +99,19 @@ SmartPanel {
|
||||
function countForRange(range) {
|
||||
return rangeCounts[range] || 0;
|
||||
}
|
||||
|
||||
function hasNotificationsInCurrentRange() {
|
||||
var m = NotificationService.historyList;
|
||||
if (!m || m.count === 0) {
|
||||
return false;
|
||||
}
|
||||
for (var i = 0; i < m.count; ++i) {
|
||||
var item = m.get(i);
|
||||
if (item && isInCurrentRange(item.timestamp))
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
Component.onCompleted: {
|
||||
recalcRangeCounts();
|
||||
@@ -120,38 +142,6 @@ SmartPanel {
|
||||
}
|
||||
}
|
||||
|
||||
// Calculate content height based on header + tabs (if visible) + content
|
||||
property real headerHeight: headerBox.implicitHeight
|
||||
property real tabsHeight: tabsBox.visible ? tabsBox.implicitHeight : 0
|
||||
property real contentHeight: {
|
||||
if (NotificationService.historyList.count === 0) {
|
||||
return emptyState.implicitHeight;
|
||||
}
|
||||
// Calculate actual height of visible notifications
|
||||
var totalHeight = 0;
|
||||
var count = NotificationService.historyList.count;
|
||||
var visibleCount = 0;
|
||||
for (var i = 0; i < count; i++) {
|
||||
var item = NotificationService.historyList.get(i);
|
||||
if (item && isInCurrentRange(item.timestamp)) {
|
||||
visibleCount++;
|
||||
}
|
||||
}
|
||||
// Estimate: each notification is roughly 100-150px, use conservative estimate
|
||||
var avgNotificationHeight = 120 * Style.uiScaleRatio;
|
||||
totalHeight = visibleCount * avgNotificationHeight + (visibleCount - 1) * Style.marginM;
|
||||
return totalHeight;
|
||||
}
|
||||
property real calculatedHeight: headerHeight + tabsHeight + contentHeight + (Style.marginL * 2) + (Style.marginXL)
|
||||
property real contentPreferredHeight: {
|
||||
if (NotificationService.historyList.count === 0) {
|
||||
// Empty state: smaller height
|
||||
return Math.min(root.preferredHeight, 280 * Style.uiScaleRatio);
|
||||
}
|
||||
// Clamp between minimum (280) and maximum (540)
|
||||
return Math.max(280 * Style.uiScaleRatio, Math.min(root.preferredHeight, calculatedHeight));
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
id: mainColumn
|
||||
anchors.fill: parent
|
||||
@@ -162,7 +152,7 @@ SmartPanel {
|
||||
NBox {
|
||||
id: headerBox
|
||||
Layout.fillWidth: true
|
||||
implicitHeight: header.implicitHeight + (Style.marginXL)
|
||||
implicitHeight: header.implicitHeight + Style.marginXL
|
||||
|
||||
ColumnLayout {
|
||||
id: header
|
||||
@@ -257,53 +247,10 @@ SmartPanel {
|
||||
}
|
||||
}
|
||||
|
||||
// Empty state when no notifications
|
||||
ColumnLayout {
|
||||
id: emptyState
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
visible: NotificationService.historyList.count === 0
|
||||
spacing: Style.marginL
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
NIcon {
|
||||
icon: "bell-off"
|
||||
pointSize: 48
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("notifications.panel.no-notifications")
|
||||
pointSize: Style.fontSizeL
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
NText {
|
||||
text: I18n.tr("notifications.panel.description")
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.Wrap
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
|
||||
// Notification list container with gradient overlay
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
visible: NotificationService.historyList.count > 0
|
||||
|
||||
NScrollView {
|
||||
id: scrollView
|
||||
@@ -315,220 +262,277 @@ SmartPanel {
|
||||
// Track which notification is expanded
|
||||
property string expandedId: ""
|
||||
|
||||
contentWidth: availableWidth
|
||||
|
||||
Column {
|
||||
width: scrollView.width
|
||||
ColumnLayout {
|
||||
width: parent.width
|
||||
spacing: Style.marginM
|
||||
|
||||
Repeater {
|
||||
model: NotificationService.historyList
|
||||
// Empty state when no notifications
|
||||
NBox {
|
||||
visible: !panelContent.hasNotificationsInCurrentRange()
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: emptyState.implicitHeight + Style.marginXL
|
||||
|
||||
delegate: Item {
|
||||
id: notificationDelegate
|
||||
width: parent.width
|
||||
visible: panelContent.isInCurrentRange(model.timestamp)
|
||||
height: visible ? contentColumn.height + (Style.marginXL) : 0
|
||||
ColumnLayout {
|
||||
id: emptyState
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginL
|
||||
|
||||
property string notificationId: model.id
|
||||
property bool isExpanded: scrollView.expandedId === notificationId
|
||||
property bool canExpand: summaryText.truncated || bodyText.truncated || (actionsList.length > 0) // Explicitly allow expand if actions exist
|
||||
|
||||
// Parse actions safely
|
||||
property var actionsList: {
|
||||
try {
|
||||
return JSON.parse(model.actionsJson || "[]");
|
||||
} catch (e) {
|
||||
return [];
|
||||
}
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
radius: Style.radiusM
|
||||
color: Color.mSurfaceVariant
|
||||
border.color: Qt.alpha(Color.mOutline, Style.opacityMedium)
|
||||
border.width: Style.borderS
|
||||
|
||||
Behavior on color {
|
||||
enabled: !Settings.data.general.animationDisabled
|
||||
ColorAnimation {
|
||||
duration: Style.animationFast
|
||||
}
|
||||
}
|
||||
NIcon {
|
||||
icon: "bell-off"
|
||||
pointSize: (NotificationService.historyList.count === 0) ? 48 : Style.baseWidgetSize
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
// Click to expand/collapse
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
anchors.rightMargin: Style.baseWidgetSize
|
||||
enabled: notificationDelegate.canExpand
|
||||
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
onClicked: {
|
||||
if (scrollView.expandedId === notificationId) {
|
||||
scrollView.expandedId = "";
|
||||
} else {
|
||||
scrollView.expandedId = notificationId;
|
||||
}
|
||||
}
|
||||
NText {
|
||||
text: I18n.tr("notifications.panel.no-notifications")
|
||||
pointSize: (NotificationService.historyList.count === 0) ? Style.fontSizeL : Style.fontSizeM
|
||||
color: Color.mOnSurfaceVariant
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
Column {
|
||||
id: contentColumn
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginM
|
||||
NText {
|
||||
visible: NotificationService.historyList.count === 0
|
||||
text: I18n.tr("notifications.panel.description")
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Row {
|
||||
Item {
|
||||
Layout.fillHeight: true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Notification list container
|
||||
Item {
|
||||
visible: panelContent.hasNotificationsInCurrentRange()
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: notificationColumn.implicitHeight
|
||||
|
||||
Column {
|
||||
id: notificationColumn
|
||||
width: scrollView.width
|
||||
spacing: Style.marginM
|
||||
|
||||
Repeater {
|
||||
model: NotificationService.historyList
|
||||
|
||||
delegate: Item {
|
||||
id: notificationDelegate
|
||||
width: parent.width
|
||||
spacing: Style.marginM
|
||||
visible: panelContent.isInCurrentRange(model.timestamp)
|
||||
height: visible ? contentColumn.height + Style.marginXL : 0
|
||||
|
||||
// Icon
|
||||
NImageRounded {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: Math.round(40 * Style.uiScaleRatio)
|
||||
height: Math.round(40 * Style.uiScaleRatio)
|
||||
radius: Math.min(Style.radiusL, width / 2)
|
||||
imagePath: model.cachedImage || model.originalImage || ""
|
||||
borderColor: "transparent"
|
||||
borderWidth: 0
|
||||
fallbackIcon: "bell"
|
||||
fallbackIconSize: 24
|
||||
property string notificationId: model.id
|
||||
property bool isExpanded: scrollView.expandedId === notificationId
|
||||
property bool canExpand: summaryText.truncated || bodyText.truncated || (actionsList.length > 0) // Explicitly allow expand if actions exist
|
||||
|
||||
// Parse actions safely
|
||||
property var actionsList: {
|
||||
try {
|
||||
return JSON.parse(model.actionsJson || "[]");
|
||||
} catch (e) {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
// Content
|
||||
Column {
|
||||
width: parent.width - Math.round(40 * Style.uiScaleRatio) - Style.marginM - Style.baseWidgetSize
|
||||
spacing: Style.marginXS
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
radius: Style.radiusM
|
||||
color: Color.mSurfaceVariant
|
||||
border.color: Settings.data.ui.boxBorderEnabled ? Qt.alpha(Color.mOutline, Style.opacityHeavy) : "transparent"
|
||||
border.width: Style.borderS
|
||||
|
||||
Behavior on color {
|
||||
enabled: !Settings.data.general.animationDisabled
|
||||
ColorAnimation {
|
||||
duration: Style.animationFast
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Click to expand/collapse
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
anchors.rightMargin: Style.baseWidgetSize
|
||||
enabled: notificationDelegate.canExpand
|
||||
cursorShape: enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||||
onClicked: {
|
||||
if (scrollView.expandedId === notificationId) {
|
||||
scrollView.expandedId = "";
|
||||
} else {
|
||||
scrollView.expandedId = notificationId;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Column {
|
||||
id: contentColumn
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.margins: Style.marginM
|
||||
spacing: Style.marginM
|
||||
|
||||
// Header row with app name and timestamp
|
||||
Row {
|
||||
width: parent.width
|
||||
spacing: Style.marginS
|
||||
spacing: Style.marginM
|
||||
|
||||
// Urgency indicator
|
||||
Rectangle {
|
||||
width: 6
|
||||
height: 6
|
||||
// Icon
|
||||
NImageRounded {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
radius: 3
|
||||
visible: model.urgency !== 1
|
||||
color: {
|
||||
if (model.urgency === 2)
|
||||
return Color.mError;
|
||||
else if (model.urgency === 0)
|
||||
return Color.mOnSurfaceVariant;
|
||||
else
|
||||
return "transparent";
|
||||
width: Math.round(40 * Style.uiScaleRatio)
|
||||
height: Math.round(40 * Style.uiScaleRatio)
|
||||
radius: Math.min(Style.radiusL, width / 2)
|
||||
imagePath: model.cachedImage || model.originalImage || ""
|
||||
borderColor: "transparent"
|
||||
borderWidth: 0
|
||||
fallbackIcon: "bell"
|
||||
fallbackIconSize: 24
|
||||
}
|
||||
|
||||
// Content
|
||||
Column {
|
||||
width: parent.width - Math.round(40 * Style.uiScaleRatio) - Style.marginM - Style.baseWidgetSize
|
||||
spacing: Style.marginXS
|
||||
|
||||
// Header row with app name and timestamp
|
||||
Row {
|
||||
width: parent.width
|
||||
spacing: Style.marginS
|
||||
|
||||
// Urgency indicator
|
||||
Rectangle {
|
||||
width: 6
|
||||
height: 6
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
radius: 3
|
||||
visible: model.urgency !== 1
|
||||
color: {
|
||||
if (model.urgency === 2)
|
||||
return Color.mError;
|
||||
else if (model.urgency === 0)
|
||||
return Color.mOnSurfaceVariant;
|
||||
else
|
||||
return "transparent";
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: model.appName || "Unknown App"
|
||||
pointSize: Style.fontSizeXS
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mSecondary
|
||||
}
|
||||
|
||||
NText {
|
||||
textFormat: Text.PlainText
|
||||
text: " " + Time.formatRelativeTime(model.timestamp)
|
||||
pointSize: Style.fontSizeXXS
|
||||
color: Color.mOnSurfaceVariant
|
||||
anchors.bottom: parent.bottom
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
text: model.appName || "Unknown App"
|
||||
pointSize: Style.fontSizeXS
|
||||
font.weight: Style.fontWeightBold
|
||||
color: Color.mSecondary
|
||||
}
|
||||
// Summary
|
||||
NText {
|
||||
id: summaryText
|
||||
width: parent.width
|
||||
text: model.summary || I18n.tr("common.no-summary")
|
||||
pointSize: Style.fontSizeM
|
||||
color: Color.mOnSurface
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.Wrap
|
||||
maximumLineCount: notificationDelegate.isExpanded ? 999 : 2
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
NText {
|
||||
textFormat: Text.PlainText
|
||||
text: " " + Time.formatRelativeTime(model.timestamp)
|
||||
pointSize: Style.fontSizeXXS
|
||||
color: Color.mOnSurfaceVariant
|
||||
anchors.bottom: parent.bottom
|
||||
}
|
||||
}
|
||||
// Body
|
||||
NText {
|
||||
id: bodyText
|
||||
width: parent.width
|
||||
text: model.body || ""
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.Wrap
|
||||
maximumLineCount: notificationDelegate.isExpanded ? 999 : 3
|
||||
elide: Text.ElideRight
|
||||
visible: text.length > 0
|
||||
}
|
||||
|
||||
// Summary
|
||||
NText {
|
||||
id: summaryText
|
||||
width: parent.width
|
||||
text: model.summary || I18n.tr("common.no-summary")
|
||||
pointSize: Style.fontSizeM
|
||||
color: Color.mOnSurface
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.Wrap
|
||||
maximumLineCount: notificationDelegate.isExpanded ? 999 : 2
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
// Actions Flow
|
||||
Flow {
|
||||
width: parent.width
|
||||
spacing: Style.marginS
|
||||
visible: notificationDelegate.actionsList.length > 0
|
||||
|
||||
// Body
|
||||
NText {
|
||||
id: bodyText
|
||||
width: parent.width
|
||||
text: model.body || ""
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mOnSurfaceVariant
|
||||
textFormat: Text.PlainText
|
||||
wrapMode: Text.Wrap
|
||||
maximumLineCount: notificationDelegate.isExpanded ? 999 : 3
|
||||
elide: Text.ElideRight
|
||||
visible: text.length > 0
|
||||
}
|
||||
Repeater {
|
||||
model: notificationDelegate.actionsList
|
||||
delegate: NButton {
|
||||
text: modelData.text
|
||||
fontSize: Style.fontSizeS
|
||||
backgroundColor: Color.mPrimary
|
||||
textColor: Color.mOnPrimary
|
||||
outlined: false
|
||||
implicitHeight: 24
|
||||
|
||||
// Actions Flow
|
||||
Flow {
|
||||
width: parent.width
|
||||
spacing: Style.marginS
|
||||
visible: notificationDelegate.actionsList.length > 0
|
||||
// Capture modelData in a property to avoid reference errors
|
||||
property var actionData: modelData
|
||||
onClicked: {
|
||||
NotificationService.invokeAction(notificationDelegate.notificationId, actionData.identifier);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Repeater {
|
||||
model: notificationDelegate.actionsList
|
||||
delegate: NButton {
|
||||
text: modelData.text
|
||||
fontSize: Style.fontSizeS
|
||||
backgroundColor: Color.mPrimary
|
||||
textColor: Color.mOnPrimary
|
||||
outlined: false
|
||||
implicitHeight: 24
|
||||
// Expand indicator
|
||||
Row {
|
||||
width: parent.width
|
||||
visible: !notificationDelegate.isExpanded && notificationDelegate.canExpand
|
||||
spacing: Style.marginXS
|
||||
|
||||
// Capture modelData in a property to avoid reference errors
|
||||
property var actionData: modelData
|
||||
onClicked: {
|
||||
NotificationService.invokeAction(notificationDelegate.notificationId, actionData.identifier);
|
||||
Item {
|
||||
width: parent.width - expandText.width - expandIcon.width - Style.marginXS
|
||||
height: 1
|
||||
}
|
||||
|
||||
NText {
|
||||
id: expandText
|
||||
text: I18n.tr("notifications.panel.click-to-expand") || "Click to expand"
|
||||
pointSize: Style.fontSizeXS
|
||||
color: Color.mPrimary
|
||||
}
|
||||
|
||||
NIcon {
|
||||
id: expandIcon
|
||||
icon: "chevron-down"
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mPrimary
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Expand indicator
|
||||
Row {
|
||||
width: parent.width
|
||||
visible: !notificationDelegate.isExpanded && notificationDelegate.canExpand
|
||||
spacing: Style.marginXS
|
||||
// Delete button
|
||||
NIconButton {
|
||||
icon: "trash"
|
||||
tooltipText: I18n.tr("tooltips.delete-notification")
|
||||
baseSize: Style.baseWidgetSize * 0.7
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
Item {
|
||||
width: parent.width - expandText.width - expandIcon.width - Style.marginXS
|
||||
height: 1
|
||||
onClicked: {
|
||||
NotificationService.removeFromHistory(notificationId);
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
id: expandText
|
||||
text: I18n.tr("notifications.panel.click-to-expand") || "Click to expand"
|
||||
pointSize: Style.fontSizeXS
|
||||
color: Color.mPrimary
|
||||
}
|
||||
|
||||
NIcon {
|
||||
id: expandIcon
|
||||
icon: "chevron-down"
|
||||
pointSize: Style.fontSizeS
|
||||
color: Color.mPrimary
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Delete button
|
||||
NIconButton {
|
||||
icon: "trash"
|
||||
tooltipText: I18n.tr("tooltips.delete-notification")
|
||||
baseSize: Style.baseWidgetSize * 0.7
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
|
||||
onClicked: {
|
||||
NotificationService.removeFromHistory(notificationId);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user