Skip to content

Commit

Permalink
feat(@desktop/wallet): This commit is focussed on testing and adding …
Browse files Browse the repository at this point in the history
…dialog resizing for simple send

fixes #16836
  • Loading branch information
Khushboo-dev-cpp committed Dec 4, 2024
1 parent 4813503 commit ca23852
Show file tree
Hide file tree
Showing 10 changed files with 858 additions and 27 deletions.
382 changes: 371 additions & 11 deletions storybook/pages/SimpleSendModalPage.qml

Large diffs are not rendered by default.

5 changes: 5 additions & 0 deletions storybook/pages/StatusDialogPage.qml
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ SplitView {
header: StatusDialogHeader {
//color: Theme.palette.baseColor3
color: !!ctrlHeaderBgColor.text ? ctrlHeaderBgColor.text : Theme.palette.statusModal.backgroundColor
dropShadowEnabled: ctrlHeaderDropShadow.checked

visible: dialog.title || dialog.subtitle
headline.title: dialog.title
Expand Down Expand Up @@ -233,6 +234,10 @@ SplitView {
id: ctrlDropShadow
text: "Footer drop shadow"
}
CheckBox {
id: ctrlHeaderDropShadow
text: "Header drop shadow"
}
}
}
}
Expand Down
20 changes: 14 additions & 6 deletions storybook/src/Models/NetworksModel.qml
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,14 @@ QtObject {
readonly property int testnetNet: 5
readonly property int customNet: 6

readonly property int mainnetChainId: 1
readonly property int sepMainnetChainId: 11155111
readonly property int optChainId: 10
readonly property int sepOptChainId: 11155420
readonly property int arbChainId: 42161
readonly property int sepArbChainId: 421614


function getShortChainName(chainId) {
if(chainId === root.ethNet)
return "eth"
Expand Down Expand Up @@ -55,7 +63,7 @@ QtObject {
readonly property var flatNetworks: ListModel {
Component.onCompleted: append([
{
chainId: 1,
chainId: mainnetChainId,
chainName: "Mainnet",
blockExplorerURL: "https://etherscan.io/",
iconUrl: "network/Network=Ethereum",
Expand All @@ -69,7 +77,7 @@ QtObject {
isRouteEnabled: true,
},
{
chainId: 11155111,
chainId: sepMainnetChainId,
chainName: "Sepolia Mainnet",
blockExplorerURL: "https://sepolia.etherscan.io/",
iconUrl: "network/Network=Ethereum",
Expand All @@ -83,7 +91,7 @@ QtObject {
isRouteEnabled: true,
},
{
chainId: 10,
chainId: optChainId,
chainName: "Optimism",
blockExplorerURL: "https://optimistic.etherscan.io",
iconUrl: "network/Network=Optimism",
Expand All @@ -97,7 +105,7 @@ QtObject {
isRouteEnabled: true,
},
{
chainId: 11155420,
chainId: sepOptChainId,
chainName: "Optimism Sepolia",
blockExplorerURL: "https://sepolia-optimism.etherscan.io/",
iconUrl: "network/Network=Optimism",
Expand All @@ -111,7 +119,7 @@ QtObject {
isRouteEnabled: true,
},
{
chainId: 42161,
chainId: arbChainId,
chainName: "Arbitrum",
blockExplorerURL: "https://arbiscan.io/",
iconUrl: "network/Network=Arbitrum",
Expand All @@ -125,7 +133,7 @@ QtObject {
isRouteEnabled: true,
},
{
chainId: 421614,
chainId: sepArbChainId,
chainName: "Arbitrum Sepolia",
blockExplorerURL: "https://sepolia-explorer.arbitrum.io/",
iconUrl: "network/Network=Arbitrum",
Expand Down
17 changes: 12 additions & 5 deletions storybook/src/Models/WalletAccountsModel.qml
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,20 @@ import QtQuick 2.15
import utils 1.0

ListModel {

readonly property string accountAddress1: "0x7F47C2e18a4BBf5487E6fb082eC2D9Ab0E6d7240"
readonly property string accountAddress2: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8881"
readonly property string accountAddress3: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8882"
readonly property string accountAddress4: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8883"
readonly property string accountAddress5: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8884"

readonly property var data: [
{
name: "helloworld",
emoji: "😋",
colorId: Constants.walletAccountColors.primary,
color: "#2A4AF5",
address: "0x7F47C2e18a4BBf5487E6fb082eC2D9Ab0E6d7240",
address: accountAddress1,
walletType: "",
canSend: true,
position: 0,
Expand Down Expand Up @@ -53,7 +60,7 @@ ListModel {
emoji: "🚗",
colorId: Constants.walletAccountColors.army,
color: "#216266",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8881",
address: accountAddress2,
walletType: Constants.generatedWalletType,
canSend: true,
position: 3,
Expand All @@ -79,7 +86,7 @@ ListModel {
emoji: "🎨",
colorId: Constants.walletAccountColors.magenta,
color: "#EC266C",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8882",
address: accountAddress3,
walletType: Constants.seedWalletType,
canSend: true,
position: 1,
Expand Down Expand Up @@ -114,7 +121,7 @@ ListModel {
emoji: "",
colorId: Constants.walletAccountColors.copper,
color: "#CB6256",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8883",
address: accountAddress4,
walletType: Constants.watchWalletType,
canSend: false,
position: 2,
Expand All @@ -131,7 +138,7 @@ ListModel {
emoji: "🔑",
colorId: Constants.walletAccountColors.camel,
color: "#C78F67",
address: "0x7F47C2e98a4BBf5487E6fb082eC2D9Ab0E6d8884",
address: accountAddress5,
walletType: Constants.keyWalletType,
canSend: true,
position: 4,
Expand Down
4 changes: 3 additions & 1 deletion ui/StatusQ/src/StatusQ/Popups/Dialog/StatusDialog.qml
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.15
import QtQml.Models 2.15
import QtQml 2.15
Expand Down Expand Up @@ -32,7 +33,8 @@ Dialog {
anchors.centerIn: Overlay.overlay

padding: 16
margins: 64
// by design
margins: root.contentItem.Window.window.height <= 780 ? 28: 64
modal: true

// workaround for https://bugreports.qt.io/browse/QTBUG-87804
Expand Down
10 changes: 10 additions & 0 deletions ui/StatusQ/src/StatusQ/Popups/Dialog/StatusDialogHeader.qml
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import QtQuick 2.14
import QtQuick.Layouts 1.14
import QtGraphicalEffects 1.15

import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
Expand All @@ -9,6 +10,7 @@ Rectangle {

readonly property alias headline: headline
readonly property alias actions: actions
property bool dropShadowEnabled

property alias leftComponent: leftComponentLoader.sourceComponent

Expand Down Expand Up @@ -63,4 +65,12 @@ Rectangle {
anchors.bottom: parent.bottom
width: parent.width
}

layer.enabled: root.dropShadowEnabled
layer.effect: DropShadow {
horizontalOffset: 0
verticalOffset: 2
samples: 37
color: Theme.palette.dropShadow
}
}
127 changes: 127 additions & 0 deletions ui/app/AppLayouts/Wallet/panels/SendModalHeader.qml
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
import QtQuick 2.15
import QtQuick.Layouts 1.15

import StatusQ 0.1
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1

import AppLayouts.Wallet.controls 1.0

RowLayout {
id: root

/**
Expected model structure:
- tokensKey: unique string ID of the token (asset); e.g. "ETH" or contract address
- name: user visible token name (e.g. "Ethereum")
- symbol: user visible token symbol (e.g. "ETH")
- decimals: number of decimal places
- communityId:optional; ID of the community this token belongs to, if any
- marketDetails: object containing props like `currencyPrice` for the computed values below
- balances: submodel[ chainId:int, account:string, balance:BigIntString, iconUrl:string ]
- currentBalance: amount of tokens
- currencyBalance: e.g. `1000.42` in user's fiat currency
- currencyBalanceAsString: e.g. "1 000,42 CZK" formatted as a string according to the user's locale
- balanceAsString: `1.42` formatted as e.g. "1,42" in user's locale
- iconSource: string
**/
required property var assetsModel
/**
Expected model structure:
- groupName: group name (from collection or community name)
- icon: from imageUrl or mediaUrl
- type: can be "community" or "other"
- subitems: submodel of collectibles/collections of the group
- key: key of collection (community type) or collectible (other type)
- name: name of the subitem (of collectible or collection)
- balance: balance of collection (in case of community collectibles)
or collectible (in case of ERC-1155)
- icon: icon of the subitem
**/
required property var collectiblesModel
/**
Expected model structure:
- chainId: network chain id
- chainName: name of network
- iconUrl: network icon url
**/
required property var networksModel

/** property holds if the header is the sticky header **/
property bool isStickyHeader

/** property that exposes the selected network **/
readonly property int selectedNetworkChainId: selectedNetworkEntry.item.chainId

/** signal to propagate that an asset was selected **/
signal assetSelected(string key)
/** signal to propagate that a collection was selected **/
signal collectionSelected(string key)
/** signal to propagate that a collectible was selected **/
signal collectibleSelected(string key)

implicitHeight: sendModalTitleText.height

spacing: 8

StatusBaseText {
id: sendModalTitleText

Layout.preferredWidth: contentWidth

lineHeightMode: Text.FixedHeight
lineHeight: root.isStickyHeader ? 30 : 38
font.pixelSize: root.isStickyHeader ? 22 : 28
elide: Text.ElideRight

text: qsTr("Send")
}

TokenSelector {
id: tokenSelector

Layout.preferredWidth: implicitWidth

assetsModel: root.assetsModel
collectiblesModel: root.collectiblesModel

onCollectibleSelected: root.collectibleSelected(key)
onCollectionSelected: root.collectionSelected(key)
onAssetSelected: root.assetSelected(key)
}

// Horizontal spacer
RowLayout {}

StatusBaseText {
Layout.alignment: Qt.AlignRight
text: qsTr("On:")
color: Theme.palette.baseColor1
font.pixelSize: 13
lineHeight: 38
lineHeightMode: Text.FixedHeight
verticalAlignment: Text.AlignVCenter
visible: networkFilter.visible
}

NetworkFilter {
id: networkFilter

Layout.alignment: Qt.AlignTop

flatNetworks: root.networksModel

multiSelection: false
showSelectionIndicator: false
showTitle: false

control.bottomPadding: 0
}

ModelEntry {
id: selectedNetworkEntry
sourceModel: root.networksModel
key: "chainId"
value: networkFilter.selection[0]
}
}
Loading

0 comments on commit ca23852

Please sign in to comment.