ARCHIVE/xrpl-dev-portal
1
0
Fork 0
mirror of https://github.com/XRPLF/xrpl-dev-portal.git synced 2025-12-06 17:27:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Desktop Wallet (JS) tutorial dependencies, copy edits

Browse Source
This commit is contained in:
mDuo13
2025-10-01 13:17:48 -07:00
parent 104d20edde
commit 929a4cbced
13 changed files with 60 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
_code-samples/build-a-desktop-wallet/js/0-hello/index.js
View File

@@ -3,20 +3,19 @@ const { app, BrowserWindow } = require('electron')
const path = require('path')
/**
* This is our main function, it creates our application window, preloads the code we will need to communicate
* between the renderer Process and the main Process, loads a layout and performs the main logic
* Main function: create application window, preload the code to communicate
* between the renderer Process and the main Process, load a layout,
* and perform the main logic
*/
const createWindow = () => {
// Creates the application window
// Create the application window
const appWindow = new BrowserWindow({
width: 1024,
height: 768
})
// Loads a layout
// Load a layout
appWindow.loadFile(path.join(__dirname, 'view', 'template.html'))
return appWindow
}

26
_code-samples/build-a-desktop-wallet/js/1-ledger-index/index.js
View File

@@ -1,40 +1,37 @@
const { app, BrowserWindow } = require('electron')
const path = require('path')
const xrpl = require("xrpl")
// Ledger index code additions - start
const xrpl = require('xrpl')
const TESTNET_URL = "wss://s.altnet.rippletest.net:51233"
const TESTNET_URL = 'wss://s.altnet.rippletest.net:51233'
/**
* This function creates a WebService client, which connects to the XRPL and fetches the latest ledger index.
* Create a WebSocket client, connect to the XRPL, and fetch the latest ledger index.
*
* @returns {Promise<number>}
*/
const getValidatedLedgerIndex = async () => {
const client = new xrpl.Client(TESTNET_URL)
await client.connect()
// Reference: https://xrpl.org/ledger.html#ledger
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/ledger-methods/ledger
const ledgerRequest = {
"command": "ledger",
"ledger_index": "validated"
}
const ledgerResponse = await client.request(ledgerRequest)
await client.disconnect()
return ledgerResponse.result.ledger_index
}
// Ledger index code additions - end
/**
* This is our main function, it creates our application window, preloads the code we will need to communicate
* between the renderer Process and the main Process, loads a layout and performs the main logic
* Main function: create application window, preload the code to communicate
* between the renderer Process and the main Process, load a layout,
* and perform the main logic
*/
const createWindow = () => {
// Creates the application window
// Create the application window
const appWindow = new BrowserWindow({
width: 1024,
height: 768,
@@ -43,9 +40,8 @@ const createWindow = () => {
},
})
// Loads a layout
// Load a layout
appWindow.loadFile(path.join(__dirname, 'view', 'template.html'))
return appWindow
}

2
_code-samples/build-a-desktop-wallet/js/2-async/index.js
View File

