feat: show toast message for transaction status changes
This commit is contained in:
parent
b0c9155e70
commit
103f02b289
|
@ -62,10 +62,7 @@ proc init*(self: WalletController) =
|
|||
|
||||
self.status.events.on(PendingTransactionType.WalletTransfer.confirmed) do(e: Args):
|
||||
let tx = TransactionMinedArgs(e)
|
||||
if tx.success:
|
||||
debug "SUCCESSS TRANSACTION", transactionHash = tx.transactionHash
|
||||
else:
|
||||
debug "ERROR TRANSACTION", revertReason = tx.revertReason
|
||||
self.view.transactionCompleted(tx.success, tx.transactionHash, tx.revertReason)
|
||||
|
||||
proc checkPendingTransactions*(self: WalletController) =
|
||||
self.status.wallet.checkPendingTransactions() # TODO: consider doing this in a spawnAndSend
|
||||
|
|
|
@ -562,3 +562,5 @@ QtObject:
|
|||
|
||||
proc ensResolved(self: WalletView, pubKey: string) {.slot.} =
|
||||
self.ensWasResolved(pubKey)
|
||||
|
||||
proc transactionCompleted*(self: WalletView, success: bool, txHash: string, revertReason: string = "") {.signal.}
|
||||
|
|
|
@ -248,6 +248,7 @@ ModalPopup {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
Connections {
|
||||
target: walletModel
|
||||
onTransactionWasSent: {
|
||||
|
@ -265,6 +266,9 @@ ModalPopup {
|
|||
}
|
||||
|
||||
toastMessage.title = qsTr("Transaction pending...")
|
||||
toastMessage.source = "../../img/loading.svg"
|
||||
toastMessage.iconColor = Style.current.primary
|
||||
toastMessage.iconRotates = true
|
||||
toastMessage.link = `${walletModel.etherscanLink}/${response.result}`
|
||||
toastMessage.open()
|
||||
root.close()
|
||||
|
@ -272,6 +276,19 @@ ModalPopup {
|
|||
console.error('Error parsing the response', e)
|
||||
}
|
||||
}
|
||||
onTransactionCompleted: {
|
||||
if (success) {
|
||||
toastMessage.title = qsTr("Transaction completed")
|
||||
toastMessage.source = "../../img/check-circle.svg"
|
||||
toastMessage.iconColor = Style.current.success
|
||||
} else {
|
||||
toastMessage.title = qsTr("Transaction failed")
|
||||
toastMessage.source = "../../img/block-icon.svg"
|
||||
toastMessage.iconColor = Style.current.danger
|
||||
}
|
||||
toastMessage.link = `${walletModel.etherscanLink}/${txHash}`
|
||||
toastMessage.open()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -38,7 +38,9 @@ Theme {
|
|||
property color backgroundHover: "#252528"
|
||||
property color secondaryText: darkGrey
|
||||
property color secondaryHover: tenPercentWhite
|
||||
property color primary: blue
|
||||
property color danger: red
|
||||
property color success: green
|
||||
property color primaryMenuItemHover: blue
|
||||
property color primaryMenuItemTextHover: almostBlack
|
||||
property color backgroundTertiary: tenPercentBlue
|
||||
|
|
|
@ -37,7 +37,9 @@ Theme {
|
|||
property color backgroundHover: grey
|
||||
property color secondaryText: darkGrey
|
||||
property color secondaryHover: tenPercentBlack
|
||||
property color primary: blue
|
||||
property color danger: red
|
||||
property color success: green
|
||||
property color primaryMenuItemHover: blue
|
||||
property color primaryMenuItemTextHover: white
|
||||
property color backgroundTertiary: tenPercentBlue
|
||||
|
|
|
@ -7,30 +7,61 @@ Rectangle {
|
|||
property alias source: roundedIconImage.source
|
||||
default property alias content: content.children
|
||||
property alias icon: roundedIconImage
|
||||
property bool rotates: false
|
||||
signal clicked
|
||||
width: 36
|
||||
height: 36
|
||||
property alias iconWidth: roundedIconImage.width
|
||||
property alias iconHeight: roundedIconImage.height
|
||||
property alias rotation: roundedIconImage.rotation
|
||||
property color iconColor: Style.current.transparent
|
||||
|
||||
color: Style.current.blue
|
||||
radius: width / 2
|
||||
|
||||
SVGImage {
|
||||
id: roundedIconImage
|
||||
width: 12
|
||||
height: 12
|
||||
Item {
|
||||
id: iconContainer
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: "../img/new_chat.svg"
|
||||
width: roundedIconImage.width
|
||||
height: roundedIconImage.height
|
||||
|
||||
SVGImage {
|
||||
id: roundedIconImage
|
||||
width: 12
|
||||
height: 12
|
||||
fillMode: Image.PreserveAspectFit
|
||||
source: "../img/new_chat.svg"
|
||||
}
|
||||
ColorOverlay {
|
||||
anchors.fill: roundedIconImage
|
||||
source: roundedIconImage
|
||||
color: root.iconColor
|
||||
}
|
||||
}
|
||||
|
||||
Loader {
|
||||
active: rotates
|
||||
sourceComponent: rotatorComponent
|
||||
}
|
||||
|
||||
Component {
|
||||
id: rotatorComponent
|
||||
RotationAnimator {
|
||||
target: iconContainer
|
||||
from: 0;
|
||||
to: 360;
|
||||
duration: 1200
|
||||
running: true
|
||||
loops: Animation.Infinite
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Item {
|
||||
id: content
|
||||
anchors.left: roundedIconImage.right
|
||||
anchors.leftMargin: 6 + (root.width - roundedIconImage.width)
|
||||
anchors.left: iconContainer.right
|
||||
anchors.leftMargin: 6 + (root.width - iconContainer.width)
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
|
|
|
@ -6,8 +6,11 @@ import "."
|
|||
|
||||
Popup {
|
||||
property url source: "../app/img/check-circle.svg"
|
||||
property color iconColor: Style.current.primary
|
||||
property bool iconRotates: false
|
||||
property string title: "Transaction pending..."
|
||||
property string linkText: qsTr("View on Etherscan")
|
||||
readonly property string defaultLinkText: qsTr("View on Etherscan")
|
||||
property string linkText: defaultLinkText
|
||||
property string link: "https://etherscan.io/"
|
||||
|
||||
id: root
|
||||
|
@ -24,6 +27,12 @@ Popup {
|
|||
root.close()
|
||||
}, 4000);
|
||||
}
|
||||
onClosed: {
|
||||
// Reset props
|
||||
iconColor = Style.current.primary
|
||||
iconRotates = false
|
||||
linkText = defaultLinkText
|
||||
}
|
||||
|
||||
Timer {
|
||||
id: timer
|
||||
|
@ -56,11 +65,13 @@ Popup {
|
|||
height: 32
|
||||
iconHeight: 20
|
||||
iconWidth: 20
|
||||
color: Style.current.secondaryBackground
|
||||
color: Utils.setColorAlpha(root.iconColor, 0.1)
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
source: root.source
|
||||
anchors.leftMargin: 12
|
||||
iconColor: root.iconColor
|
||||
rotates: root.iconRotates
|
||||
}
|
||||
|
||||
StyledText {
|
||||
|
|
Loading…
Reference in New Issue