diff --git a/storybook/pages/DAppsWorkflowPage.qml b/storybook/pages/DAppsWorkflowPage.qml index a67c922fcd..63b54f2199 100644 --- a/storybook/pages/DAppsWorkflowPage.qml +++ b/storybook/pages/DAppsWorkflowPage.qml @@ -379,6 +379,7 @@ Item { property string pairUri: "" property bool testNetworks: false property bool enableSDK: true + property bool pending : false property string customAccounts: "" } } diff --git a/storybook/pages/WCUriInputPage.qml b/storybook/pages/WCUriInputPage.qml new file mode 100644 index 0000000000..ed18288ff5 --- /dev/null +++ b/storybook/pages/WCUriInputPage.qml @@ -0,0 +1,74 @@ +import QtQuick 2.15 +import QtQuick.Controls 2.15 +import QtQuick.Layouts 1.15 + +import shared.popups.walletconnect.PairWCModal 1.0 + +import Storybook 1.0 + +SplitView { + id: root + + ColumnLayout { + SplitView.fillHeight: true + SplitView.fillWidth: true + + WCUriInput { + id: wcInput + Layout.fillWidth: true + Layout.alignment: Qt.AlignCenter + Layout.margins: 16 + } + + Component.onCompleted: { + function onVisibilityChangedAfterCreation() { + let items = InspectionUtils.findVisualsByTypeName(wcInput, "StatusBaseInput") + if (items.length === 1) { + items[0].text = "wc:825fbaeb53eeeb08e53a8ddf40cec7996056f49647ab5c39663a2a102920d81c@2?expiryTimestamp=1719495004&relay-protocol=irn&symKey=2eaa97fa11774efb67fd7c93efe92773a7b60650c5cb2621abbdba02cdd4040c" + } + wcInput.visibleChanged.disconnect(onVisibilityChangedAfterCreation); + } + wcInput.visibleChanged.connect(onVisibilityChangedAfterCreation); + } + + // Spacer + Item { Layout.fillHeight: true } + } + + Pane { + Layout.fillWidth: true + + ColumnLayout { + TextInput { + id: placeHolderInput + text: "Input state" + } + CheckBox { + id: pendingCheckBox + text: "pending" + checked: false + + onCheckedChanged: { + let items = InspectionUtils.findVisualsByTypeName(wcInput, "StatusBaseInput") + if (items.length === 1) { + items[0].pending = pendingCheckBox.checked + } + } + } + CheckBox { + id: validCheckBox + text: "valid" + checked: true + + onCheckedChanged: { + let items = InspectionUtils.findVisualsByTypeName(wcInput, "StatusBaseInput") + if (items.length === 1) { + items[0].valid = validCheckBox.checked + } + } + } + } + } +} + +// category: Components diff --git a/ui/imports/shared/popups/walletconnect/PairWCModal/WCUriInput.qml b/ui/imports/shared/popups/walletconnect/PairWCModal/WCUriInput.qml index ffbe71451e..cefbe272a7 100644 --- a/ui/imports/shared/popups/walletconnect/PairWCModal/WCUriInput.qml +++ b/ui/imports/shared/popups/walletconnect/PairWCModal/WCUriInput.qml @@ -6,6 +6,7 @@ import QtQuick.Layouts 1.15 import StatusQ.Core 0.1 import StatusQ.Popups 0.1 import StatusQ.Controls 0.1 +import StatusQ.Components 0.1 import StatusQ.Core.Theme 0.1 ColumnLayout { @@ -13,6 +14,7 @@ ColumnLayout { readonly property bool valid: input.valid && input.text.length > 0 readonly property alias text: input.text + property alias pending: input.pending StatusBaseInput { id: input @@ -76,12 +78,18 @@ ColumnLayout { readonly property bool showIcon: input.valid && input.text.length > 0 + StatusLoadingIndicator { + anchors.centerIn: parent + color: Theme.palette.blue + visible: showIcon && input.pending + } + StatusIcon { anchors.centerIn: parent icon: "tiny/tiny-checkmark" color: Theme.palette.green - visible: showIcon + visible: showIcon && !input.pending } StatusButton { diff --git a/ui/imports/shared/popups/walletconnect/PairWCModal/qmldir b/ui/imports/shared/popups/walletconnect/PairWCModal/qmldir new file mode 100644 index 0000000000..f301ec810e --- /dev/null +++ b/ui/imports/shared/popups/walletconnect/PairWCModal/qmldir @@ -0,0 +1 @@ +WCUriInput 1.0 WCUriInput.qml