@@ -38,7 +38,7 @@ const main = async () => {
await client.connect()
// Subscribe client to 'ledger' events
// Reference: https://xrpl.org/subscribe.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe
await client.request({
"command": "subscribe",
"streams": ["ledger"]

12
_code-samples/build-a-desktop-wallet/js/3-account/index.js
View File

@@ -29,30 +29,30 @@ const main = async () => {
await client.connect()
// Reference: https://xrpl.org/subscribe.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe
await client.request({
"command": "subscribe",
"streams": ["ledger"],
"accounts": [address]
})
// Reference: https://xrpl.org/subscribe.html#ledger-stream
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe#ledger-stream
client.on("ledgerClosed", async (rawLedgerData) => {
const ledger = prepareLedgerData(rawLedgerData)
appWindow.webContents.send('update-ledger-data', ledger)
})
// Initial Ledger Request -> Get account details on startup
// Reference: https://xrpl.org/ledger.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/ledger-methods/ledger
const ledgerResponse = await client.request({
"command": "ledger"
})
const initialLedgerData = prepareLedgerData(ledgerResponse.result.closed.ledger)
appWindow.webContents.send('update-ledger-data', initialLedgerData)
// Reference: https://xrpl.org/subscribe.html#transaction-streams
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe#transaction-streams
client.on("transaction", async (transaction) => {
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const accountInfoRequest = {
"command": "account_info",
"account": address,
@@ -64,7 +64,7 @@ const main = async () => {
})
// Initial Account Request -> Get account details on startup
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const accountInfoResponse = await client.request({
"command": "account_info",
"account": address,

10
_code-samples/build-a-desktop-wallet/js/4-tx-history/index.js
View File

@@ -30,14 +30,14 @@ const main = async () => {
await client.connect()
// Reference: https://xrpl.org/subscribe.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe
await client.request({
"command": "subscribe",
"streams": ["ledger"],
"accounts": [address]
})
// Reference: https://xrpl.org/subscribe.html#ledger-stream
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe#ledger-stream
client.on("ledgerClosed", async (rawLedgerData) => {
const ledger = prepareLedgerData(rawLedgerData)
appWindow.webContents.send('update-ledger-data', ledger)
@@ -45,7 +45,7 @@ const main = async () => {
// Wait for transaction on subscribed account and re-request account data
client.on("transaction", async (transaction) => {
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const accountInfoRequest = {
"command": "account_info",
"account": address,
@@ -61,7 +61,7 @@ const main = async () => {
})
// Initial Account Request -> Get account details on startup
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const accountInfoResponse = await client.request({
"command": "account_info",
"account": address,
@@ -71,7 +71,7 @@ const main = async () => {
appWindow.webContents.send('update-account-data', accountData)
// Initial Transaction Request -> List account transactions on startup
// Reference: https://xrpl.org/account_tx.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_tx
const txResponse = await client.request({
"command": "account_tx",
"account": address

3
_code-samples/build-a-desktop-wallet/js/5-password/index.js
View File

@@ -51,6 +51,9 @@ const main = async () => {
}
const wallet = xrpl.Wallet.fromSeed(seed)
// For compatibility with seeds generated using secp256k1 (the old
// default algorithm), use the following instead:
// const wallet = xrpl.Wallet.fromSeed(seed, {algorithm: "secp256k1"})
const client = new xrpl.Client(TESTNET_URL)

2
_code-samples/build-a-desktop-wallet/js/README.md
View File

@@ -2,7 +2,7 @@
Build a non-custodial XRP Ledger wallet application in JavaScript that runs on the desktop using Electron.
For the full documentation, refer to the [Build a Wallet in JavaScript tutorial](https://xrpl.org/build-a-wallet-in-javascript.html).
For the full documentation, refer to the [Build a Desktop Wallet in JavaScript tutorial](https://xrpl.org/docs/tutorials/javascript/build-apps/build-a-desktop-wallet-in-javascript).
## TL;DR

2
_code-samples/build-a-desktop-wallet/js/library/3_helpers.js
View File

@@ -3,7 +3,7 @@ const xrpl = require("xrpl");
// The rippled server and its APIs represent time as an unsigned integer.
// This number measures the number of seconds since the "Ripple Epoch" of
// January 1, 2000 (00:00 UTC). This is like the way the Unix epoch works,
// Reference: https://xrpl.org/basic-data-types.html
// Reference: https://xrpl.org/docs/references/protocol/data-types/basic-data-types#specifying-time
const RIPPLE_EPOCH = 946684800;
const prepareAccountData = (rawAccountData) => {

10
_code-samples/build-a-desktop-wallet/js/library/5_helpers.js
View File

@@ -14,7 +14,7 @@ const fernet = require("fernet");
* @returns {Promise<void>}
*/
const initialize = async (client, wallet, appWindow) => {
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const accountInfoResponse = await client.request({
"command": "account_info",
"account": wallet.address,
@@ -23,7 +23,7 @@ const initialize = async (client, wallet, appWindow) => {
const accountData = prepareAccountData(accountInfoResponse.result.account_data)
appWindow.webContents.send('update-account-data', accountData)
// Reference: https://xrpl.org/account_tx.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_tx
const txResponse = await client.request({
"command": "account_tx",
"account": wallet.address
@@ -42,14 +42,14 @@ const initialize = async (client, wallet, appWindow) => {
*/
const subscribe = async (client, wallet, appWindow) => {
// Reference: https://xrpl.org/subscribe.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe
await client.request({
"command": "subscribe",
"streams": ["ledger"],
"accounts": [wallet.address]
})
// Reference: https://xrpl.org/subscribe.html#ledger-stream
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/subscription-methods/subscribe#ledger-stream
client.on("ledgerClosed", async (rawLedgerData) => {
const ledger = prepareLedgerData(rawLedgerData)
appWindow.webContents.send('update-ledger-data', ledger)
@@ -57,7 +57,7 @@ const subscribe = async (client, wallet, appWindow) => {
// Wait for transaction on subscribed account and re-request account data
client.on("transaction", async (transaction) => {
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const accountInfoRequest = {
"command": "account_info",
"account": wallet.address,

2
_code-samples/build-a-desktop-wallet/js/library/7_helpers.js
View File

@@ -9,7 +9,7 @@ const xrpl = require("xrpl");
* @returns {Promise<*>}
*/
const sendXrp = async (paymentData, client, wallet) => {
// Reference: https://xrpl.org/submit.html#request-format-1
// Reference: https://xrpl.org/docs/references/protocol/transactions/types/payment
const paymentTx = {
"TransactionType": "Payment",
"Account": wallet.address,

4
_code-samples/build-a-desktop-wallet/js/library/8_helpers.js
View File

@@ -39,7 +39,7 @@ async function checkDestination(accountData) {
/**
* Verify an account using a xrp-ledger.toml file.
* https://xrpl.org/xrp-ledger-toml.html#xrp-ledgertoml-file
* https://xrpl.org/docs/references/xrp-ledger-toml
*
* @param accountData
* @returns {Promise<{domain: string, verified: boolean}>}
@@ -89,7 +89,7 @@ async function verifyAccountDomain(accountData) {
* @returns {Promise<{domain: string, verified: boolean}>}
*/
async function verify(accountAddress, client) {
// Reference: https://xrpl.org/account_info.html
// Reference: https://xrpl.org/docs/references/http-websocket-apis/public-api-methods/account-methods/account_info
const request = {
"command": "account_info",
"account": accountAddress,

12
_code-samples/build-a-desktop-wallet/js/package.json
View File

@@ -1,6 +1,6 @@
{
"name": "xrpl-javascript-desktop-wallet",
"version": "1.0.0",
"version": "1.1.0",
"license": "MIT",
"scripts": {
"hello": "electron 0-hello/index.js",
@@ -14,15 +14,15 @@
"domain-verification": "electron 8-domain-verification/index.js"
},
"dependencies": {
"async": "^3.2.4",
"async": "^3.2.6",
"fernet": "=0.3.3",
"node-fetch": "^2.6.9",
"pbkdf2-hmac": "^1.1.0",
"node-fetch": "^2.7.0",
"pbkdf2-hmac": "^1.2.1",
"open": "^8.4.0",
"toml": "^3.0.0",
"xrpl": "^4.3.0"
"xrpl": "^4.4.2"
},
"devDependencies": {
"electron": "28.3.2"
"electron": "38.2.0"
}
}