status-im/status-desktop
2
0
Fork 0
mirror of https://github.com/status-im/status-desktop.git synced 2025-01-27 06:46:22 +00:00
Code Issues Projects Releases Wiki Activity

feat(@desktop/wallet): Adapt AmountToSend for Simple Send

Browse Source 
fixes #16703
This commit is contained in:
Khushboo Mehta 2024-11-26 17:34:09 +01:00 committed by Khushboo-dev-cpp
parent dc716ad1b0
commit f1395a3a0a
6 changed files with 149 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
storybook/pages/AmountToSendPage.qml
View File

@ -19,6 +19,8 @@ SplitView {
anchors.centerIn: parent
width: 400
interactive: interactiveCheckBox.checked
fiatInputInteractive: fiatInteractiveCheckBox.checked
markAsInvalid: markAsInvalidCheckBox.checked
@ -26,7 +28,7 @@ SplitView {
mainInputLoading: ctrlMainInputLoading.checked
bottomTextLoading: ctrlBottomTextLoading.checked
caption: "Amount to send"
caption: captionField.text
decimalPoint: decimalPointRadioButton.checked ? "." : ","
price: parseFloat(priceTextField.text)
@ -35,6 +37,10 @@ SplitView {
formatFiat: balance => `${balance.toLocaleString(Qt.locale())} USD`
formatBalance: balance => `${balance.toLocaleString(Qt.locale())} ETH`
dividerVisible: ctrlDividerVisible.checked
selectedSymbol: ctrlShowMainInputSymbol.checked ? amountToSend.fiatMode ? "USD": "ETH": ""
progressivePixelReduction: ctrlProgressivePixelReduction.checked
}
}
@ -46,6 +52,19 @@ SplitView {
ColumnLayout {
spacing: 15
RowLayout {
Label {
text: "Caption"
}
TextField {
id: captionField
text: "Amount to send"
}
}
RowLayout {
Label {
text: "Price"
@ -119,6 +138,22 @@ SplitView {
id: ctrlBottomTextLoading
text: "Bottom text loading"
}
CheckBox {
id: ctrlDividerVisible
text: "Divider"
}
CheckBox {
id: ctrlProgressivePixelReduction
text: "Progressive Pixel Reduction"
checked: true
}
CheckBox {
id: ctrlShowMainInputSymbol
text: "Show Main Input Symbol"
}
}
Label {

15
storybook/pages/AmountValidatorPage.qml
View File

@ -20,6 +20,7 @@ Item {
maxIntegralDigits: maxIntegralDigitsSpinBox.value
maxDecimalDigits: maxDecimalDigitsSpinBox.value
maxDigits: maxTotalDigitsSpinBox.value
}
}
@ -80,6 +81,20 @@ Item {
value: 5
}
}
RowLayout {
Layout.alignment: Qt.AlignHCenter
Label {
text: "Max total digits:"
}
SpinBox {
id: maxTotalDigitsSpinBox
value: maxIntegralDigitsSpinBox.value + maxDecimalDigitsSpinBox.value
}
}
}
}

22
storybook/qmlTests/tests/tst_AmountValidator.qml
View File

@ -171,5 +171,27 @@ Item {
compare(textField.acceptableInput, true)
compare(textField.text, ".22")
}
function test_maxTotalDigits() {
textField.text = "1234567891."
textField.forceActiveFocus()
textField.validator.maxDecimalDigits = 18
textField.validator.maxDigits = 15
textField.cursorPosition = 11
type(Qt.Key_1)
type(Qt.Key_2)
type(Qt.Key_3)
type(Qt.Key_4)
type(Qt.Key_5)
compare(textField.acceptableInput, true)
compare(textField.text, "1234567891.12345")
type(Qt.Key_6)
compare(textField.acceptableInput, true)
compare(textField.text, "1234567891.12345")
}
}
}

17
storybook/qmlTests/tests/tst_SwapInputPanel.qml
View File

