diff --git a/ui/app/AppLayouts/Chat/views/ChatColumnView.qml b/ui/app/AppLayouts/Chat/views/ChatColumnView.qml index 0b89aa2611..5690f2c7b0 100644 --- a/ui/app/AppLayouts/Chat/views/ChatColumnView.qml +++ b/ui/app/AppLayouts/Chat/views/ChatColumnView.qml @@ -42,6 +42,7 @@ Item { property bool isExtendedInput: isReply || isImage property bool isConnected: false property string contactToRemove: "" + property bool isSectionActive: mainModule.activeSection.id === parentModule.getMySectionId() property string activeChatId: parentModule && parentModule.activeItem.id property string activeSubItemId: parentModule && parentModule.activeItem.activeSubItem.id property string activeChatType: parentModule && parentModule.activeItem.type @@ -148,18 +149,7 @@ Item { delegate: ChatContentView { width: parent.width clip: true - height: { - // dynamically calculate the height of the view, if the active one is the current one - // then set the height to parent otherwise set it to 0 - if(!chatContentModule) - return 0 - - let myChatId = chatContentModule.getMyChatId() - if(myChatId === root.activeChatId || myChatId === root.activeSubItemId) - return parent.height - - return 0 - } + height: isActiveChannel ? parent.height : 0 rootStore: root.rootStore contactsStore: root.contactsStore sendTransactionNoEnsModal: cmpSendTransactionNoEns @@ -167,6 +157,18 @@ Item { sendTransactionWithEnsModal: cmpSendTransactionWithEns stickersLoaded: root.stickersLoaded isBlocked: model.blocked + isActiveChannel: { + // dynamically calculate the height of the view, if the active one is the current one + // then set the height to parent otherwise set it to 0 + if(!chatContentModule || !isSectionActive) + return false + + let myChatId = chatContentModule.getMyChatId() + if(myChatId === root.activeChatId || myChatId === root.activeSubItemId) + return true + + return false + } Component.onCompleted: { parentModule.prepareChatContentModuleForChatId(model.itemId) chatContentModule = parentModule.getChatContentModule() @@ -178,18 +180,7 @@ Item { delegate: ChatContentView { width: parent.width clip: true - height: { - // dynamically calculate the height of the view, if the active one is the current one - // then set the height to parent otherwise set it to 0 - if(!chatContentModule) - return 0 - - let myChatId = chatContentModule.getMyChatId() - if(myChatId === root.activeChatId || myChatId === root.activeSubItemId) - return parent.height - - return 0 - } + height: isActiveChannel ? parent.height : 0 rootStore: root.rootStore contactsStore: root.contactsStore sendTransactionNoEnsModal: cmpSendTransactionNoEns @@ -197,6 +188,18 @@ Item { sendTransactionWithEnsModal: cmpSendTransactionWithEns stickersLoaded: root.stickersLoaded isBlocked: model.blocked + isActiveChannel: { + // dynamically calculate the height of the view, if the active one is the current one + // then set the height to parent otherwise set it to 0 + if(!chatContentModule || !isSectionActive) + return false + + let myChatId = chatContentModule.getMyChatId() + if(myChatId === root.activeChatId || myChatId === root.activeSubItemId) + return true + + return false + } Component.onCompleted: { parentModule.prepareChatContentModuleForChatId(itemId) chatContentModule = parentModule.getChatContentModule() diff --git a/ui/app/AppLayouts/Chat/views/ChatContentView.qml b/ui/app/AppLayouts/Chat/views/ChatContentView.qml index 9f7f4b1029..480ec69998 100644 --- a/ui/app/AppLayouts/Chat/views/ChatContentView.qml +++ b/ui/app/AppLayouts/Chat/views/ChatContentView.qml @@ -31,6 +31,7 @@ ColumnLayout { property var chatContentModule property var rootStore property var contactsStore + property bool isActiveChannel: false property UsersStore usersStore: UsersStore {} onChatContentModuleChanged: { @@ -416,6 +417,7 @@ ColumnLayout { } messageContextMenu: contextmenu isContactBlocked: chatContentRoot.isBlocked + isActiveChannel: chatContentRoot.isActiveChannel chatInputPlaceholder: chatContentRoot.isBlocked ? //% "This user has been blocked." qsTrId("this-user-has-been-blocked-") : diff --git a/ui/app/AppMain.qml b/ui/app/AppMain.qml index b6760749f8..dbe8789c49 100644 --- a/ui/app/AppMain.qml +++ b/ui/app/AppMain.qml @@ -32,6 +32,7 @@ Item { anchors.fill: parent property alias appLayout: appLayout + property alias dragAndDrop: dragTarget property RootStore rootStore: RootStore { } // set from main.qml property var sysPalette @@ -645,6 +646,93 @@ Item { } } + + DropArea { + id: dragTarget + + signal droppedOnValidScreen(var drop) + property alias droppedUrls: rptDraggedPreviews.model + property var chatCommunitySectionModule: chatLayoutContainer.rootStore.chatCommunitySectionModule + property int activeChatType: chatCommunitySectionModule && chatCommunitySectionModule.activeItem.type + property bool enabled: !drag.source && !!loader.item && !!loader.item.appLayout + && ( + // in chat view + (mainModule.activeSection.sectionType === Constants.appSection.chat && + ( + // in a one-to-one chat + activeChatType === Constants.chatType.oneToOne || + // in a private group chat + activeChatType === Constants.chatType.privateGroupChat + ) + ) || + // In community section + mainModule.activeSection.sectionType === Constants.appSection.community + ) + + width: appMain.width + height: appMain.height + + function cleanup() { + rptDraggedPreviews.model = [] + } + + onDropped: (drop) => { + if (enabled) { + droppedOnValidScreen(drop) + } else { + drop.accepted = false + } + cleanup() + } + onEntered: { + if (!enabled || !!drag.source) { + drag.accepted = false + return + } + + // needed because drag.urls is not a normal js array + rptDraggedPreviews.model = drag.urls.filter(img => Utils.hasDragNDropImageExtension(img)) + } + onPositionChanged: { + rptDraggedPreviews.x = drag.x + rptDraggedPreviews.y = drag.y + } + onExited: cleanup() + Rectangle { + id: dropRectangle + + width: parent.width + height: parent.height + color: Style.current.transparent + opacity: 0.8 + + states: [ + State { + when: dragTarget.enabled && dragTarget.containsDrag + PropertyChanges { + target: dropRectangle + color: Style.current.background + } + } + ] + } + Repeater { + id: rptDraggedPreviews + + Image { + source: modelData + width: 80 + height: 80 + sourceSize.width: 160 + sourceSize.height: 160 + fillMode: Image.PreserveAspectFit + x: index * 10 + rptDraggedPreviews.x + y: index * 10 + rptDraggedPreviews.y + z: 1 + } + } + } + // Add SendModal here as it is used by the Wallet as well as the Browser Loader { id: sendModal @@ -759,6 +847,7 @@ Item { } Component.onCompleted: { + Global.appMain = this; const whitelist = appMain.rootStore.privacyStore.getLinkPreviewWhitelist() try { const whiteListedSites = JSON.parse(whitelist) diff --git a/ui/imports/shared/status/StatusChatInput.qml b/ui/imports/shared/status/StatusChatInput.qml index 086e0e2163..bf96d3b6eb 100644 --- a/ui/imports/shared/status/StatusChatInput.qml +++ b/ui/imports/shared/status/StatusChatInput.qml @@ -40,6 +40,7 @@ Rectangle { property bool isImage: false property bool isEdit: false property bool isContactBlocked: false + property bool isActiveChannel: false property var recentStickers property var stickerPackList @@ -591,7 +592,8 @@ Rectangle { } Connections { - target: Global.applicationWindow.dragAndDrop + enabled: control.isActiveChannel + target: Global.appMain.dragAndDrop onDroppedOnValidScreen: (drop) => { let validImages = validateImages(drop.urls) if (validImages.length > 0) { diff --git a/ui/imports/utils/Global.qml b/ui/imports/utils/Global.qml index 5c96f5aec4..ac251ed6e4 100644 --- a/ui/imports/utils/Global.qml +++ b/ui/imports/utils/Global.qml @@ -7,6 +7,7 @@ QtObject { id: root property var applicationWindow + property var appMain property bool popupOpened: false property int settingsSubsection: Constants.settingsSubsection.profile property var errorSound diff --git a/ui/main.qml b/ui/main.qml index e829dc83e5..8be55bc6a4 100644 --- a/ui/main.qml +++ b/ui/main.qml @@ -21,7 +21,6 @@ import "./app" StatusWindow { property bool hasAccounts: startupModule.appState !== Constants.appState.onboarding - property alias dragAndDrop: dragTarget property bool displayBeforeGetStartedModal: !hasAccounts property bool appIsReady: false @@ -414,92 +413,6 @@ StatusWindow { anchors.fill: parent } - DropArea { - id: dragTarget - - signal droppedOnValidScreen(var drop) - property alias droppedUrls: rptDraggedPreviews.model - property bool enabled: !drag.source && !!loader.item && !!loader.item.appLayout - - // Not Refactored Yet -// && ( -// // in chat view -// (loader.item.appLayout.appView.currentIndex === Constants.appViewStackIndex.chat && -// ( -// // in a one-to-one chat -// chatsModel.channelView.activeChannel.chatType === Constants.chatType.oneToOne || -// // in a private group chat -// chatsModel.channelView.activeChannel.chatType === Constants.chatType.privateGroupChat -// ) -// ) || -// // In community section -// chatsModel.communities.activeCommunity.active -// ) - - width: applicationWindow.width - height: applicationWindow.height - - function cleanup() { - rptDraggedPreviews.model = [] - } - - onDropped: (drop) => { - if (enabled) { - droppedOnValidScreen(drop) - } else { - drop.accepted = false - } - cleanup() - } - onEntered: { - if (!enabled || !!drag.source) { - drag.accepted = false - return - } - - // needed because drag.urls is not a normal js array - rptDraggedPreviews.model = drag.urls.filter(img => Utils.hasDragNDropImageExtension(img)) - } - onPositionChanged: { - rptDraggedPreviews.x = drag.x - rptDraggedPreviews.y = drag.y - } - onExited: cleanup() - Rectangle { - id: dropRectangle - - width: parent.width - height: parent.height - color: Style.current.transparent - opacity: 0.8 - - states: [ - State { - when: dragTarget.enabled && dragTarget.containsDrag - PropertyChanges { - target: dropRectangle - color: Style.current.background - } - } - ] - } - Repeater { - id: rptDraggedPreviews - - Image { - source: modelData - width: 80 - height: 80 - sourceSize.width: 160 - sourceSize.height: 160 - fillMode: Image.PreserveAspectFit - x: index * 10 + rptDraggedPreviews.x - y: index * 10 + rptDraggedPreviews.y - z: 1 - } - } - } - Component { id: app AppMain {