481 lines
16 KiB
QML
481 lines
16 KiB
QML
import QtQuick 2.15
|
|
import QtQuick.Controls 2.15
|
|
import QtQuick.Layouts 1.15
|
|
import QtQml 2.15
|
|
import Qt.labs.settings 1.0
|
|
import QtTest 1.15
|
|
import QtQml.Models 2.14
|
|
|
|
import StatusQ.Core 0.1
|
|
import StatusQ.Core.Utils 0.1
|
|
import StatusQ.Controls 0.1
|
|
import StatusQ.Components 0.1
|
|
import StatusQ.Core.Theme 0.1
|
|
import StatusQ.Popups.Dialog 0.1
|
|
import StatusQ.Core.Utils 0.1 as SQUtils
|
|
|
|
import Models 1.0
|
|
import Storybook 1.0
|
|
|
|
import AppLayouts.Wallet.controls 1.0
|
|
import AppLayouts.Wallet.stores 1.0 as WalletStores
|
|
import AppLayouts.Wallet.services.dapps 1.0
|
|
|
|
import SortFilterProxyModel 0.2
|
|
|
|
import AppLayouts.Wallet.panels 1.0
|
|
import AppLayouts.Profile.stores 1.0
|
|
|
|
import mainui 1.0
|
|
import shared.stores 1.0
|
|
import utils 1.0
|
|
|
|
Item {
|
|
id: root
|
|
|
|
// Needed for DAppsWorkflow->PairWCModal to open its instructions popup
|
|
Popups {
|
|
popupParent: root
|
|
rootStore: QtObject {}
|
|
communityTokensStore: QtObject {}
|
|
}
|
|
|
|
SplitView {
|
|
anchors.fill: parent
|
|
|
|
ColumnLayout {
|
|
SplitView.fillWidth: true
|
|
|
|
Rectangle {
|
|
Layout.alignment: Qt.AlignCenter
|
|
Layout.preferredWidth: dappsWorkflow.implicitHeight + 20
|
|
Layout.preferredHeight: dappsWorkflow.implicitHeight + 20
|
|
|
|
border.color: "blue"
|
|
border.width: 1
|
|
|
|
DAppsWorkflow {
|
|
id: dappsWorkflow
|
|
|
|
anchors.centerIn: parent
|
|
|
|
spacing: 8
|
|
|
|
wcService: walletConnectService
|
|
}
|
|
}
|
|
ColumnLayout {}
|
|
}
|
|
|
|
ColumnLayout {
|
|
id: optionsSpace
|
|
|
|
RowLayout {
|
|
StatusBaseText { text: "projectId" }
|
|
StatusBaseText {
|
|
id: projectIdText
|
|
readonly property string projectId: SystemUtils.getEnvVar("WALLET_CONNECT_PROJECT_ID")
|
|
text: SQUtils.Utils.elideText(projectId, 3)
|
|
font.bold: true
|
|
}
|
|
}
|
|
|
|
CheckBox {
|
|
text: "Testnet Mode"
|
|
checked: settings.testNetworks
|
|
onCheckedChanged: {
|
|
settings.testNetworks = checked
|
|
}
|
|
}
|
|
|
|
StatusTextArea {
|
|
text: settings.customAccounts
|
|
onTextChanged: {
|
|
settings.customAccounts = text
|
|
customAccountsModel.clear()
|
|
let customData = JSON.parse(text)
|
|
customData.forEach(function(account) {
|
|
customAccountsModel.append(account)
|
|
})
|
|
}
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: !!text ? 400 : -1
|
|
}
|
|
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: 1
|
|
color: "grey"
|
|
}
|
|
|
|
StatusBaseText { text: "Requests Queue" }
|
|
|
|
ListView {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: Math.min(50, contentHeight)
|
|
model: walletConnectService.requestHandler.requestsModel
|
|
delegate: RowLayout {
|
|
StatusBaseText {
|
|
text: SQUtils.Utils.elideAndFormatWalletAddress(model.topic, 6, 4)
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
}
|
|
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: 1
|
|
color: "grey"
|
|
}
|
|
|
|
StatusBaseText { text: "Persisted Sessions" }
|
|
|
|
ListView {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: Math.min(100, contentHeight)
|
|
model: sessionsModel
|
|
delegate: RowLayout {
|
|
StatusBaseText {
|
|
text: SQUtils.Utils.elideAndFormatWalletAddress(model.topic, 6, 4)
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
}
|
|
|
|
StatusButton {
|
|
text: qsTr("Clear Persistance")
|
|
visible: sessionsModel.count > 0
|
|
onClicked: {
|
|
settings.persistedSessions = "[]"
|
|
d.updateSessionsModelAndAddNewIfNotNull(null)
|
|
}
|
|
}
|
|
|
|
// spacer
|
|
ColumnLayout {}
|
|
|
|
CheckBox {
|
|
|
|
text: "Enable SDK"
|
|
checked: settings.enableSDK
|
|
onCheckedChanged: {
|
|
settings.enableSDK = checked
|
|
}
|
|
}
|
|
|
|
RowLayout {
|
|
StatusBaseText { text: "URI" }
|
|
StatusInput {
|
|
id: pairUriInput
|
|
|
|
//placeholderText: "Enter WC Pair URI"
|
|
text: settings.pairUri
|
|
onTextChanged: {
|
|
settings.pairUri = text
|
|
}
|
|
|
|
Layout.fillWidth: true
|
|
}
|
|
}
|
|
|
|
ComboBox {
|
|
model: [{testCase: d.noTestCase, name: "No Test Case"},
|
|
{testCase: d.openDappsTestCase, name: "Open dApps"},
|
|
{testCase: d.openPairTestCase, name: "Open Pair"}
|
|
]
|
|
textRole: "name"
|
|
valueRole: "testCase"
|
|
currentIndex: settings.testCase
|
|
onCurrentValueChanged: {
|
|
settings.testCase = currentValue
|
|
if (currentValue !== d.noTestCase) {
|
|
d.startTestCase()
|
|
}
|
|
}
|
|
|
|
Connections {
|
|
target: dappsWorkflow
|
|
|
|
// If Open Pair workflow if selected in the side bar
|
|
function onDappsListReady() {
|
|
if (d.activeTestCase < d.openPairTestCase)
|
|
return
|
|
|
|
let items = InspectionUtils.findVisualsByTypeName(dappsWorkflow, "DAppsListPopup")
|
|
if (items.length === 1) {
|
|
let buttons = InspectionUtils.findVisualsByTypeName(items[0], "StatusButton")
|
|
if (buttons.length === 1) {
|
|
buttons[0].clicked()
|
|
}
|
|
}
|
|
}
|
|
|
|
function onPairWCReady() {
|
|
if (d.activeTestCase < d.openPairTestCase)
|
|
return
|
|
|
|
if (pairUriInput.text.length > 0) {
|
|
let items = InspectionUtils.findVisualsByTypeName(dappsWorkflow, "StatusBaseInput")
|
|
if (items.length === 1) {
|
|
items[0].text = pairUriInput.text
|
|
|
|
clickDoneIfSDKReady()
|
|
}
|
|
}
|
|
}
|
|
|
|
function clickDoneIfSDKReady() {
|
|
if (d.activeTestCase < d.openPairTestCase) {
|
|
return
|
|
}
|
|
|
|
let modals = InspectionUtils.findVisualsByTypeName(dappsWorkflow, "PairWCModal")
|
|
if (modals.length === 1) {
|
|
let buttons = InspectionUtils.findVisualsByTypeName(modals[0].footer, "StatusButton")
|
|
if (buttons.length === 1 && walletConnectService.wcSDK.sdkReady) {
|
|
d.activeTestCase = d.noTestCase
|
|
buttons[0].clicked()
|
|
return
|
|
}
|
|
}
|
|
|
|
Backpressure.debounce(dappsWorkflow, 250, clickDoneIfSDKReady)()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
StatusDialog {
|
|
id: authMockDialog
|
|
title: "Authenticate user"
|
|
visible: false
|
|
|
|
property string topic: ""
|
|
property string id: ""
|
|
|
|
ColumnLayout {
|
|
RowLayout {
|
|
StatusBaseText { text: "Topic" }
|
|
StatusBaseText { text: authMockDialog.topic }
|
|
StatusBaseText { text: "ID" }
|
|
StatusBaseText { text: authMockDialog.id }
|
|
}
|
|
}
|
|
footer: StatusDialogFooter {
|
|
rightButtons: ObjectModel {
|
|
StatusButton {
|
|
text: qsTr("Reject")
|
|
onClicked: {
|
|
walletConnectService.store.userAuthenticationFailed(authMockDialog.topic, authMockDialog.id)
|
|
authMockDialog.close()
|
|
}
|
|
}
|
|
StatusButton {
|
|
text: qsTr("Authenticate")
|
|
onClicked: {
|
|
walletConnectService.store.userAuthenticated(authMockDialog.topic, authMockDialog.id, "0x1234567890", "123")
|
|
authMockDialog.close()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
WalletConnectService {
|
|
id: walletConnectService
|
|
|
|
wcSDK: WalletConnectSDK {
|
|
active: settings.enableSDK
|
|
|
|
projectId: projectIdText.projectId
|
|
}
|
|
|
|
store: DAppsStore {
|
|
signal dappsListReceived(string dappsJson)
|
|
signal userAuthenticated(string topic, string id, string password, string pin)
|
|
signal userAuthenticationFailed(string topic, string id)
|
|
|
|
function addWalletConnectSession(sessionJson) {
|
|
console.info("Persist Session", sessionJson)
|
|
|
|
let session = JSON.parse(sessionJson)
|
|
d.updateSessionsModelAndAddNewIfNotNull(session)
|
|
|
|
return true
|
|
}
|
|
|
|
function deactivateWalletConnectSession(topic) {
|
|
console.info("Deactivate Persisted Session", topic)
|
|
|
|
let sessions = JSON.parse(settings.persistedSessions)
|
|
let newSessions = sessions.filter(function(session) {
|
|
return session.topic !== topic
|
|
})
|
|
settings.persistedSessions = JSON.stringify(newSessions)
|
|
d.updateSessionsModelAndAddNewIfNotNull(null)
|
|
return true
|
|
}
|
|
|
|
function updateWalletConnectSessions(activeTopicsJson) {
|
|
console.info("Update Persisted Sessions", activeTopicsJson)
|
|
|
|
let activeTopics = JSON.parse(activeTopicsJson)
|
|
let sessions = JSON.parse(settings.persistedSessions)
|
|
let newSessions = sessions.filter(function(session) {
|
|
return activeTopics.includes(session.topic)
|
|
})
|
|
settings.persistedSessions = JSON.stringify(newSessions)
|
|
d.updateSessionsModelAndAddNewIfNotNull(null)
|
|
return true
|
|
}
|
|
|
|
|
|
function getDapps() {
|
|
let dappsJson = JSON.stringify(d.persistedDapps)
|
|
this.dappsListReceived(dappsJson)
|
|
return true
|
|
}
|
|
|
|
function authenticateUser(topic, id, address) {
|
|
authMockDialog.topic = topic
|
|
authMockDialog.id = id
|
|
authMockDialog.open()
|
|
return true
|
|
}
|
|
|
|
// hardcoded for https://react-app.walletconnect.com/
|
|
function signMessage(topic, id, address, password, message) {
|
|
console.info(`calling mocked DAppsStore.signMessage(${topic}, ${id}, ${address}, ${password}, ${message})`)
|
|
return "0x0b083acc1b3b612dd38e8e725b28ce9b2dd4936b4cf7922da4e4a3c6f44f7f4f6d3050ccb41455a2b85093f1bfadb10fc6a75d83bb590b2eb70e3447653459701c"
|
|
}
|
|
|
|
// hardcoded for https://react-app.walletconnect.com/
|
|
function signTypedDataV4(topic, id, address, password, typedDataJson) {
|
|
console.info(`calling mocked DAppsStore.signTypedDataV4(${topic}, ${id}, ${address}, ${password}, ${typedDataJson})`)
|
|
return "0xf8ceb3468319cc215523b67c24c4504b3addd9bf8de31c278038d7478c9b6de554f7d8a516cd5d6a066b7d48b81f03d9d6bb7d5d754513c08325674ebcc7efbc1b"
|
|
}
|
|
|
|
// hardcoded for https://react-app.walletconnect.com/
|
|
function signTransaction(topic, id, address, chainId, password, tx) {
|
|
console.info(`calling mocked DAppsStore.signTransaction(${topic}, ${id}, ${address}, ${chainId}, ${password}, ${tx})`)
|
|
return "0xf8672a8402fb7acf82520894e2d622c817878da5143bbe06866ca8e35273ba8a80808401546d71a04fc89c2f007c3b27d0fcff07d3e69c29f940967fab4caf525f9af72dadb48befa00c5312a3cb6f50328889ad361a0c88bb9d1b1a4fc510f6783b287930b4e187b5"
|
|
}
|
|
|
|
function sendTransaction(topic, id, address, chainId, password, tx) {
|
|
console.info(`calling mocked DAppsStore.sendTransaction(${topic}, ${id}, ${address}, ${chainId}, ${password}, ${tx})`)
|
|
return "0xf8672a8402fb7acf82520894e2d622c817878da5143bbe068"
|
|
}
|
|
}
|
|
|
|
walletRootStore: WalletStores.RootStore {
|
|
property string selectedAddress: ""
|
|
property var filteredFlatModel: SortFilterProxyModel {
|
|
sourceModel: NetworksModel.flatNetworks
|
|
filters: ValueFilter { roleName: "isTest"; value: settings.testNetworks; }
|
|
}
|
|
property var accounts: customAccountsModel.count > 0 ? customAccountsModel : defaultAccountsModel
|
|
readonly property ListModel nonWatchAccounts: accounts
|
|
|
|
function getNetworkShortNames(chainIds) {
|
|
return "eth:oeth:arb"
|
|
}
|
|
}
|
|
|
|
onDisplayToastMessage: (message, isErr) => {
|
|
if(isErr) {
|
|
console.log(`Storybook.displayToastMessage(${message}, "", "warning", false, Constants.ephemeralNotificationType.danger, "")`)
|
|
return
|
|
}
|
|
console.log(`Storybook.displayToastMessage(${message}, "", "checkmark-circle", false, Constants.ephemeralNotificationType.success, "")`)
|
|
}
|
|
}
|
|
|
|
|
|
QObject {
|
|
id: d
|
|
|
|
property int activeTestCase: noTestCase
|
|
|
|
function startTestCase() {
|
|
d.activeTestCase = settings.testCase
|
|
if(root.visible) {
|
|
dappsWorkflow.popup.open()
|
|
}
|
|
}
|
|
|
|
readonly property int noTestCase: 0
|
|
readonly property int openDappsTestCase: 1
|
|
readonly property int openPairTestCase: 2
|
|
|
|
ListModel {
|
|
id: sessionsModel
|
|
}
|
|
|
|
function updateSessionsModelAndAddNewIfNotNull(newSession) {
|
|
var sessions = JSON.parse(settings.persistedSessions)
|
|
if (!!newSession) {
|
|
sessions.push(newSession)
|
|
settings.persistedSessions = JSON.stringify(sessions)
|
|
}
|
|
|
|
sessionsModel.clear()
|
|
d.persistedDapps = []
|
|
sessions.forEach(function(session) {
|
|
sessionsModel.append(session)
|
|
|
|
let firstIconUrl = session.peer.metadata.icons.length > 0 ? session.peer.metadata.icons[0] : ""
|
|
let persistedDapp = {
|
|
"name": session.peer.metadata.name,
|
|
"url": session.peer.metadata.url,
|
|
"iconUrl": firstIconUrl,
|
|
"topic": session.topic
|
|
}
|
|
var found = false
|
|
for (var i = 0; i < d.persistedDapps.length; i++) {
|
|
if (d.persistedDapps[i].url == persistedDapp.url) {
|
|
found = true
|
|
break
|
|
}
|
|
}
|
|
if (!found) {
|
|
d.persistedDapps.push(persistedDapp)
|
|
}
|
|
})
|
|
}
|
|
|
|
property var persistedDapps: []
|
|
ListModel {
|
|
id: customAccountsModel
|
|
}
|
|
WalletAccountsModel{
|
|
id: defaultAccountsModel
|
|
}
|
|
}
|
|
|
|
onVisibleChanged: {
|
|
if (visible && d.activeTestCase !== d.noTestCase) {
|
|
d.startTestCase()
|
|
}
|
|
}
|
|
|
|
Settings {
|
|
id: settings
|
|
|
|
property int testCase: d.noTestCase
|
|
property string pairUri: ""
|
|
property bool testNetworks: false
|
|
property bool enableSDK: true
|
|
property bool pending : false
|
|
property string customAccounts: ""
|
|
property string persistedSessions: "[]"
|
|
}
|
|
|
|
Component.onCompleted: {
|
|
d.updateSessionsModelAndAddNewIfNotNull(null)
|
|
}
|
|
}
|
|
|
|
// category: Wallet
|
|
// https://www.figma.com/design/HrmZp1y4S77QJezRFRl6ku/dApp-Interactions---Milestone-1?node-id=3649-30334&t=t5qqtR3RITR4yCOx-0
|