@ -176,7 +176,11 @@ Item {
const amountToSendInput = findChild(controlUnderTest, "amountToSendInput")
verify(!!amountToSendInput)
mouseClick(amountToSendInput)
const amountToSend_textField = findChild(controlUnderTest, "amountToSend_textField")
verify(!!amountToSend_textField)
mouseClick(amountToSend_textField)
waitForRendering(amountToSendInput)
verify(amountToSendInput.cursorVisible)
@ -221,7 +225,11 @@ Item {
const amountToSendInput = findChild(controlUnderTest, "amountToSendInput")
verify(!!amountToSendInput)
mouseClick(amountToSendInput)
const amountToSend_textField = findChild(controlUnderTest, "amountToSend_textField")
verify(!!amountToSend_textField)
mouseClick(amountToSend_textField)
waitForRendering(amountToSendInput)
verify(amountToSendInput.cursorVisible)
@ -398,10 +406,13 @@ Item {
const amountToSendInput = findChild(controlUnderTest, "amountToSendInput")
verify(!!amountToSendInput)
const amountToSend_textField = findChild(controlUnderTest, "amountToSend_textField")
verify(!!amountToSend_textField)
const bottomItemText = findChild(amountToSendInput, "bottomItemText")
verify(!!bottomItemText)
mouseClick(amountToSendInput)
mouseClick(amountToSend_textField)
// enter 5.42 as entered amount
keyClick(Qt.Key_5)
keyClick(Qt.Key_Period)

4
ui/StatusQ/src/StatusQ/Validators/AmountValidator.qml
View File

@ -24,6 +24,7 @@ GenericValidator {
property string decimalPoint: Qt.locale(locale).decimalPoint
property int maxIntegralDigits: 10
property int maxDecimalDigits: 10
property int maxDigits: maxIntegralDigits + maxDecimalDigits
validate: {
if (input.length === 0)
@ -52,6 +53,9 @@ GenericValidator {
const [integral, decimal] = pointsCount ? delocalized.split(".")
: [delocalized, ""]
if ((integral.length + decimal.length) > root.maxDigits)
return GenericValidator.Invalid
if (integral.length > root.maxIntegralDigits)
return GenericValidator.Invalid

61
ui/imports/shared/popups/send/views/AmountToSend.qml
View File

@ -55,6 +55,19 @@ Control {
property alias caption: captionText.text
property bool interactive: true
/* Boolean flag decides whether divider is shown between main input
area and bottom text */
property bool dividerVisible
/* Boolean flag decides whether the main input text area's fontsize reduces
as more and more characters are added.
True by default */
property bool progressivePixelReduction: true
/* This string holds the current main input area's currency symbol (fiat or crypto)
Not set = not shown */
property string selectedSymbol
readonly property bool cursorVisible: textField.cursorVisible
readonly property alias placeholderText: textField.placeholderText
@ -155,6 +168,22 @@ Control {
multiplier),
SQUtils.AmountsArithmetic.fromNumber(price)).toFixed()
}
/* Incase we dont have progressing font size reduction we only
allow users to enter digits until there is place left */
function getMaxDigitsAllowed() {
if (root.progressivePixelReduction) {
return validator.maxDecimalDigits + validator.maxIntegralDigits
} else {
let availableSpaceForAmount = root.availableWidth - currencyField.contentWidth - layout.spacing
return Math.floor(availableSpaceForAmount/textMetrics.tightBoundingRect.width)
}
}
readonly property TextMetrics textMetrics: TextMetrics {
font: textField.font
text: "0"
}
}
contentItem: ColumnLayout {
@ -173,13 +202,14 @@ Control {
}
RowLayout {
id: layout
spacing: 4
StatusTextField {
id: textField
objectName: "amountToSend_textField"
Layout.fillWidth: true
implicitHeight: 44
padding: 0
background: null
@ -198,11 +228,16 @@ Control {
+ "0".repeat(root.fiatDecimalPlaces)
}
font.pixelSize: Utils.getFontSizeBasedOnLetterCount(text)
font.pixelSize:{
if (!root.progressivePixelReduction)
return 34
return Utils.getFontSizeBasedOnLetterCount(text)
}
validator: AmountValidator {
id: validator
maxDigits: d.getMaxDigitsAllowed()
maxDecimalDigits: d.fiatMode ? root.fiatDecimalPlaces
: root.multiplierIndex
locale: root.locale.name
@ -215,6 +250,26 @@ Control {
Layout.preferredHeight: textField.height
visible: root.mainInputLoading
}
StatusBaseText {
id: currencyField
objectName: "amountToSend_currencyField"
Layout.alignment: Qt.AlignVCenter
Layout.topMargin: 10
color: Theme.palette.directColor5
text: selectedSymbol
font.pixelSize: Theme.additionalTextSize
}
}
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 1
Layout.bottomMargin: 12
color: Theme.palette.baseColor2
visible: root.dividerVisible
}
StatusBaseText {