From 1d074f25fd117a58e41c1b8111c48fb1994721f9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9bastien=20Blin?=
<sebastien.blin@savoirfairelinux.com>
Date: Tue, 7 Dec 2021 10:50:11 -0500
Subject: [PATCH] swarm details page: improve
GitLab: #340
Change-Id: I03becae1c33be5a6ab10452c6986d7b5abd009e3
---
src/constant/JamiStrings.qml | 3 +-
src/constant/JamiTheme.qml | 1 +
src/currentconversation.cpp | 2 +-
src/mainview/MainView.qml | 1 -
src/mainview/components/ChatView.qml | 1 +
src/mainview/components/FilterTabButton.qml | 42 +++-
src/mainview/components/SwarmDetailsPanel.qml | 213 ++++++++++++------
src/utilsadapter.cpp | 33 +++
src/utilsadapter.h | 7 +
9 files changed, 226 insertions(+), 77 deletions(-)
diff --git a/src/constant/JamiStrings.qml b/src/constant/JamiStrings.qml
index c12870f70..aa32169b2 100644
--- a/src/constant/JamiStrings.qml
+++ b/src/constant/JamiStrings.qml
@@ -613,7 +613,8 @@ Item {
// SwarmDetailsPanel
property string about: qsTr("About")
- property string members: qsTr("Members")
+ property string members: qsTr("%1 Members")
+ property string member: qsTr("Member")
property string documents: qsTr("Documents")
property string editTitle: qsTr("Edit title")
property string editDescription: qsTr("Edit description")
diff --git a/src/constant/JamiTheme.qml b/src/constant/JamiTheme.qml
index 510abcee5..335dc8aa9 100644
--- a/src/constant/JamiTheme.qml
+++ b/src/constant/JamiTheme.qml
@@ -55,6 +55,7 @@ Item {
property color selectedColor: darkTheme ? "#0e81c5" : "#e0e0e0"
property color editBackgroundColor: darkTheme ? "#373737" : lightGrey_
property color textColor: primaryForegroundColor
+ property color textColorHovered: darkTheme? "#cccccc" : "#333333"
property color tabbarBorderColor: darkTheme ? blackColor : "#e3e3e3"
property color popupOverlayColor: darkTheme ? Qt.rgba(255, 255, 255, 0.22) :
Qt.rgba(0, 0, 0, 0.33)
diff --git a/src/currentconversation.cpp b/src/currentconversation.cpp
index 21ee8f43c..53f98f4c8 100644
--- a/src/currentconversation.cpp
+++ b/src/currentconversation.cpp
@@ -52,7 +52,7 @@ CurrentConversation::updateData()
auto& convInfo = optConv->get();
set_title(accInfo.conversationModel->title(convId));
set_description(accInfo.conversationModel->description(convId));
- set_uris(accInfo.conversationModel->peersForConversation(convId).toList());
+ set_uris(convInfo.participants.toList());
set_isSwarm(convInfo.isSwarm());
set_isLegacy(convInfo.isLegacy());
set_isCoreDialog(convInfo.isCoreDialog());
diff --git a/src/mainview/MainView.qml b/src/mainview/MainView.qml
index 353ec1a05..9a4a7aaba 100644
--- a/src/mainview/MainView.qml
+++ b/src/mainview/MainView.qml
@@ -418,7 +418,6 @@ Rectangle {
visible: false
onCreateSwarmClicked: {
- console.warn("@@@")
backToMainView()
}
}
diff --git a/src/mainview/components/ChatView.qml b/src/mainview/components/ChatView.qml
index 1ff473931..0a4691ac9 100644
--- a/src/mainview/components/ChatView.qml
+++ b/src/mainview/components/ChatView.qml
@@ -43,6 +43,7 @@ Rectangle {
function focusChatView() {
chatViewFooter.textInput.forceActiveFocus()
+ swarmDetailsPanel.visible = false
}
color: JamiTheme.chatviewBgColor
diff --git a/src/mainview/components/FilterTabButton.qml b/src/mainview/components/FilterTabButton.qml
index 0aedda536..c17e2800b 100644
--- a/src/mainview/components/FilterTabButton.qml
+++ b/src/mainview/components/FilterTabButton.qml
@@ -31,21 +31,32 @@ TabButton {
property alias labelText: label.text
property alias acceleratorSequence: accelerator.sequence
property alias badgeCount: badge.count
+
+ property var backgroundColor: JamiTheme.backgroundColor
+ property var hoverColor: JamiTheme.backgroundColor
+ property var textColor: JamiTheme.textColor
+ property var textColorHovered: JamiTheme.textColorHovered
+ property var borderWidth: 2
+ property var bottomMargin: 1
+ property var underlineContentOnly: false
+ property var fontSize: JamiTheme.filterItemFontSize
+
signal selected
hoverEnabled: true
onClicked: selected()
- Rectangle {
+ Rectangle {
id: contentRect
anchors.fill: root
color: root.hovered ?
- JamiTheme.hoverColor :
- JamiTheme.backgroundColor
+ root.hoverColor :
+ root.backgroundColor
RowLayout {
+ id: informations
anchors.horizontalCenter: contentRect.horizontalCenter
anchors.verticalCenter: contentRect.verticalCenter
@@ -53,10 +64,14 @@ TabButton {
id: label
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
- Layout.bottomMargin: 1
-
- font.pointSize: JamiTheme.filterItemFontSize
- color: JamiTheme.textColor
+ Layout.bottomMargin: root.bottomMargin
+
+ font.pointSize: fontSize
+ color: {
+ if (!root.down && root.hovered)
+ return root.textColorHovered
+ return root.textColor
+ }
opacity: root.down ? 1.0 : 0.5
}
@@ -69,10 +84,17 @@ TabButton {
}
Rectangle {
- width: contentRect.width
+ width: underlineContentOnly ? informations.width + JamiTheme.menuBorderPreferredHeight : contentRect.width
+ anchors.horizontalCenter: contentRect.horizontalCenter
anchors.bottom: contentRect.bottom
- height: 2
- color: root.down ? JamiTheme.textColor : "transparent"
+ height: borderWidth
+ color: {
+ if (!root.down && root.hovered)
+ return root.textColorHovered
+ if (!root.down)
+ return "transparent"
+ return root.textColor
+ }
}
Shortcut {
diff --git a/src/mainview/components/SwarmDetailsPanel.qml b/src/mainview/components/SwarmDetailsPanel.qml
index 905eef8dd..986a167e5 100644
--- a/src/mainview/components/SwarmDetailsPanel.qml
+++ b/src/mainview/components/SwarmDetailsPanel.qml
@@ -33,96 +33,181 @@ Rectangle {
ColumnLayout {
id: swarmProfileDetails
- Layout.fillWidth: true
Layout.fillHeight: true
+ Layout.fillWidth: true
+ spacing: 0
- ConversationAvatar {
- id: conversationAvatar
+ ColumnLayout {
+ id: header
+ Layout.fillWidth: true
+ spacing: 0
- Layout.alignment: Qt.AlignCenter
- Layout.preferredWidth: JamiTheme.avatarSizeInCall
- Layout.preferredHeight: JamiTheme.avatarSizeInCall
+ ConversationAvatar {
+ id: conversationAvatar
- imageId: LRCInstance.selectedConvUid
+ Layout.alignment: Qt.AlignCenter
+ Layout.preferredWidth: JamiTheme.avatarSizeInCall
+ Layout.preferredHeight: JamiTheme.avatarSizeInCall
- showPresenceIndicator: false
- }
+ imageId: LRCInstance.selectedConvUid
- EditableLineEdit {
- id: titleLine
- Layout.alignment: Qt.AlignCenter
- Layout.topMargin: JamiTheme.preferredMarginSize
+ showPresenceIndicator: false
+ }
+
+ EditableLineEdit {
+ id: titleLine
+ Layout.alignment: Qt.AlignCenter
+ Layout.topMargin: JamiTheme.preferredMarginSize
- font.pointSize: JamiTheme.titleFontSize
+ font.pointSize: JamiTheme.titleFontSize
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
- text: CurrentConversation.title
- placeholderText: JamiStrings.editTitle
- placeholderTextColor: JamiTheme.placeholderTextColorWhite
- tooltipText: JamiStrings.editTitle
- backgroundColor: root.color
- color: "white"
+ text: CurrentConversation.title
+ placeholderText: JamiStrings.editTitle
+ placeholderTextColor: JamiTheme.placeholderTextColorWhite
+ tooltipText: JamiStrings.editTitle
+ backgroundColor: root.color
+ color: "white"
- onEditingFinished: {
- ConversationsAdapter.updateConversationTitle(LRCInstance.selectedConvUid, titleLine.text)
+ onEditingFinished: {
+ ConversationsAdapter.updateConversationTitle(LRCInstance.selectedConvUid, titleLine.text)
+ }
}
- }
- EditableLineEdit {
- id: descriptionLine
- Layout.alignment: Qt.AlignCenter
- Layout.topMargin: JamiTheme.preferredMarginSize
+ EditableLineEdit {
+ id: descriptionLine
+ Layout.alignment: Qt.AlignCenter
+ Layout.topMargin: JamiTheme.preferredMarginSize
+ Layout.bottomMargin: JamiTheme.preferredMarginSize
- font.pointSize: JamiTheme.titleFontSize
+ font.pointSize: JamiTheme.titleFontSize
- text: CurrentConversation.description
- placeholderText: JamiStrings.editDescription
- placeholderTextColor: JamiTheme.placeholderTextColorWhite
- tooltipText: JamiStrings.editDescription
- backgroundColor: root.color
- color: "white"
+ text: CurrentConversation.description
+ placeholderText: JamiStrings.editDescription
+ placeholderTextColor: JamiTheme.placeholderTextColorWhite
+ tooltipText: JamiStrings.editDescription
+ backgroundColor: root.color
+ color: "white"
- onEditingFinished: {
- ConversationsAdapter.updateConversationDescription(LRCInstance.selectedConvUid, descriptionLine.text)
+ onEditingFinished: {
+ ConversationsAdapter.updateConversationDescription(LRCInstance.selectedConvUid, descriptionLine.text)
+ }
+ }
+
+ TabBar {
+ id: tabBar
+
+ Layout.topMargin: JamiTheme.preferredMarginSize
+ Layout.preferredWidth: root.width
+ Layout.preferredHeight: membersTabButton.height
+
+ /*FilterTabButton {
+ id: aboutTabButton
+ backgroundColor: JamiTheme.buttonTintedBlue
+ hoverColor: JamiTheme.buttonTintedBlue
+ borderWidth: 4
+ bottomMargin: JamiTheme.preferredMarginSize
+ fontSize: JamiTheme.titleFontSize
+ underlineContentOnly: true
+
+ down: tabBar.currentIndex === 0
+ labelText: JamiStrings.about
+ }*/
+
+ FilterTabButton {
+ id: membersTabButton
+ backgroundColor: JamiTheme.buttonTintedBlue
+ hoverColor: JamiTheme.buttonTintedBlue
+ borderWidth: 4
+ bottomMargin: JamiTheme.preferredMarginSize
+ fontSize: JamiTheme.titleFontSize
+ underlineContentOnly: true
+
+ down: true//tabBar.currentIndex === 1
+ labelText: {
+ var membersNb = CurrentConversation.uris.length;
+ if (membersNb > 1)
+ return JamiStrings.members.arg(membersNb)
+ return JamiStrings.member
+ }
+ }
+
+ /*FilterTabButton {
+ id: documentsTabButton
+ backgroundColor: JamiTheme.buttonTintedBlue
+ hoverColor: JamiTheme.buttonTintedBlue
+ borderWidth: 4
+ bottomMargin: JamiTheme.preferredMarginSize
+ fontSize: JamiTheme.titleFontSize
+ underlineContentOnly: true
+
+ down: tabBar.currentIndex === 2
+ labelText: JamiStrings.documents
+ }*/
}
}
- TabBar {
- id: tabBar
+ Rectangle {
+ id: details
+ Layout.fillWidth: true
+ Layout.preferredHeight: root.height - header.height
+ color: JamiTheme.secondaryBackgroundColor
- currentIndex: 1
- Layout.preferredWidth: root.width
+ JamiListView {
+ id: members
+ anchors.fill: parent
+ spacing: JamiTheme.preferredMarginSize
+ anchors.topMargin: JamiTheme.preferredMarginSize
- FilterTabButton {
- id: aboutTabButton
+ model: CurrentConversation.uris
+ delegate: RowLayout {
+ spacing: 10
- down: tabBar.currentIndex === 0
- labelText: JamiStrings.about
- }
+ Avatar {
+ width: JamiTheme.smartListAvatarSize
+ height: JamiTheme.smartListAvatarSize
+ z: -index
- FilterTabButton {
- id: membersTabButton
+ imageId: CurrentAccount.uri == modelData ? CurrentAccount.id : modelData
+ showPresenceIndicator: UtilsAdapter.getContactPresence(CurrentAccount.id, modelData)
+ mode: CurrentAccount.uri == modelData ? Avatar.Mode.Account : Avatar.Mode.Contact
+ }
- down: tabBar.currentIndex === 1
- labelText: JamiStrings.members
- }
+ ElidedTextLabel {
+ id: bestName
- FilterTabButton {
- id: documentsTabButton
+ Layout.preferredWidth: JamiTheme.preferredFieldWidth
+ Layout.preferredHeight: JamiTheme.preferredFieldHeight
- down: tabBar.currentIndex === 2
- labelText: JamiStrings.documents
- }
- }
+ eText: UtilsAdapter.getContactBestName(CurrentAccount.id, modelData)
+ maxWidth: JamiTheme.preferredFieldWidth
-
- Rectangle {
- Layout.alignment: Qt.AlignCenter
- Layout.preferredWidth: root.width
- Layout.preferredHeight: root.height
- color: JamiTheme.secondaryBackgroundColor
+ font.pointSize: JamiTheme.participantFontSize
+ color: JamiTheme.primaryForegroundColor
+ font.kerning: true
+
+ verticalAlignment: Text.AlignVCenter
+ }
+
+ ElidedTextLabel {
+ id: role
+
+ Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+ eText: UtilsAdapter.getParticipantRole(CurrentAccount.id, CurrentConversation.id, modelData)
+ maxWidth: JamiTheme.preferredFieldWidth
+
+ font.pointSize: JamiTheme.participantFontSize
+ color: JamiTheme.textColorHovered
+ font.kerning: true
+
+ horizontalAlignment: Text.AlignRight
+ verticalAlignment: Text.AlignVCenter
+ }
+ }
+ }
}
}
}
diff --git a/src/utilsadapter.cpp b/src/utilsadapter.cpp
index 9417c3b72..7d493a7fa 100644
--- a/src/utilsadapter.cpp
+++ b/src/utilsadapter.cpp
@@ -471,3 +471,36 @@ UtilsAdapter::supportedLang()
}
return result;
}
+
+bool
+UtilsAdapter::getContactPresence(const QString& accountId, const QString& uri)
+{
+ try {
+ if (lrcInstance_->getAccountInfo(accountId).profileInfo.uri == uri)
+ return true; // It's the same account
+ auto info = lrcInstance_->getAccountInfo(accountId).contactModel->getContact(uri);
+ return info.isPresent;
+ } catch (...) {
+ }
+ return false;
+}
+
+QString
+UtilsAdapter::getContactBestName(const QString& accountId, const QString& uri)
+{
+ try {
+ if (lrcInstance_->getAccountInfo(accountId).profileInfo.uri == uri)
+ return lrcInstance_->accountModel().bestNameForAccount(
+ accountId); // It's the same account
+ return lrcInstance_->getAccountInfo(accountId).contactModel->bestNameForContact(uri);
+ } catch (...) {
+ }
+ return {};
+}
+
+QString
+UtilsAdapter::getParticipantRole(const QString& accountId, const QString& convId, const QString& uri)
+{
+ // TODO get role
+ return {};
+}
diff --git a/src/utilsadapter.h b/src/utilsadapter.h
index 2597278eb..eef62ed42 100644
--- a/src/utilsadapter.h
+++ b/src/utilsadapter.h
@@ -92,6 +92,13 @@ public:
Q_INVOKABLE void clearInteractionsCache(const QString& accountId, const QString& convUid);
Q_INVOKABLE QVariantMap supportedLang();
+ // For Swarm details page
+ Q_INVOKABLE bool getContactPresence(const QString& accountId, const QString& uri);
+ Q_INVOKABLE QString getContactBestName(const QString& accountId, const QString& uri);
+ Q_INVOKABLE QString getParticipantRole(const QString& accountId,
+ const QString& convId,
+ const QString& uri);
+
Q_SIGNALS:
void debugMessageReceived(const QString& message);
--
GitLab