status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat:(@desktop/activity-center): AC notification categories according new designs 

Close #7161
This commit is contained in:
MishkaRogachev 2022-09-12 14:06:26 +04:00 committed by Mikhail Rogachev
parent 2e33efc014
commit ae4519a6be
4 changed files with 80 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

144
ui/app/AppLayouts/Chat/panels/ActivityCenterPopupTopBarPanel.qml
View File

@ -1,5 +1,6 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick 2.14
import QtQuick.Controls 2.14
import QtQuick.Layouts 1.14
import utils 1.0
@ -9,88 +10,64 @@ import StatusQ.Controls 0.1
import StatusQ.Popups 0.1
import ".."
import "../popups"
Item {
id: root
width: parent.width
height: 64
property bool hasMentions: false
property bool hasReplies: false
property bool hideReadNotifications: false
property bool allBtnHighlighted: false
property bool repliesBtnHighlighted: false
property bool mentionsBtnHighlighted: false
property int currentActivityCategory: ActivityCenterPopup.ActivityCategory.All
property alias errorText: errorText.text
signal allBtnClicked()
signal repliesBtnClicked()
signal mentionsBtnClicked()
signal preferencesClicked()
signal categoryTriggered(int category)
signal markAllReadClicked()
signal hideReadNotificationsTriggered()
Row {
id: filterButtons
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
height: 64
RowLayout {
id: row
anchors.fill: parent
anchors.leftMargin: Style.current.padding
height: allBtn.height
spacing: Style.current.padding
StatusFlatButton {
id: allBtn
text: qsTr("All")
size: StatusBaseButton.Size.Small
highlighted: root.allBtnHighlighted
onClicked: root.allBtnClicked();
}
StatusFlatButton {
id: mentionsBtn
text: qsTr("Mentions")
enabled: hasMentions
size: StatusBaseButton.Size.Small
highlighted: root.mentionsBtnHighlighted
onClicked: {
root.mentionsBtnClicked();
}
}
StatusFlatButton {
id: repliesbtn
text: qsTr("Replies")
enabled: hasReplies
size: StatusBaseButton.Size.Small
highlighted: root.repliesBtnHighlighted
onClicked: {
root.repliesBtnClicked();
}
}
// StatusFlatButton {
// id: contactRequestsBtn
// //% "Contact requests"
// text: qsTr("Replies")
// enabled: hasContactRequests
// size: StatusBaseButton.Size.Small
// highlighted: activityCenter.currentFilter === ActivityCenter.Filter.ContactRequests
// onClicked: activityCenter.currentFilter = ActivityCenter.Filter.ContactRequests
// }
}
Row {
id: otherButtons
anchors.verticalCenter: parent.verticalCenter
anchors.right: parent.right
anchors.rightMargin: Style.current.padding
height: markAllReadBtn.height
spacing: Style.current.padding
StatusListView {
id: listView
// NOTE: some entries are hidden until implimentation
model: [ { text: qsTr("All"), category: ActivityCenterPopup.ActivityCategory.All, visible: true },
{ text: qsTr("Admin"), category: ActivityCenterPopup.ActivityCategory.Admin, visible: false },
{ text: qsTr("Mentions"), category: ActivityCenterPopup.ActivityCategory.Mentions, visible: true },
{ text: qsTr("Replies"), category: ActivityCenterPopup.ActivityCategory.Replies, visible: true },
{ text: qsTr("Contact requests"), category: ActivityCenterPopup.ActivityCategory.ContactRequests, visible: true },
{ text: qsTr("Identity verification"), category: ActivityCenterPopup.ActivityCategory.IdentityVerification, visible: false },
{ text: qsTr("Transactions"), category: ActivityCenterPopup.ActivityCategory.Transactions, visible: false },
{ text: qsTr("Membership"), category: ActivityCenterPopup.ActivityCategory.Membership, visible: false },
{ text: qsTr("System"), category: ActivityCenterPopup.ActivityCategory.System, visible: false } ]
orientation: StatusListView.Horizontal
spacing: 0
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
Layout.fillWidth: true
Layout.fillHeight: true
delegate: StatusFlatButton {
visible: modelData.visible
width: visible ? implicitWidth : 0
text: modelData.text
anchors.verticalCenter: parent.verticalCenter
height: 32
size: StatusBaseButton.Size.Small
highlighted: modelData.category == root.currentActivityCategory
onClicked: root.categoryTriggered(modelData.category)
}
}
StatusFlatRoundButton {
id: markAllReadBtn
icon.name: "double-checkmark"
width: 32
height: 32
onClicked: markAllReadClicked()
StatusToolTip {
@ -100,34 +77,13 @@ Item {
}
StatusFlatRoundButton {
id: moreActionsBtn
icon.name: "more"
width: 32
height: 32
type: StatusFlatRoundButton.Type.Secondary
onClicked: {
let p = moreActionsBtn.mapToItem(otherButtons, moreActionsBtn.x, moreActionsBtn.y)
moreActionsMenu.popup(moreActionsBtn.width - moreActionsMenu.width, p.y + moreActionsBtn.height + 4)
}
StatusPopupMenu {
id: moreActionsMenu
StatusMenuItem {
id: hideReadNotificationsBtn
icon.name: "hide"
text: hideReadNotifications ?
qsTr("Show read notifications") :
qsTr("Hide read notifications")
onTriggered: hideReadNotifications = !hideReadNotifications
}
onClicked: hideReadNotifications = !hideReadNotifications
StatusMenuItem {
icon.name: "notification"
text: qsTr("Notification settings")
onTriggered: {
root.preferencesClicked();
}
}
StatusToolTip {
visible: markAllReadBtn.hovered
text: hideReadNotifications ? qsTr("Show read notifications") : qsTr("Hide read notifications")
}
}
}
@ -135,7 +91,7 @@ Item {
StatusBaseText {
id: errorText
visible: !!text
anchors.top: filterButtons.bottom
anchors.top: parent.top
anchors.topMargin: Style.current.smallPadding
color: Theme.palette.dangerColor1
}

46
ui/app/AppLayouts/Chat/popups/ActivityCenterPopup.qml
View File

@ -18,13 +18,18 @@ import "../panels"
Popup {
id: root
enum Filter {
enum ActivityCategory {
All,
Admin,
Mentions,
Replies,
ContactRequests
ContactRequests,
IdentityVerification,
Transactions,
Membership,
System
}
property int currentFilter: ActivityCenterPopup.Filter.All
property int currentActivityCategory: ActivityCenterPopup.ActivityCategory.All
property bool hasMentions: false
property bool hasReplies: false
// property bool hasContactRequests: false
@ -74,24 +79,13 @@ Popup {
ActivityCenterPopupTopBarPanel {
id: activityCenterTopBar
width: parent.width
hasReplies: root.hasReplies
hasMentions: root.hasMentions
hideReadNotifications: root.hideReadNotifications
allBtnHighlighted: root.currentFilter === ActivityCenterPopup.Filter.All
mentionsBtnHighlighted: root.currentFilter === ActivityCenterPopup.Filter.Mentions
repliesBtnHighlighted: root.currentFilter === ActivityCenterPopup.Filter.Replies
onAllBtnClicked: {
root.currentFilter = ActivityCenterPopup.Filter.All;
}
onRepliesBtnClicked: {
root.currentFilter = ActivityCenterPopup.Filter.Replies;
}
onMentionsBtnClicked: {
root.currentFilter = ActivityCenterPopup.Filter.Mentions;
}
onPreferencesClicked: {
root.close()
Global.changeAppSectionBySectionType(Constants.appSection.profile, Constants.settingsSubsection.notifications);
currentActivityCategory: root.currentActivityCategory
onCategoryTriggered: {
root.currentActivityCategory = category;
}
onMarkAllReadClicked: {
errorText = root.store.activityCenterModuleInst.markAllActivityCenterNotificationsRead()
@ -100,6 +94,8 @@ Popup {
StatusScrollView {
id: scrollView
anchors.left: parent.left
anchors.right: parent.right
anchors.top: activityCenterTopBar.bottom
anchors.topMargin: 13
anchors.bottom: parent.bottom
@ -110,7 +106,7 @@ Popup {
Column {
id: notificationsContainer
width: parent.width
width: scrollView.availableWidth
spacing: 0
// TODO remove this once it is handled by the activity center
@ -120,7 +116,8 @@ Popup {
// delegate: ContactRequest {
// visible: !hideReadNotifications &&
// (root.currentFilter === ActivityCenter.Filter.All || root.currentFilter === ActivityCenter.Filter.ContactRequests)
// (root.currentActivityCategory === ActivityCenter.ActivityCategory.All ||
// root.currentActivityCategory === ActivityCenter.ActivityCategory.ContactRequests)
// name: Utils.removeStatusEns(model.name)
// address: model.address
// localNickname: model.localNickname
@ -154,7 +151,7 @@ Popup {
delegate: Item {
id: notificationDelegate
width: parent.width
width: parent.availableWidth
height: notifLoader.active ? childrenRect.height : 0
property int idx: DelegateModel.itemsIndex
@ -188,7 +185,8 @@ Popup {
}
return -1;
}
property string previousNotificationTimestamp: notificationDelegate.idx === 0 ? "" : root.store.activityCenterList.getNotificationData(previousNotificationIndex, "timestamp")
readonly property string previousNotificationTimestamp: notificationDelegate.idx === 0 ? "" :
root.store.activityCenterList.getNotificationData(previousNotificationIndex, "timestamp")
onPreviousNotificationTimestampChanged: {
root.store.messageStore.prevMsgTimestamp = previousNotificationTimestamp;
}
@ -221,7 +219,7 @@ Popup {
ActivityCenterMessageComponentView {
id: activityCenterMessageView
store: root.store
acCurrentFilter: root.currentFilter
acCurrentActivityCategory: root.currentActivityCategory
chatSectionModule: root.chatSectionModule
messageContextMenu: root.messageContextMenu
hideReadNotifications: root.hideReadNotifications
@ -244,7 +242,7 @@ Popup {
ActivityCenterGroupRequest {
store: root.store
hideReadNotifications: root.hideReadNotifications
acCurrentFilterAll: root.currentFilter === ActivityCenter.Filter.All
acCurrentActivityCategoryAll: root.currentActivityCategory === ActivityCenter.ActivityCategory.All
}
}
}

4
ui/app/AppLayouts/Chat/views/ActivityCenterGroupRequest.qml
View File

@ -23,7 +23,7 @@ Item {
property int previousNotificationIndex
property int previousNotificationTimestamp
property bool hideReadNotifications: false
property bool acCurrentFilterAll: false
property bool acCurrentActivityCategoryAll: false
StatusDateGroupLabel {
id: dateGroupLbl
@ -47,7 +47,7 @@ Item {
return false
}
return acCurrentFilterAll;
return acCurrentActivityCategoryAll;
}
width: parent.width
height: visible ? 60 : 0

10
ui/app/AppLayouts/Chat/views/ActivityCenterMessageComponentView.qml
View File

@ -24,14 +24,14 @@ Item {
if (hideReadNotifications && model.read) {
return false
}
return acCurrentFilter === ActivityCenterPopup.Filter.All ||
(model.notificationType === Constants.activityCenterNotificationTypeMention && acCurrentFilter === ActivityCenterPopup.Filter.Mentions) ||
(model.notificationType === Constants.activityCenterNotificationTypeOneToOne && acCurrentFilter === ActivityCenterPopup.Filter.ContactRequests) ||
(model.notificationType === Constants.activityCenterNotificationTypeReply && acCurrentFilter === ActivityCenterPopup.Filter.Replies)
return acCurrentActivityCategory === ActivityCenterPopup.ActivityCategory.All ||
(model.notificationType === Constants.activityCenterNotificationTypeMention && acCurrentActivityCategory === ActivityCenterPopup.ActivityCategory.Mentions) ||
(model.notificationType === Constants.activityCenterNotificationTypeOneToOne && acCurrentActivityCategory === ActivityCenterPopup.ActivityCategory.ContactRequests) ||
(model.notificationType === Constants.activityCenterNotificationTypeReply && acCurrentActivityCategory === ActivityCenterPopup.ActivityCategory.Replies)
}
property var store
property int acCurrentFilter
property int acCurrentActivityCategory
property var chatSectionModule
property int previousNotificationIndex
property bool hideReadNotifications