diff --git a/ui/StatusQ/src/StatusQ/Core/StatusBaseText.qml b/ui/StatusQ/src/StatusQ/Core/StatusBaseText.qml index a07c7519de..dc8a3cf55e 100644 --- a/ui/StatusQ/src/StatusQ/Core/StatusBaseText.qml +++ b/ui/StatusQ/src/StatusQ/Core/StatusBaseText.qml @@ -28,4 +28,6 @@ import StatusQ.Core.Theme 0.1 Text { font.family: Theme.palette.baseFont.name color: Theme.palette.directColor1 + linkColor: hoveredLink ? Qt.lighter(Theme.palette.primaryColor1) + : Theme.palette.primaryColor1 } diff --git a/ui/app/AppLayouts/CommunitiesPortal/popups/CreateCommunityPopup.qml b/ui/app/AppLayouts/CommunitiesPortal/popups/CreateCommunityPopup.qml index 9d7a78679b..4cfbba39af 100644 --- a/ui/app/AppLayouts/CommunitiesPortal/popups/CreateCommunityPopup.qml +++ b/ui/app/AppLayouts/CommunitiesPortal/popups/CreateCommunityPopup.qml @@ -162,7 +162,6 @@ StatusStackModal { Layout.topMargin: 8 Layout.alignment: Qt.AlignHCenter horizontalAlignment: Qt.AlignHCenter - linkColor: hoveredLink ? Qt.lighter(Theme.palette.primaryColor1) : Theme.palette.primaryColor1 text: qsTr("Export your Discord JSON data using %1") .arg("DiscordChatExporter") onLinkActivated: Global.openLink(link) @@ -178,7 +177,6 @@ StatusStackModal { StatusBaseText { Layout.alignment: Qt.AlignHCenter horizontalAlignment: Qt.AlignHCenter - linkColor: hoveredLink ? Qt.lighter(Theme.palette.primaryColor1) : Theme.palette.primaryColor1 text: qsTr("Refer to this wiki if you have any queries") onLinkActivated: Global.openLink(link) HoverHandler { diff --git a/ui/app/AppLayouts/Profile/popups/ENSPopup.qml b/ui/app/AppLayouts/Profile/popups/ENSPopup.qml index ed4c33de68..485455e083 100644 --- a/ui/app/AppLayouts/Profile/popups/ENSPopup.qml +++ b/ui/app/AppLayouts/Profile/popups/ENSPopup.qml @@ -4,66 +4,72 @@ import QtQuick.Layouts 1.3 import QtQml.Models 2.3 import StatusQ.Core 0.1 +import StatusQ.Core.Theme 0.1 +import StatusQ.Controls 0.1 +import StatusQ.Popups.Dialog 0.1 import utils 1.0 import shared 1.0 import shared.panels 1.0 import shared.popups 1.0 -// TODO: replace with StatusModal -ModalPopup { - id: popup - - title: qsTr("Primary username") +StatusDialog { + id: root property var ensUsernamesStore - property string newUsername: "" - onOpened: { - for(var i in ensNames.contentItem.children){ - ensNames.contentItem.children[i].checked = ensNames.contentItem.children[i].text === popup.ensUsernamesStore.preferredUsername - } + title: qsTr("Primary username") + standardButtons: Dialog.ApplyRole + implicitWidth: 400 + + onApplied: { + console.log("applied!") + ensUsernamesStore.setPrefferedEnsUsername(d.newUsername); + close(); } - StyledText { - id: lbl1 - text: popup.ensUsernamesStore.preferredUsername ? - qsTr("Your messages are displayed to others with this username:") - : - qsTr("Once you select a username, you won’t be able to disable it afterwards. You will only be able choose a different username to display.") - font.pixelSize: 15 - wrapMode: Text.WordWrap - width: parent.width + QtObject { + id: d + + property string newUsername: "" } - StyledText { - id: lbl2 - anchors.top: lbl1.bottom - anchors.topMargin: Style.current.padding - text: popup.ensUsernamesStore.preferredUsername - font.pixelSize: 17 - font.weight: Font.Bold - } - - StatusScrollView { + ColumnLayout { anchors.fill: parent - anchors.top: lbl2.bottom - anchors.topMargin: 70 - Layout.fillWidth: true - Layout.fillHeight: true + spacing: Style.current.padding - ScrollBar.horizontal.policy: ScrollBar.AlwaysOff - ScrollBar.vertical.policy: ensNames.contentHeight > ensNames.height ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff + StyledText { + Layout.fillWidth: true + text: root.ensUsernamesStore.preferredUsername ? + qsTr("Your messages are displayed to others with this username:") + : + qsTr("Once you select a username, you won’t be able to disable it afterwards. You will only be able choose a different username to display.") + font.pixelSize: 15 + wrapMode: Text.WordWrap + } + + StyledText { + visible: root.ensUsernamesStore.preferredUsername + text: root.ensUsernamesStore.preferredUsername + font.pixelSize: 17 + font.weight: Font.Bold + } StatusListView { - anchors.fill: parent + id: ensNamesListView + + Layout.fillWidth: true + Layout.fillHeight: true + implicitHeight: contentHeight + model: root.ensUsernamesStore.ensUsernamesModel - spacing: 0 - id: ensNames + delegate: RadioDelegate { id: radioDelegate + + width: ListView.view.width text: ensUsername - checked: popup.ensUsernamesStore.preferredUsername === ensUsername + checked: root.ensUsernamesStore.preferredUsername === ensUsername contentItem: StyledText { color: Style.current.textColor @@ -76,65 +82,12 @@ ModalPopup { anchors.fill: parent onClicked: { parent.checked = true - newUsername = ensUsername; + d.newUsername = ensUsername; } } } } } - onNewUsernameChanged: { - btnSelectPreferred.state = newUsername === popup.ensUsernamesStore.preferredUsername ? "inactive" : "active" - } - - footer: Item { - width: parent.width - height: btnSelectPreferred.height - - Button { - id: btnSelectPreferred - width: 44 - height: 44 - anchors.bottom: parent.bottom - anchors.right: parent.right - state: "inactive" - states: [ - State { - name: "inactive" - PropertyChanges { - target: btnContinue - source: Style.svg("arrow-right-btn-inactive") - } - }, - State { - name: "active" - PropertyChanges { - target: btnContinue - source: Style.svg("arrow-right-btn-active") - } - } - ] - - SVGImage { - id: btnContinue - width: 50 - height: 50 - } - background: Rectangle { - color: "transparent" - } - MouseArea { - cursorShape: btnSelectPreferred.state === "active" ? Qt.PointingHandCursor : Qt.ArrowCursor - anchors.fill: parent - onClicked : { - if(btnSelectPreferred.state === "active"){ - popup.ensUsernamesStore.setPrefferedEnsUsername(newUsername); - newUsername = ""; - popup.close(); - } - } - } - } - } } diff --git a/ui/app/AppLayouts/Profile/views/EnsListView.qml b/ui/app/AppLayouts/Profile/views/EnsListView.qml index 93afd57b3d..0d97565f8b 100644 --- a/ui/app/AppLayouts/Profile/views/EnsListView.qml +++ b/ui/app/AppLayouts/Profile/views/EnsListView.qml @@ -5,6 +5,7 @@ import QtQuick.Controls 2.14 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import StatusQ.Controls 0.1 +import StatusQ.Components 0.1 import shared 1.0 import shared.panels 1.0 @@ -17,30 +18,32 @@ import "../popups" Item { id: root - signal addBtnClicked() - signal selectEns(string username) property var ensUsernamesStore property int profileContentWidth - // Defaults to show message - property bool isMessage: true - property bool isEmoji: false - property bool isCurrentUser: false - property int contentType: 1 - property string message: qsTr("Hey") - property string authorCurrentMsg: "0" - property string authorPrevMsg: "1" - property bool isText: true - property var clickMessage: function(){} + signal addBtnClicked() + signal selectEns(string username) - function shouldDisplayExampleMessage(){ - return root.ensUsernamesStore.ensUsernamesModel.count > 0 && - root.ensUsernamesStore.numOfPendingEnsUsernames() !== root.ensUsernamesStore.ensUsernamesModel && - store.ensUsernamesStore.preferredUsername !== "" + + QtObject { + id: d + + function shouldDisplayExampleMessage(){ + return root.ensUsernamesStore.ensUsernamesModel.count > 0 && + root.ensUsernamesStore.numOfPendingEnsUsernames() !== root.ensUsernamesStore.ensUsernamesModel && + store.ensUsernamesStore.preferredUsername !== "" + } + } + + Connections { + target: root.ensUsernamesStore.ensUsernamesModule + onUsernameConfirmed: { + messagesShownAs.updateVisibility() + chatSettingsLabel.visible = true + } } - anchors.fill: parent Item { anchors.top: parent.top @@ -124,11 +127,6 @@ Item { } } - ENSPopup { - id: ensPopup - ensUsernamesStore: root.ensUsernamesStore - } - StatusBaseText { id: sectionTitle text: qsTr("ENS usernames") @@ -226,7 +224,7 @@ Item { width: childrenRect.width height: childrenRect.height - id: preferredUsername + id: primaryUsernameItem anchors.left: parent.left anchors.top: chatSettingsLabel.bottom anchors.topMargin: 24 @@ -253,94 +251,59 @@ Item { MouseArea { anchors.fill: parent cursorShape: Qt.PointingHandCursor - onClicked: ensPopup.open() + onClicked: { + Global.openPopup(ensPopupComponent) + } } } - Item { + StatusMessage { id: messagesShownAs - visible: shouldDisplayExampleMessage() - anchors.top: !visible ? separator.bottom : preferredUsername.bottom + + function updateVisibility() { +// visible = d.shouldDisplayExampleMessage() + } + + Component.onCompleted: { + updateVisibility() + } + + anchors.top: !visible ? separator.bottom : primaryUsernameItem.bottom anchors.topMargin: Style.current.padding * 2 - UserImage { - id: chatImage - anchors.left: parent.left - anchors.leftMargin: Style.current.padding - anchors.top: parent.top - anchors.topMargin: 20 + timestamp: new Date().getTime() + disableHover: true + hideQuickActions: true + profileClickable: false - image: root.ensUsernamesStore.icon - - onClicked: root.parent.clickMessage(true, false, false, null, false, false, false) - } - - UsernameLabel { - id: chatName - anchors.leftMargin: 20 - anchors.top: parent.top - anchors.topMargin: 0 - anchors.left: chatImage.right - - displayName: "@" + (root.ensUsernamesStore.preferredUsername.replace(".stateofus.eth", "")) - localName: "" - amISender: true - } - - Rectangle { - property int chatVerticalPadding: 7 - property int chatHorizontalPadding: 12 - id: chatBox - color: Style.current.secondaryBackground - height: 35 - width: 80 - radius: 16 - anchors.left: chatImage.right - anchors.leftMargin: 8 - anchors.top: chatImage.top - - ChatTextView { - id: chatText - message: root.message - anchors.top: parent.top - anchors.topMargin: chatBox.chatVerticalPadding - anchors.left: parent.left - anchors.leftMargin: chatBox.chatHorizontalPadding - width: parent.width - anchors.right: parent.right - store: root.store - } - - RectangleCorner {} - } - - ChatTimePanel { - id: chatTime - anchors.top: chatBox.bottom - anchors.topMargin: 4 - anchors.bottomMargin: Style.current.padding - anchors.right: chatBox.right - anchors.rightMargin: Style.current.padding - timestamp: new Date().getTime() - visible: true - } - - StatusBaseText { - anchors.top: chatTime.bottom - anchors.left: chatImage.left - anchors.topMargin: Style.current.padding - text: qsTr("You’re displaying your ENS username in chats") - font.pixelSize: 14 - color: Theme.palette.baseColor1 + messageDetails: StatusMessageDetails { + contentType: StatusMessage.ContentType.Text + messageText: qsTr("Hey!") + amISender: false + sender.displayName: root.ensUsernamesStore.preferredUsername + // displayName: "@" + (root.ensUsernamesStore.preferredUsername.replace(".stateofus.eth", "")) + sender.profileImage.assetSettings.isImage: true + sender.profileImage.name: root.ensUsernamesStore.icon } } + StatusBaseText { + anchors.top: messagesShownAs.bottom + anchors.left: messagesShownAs.left + anchors.topMargin: Style.current.padding + text: qsTr("You’re displaying your ENS username in chats") + font.pixelSize: 14 + color: Theme.palette.baseColor1 + } + } - Connections { - target: root.ensUsernamesStore.ensUsernamesModule - onUsernameConfirmed: { - messagesShownAs.visible = shouldDisplayExampleMessage() - chatSettingsLabel.visible = true + Component { + id: ensPopupComponent + + ENSPopup { + ensUsernamesStore: root.ensUsernamesStore + onClosed: { + destroy() } } } diff --git a/ui/app/AppLayouts/Profile/views/EnsSearchView.qml b/ui/app/AppLayouts/Profile/views/EnsSearchView.qml index 2277ad7abd..baa44f0d1b 100644 --- a/ui/app/AppLayouts/Profile/views/EnsSearchView.qml +++ b/ui/app/AppLayouts/Profile/views/EnsSearchView.qml @@ -5,6 +5,7 @@ import QtQuick.Controls 2.14 import StatusQ.Core 0.1 import StatusQ.Core.Theme 0.1 import StatusQ.Controls 0.1 as StatusQControls +import StatusQ.Components 0.1 import utils 1.0 import shared 1.0 @@ -142,7 +143,6 @@ Item { color: Theme.palette.primaryColor1 SVGImage { - id: imgIcon visible: ensStatus === Constants.ens_taken fillMode: Image.PreserveAspectFit source: Style.svg("block-icon-white") @@ -221,8 +221,6 @@ Item { type: StatusQControls.StatusRoundButton.Type.Secondary objectName: "ensNextButton" icon.name: "arrow-right" - icon.width: 18 - icon.height: 14 visible: valid onClicked: { if(!valid) return; diff --git a/ui/app/AppLayouts/Profile/views/profile/MyProfileSettingsView.qml b/ui/app/AppLayouts/Profile/views/profile/MyProfileSettingsView.qml index 08fda81f0b..6ed8076acb 100644 --- a/ui/app/AppLayouts/Profile/views/profile/MyProfileSettingsView.qml +++ b/ui/app/AppLayouts/Profile/views/profile/MyProfileSettingsView.qml @@ -35,7 +35,8 @@ ColumnLayout { property url profileLargeImage: profileHeader.previewIcon } - readonly property bool dirty: descriptionPanel.displayName.text !== profileStore.displayName || + readonly property bool dirty: (!descriptionPanel.isEnsName && + descriptionPanel.displayName.text !== profileStore.displayName) || descriptionPanel.bio.text !== profileStore.bio || profileStore.socialLinksDirty || biometricsSwitch.checked !== biometricsSwitch.currentStoredValue || @@ -53,7 +54,8 @@ ColumnLayout { } function save() { - profileStore.setDisplayName(descriptionPanel.displayName.text) + if (!descriptionPanel.isEnsName) + profileStore.setDisplayName(descriptionPanel.displayName.text) profileStore.setBio(descriptionPanel.bio.text) profileStore.saveSocialLinks() if (profileHeader.icon === "") { @@ -121,15 +123,20 @@ ColumnLayout { ProfileDescriptionPanel { id: descriptionPanel - Layout.fillWidth: true + readonly property bool isEnsName: profileStore.ensName function reevaluateSocialLinkInputs() { socialLinksModel = null socialLinksModel = staticSocialLinksSubsetModel } - displayName.text: profileStore.displayName - displayName.validationMode: StatusInput.ValidationMode.Always + Layout.fillWidth: true + + displayName.focus: !isEnsName + displayName.input.edit.readOnly: isEnsName + displayName.text: profileStore.ensName || profileStore.displayName + displayName.validationMode: isEnsName ? StatusInput.ValidationMode.None : StatusInput.ValidationMode.Always + displayName.validators: isEnsName ? [] : Constants.validators.displayName bio.text: profileStore.bio socialLinksModel: staticSocialLinksSubsetModel diff --git a/ui/imports/shared/views/chat/ChatTextView.qml b/ui/imports/shared/views/chat/ChatTextView.qml deleted file mode 100644 index d14247817c..0000000000 --- a/ui/imports/shared/views/chat/ChatTextView.qml +++ /dev/null @@ -1,189 +0,0 @@ -import QtQuick 2.13 -import QtGraphicalEffects 1.0 - -import shared 1.0 -import shared.panels 1.0 -import shared.controls 1.0 -import utils 1.0 - -import StatusQ.Core.Utils 0.1 as StatusQUtils - -Item { - id: root - - property string message: "" - property var store - property bool longChatText: true - property bool veryLongChatText: globalUtils.plainText(message).length > Constants.limitLongChatTextCompactMode - property bool readMore: false - property alias textField: chatText - - signal linkActivated(url link) - property alias hoveredLink: chatText.hoveredLink - property bool linkHovered: chatText.hoveredLink !== "" - - z: 51 - - implicitHeight: { - if (!visible) - return 0; - if (!chatText.visible && showMoreLoader.active) - return childrenRect.height - 10; - if (root.veryLongChatText && !root.readMore) - return Math.min(chatText.contentHeight, 200); - if (chatText.getText(0, chatText.text.length) !== "") - return chatText.contentHeight; - return 0; - } - - // This function is to avoid the binding loop warning - function setWidths() { - if (longChatText) { - root.width = 0; - chatText.width = Qt.binding(function () {return root.width}) - } else { - chatText.width = Qt.binding(function () {return chatText.implicitWidth}) - root.width = Qt.binding(function () {return chatText.width}) - } - } - - Component.onCompleted: { - root.setWidths() - } - - StyledTextEdit { - id: chatText - objectName: "chatText" - textFormat: Text.RichText - wrapMode: Text.Wrap - font.pixelSize: Style.current.primaryTextFontSize - readOnly: true - selectByMouse: true - color: Style.current.textColor - clip: height < implicitHeight - onLinkActivated: { - root.linkActivated(link) - - // Not Refactored Yet -// if(link.startsWith("#")) { -// const channelName = link.substring(1); -// const foundChannelObj = root.store.chatsModelInst.getChannel(channelName); - -// if (!foundChannelObj) -// { -// root.store.chatsModelInst.channelView.joinPublicChat(channelName) -// if(root.store.chatsModelInst.communities.activeCommunity.active) -// { -// root.store.chatsModelInst.channelView.joinPublicChat(channelName) -// Global.changeAppSectionBySectionType(Constants.appSection.chat) -// } -// return -// } - -// let obj = JSON.parse(foundChannelObj) - -// if(obj.chatType === -1 || obj.chatType === Constants.chatTypePublic) -// { -// if(root.store.chatsModelInst.communities.activeCommunity.active) { -// root.store.chatsModelInst.channelView.joinPublicChat(channelName) -// Global.changeAppSectionBySectionType(Constants.appSection.chat) -// } -// root.store.chatsModelInst.channelView.setActiveChannel(channelName); -// } -// else if(obj.communityId === root.store.chatsModelInst.communities.activeCommunity.id && -// obj.chatType === Constants.chatTypeCommunity && -// root.store.chatsModelInst.channelView.activeChannel.id !== obj.id -// ) -// { -// root.store.chatsModelInst.channelView.setActiveChannel(channelName); -// } - -// return -// } - - if (link.startsWith('//')) { - let pk = link.replace("//", ""); - Global.openProfilePopup(pk) - return; - } - - // Not Refactored Yet -// const data = Utils.getLinkDataForStatusLinks(link) -// if (data && data.callback) { -// return data.callback() -// } - - - Global.openLink(link) - } - - onLinkHovered: { - cursorShape: Qt.PointingHandCursor - } - - text: { - if (contentType === Constants.messageContentType.stickerType) - return ""; - let msg = StatusQUtils.Utils.linkifyAndXSS(message); - if (isEmoji) - return StatusQUtils.Emoji.parse(msg, StatusQUtils.Emoji.size.middle, StatusQUtils.Emoji.format.png); - if (isEdited) { - let index = msg.endsWith("code>") ? msg.length : msg.length - 4 - return StatusQUtils.Utils.getMessageWithStyle(StatusQUtils.Emoji.parse(msg.slice(0, index) + Constants.editLabel + msg.slice(index)), isCurrentUser, hoveredLink) - } - return StatusQUtils.Utils.getMessageWithStyle(StatusQUtils.Emoji.parse(msg), isCurrentUser, hoveredLink) - } - } - - Loader { - id: mask - anchors.fill: chatText - active: showMoreLoader.active - visible: false - sourceComponent: LinearGradient { - start: Qt.point(0, 0) - end: Qt.point(0, chatText.height) - gradient: Gradient { - GradientStop { position: 0.0; color: "white" } - GradientStop { position: 0.85; color: "white" } - GradientStop { position: 1; color: "transparent" } - } - } - } - - Loader { - id: opMask - active: showMoreLoader.active && !root.readMore - anchors.fill: chatText - sourceComponent: OpacityMask { - source: chatText - maskSource: mask - } - } - - Loader { - id: showMoreLoader - active: root.veryLongChatText - anchors.top: chatText.bottom - anchors.topMargin: - Style.current.padding - anchors.horizontalCenter: parent.horizontalCenter - sourceComponent: Component { - SVGImage { - id: emojiImage - width: 256 - height: 44 - fillMode: Image.PreserveAspectFit - source: Style.svg("read-more") - z: 100 - rotation: root.readMore ? 180 : 0 - MouseArea { - anchors.fill: parent - cursorShape: Qt.PointingHandCursor - onClicked: { - root.readMore = !root.readMore - } - } - } - } - } -} diff --git a/ui/imports/shared/views/chat/qmldir b/ui/imports/shared/views/chat/qmldir index 0567c4845e..d64318bf16 100644 --- a/ui/imports/shared/views/chat/qmldir +++ b/ui/imports/shared/views/chat/qmldir @@ -1,6 +1,5 @@ AcceptTransactionView 1.0 AcceptTransactionView.qml ChannelIdentifierView 1.0 ChannelIdentifierView.qml -ChatTextView 1.0 ChatTextView.qml CompactMessageView 1.0 CompactMessageView.qml InvitationBubbleView 1.0 InvitationBubbleView.qml LinksMessageView 1.0 LinksMessageView.qml