From 42625711c69da17cd98ebb92898c330b9a1413ed Mon Sep 17 00:00:00 2001 From: Kieran Hall Date: Fri, 23 Feb 2024 13:20:35 +0100 Subject: [PATCH] Add Prettier for formatting and format all files Resolves #1457 --- web-wallet/.eslintrc.cjs | 128 ++-- web-wallet/.prettierrc.js | 9 + web-wallet/CHANGELOG.md | 76 +-- web-wallet/README.md | 39 +- web-wallet/__mocks__/Wallet.js | 24 +- web-wallet/jsconfig.json | 4 +- web-wallet/package-lock.json | 90 ++- web-wallet/package.json | 14 +- web-wallet/src/app.html | 23 +- web-wallet/src/env.d.ts | 2 +- web-wallet/src/error.html | 20 +- web-wallet/src/lamb.d.ts | 629 +++++++++--------- .../AddressPicker/AddressPicker.css | 114 ++-- .../AddressPicker/AddressPicker.svelte | 77 ++- .../src/lib/components/Balance/Balance.svelte | 14 +- .../ContractOperations.svelte | 23 +- .../ContractStatusesList.svelte | 5 +- .../ExistingWalletNotice.svelte | 18 +- .../components/GasControls/GasControls.svelte | 16 +- .../src/lib/components/GasFee/GasFee.svelte | 25 +- .../components/GasSettings/GasSettings.svelte | 2 +- .../OperationResult/OperationResult.svelte | 27 +- .../src/lib/components/Receive/Receive.svelte | 28 +- .../src/lib/components/ScanQR/ScanQR.svelte | 4 +- .../src/lib/components/Send/Send.svelte | 36 +- .../src/lib/components/Stake/Stake.svelte | 133 ++-- .../lib/components/Stake/StakeOverview.svelte | 4 +- .../Transactions/Transactions.svelte | 197 +++--- .../__tests__/AddressPicker.spec.js | 10 +- .../lib/components/__tests__/Balance.spec.js | 22 +- .../__tests__/ContractOperations.spec.js | 107 +-- .../__tests__/ContractStatusesList.spec.js | 40 +- .../components/__tests__/GasControls.spec.js | 35 +- .../lib/components/__tests__/GasFee.spec.js | 17 +- .../components/__tests__/GasSettings.spec.js | 35 +- .../__tests__/OperationResult.spec.js | 52 +- .../lib/components/__tests__/ScanQR.spec.js | 11 +- .../src/lib/components/__tests__/Send.spec.js | 78 +-- .../lib/components/__tests__/Stake.spec.js | 81 +-- .../components/__tests__/Transactions.spec.js | 63 +- .../StakeContract/StakeContract.svelte | 116 ++-- .../TransferContract/TransferContract.svelte | 56 +- .../__tests__/deductLuxFeeFrom.spec.js | 10 +- .../src/lib/contracts/contract-descriptors.js | 82 ++- .../src/lib/contracts/deductLuxFeeFrom.js | 3 +- .../array/__tests__/findFirstNMatches.spec.js | 47 +- .../dusk/array/__tests__/shuffleArray.spec.js | 5 +- web-wallet/src/lib/dusk/array/arraysEqual.js | 2 +- .../src/lib/dusk/array/findFirstNMatches.js | 3 +- web-wallet/src/lib/dusk/array/shuffleArray.js | 7 +- .../base64/__tests__/base64ToBytes.spec.js | 6 +- .../base64/__tests__/base64ToUTF8.spec.js | 6 +- .../base64/__tests__/bytesToBase64.spec.js | 6 +- .../base64/__tests__/utf8ToBase64.spec.js | 6 +- .../src/lib/dusk/base64/base64ToBytes.js | 9 +- .../src/lib/dusk/base64/base64ToUTF8.js | 2 +- .../src/lib/dusk/base64/bytesToBase64.js | 2 +- .../src/lib/dusk/base64/utf8ToBase64.js | 2 +- .../components/Agreement/Agreement.svelte | 8 +- .../lib/dusk/components/Anchor/Anchor.svelte | 4 +- .../AnchorButton/AnchorButton.svelte | 22 +- .../lib/dusk/components/Badge/Badge.svelte | 2 +- .../lib/dusk/components/Button/Button.svelte | 14 +- .../src/lib/dusk/components/Card/Card.svelte | 12 +- .../ErrorDetails/ErrorDetails.svelte | 4 +- .../dusk/components/Icon/CircularIcon.svelte | 13 +- .../src/lib/dusk/components/Icon/Icon.svelte | 20 +- .../dusk/components/Mnemonic/Mnemonic.svelte | 55 +- .../components/ProgressBar/ProgressBar.svelte | 5 +- .../lib/dusk/components/QrCode/QrCode.svelte | 4 +- .../lib/dusk/components/Select/Options.svelte | 2 +- .../lib/dusk/components/Select/Select.svelte | 6 +- .../dusk/components/Stepper/Stepper.svelte | 7 +- .../lib/dusk/components/Switch/Switch.svelte | 10 +- .../src/lib/dusk/components/Tabs/Tabs.css | 5 +- .../src/lib/dusk/components/Tabs/Tabs.svelte | 93 +-- .../dusk/components/Textbox/Textbox.svelte | 13 +- .../dusk/components/Throbber/Throbber.svelte | 18 +- .../lib/dusk/components/Toast/Toast.svelte | 18 +- .../src/lib/dusk/components/Toast/store.js | 36 +- .../dusk/components/Tooltip/Tooltip.svelte | 90 +-- .../lib/dusk/components/Wizard/Wizard.svelte | 6 +- .../dusk/components/Wizard/WizardStep.svelte | 69 +- .../components/Wizard/createWizardStore.js | 14 +- .../lib/dusk/components/Words/Words.svelte | 4 +- .../__mocks__/mockedMnemonicStore.js | 2 +- .../components/__tests__/Agreement.spec.js | 9 +- .../dusk/components/__tests__/Anchor.spec.js | 18 +- .../components/__tests__/AnchorButton.spec.js | 39 +- .../dusk/components/__tests__/Badge.spec.js | 27 +- .../dusk/components/__tests__/Button.spec.js | 31 +- .../dusk/components/__tests__/Card.spec.js | 17 +- .../components/__tests__/Checkbox.spec.js | 29 +- .../components/__tests__/ErrorDetails.spec.js | 15 +- .../dusk/components/__tests__/Icon.spec.js | 19 +- .../components/__tests__/Mnemonic.spec.js | 49 +- .../components/__tests__/ProgressBar.spec.js | 15 +- .../dusk/components/__tests__/QrCode.spec.js | 16 +- .../dusk/components/__tests__/Select.spec.js | 45 +- .../dusk/components/__tests__/Stepper.spec.js | 23 +- .../dusk/components/__tests__/Switch.spec.js | 56 +- .../dusk/components/__tests__/Tabs.spec.js | 22 +- .../dusk/components/__tests__/Textbox.spec.js | 42 +- .../components/__tests__/Throbber.spec.js | 13 +- .../dusk/components/__tests__/Toast.spec.js | 53 +- .../dusk/components/__tests__/Tooltip.spec.js | 260 ++++++-- .../dusk/components/__tests__/Words.spec.js | 20 +- .../lib/dusk/components/dusk.components.d.ts | 64 +- .../dusk/currency/__tests__/duskToLux.spec.js | 6 +- .../dusk/currency/__tests__/luxToDusk.spec.js | 6 +- .../dusk/currency/createCurrencyFormatter.js | 12 +- .../lib/dusk/currency/createFeeFormatter.js | 4 +- .../dusk/currency/createTransferFormatter.js | 4 +- .../src/lib/dusk/currency/currencies.js | 2 +- web-wallet/src/lib/dusk/currency/duskToLux.js | 2 +- web-wallet/src/lib/dusk/currency/luxToDusk.js | 2 +- .../http/__tests__/failureToRejection.spec.js | 12 +- .../src/lib/dusk/http/failureToRejection.js | 12 +- web-wallet/src/lib/dusk/icons/logo.js | 3 +- .../src/lib/dusk/math/__tests__/lerp.spec.js | 12 +- .../lib/dusk/mocks/IntersectionObserver.js | 20 +- .../src/lib/dusk/mocks/ResizeObserver.js | 8 +- .../string/__tests__/hexStringToBytes.spec.js | 10 +- .../string/__tests__/makeClassName.spec.js | 33 +- .../string/__tests__/validateAddress.spec.js | 4 +- .../dusk/string/calculateAdaptiveCharCount.js | 10 +- .../src/lib/dusk/string/hexStringToBytes.js | 8 +- .../src/lib/dusk/string/makeClassName.js | 16 +- .../src/lib/dusk/string/middleEllipsis.js | 4 +- .../src/lib/dusk/string/validateAddress.js | 12 +- .../lib/dusk/test-helpers/SlotContent.svelte | 1 - .../lib/dusk/test-helpers/getAsHTMLElement.js | 2 +- .../lib/dusk/test-helpers/mockDerivedStore.js | 6 +- .../dusk/test-helpers/mockReadableStore.js | 6 +- .../lib/dusk/test-helpers/renderWithSlots.js | 18 +- .../__test__/handlePageClick.spec.js | 4 +- .../lib/dusk/ui-helpers/handlePageClick.js | 10 +- web-wallet/src/lib/mock-data/addresses.js | 2 +- web-wallet/src/lib/mock-data/stakeInfo.js | 2 +- web-wallet/src/lib/mock-data/transactions.js | 93 +-- .../lib/navigation/__test__/logout.spec.js | 9 +- web-wallet/src/lib/navigation/logout.js | 2 +- .../loginInfoStorage/__tests__/index.spec.js | 22 +- .../lib/services/loginInfoStorage/index.js | 17 +- .../wallet/__tests__/getWallet.spec.js | 9 +- .../src/lib/services/wallet/getWallet.js | 4 +- .../lib/stores/__tests__/walletStore.spec.js | 173 +++-- web-wallet/src/lib/stores/settingsStore.js | 11 +- web-wallet/src/lib/stores/stores.d.ts | 27 +- web-wallet/src/lib/stores/walletStore.js | 126 ++-- .../__tests__/sortByHeightDesc.spec.js | 10 +- .../transactions/getLastTransactionHash.js | 17 +- .../src/lib/transactions/transactions.d.ts | 12 +- .../wallet/__tests__/decryptMnemonic.spec.js | 6 +- .../wallet/__tests__/encryptMnemonic.spec.js | 8 +- .../__tests__/getSeedFromMnemonic.spec.js | 6 +- web-wallet/src/lib/wallet/decryptMnemonic.js | 8 +- web-wallet/src/lib/wallet/encryptMnemonic.js | 6 +- web-wallet/src/lib/wallet/getDerivedKey.js | 40 +- .../src/lib/wallet/getSeedFromMnemonic.js | 3 +- web-wallet/src/lib/wallet/initializeWallet.js | 2 +- .../wallet/refreshLocalStoragePasswordInfo.js | 4 +- web-wallet/src/lib/wallet/wallet.d.ts | 8 +- web-wallet/src/routes/(app)/+layout.js | 2 +- web-wallet/src/routes/(app)/+layout.svelte | 6 +- .../(app)/__mocks__/mockedWalletStore.js | 2 +- .../src/routes/(app)/__tests__/layout.spec.js | 30 +- .../src/routes/(app)/dashboard/+layout.js | 6 +- .../src/routes/(app)/dashboard/+layout.svelte | 27 +- .../src/routes/(app)/dashboard/+page.svelte | 88 +-- .../(app)/dashboard/__tests__/layout.spec.js | 97 ++- .../(app)/dashboard/__tests__/page.spec.js | 21 +- .../(app)/dashboard/transactions/+page.svelte | 4 +- .../transactions/__tests__/page.spec.js | 2 +- .../src/routes/(app)/settings/+page.svelte | 123 ++-- .../(app)/settings/__tests__/page.spec.js | 25 +- .../src/routes/(welcome)/+layout.svelte | 8 +- .../(welcome)/forced-logout/+page.svelte | 14 +- .../forced-logout/__tests__/page.spec.js | 9 +- .../src/routes/(welcome)/login/+page.svelte | 55 +- .../(welcome)/login/__tests__/page.spec.js | 24 +- .../src/routes/(welcome)/setup/+page.svelte | 28 +- .../src/routes/(welcome)/setup/AllSet.svelte | 3 +- .../routes/(welcome)/setup/Animation.svelte | 19 +- .../(welcome)/setup/PasswordSetup.svelte | 36 +- .../(welcome)/setup/TermsOfService.svelte | 25 +- .../(welcome)/setup/__tests__/page.spec.js | 7 +- .../(welcome)/setup/create/+page.svelte | 72 +- .../setup/create/MnemonicPhrase.svelte | 7 +- .../setup/create/MnemonicPreSetup.svelte | 14 +- .../setup/create/MnemonicValidate.svelte | 15 +- .../(welcome)/setup/create/SwapNDUSK.svelte | 4 +- .../setup/create/__tests__/page.spec.js | 7 +- .../(welcome)/setup/restore/+page.svelte | 49 +- .../setup/restore/MnemonicAuthenticate.svelte | 13 +- .../setup/restore/__tests__/page.spec.js | 34 +- web-wallet/src/routes/+error.svelte | 2 +- web-wallet/src/routes/+layout.svelte | 6 +- web-wallet/src/routes/+page.js | 2 +- web-wallet/src/routes/__tests__/page.spec.js | 13 +- .../routes/components-showcase/+page.svelte | 34 +- .../routes/components-showcase/Badges.svelte | 9 +- .../routes/components-showcase/Cards.svelte | 20 +- .../components-showcase/Checkboxes.svelte | 19 +- .../components-showcase/IconButtons.svelte | 74 +-- .../components-showcase/LabeledButtons.svelte | 18 +- .../components-showcase/ProgressBars.svelte | 8 +- .../routes/components-showcase/Selects.svelte | 12 +- .../components-showcase/Steppers.svelte | 4 +- .../components-showcase/Switches.svelte | 12 +- .../components-showcase/Tabboxes.svelte | 6 +- .../components-showcase/Textboxes.svelte | 15 +- .../components-showcase/Throbbers.svelte | 2 +- .../routes/components-showcase/Toasts.svelte | 10 +- .../components-showcase/Tooltips.svelte | 2 +- .../routes/components-showcase/Wizards.svelte | 31 +- .../src/style/app-components/headings.css | 15 +- .../src/style/dusk-components/agreement.css | 2 +- .../src/style/dusk-components/badge.css | 32 +- .../src/style/dusk-components/button.css | 48 +- web-wallet/src/style/dusk-components/card.css | 2 +- .../src/style/dusk-components/checkbox.css | 5 +- .../style/dusk-components/error-details.css | 4 +- web-wallet/src/style/dusk-components/icon.css | 2 +- .../src/style/dusk-components/select.css | 17 +- .../src/style/dusk-components/switch.css | 6 +- web-wallet/src/style/dusk-components/tabs.css | 7 +- .../src/style/dusk-components/textbox.css | 4 +- .../src/style/dusk-components/throbber.css | 2 +- .../src/style/dusk-components/toast.css | 54 +- .../src/style/dusk-components/tooltip.css | 10 +- .../src/style/dusk-components/wizard.css | 27 +- .../src/style/dusk-components/words.css | 2 +- web-wallet/src/style/dusk/colors.css | 10 +- web-wallet/src/style/dusk/language.css | 18 +- web-wallet/src/style/main.css | 28 +- web-wallet/svelte.config.js | 13 +- web-wallet/vite-setup.js | 48 +- web-wallet/vite.config.js | 47 +- 239 files changed, 3563 insertions(+), 3031 deletions(-) create mode 100644 web-wallet/.prettierrc.js diff --git a/web-wallet/.eslintrc.cjs b/web-wallet/.eslintrc.cjs index 496a8229ac..414eb5e3f8 100644 --- a/web-wallet/.eslintrc.cjs +++ b/web-wallet/.eslintrc.cjs @@ -1,73 +1,73 @@ module.exports = { - "env": { - "browser": true, - "es2022": true, - "node": true + env: { + browser: true, + es2022: true, + node: true, }, - "extends": [ + extends: [ "@dusk-network/eslint-config/js", - "@dusk-network/eslint-config/svelte" + "@dusk-network/eslint-config/svelte", ], - "globals": { - "CONFIG": false + globals: { + CONFIG: false, }, - "overrides": [{ - "files": ["*.svelte"], - "rules": { - "no-undef-init": 0, - "svelte/require-optimized-style-attribute": 0 - } - }, { - "files": ["*.spec.js", "*.test.js"], - "rules": { - "brace-style": [ - "error", - "1tbs", - { "allowSingleLine": true } - ], - "jsdoc/require-jsdoc": 0, - "max-len": [ - "error", { - "code": 110, - "comments": 110, - "ignorePattern": "^\\s*it\\(", - "ignoreUrls": true - } - ], - "max-nested-callbacks": [ - "error", - 5 - ], - "max-statements": 0, - "max-statements-per-line": [ - "error", { - "max": 2 - } - ], - "object-curly-newline": 0, - "quote-props": [ - "error", - "consistent" - ], - "sort-keys": 0 - } - }], - "root": true, - "settings": { + overrides: [ + { + files: ["*.svelte"], + rules: { + "no-undef-init": 0, + "svelte/require-optimized-style-attribute": 0, + }, + }, + { + files: ["*.spec.js", "*.test.js"], + rules: { + "brace-style": ["error", "1tbs", { allowSingleLine: true }], + "jsdoc/require-jsdoc": 0, + "max-len": [ + "error", + { + code: 110, + comments: 110, + ignorePattern: "^\\s*it\\(", + ignoreUrls: true, + }, + ], + "max-nested-callbacks": ["error", 5], + "max-statements": 0, + "max-statements-per-line": [ + "error", + { + max: 2, + }, + ], + "object-curly-newline": 0, + "quote-props": ["error", "consistent"], + "sort-keys": 0, + }, + }, + ], + root: true, + settings: { "import/resolver": { "eslint-import-resolver-custom-alias": { - "alias": { - "$app": "node_modules/@sveltejs/kit/src/runtime/app", - "$config": "./src/config", - "$lib": "./src/lib", - "@sveltejs/kit": "node_modules/@sveltejs/kit/src/exports/index.js", - "@testing-library/svelte": "node_modules/@testing-library/svelte/src/index.js", - "svelte/motion": "node_modules/svelte/src/runtime/motion/index.js", - "svelte/store": "node_modules/svelte/src/runtime/store/index.js", - "svelte/transition": "node_modules/svelte/src/runtime/transition/index.js" + alias: { + $app: "node_modules/@sveltejs/kit/src/runtime/app", + $config: "./src/config", + $lib: "./src/lib", + "@sveltejs/kit": + "node_modules/@sveltejs/kit/src/exports/index.js", + "@testing-library/svelte": + "node_modules/@testing-library/svelte/src/index.js", + "svelte/motion": + "node_modules/svelte/src/runtime/motion/index.js", + "svelte/store": + "node_modules/svelte/src/runtime/store/index.js", + "svelte/transition": + "node_modules/svelte/src/runtime/transition/index.js", }, - "extensions": [".cjs", ".js", ".json", ".svelte"] - } - } - } + extensions: [".cjs", ".js", ".json", ".svelte"], + }, + }, + }, }; diff --git a/web-wallet/.prettierrc.js b/web-wallet/.prettierrc.js new file mode 100644 index 0000000000..1dfa4caaeb --- /dev/null +++ b/web-wallet/.prettierrc.js @@ -0,0 +1,9 @@ +import duskJsPrettierConfig from "@dusk-network/prettier-config/js/index.js"; +import duskSveltePrettierConfig from "@dusk-network/prettier-config/svelte/index.js"; + +export default { + plugins: ["prettier-plugin-svelte"], + overrides: [{ files: "*.svelte", options: { parser: "svelte" } }], + ...duskJsPrettierConfig, + ...duskSveltePrettierConfig, +}; diff --git a/web-wallet/CHANGELOG.md b/web-wallet/CHANGELOG.md index 18ef9354a0..288915c68e 100644 --- a/web-wallet/CHANGELOG.md +++ b/web-wallet/CHANGELOG.md @@ -9,81 +9,82 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added -- Add visible version, commit hash and build date [#1441] -- Add Address validation (Transfer flow) [#1377] +- Add visible version, commit hash and build date [#1441] +- Add Address validation (Transfer flow) [#1377] ### Changed -- Change Get Quote API Endpoint to env variable [#1311] +- Change Get Quote API Endpoint to env variable [#1311] ### Removed -- Remove the use of `checkValidity()` in Send and Stake flow amounts validity checks [#1391] +- Remove the use of `checkValidity()` in Send and Stake flow amounts validity checks [#1391] ### Fixed -- Fix typo in routes/welcome/\_\_tests\_\_/page.spec.js [#1445] +- Fix typo in routes/welcome/\_\_tests\_\_/page.spec.js [#1445] ## [0.2.1] - 2024-02-20 ### Added -- Add wallet restore flow tests [#1416] -- Add missing login flow tests [#1423] +- Add wallet restore flow tests [#1416] +- Add missing login flow tests [#1423] ### Fixed -- Fix restore flow allowing invalid mnemonic to be used to log in [#1416] -- Fix can't unlock the wallet with upper case words [#1417] +- Fix restore flow allowing invalid mnemonic to be used to log in [#1416] +- Fix can't unlock the wallet with upper case words [#1417] ## [0.2.0] - 2024-02-15 ### Added -- Add running node requirement notice in Staking flow [#1359] -- Add `fiatPrice` optional property to Balance component [#1323] -- Add ability to revert words when entering the mnemonic phrase [#1290] -- Add missing error handling when querying the quote API [#1322] -- Add gas settings validation to settings page [#1352] -- Add forced log out on inactive tabs [#1373] -- Add gas settings validation to block Send and Stake operations if invalid gas settings [#1354] -- Add abortable sync [#1401] -- Add `existing wallet notice` to wallet create, restore and login flows [#1360] -- Add `userId` value to localStorage preferences object during wallet create and restore [#1360] +- Add running node requirement notice in Staking flow [#1359] +- Add `fiatPrice` optional property to Balance component [#1323] +- Add ability to revert words when entering the mnemonic phrase [#1290] +- Add missing error handling when querying the quote API [#1322] +- Add gas settings validation to settings page [#1352] +- Add forced log out on inactive tabs [#1373] +- Add gas settings validation to block Send and Stake operations if invalid gas settings [#1354] +- Add abortable sync [#1401] +- Add `existing wallet notice` to wallet create, restore and login flows [#1360] +- Add `userId` value to localStorage preferences object during wallet create and restore [#1360] ### Changed -- Change Holdings component design [#1361] -- Change `fiatCurrency`, `locale`, `tokenCurrency`, `token` to required properties in Balance component [#1323] -- Change `package.json` fields to reflect repo change [#1367] -- Change `walletStore.js` to receive gasPrice and gasLimit when `transfer` , `stake`, `unstake` and `withdrawRewards` are called [#1353] -- Update deprecated Node actions in CI [#1343] -- Change `setGasSettings` event to `gasSettings` and include `isValidGas` property in event data [#1354] -- Change "withdraw stake" label to "unstake" [#1403] -- Change logout flow to abort a sync if in progress [#1401] -- Update dusk-wallet-js to from 0.3.2 to 0.4.2 [#1401] +- Change Holdings component design [#1361] +- Change `fiatCurrency`, `locale`, `tokenCurrency`, `token` to required properties in Balance component [#1323] +- Change `package.json` fields to reflect repo change [#1367] +- Change `walletStore.js` to receive gasPrice and gasLimit when `transfer` , `stake`, `unstake` and `withdrawRewards` are called [#1353] +- Update deprecated Node actions in CI [#1343] +- Change `setGasSettings` event to `gasSettings` and include `isValidGas` property in event data [#1354] +- Change "withdraw stake" label to "unstake" [#1403] +- Change logout flow to abort a sync if in progress [#1401] +- Update dusk-wallet-js to from 0.3.2 to 0.4.2 [#1401] ### Removed -- Remove `fiat` property from Balance component [#1323] -- Remove `gasSettings` store update from `dashboard/+page.svelte.js` [#1353] +- Remove `fiat` property from Balance component [#1323] +- Remove `gasSettings` store update from `dashboard/+page.svelte.js` [#1353] ### Fixed -- Fix Transactions table remains hidden for some screen resolutions [#1412] -- Fix Stake button is always disabled [#1410] -- Fix wizard progression on Stake flow [#1398] -- Fix Seed Phrase words size [#1335] -- Fix colors on red background [#1334] -- Fix Transactions table design [#1309] +- Fix Transactions table remains hidden for some screen resolutions [#1412] +- Fix Stake button is always disabled [#1410] +- Fix wizard progression on Stake flow [#1398] +- Fix Seed Phrase words size [#1335] +- Fix colors on red background [#1334] +- Fix Transactions table design [#1309] ## [0.1.0-beta] - 2024-02-02 ### Added -- Add initial commit +- Add initial commit + [#1359]: https://github.com/dusk-network/rusk/issues/1359 [#1311]: https://github.com/dusk-network/rusk/issues/1311 [#1323]: https://github.com/dusk-network/rusk/issues/1323 @@ -114,6 +115,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 [#1441]: https://github.com/dusk-network/rusk/issues/1441 + [Unreleased]: https://github.com/dusk-network/rusk/tree/master/web-wallet [0.2.1]: https://github.com/dusk-network/rusk/tree/web-wallet-0.2.1 [0.2.0]: https://github.com/dusk-network/rusk/tree/web-wallet-0.2.0 diff --git a/web-wallet/README.md b/web-wallet/README.md index 1c4a749d54..59ff82ecd4 100644 --- a/web-wallet/README.md +++ b/web-wallet/README.md @@ -4,12 +4,12 @@ Web Wallet website. ## TOC -- [Web Wallet](#web-wallet) - - [TOC](#toc) - - [Build system and dev environment](#build-system-and-dev-environment) - - [Environment variables](#environment-variables) - - [NPM scripts](#npm-scripts) - - [Running a local Rusk node](#running-a-local-rusk-node) +- [Web Wallet](#web-wallet) + - [TOC](#toc) + - [Build system and dev environment](#build-system-and-dev-environment) + - [Environment variables](#environment-variables) + - [NPM scripts](#npm-scripts) + - [Running a local Rusk node](#running-a-local-rusk-node) ## Build system and dev environment @@ -23,6 +23,7 @@ As the application uses the [Web Crypto API](https://developer.mozilla.org/en-US The staging environment is at https://web-wallet-staging-oxs3z.ondigitalocean.app/ ## Environment variables + The `dusk-wallet-js` library uses some [environment variables](https://github.com/dusk-network/dusk-wallet-js/blob/main/.env). The application defines these variables by reading a local `.env` file containing the same variables used in the `dusk-wallet-js`, with the addition of the `VITE_` prefix. @@ -53,19 +54,19 @@ To run a local node different steps are needed, so please read the [related sect ## NPM scripts -- `npm run build` generates the production build -- `npm run checks` runs all checks (lint, typecheck and test) -- `npm run dev` generates the development build and starts the dev server -- `npm run dev:host` generates the development build, starts the dev server and exposes it to the local network -- `npm run lint`: performs the linting checks -- `npm run lint:fix`: runs ESLint with the `--fix` flag to fix formatting errors -- `npm run preview` previews the production build -- `npm test` runs the test suite -- `npm run test:coverage` runs the test suite and generate the code coverage report in the `coverage` folder -- `npm run test:watch` runs the test suite in watch mode -- `npm run typecheck` runs the type checker -- `npm run typecheck:watch` runs the type checker in watch mode +- `npm run build` generates the production build +- `npm run checks` runs all checks (lint, typecheck and test) +- `npm run dev` generates the development build and starts the dev server +- `npm run dev:host` generates the development build, starts the dev server and exposes it to the local network +- `npm run lint`: performs the linting checks +- `npm run lint:fix`: runs ESLint with the `--fix` flag to fix formatting errors +- `npm run preview` previews the production build +- `npm test` runs the test suite +- `npm run test:coverage` runs the test suite and generate the code coverage report in the `coverage` folder +- `npm run test:watch` runs the test suite in watch mode +- `npm run typecheck` runs the type checker +- `npm run typecheck:watch` runs the type checker in watch mode ## Running a local Rusk node -To run a local node, follow the instructions outlined in the [Rusk's readme](https://github.com/dusk-network/rusk). \ No newline at end of file +To run a local node, follow the instructions outlined in the [Rusk's readme](https://github.com/dusk-network/rusk). diff --git a/web-wallet/__mocks__/Wallet.js b/web-wallet/__mocks__/Wallet.js index 96c610d579..338ead1e6e 100644 --- a/web-wallet/__mocks__/Wallet.js +++ b/web-wallet/__mocks__/Wallet.js @@ -1,5 +1,5 @@ class Wallet { - constructor (seed, gasLimit = 2900000000, gasPrice = 1) { + constructor(seed, gasLimit = 2900000000, gasPrice = 1) { this.gasLimit = gasLimit; this.gasPrice = gasPrice; this.seed = seed; @@ -11,17 +11,17 @@ class Wallet { seed; wasm; - async history () {} - async getBalance () {} - async getPsks () {} - async stake () {} - async stakeAllow () {} - async stakeInfo () {} - async reset () {} - async sync () {} - async transfer () {} - async unstake () {} - async withdrawReward () {} + async history() {} + async getBalance() {} + async getPsks() {} + async stake() {} + async stakeAllow() {} + async stakeInfo() {} + async reset() {} + async sync() {} + async transfer() {} + async unstake() {} + async withdrawReward() {} } export default Wallet; diff --git a/web-wallet/jsconfig.json b/web-wallet/jsconfig.json index 0f45dc0b32..902fa25d46 100644 --- a/web-wallet/jsconfig.json +++ b/web-wallet/jsconfig.json @@ -14,8 +14,6 @@ "$lib": ["./src/lib"], "$lib/*": ["./src/lib/*"] }, - "types": [ - "./node_modules/@testing-library/jest-dom/types/vitest.d.ts" - ] + "types": ["./node_modules/@testing-library/jest-dom/types/vitest.d.ts"] } } diff --git a/web-wallet/package-lock.json b/web-wallet/package-lock.json index 483cd1eb08..8b95d3ed00 100644 --- a/web-wallet/package-lock.json +++ b/web-wallet/package-lock.json @@ -20,7 +20,8 @@ "svelte-persisted-store": "0.7.0" }, "devDependencies": { - "@dusk-network/eslint-config": "2.1.0", + "@dusk-network/eslint-config": "3.0.0", + "@dusk-network/prettier-config": "1.0.0", "@sveltejs/adapter-static": "2.0.3", "@sveltejs/kit": "1.27.6", "@testing-library/jest-dom": "6.1.4", @@ -28,14 +29,17 @@ "@vitejs/plugin-basic-ssl": "1.0.2", "@vitest/browser": "0.34.6", "@vitest/coverage-v8": "0.34.6", - "@zerodevx/svelte-toast": "^0.9.5", + "@zerodevx/svelte-toast": "0.9.5", "autoprefixer": "10.4.16", - "eslint": "8.54.0", + "eslint": "8.56.0", + "eslint-config-prettier": "9.1.0", "eslint-import-resolver-custom-alias": "1.3.2", "eslint-plugin-svelte": "2.35.1", "jsdom": "23.0.0", "jsdom-worker": "0.3.0", "postcss-nested": "6.0.1", + "prettier": "3.2.5", + "prettier-plugin-svelte": "3.2.1", "svelte": "4.2.7", "svelte-check": "3.6.2", "svelte-preprocess": "5.1.1", @@ -282,19 +286,32 @@ } }, "node_modules/@dusk-network/eslint-config": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/@dusk-network/eslint-config/-/eslint-config-2.1.0.tgz", - "integrity": "sha512-A9qT+pg0MFJnWFZtQOBK2jdIyufg1nxPSxuFHThGJN+yqRSYV3GYQA7HkfkSJLGHSqxgfqhKz/FTYNzSjoJWhw==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@dusk-network/eslint-config/-/eslint-config-3.0.0.tgz", + "integrity": "sha512-jPHrV5FkOMKmE0zOBHRUkkJoI1aHxwBd4q3C/fk2Jdervf2HQKimZ0JL38Ezkmy0c9EX6bW94AGDq33X8Yg2Ow==", "dev": true, "engines": { - "node": ">=18.0.0" + "node": ">=16.0.0" }, "optionalDependencies": { - "eslint-plugin-svelte": ">=2.31.0" + "eslint-plugin-svelte": ">=2.35.1" }, "peerDependencies": { - "eslint": ">=8.0.0", - "eslint-plugin-import": ">=2.0.0" + "eslint": ">=8.56.0", + "eslint-config-prettier": ">=9.1.0", + "eslint-plugin-import": ">=2.29.1" + } + }, + "node_modules/@dusk-network/prettier-config": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/@dusk-network/prettier-config/-/prettier-config-1.0.0.tgz", + "integrity": "sha512-tEmXgJ1MFqz6W0cTPq5o8TLBZBmAUeJM56gWh/0Ssh7Ol2uc1qXtB/EhylPagBPcbCwcR67XCteELQ12aFvgDw==", + "dev": true, + "engines": { + "node": ">=16.0.0" + }, + "optionalDependencies": { + "prettier-plugin-svelte": ">=3.2.1" } }, "node_modules/@esbuild/android-arm": { @@ -697,9 +714,9 @@ } }, "node_modules/@eslint/js": { - "version": "8.54.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.54.0.tgz", - "integrity": "sha512-ut5V+D+fOoWPgGGNj83GGjnntO39xDy6DWxO0wb7Jp3DcMX0TfIqdzHF85VTQkerdyGmuuMD9AKAo5KiNlf/AQ==", + "version": "8.56.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.56.0.tgz", + "integrity": "sha512-gMsVel9D7f2HLkBma9VbtzZRehRogVRfbr++f06nL2vnCGCNlzOD+/MUov/F4p8myyAHspEhVobgjpX64q5m6A==", "dev": true, "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" @@ -2880,15 +2897,15 @@ } }, "node_modules/eslint": { - "version": "8.54.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.54.0.tgz", - "integrity": "sha512-NY0DfAkM8BIZDVl6PgSa1ttZbx3xHgJzSNJKYcQglem6CppHyMhRIQkBVSSMaSRnLhig3jsDbEzOjwCVt4AmmA==", + "version": "8.56.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.56.0.tgz", + "integrity": "sha512-Go19xM6T9puCOWntie1/P997aXxFsOi37JIHRWI514Hc6ZnaHGKY9xFhrU65RT6CcBEzZoGG1e6Nq+DT04ZtZQ==", "dev": true, "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", - "@eslint/eslintrc": "^2.1.3", - "@eslint/js": "8.54.0", + "@eslint/eslintrc": "^2.1.4", + "@eslint/js": "8.56.0", "@humanwhocodes/config-array": "^0.11.13", "@humanwhocodes/module-importer": "^1.0.1", "@nodelib/fs.walk": "^1.2.8", @@ -2946,6 +2963,18 @@ "eslint": ">=6.0.0" } }, + "node_modules/eslint-config-prettier": { + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz", + "integrity": "sha512-NSWl5BFQWEPi1j4TjVNItzYV7dZXZ+wP6I6ZhrBGpChQhZRUaElihE9uRRkcbRnNb76UMKDF3r+WTmNcGPKsqw==", + "dev": true, + "bin": { + "eslint-config-prettier": "bin/cli.js" + }, + "peerDependencies": { + "eslint": ">=7.0.0" + } + }, "node_modules/eslint-import-resolver-custom-alias": { "version": "1.3.2", "resolved": "https://registry.npmjs.org/eslint-import-resolver-custom-alias/-/eslint-import-resolver-custom-alias-1.3.2.tgz", @@ -5443,6 +5472,31 @@ "node": ">= 0.8.0" } }, + "node_modules/prettier": { + "version": "3.2.5", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.2.5.tgz", + "integrity": "sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A==", + "dev": true, + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, + "node_modules/prettier-plugin-svelte": { + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/prettier-plugin-svelte/-/prettier-plugin-svelte-3.2.1.tgz", + "integrity": "sha512-ENAPbIxASf2R79IZwgkG5sBdeNA9kLRlXVvKKmTXh79zWTy0KKoT86XO2pHrTitUPINd+iXWy12MRmgzKGVckA==", + "dev": true, + "peerDependencies": { + "prettier": "^3.0.0", + "svelte": "^3.2.0 || ^4.0.0-next.0 || ^5.0.0-next.0" + } + }, "node_modules/pretty-format": { "version": "27.5.1", "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz", diff --git a/web-wallet/package.json b/web-wallet/package.json index 99578ce0a2..098e8d2617 100644 --- a/web-wallet/package.json +++ b/web-wallet/package.json @@ -18,9 +18,11 @@ }, "scripts": { "build": "vite build", - "checks": "npm run lint && npm run typecheck && npm test", + "checks": "npm run format && npm run lint && npm run typecheck && npm test", "dev": "vite dev", "dev:host": "vite dev --host", + "format": "prettier . --check", + "format:fix": "prettier . --write", "lint": "eslint .", "lint:fix": "eslint . --fix", "preview": "vite preview", @@ -44,7 +46,8 @@ "svelte-persisted-store": "0.7.0" }, "devDependencies": { - "@dusk-network/eslint-config": "2.1.0", + "@dusk-network/eslint-config": "3.0.0", + "@dusk-network/prettier-config": "1.0.0", "@sveltejs/adapter-static": "2.0.3", "@sveltejs/kit": "1.27.6", "@testing-library/jest-dom": "6.1.4", @@ -52,13 +55,16 @@ "@vitejs/plugin-basic-ssl": "1.0.2", "@vitest/browser": "0.34.6", "@vitest/coverage-v8": "0.34.6", - "@zerodevx/svelte-toast": "^0.9.5", + "@zerodevx/svelte-toast": "0.9.5", "autoprefixer": "10.4.16", - "eslint": "8.54.0", + "eslint": "8.56.0", + "eslint-config-prettier": "9.1.0", "eslint-import-resolver-custom-alias": "1.3.2", "eslint-plugin-svelte": "2.35.1", "jsdom": "23.0.0", "jsdom-worker": "0.3.0", + "prettier": "3.2.5", + "prettier-plugin-svelte": "3.2.1", "postcss-nested": "6.0.1", "svelte": "4.2.7", "svelte-check": "3.6.2", diff --git a/web-wallet/src/app.html b/web-wallet/src/app.html index bb6bc7f624..961f8c05dd 100644 --- a/web-wallet/src/app.html +++ b/web-wallet/src/app.html @@ -1,14 +1,25 @@ - + Dusk Web Wallet - v%sveltekit.env.PUBLIC_APP_VERSION% - - - - + + + + %sveltekit.head% - +
%sveltekit.body%
diff --git a/web-wallet/src/env.d.ts b/web-wallet/src/env.d.ts index 14218c023e..26127e98ce 100644 --- a/web-wallet/src/env.d.ts +++ b/web-wallet/src/env.d.ts @@ -1,3 +1,3 @@ declare const CONFIG: { - LOCAL_STORAGE_APP_KEY: string + LOCAL_STORAGE_APP_KEY: string; }; diff --git a/web-wallet/src/error.html b/web-wallet/src/error.html index ccbc754e74..f4b656c508 100644 --- a/web-wallet/src/error.html +++ b/web-wallet/src/error.html @@ -1,12 +1,12 @@ - + - - - %sveltekit.error.message% - - -

Error

-

Status: %sveltekit.status%

-

Message: %sveltekit.error.message%

- + + + %sveltekit.error.message% + + +

Error

+

Status: %sveltekit.status%

+

Message: %sveltekit.error.message%

+ diff --git a/web-wallet/src/lamb.d.ts b/web-wallet/src/lamb.d.ts index 5f2c390f24..bc73f9a7d9 100644 --- a/web-wallet/src/lamb.d.ts +++ b/web-wallet/src/lamb.d.ts @@ -8,19 +8,19 @@ declare module "lamb" { type FoldAccumulatorCallback< L extends ArrayLike, R, - I extends keyof L & number = any + I extends keyof L & number = any, > = (result: R, current: L[I], idx: I, list: L) => R; type ListIteratorCallback< L extends ArrayLike, R, - I extends keyof L & number = any + I extends keyof L & number = any, > = (element: L[I], idx: I, list: L) => R; type ObjectIteratorCallback< S extends Record, R, - K extends keyof S & string = any + K extends keyof S & string = any, > = (value: S[K], key: K, source: S) => R; type Ord = Number | number | String | string | Boolean | boolean | Date; @@ -28,8 +28,8 @@ declare module "lamb" { /** @see https://dev.to/ecyrbe/how-to-use-advanced-typescript-to-define-a-pipe-function-381h */ type PipeArgs< Fns extends AnyFunction[], - AccFns extends AnyFunction[] = [] - > = Fns extends [(...args: infer A) => infer B] + AccFns extends AnyFunction[] = [], + > = Fns extends [(...args: infer A) => infer B] ? [...AccFns, (...args: A) => B] : Fns extends [(...args: infer A) => any, ...infer Tail] ? Tail extends [(arg: infer B) => any, ...any[]] @@ -39,7 +39,7 @@ declare module "lamb" { type PipeArgsLastReturnType< Fns extends AnyFunction[], - Else = never + Else = never, > = Fns extends [...any[], (...args: any) => infer R] ? R : Else; type Predicate = (v: T) => v is U; @@ -47,7 +47,7 @@ declare module "lamb" { type ReduceAccumulatorCallback< T, L extends ArrayLike, - I extends keyof L & number = any + I extends keyof L & number = any, > = (prev: T, current: L[I], idx: I, list: L) => T; type Sorter = { @@ -65,338 +65,341 @@ declare module "lamb" { * ***** ARRAY ***** * * ------------------------- */ - function append (value: T): (arrayLike: ArrayLike) => Array; + function append(value: T): (arrayLike: ArrayLike) => Array; - function appendTo (arrayLike: ArrayLike, value: T): Array; + function appendTo(arrayLike: ArrayLike, value: T): Array; - function contains (value: T): (arrayLike: ArrayLike) => boolean; + function contains(value: T): (arrayLike: ArrayLike) => boolean; function count< R extends string, L extends ArrayLike, - F extends ListIteratorCallback - > (arrayLike: L, iteratee: F): Record; + F extends ListIteratorCallback, + >(arrayLike: L, iteratee: F): Record; function countBy< R extends string, L extends ArrayLike, - F extends ListIteratorCallback - > (iteratee: F): (arrayLike: L) => Record; + F extends ListIteratorCallback, + >(iteratee: F): (arrayLike: L) => Record; - function difference (a: ArrayLike, b: ArrayLike): Array; + function difference(a: ArrayLike, b: ArrayLike): Array; - function drop (n: number): (arrayLike: ArrayLike) => Array; + function drop(n: number): (arrayLike: ArrayLike) => Array; - function dropFrom (arrayLike: ArrayLike, n: number): Array; + function dropFrom(arrayLike: ArrayLike, n: number): Array; function dropLastWhile< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => Array; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => Array; function dropWhile< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => Array; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => Array; function every< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => boolean; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => boolean; function everyIn< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): boolean; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): boolean; function filter< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): Array; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): Array; function filterWith< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => Array; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => Array; function find< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): T | undefined; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): T | undefined; function findIndex< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): number; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): number; function findIndexWhere< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => number; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => number; function findLast< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): T | undefined; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): T | undefined; function findLastIndex< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): number; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): number; function findLastIndexWhere< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => number; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => number; function findLastWhere< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => T | undefined; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => T | undefined; function findWhere< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => T | undefined; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => T | undefined; function flatMap< T extends any | any[], R, A extends Array, - F extends ListIteratorCallback - > (array: A, iteratee: F): Array; + F extends ListIteratorCallback, + >(array: A, iteratee: F): Array; function flatMapWith< T extends any | any[], R, A extends Array, - F extends ListIteratorCallback - > (iteratee: F): (array: A) => Array; + F extends ListIteratorCallback, + >(iteratee: F): (array: A) => Array; - function flatten< - T, - U extends T | T[], - A extends Array - > (array: A): Array; + function flatten>( + array: A + ): Array; - function getAt (index: number): (arrayLike: ArrayLike) => T | undefined; + function getAt( + index: number + ): (arrayLike: ArrayLike) => T | undefined; - function getIndex (arrayLike: ArrayLike, index: number): T | undefined; + function getIndex(arrayLike: ArrayLike, index: number): T | undefined; function group< T extends Record, V extends T[keyof T], L extends ArrayLike, - F extends ListIteratorCallback - > (arrayLike: L, iteratee: F): Record>; + F extends ListIteratorCallback, + >(arrayLike: L, iteratee: F): Record>; function groupBy< T extends Record, V extends T[keyof T], L extends ArrayLike, F extends ListIteratorCallback, - > (iteratee: F): (arrayLike: L) => Record>; + >(iteratee: F): (arrayLike: L) => Record>; - function head> (arrayLike: L): L["length"] extends 0 ? undefined : L[0]; + function head>( + arrayLike: L + ): L["length"] extends 0 ? undefined : L[0]; function index< T extends Record, V extends T[keyof T], L extends ArrayLike, - F extends ListIteratorCallback - > (arrayLike: L, iteratee: F): Record; + F extends ListIteratorCallback, + >(arrayLike: L, iteratee: F): Record; function indexBy< T extends Record, V extends T[keyof T], L extends ArrayLike, - F extends ListIteratorCallback - > (iteratee: F): (arrayLike: L) => Record; + F extends ListIteratorCallback, + >(iteratee: F): (arrayLike: L) => Record; - function init (arrayLike: ArrayLike): Array; + function init(arrayLike: ArrayLike): Array; - function insert (arrayLike: ArrayLike, index: number, element: T): Array; + function insert( + arrayLike: ArrayLike, + index: number, + element: T + ): Array; - function insertAt (index: number, element: T): (arrayLike: ArrayLike) => Array; + function insertAt( + index: number, + element: T + ): (arrayLike: ArrayLike) => Array; - function intersection (a: ArrayLike, b: ArrayLike): Array; + function intersection(a: ArrayLike, b: ArrayLike): Array; - function isIn (arrayLike: ArrayLike, value: T): boolean; + function isIn(arrayLike: ArrayLike, value: T): boolean; - function join (arrayLike: ArrayLike, separator: string): string; + function join(arrayLike: ArrayLike, separator: string): string; - function joinWith (separator: string): (arrayLike: ArrayLike) => string; + function joinWith( + separator: string + ): (arrayLike: ArrayLike) => string; - function last> (arrayLike: L): L["length"] extends 0 ? undefined : L[-1]; + function last>( + arrayLike: L + ): L["length"] extends 0 ? undefined : L[-1]; - function list (...values: T[]): Array; + function list(...values: T[]): Array; - function map< - T, - L extends ArrayLike, - R - > (arrayLike: L, iteratee: ListIteratorCallback): Array; + function map, R>( + arrayLike: L, + iteratee: ListIteratorCallback + ): Array; - function mapWith< - T, - L extends ArrayLike, - R - > (iteratee: ListIteratorCallback): (arrayLike: L) => Array; + function mapWith, R>( + iteratee: ListIteratorCallback + ): (arrayLike: L) => Array; function partition< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): [Array, Array]; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): [Array, Array]; function partitionWith< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => [Array, Array]; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => [Array, Array]; - function pluck< - T, - U extends Record, - K extends keyof U - > (key: K): (arrayLike: ArrayLike) => Array; + function pluck, K extends keyof U>( + key: K + ): (arrayLike: ArrayLike) => Array; - function pluckFrom< - T, - U extends Record, - K extends keyof U - > (arrayLike: ArrayLike, key: K): Array; + function pluckFrom, K extends keyof U>( + arrayLike: ArrayLike, + key: K + ): Array; - function pullFrom< - T, - L extends ArrayLike, - V extends ArrayLike - > (arrayLike: L, values: V): Array; + function pullFrom, V extends ArrayLike>( + arrayLike: L, + values: V + ): Array; - function pull< - T, - L extends ArrayLike, - V extends ArrayLike - > (values: V): (arrayLike: L) => Array; + function pull, V extends ArrayLike>( + values: V + ): (arrayLike: L) => Array; function reduceRight< T, L extends ArrayLike, - Acc extends ReduceAccumulatorCallback - > (arrayLike: L, accumulator: Acc): T; + Acc extends ReduceAccumulatorCallback, + >(arrayLike: L, accumulator: Acc): T; function reduceRight< R, L extends ArrayLike, - Acc extends FoldAccumulatorCallback - > (arrayLike: L, accumulator: Acc, initialValue: R): R; + Acc extends FoldAccumulatorCallback, + >(arrayLike: L, accumulator: Acc, initialValue: R): R; function reduceRightWith< T, L extends ArrayLike, - Acc extends ReduceAccumulatorCallback - > (accumulator: Acc): (arrayLike: L) => T; + Acc extends ReduceAccumulatorCallback, + >(accumulator: Acc): (arrayLike: L) => T; function reduceRightWith< R, L extends ArrayLike, - Acc extends FoldAccumulatorCallback - > (accumulator: Acc, initialValue: R): (list: L) => R; + Acc extends FoldAccumulatorCallback, + >(accumulator: Acc, initialValue: R): (list: L) => R; - function reverse< - T, - L extends ArrayLike - > (arrayLike: L): Array; + function reverse>(arrayLike: L): Array; - function rotate< - T, - L extends ArrayLike - > (arrayLike: L, amount: number): Array; + function rotate>( + arrayLike: L, + amount: number + ): Array; - function rotateBy< - T, - L extends ArrayLike - > (amount: number): (arrayLike: L) => Array; + function rotateBy>( + amount: number + ): (arrayLike: L) => Array; - function setAt< - T, - L extends ArrayLike - > (index: number, value: T): (arrayLike: L) => Array; + function setAt>( + index: number, + value: T + ): (arrayLike: L) => Array; - function setIndex< - T, - L extends ArrayLike - > (arrayLike: L, index: number, value: T): Array; + function setIndex>( + arrayLike: L, + index: number, + value: T + ): Array; - function shallowFlatten< - T, - U extends T | T[] - > (array: Array): Array; + function shallowFlatten(array: Array): Array; function some< T, L extends ArrayLike, - P extends ListIteratorCallback - > (predicate: P): (arrayLike: L) => boolean; + P extends ListIteratorCallback, + >(predicate: P): (arrayLike: L) => boolean; function someIn< T, L extends ArrayLike, - P extends ListIteratorCallback - > (arrayLike: L, predicate: P): boolean; + P extends ListIteratorCallback, + >(arrayLike: L, predicate: P): boolean; function sort< T, L extends ArrayLike, - S extends Array | SorterReader> = [Sorter] - > (arrayLike: L, sorters?: S): Array; + S extends Array | SorterReader> = [ + Sorter, + ], + >(arrayLike: L, sorters?: S): Array; function sortedInsert< T, L extends ArrayLike, - S extends Array | SorterReader> = [Sorter] - > (arrayLike: L, element: T, sorters?: S): Array; + S extends Array | SorterReader> = [ + Sorter, + ], + >(arrayLike: L, element: T, sorters?: S): Array; - function sorter< - T, - RD extends SorterReader = (value: T) => T, - > (reader?: RD, comparer?: SorterComparer): Sorter; + function sorter = (value: T) => T>( + reader?: RD, + comparer?: SorterComparer + ): Sorter; - function sorterDesc< - T, - RD extends SorterReader = (value: T) => T, - > (reader?: RD, comparer?: SorterComparer): Sorter; + function sorterDesc = (value: T) => T>( + reader?: RD, + comparer?: SorterComparer + ): Sorter; function sortWith< T, L extends ArrayLike, - S extends Array | SorterReader> = [Sorter] - > (sorters?: S): (arrayLike: L) => Array; + S extends Array | SorterReader> = [ + Sorter, + ], + >(sorters?: S): (arrayLike: L) => Array; - function take< - T, - L extends ArrayLike - > (amount: number): (arrayLike: L) => Array; + function take>( + amount: number + ): (arrayLike: L) => Array; - function uniques (arrayLike: ArrayLike): Array; + function uniques(arrayLike: ArrayLike): Array; function uniquesBy< T, L extends ArrayLike, - F extends ListIteratorCallback - > (iteratee: F): (arrayLike: L) => Array; + F extends ListIteratorCallback, + >(iteratee: F): (arrayLike: L) => Array; /* ------------------------- * * ***** CORE ***** * @@ -404,69 +407,71 @@ declare module "lamb" { type __ = {}; - function always (value: T): (...args: unknown[]) => T; + function always(value: T): (...args: unknown[]) => T; - function areSVZ (a: any, b: any): boolean; + function areSVZ(a: any, b: any): boolean; - function binary< - A, - B, - R, - F extends (...args: [A, B, ...any[]]) => R - > (fn: F): (a: A, b: B) => R; - - function clamp (n: number, min: number, max: number): number; - - function clampWithin (min: number, max: number): (n: number) => number; - - function compose< - A, - B, - C - > (f: UnaryFunction, g: UnaryFunction): (value: A) => C; - function compose< - A extends any[], - B, - C - > (f: UnaryFunction, g: (...args: A) => B): (...values: A) => C; - - function partial< - Args extends (any | __)[], - F extends AnyFunction - > (fn: F, args: Args): (...args: any[]) => ReturnType; - - function partialRight< - Args extends (any | __)[], - F extends AnyFunction - > (fn: F, args: Args): (...args: any[]) => ReturnType; + function binary R>( + fn: F + ): (a: A, b: B) => R; + + function clamp(n: number, min: number, max: number): number; + + function clampWithin(min: number, max: number): (n: number) => number; + + function compose( + f: UnaryFunction, + g: UnaryFunction + ): (value: A) => C; + function compose( + f: UnaryFunction, + g: (...args: A) => B + ): (...values: A) => C; + + function partial( + fn: F, + args: Args + ): (...args: any[]) => ReturnType; + + function partialRight( + fn: F, + args: Args + ): (...args: any[]) => ReturnType; function reduce< T, L extends ArrayLike, - Acc extends ReduceAccumulatorCallback - > (arrayLike: L, accumulator: Acc): T; + Acc extends ReduceAccumulatorCallback, + >(arrayLike: L, accumulator: Acc): T; function reduce< R, L extends ArrayLike, - Acc extends FoldAccumulatorCallback - > (arrayLike: L, accumulator: Acc, initialValue: R): R; + Acc extends FoldAccumulatorCallback, + >(arrayLike: L, accumulator: Acc, initialValue: R): R; function reduceWith< T, L extends ArrayLike, - Acc extends ReduceAccumulatorCallback - > (accumulator: Acc): (arrayLike: L) => T; + Acc extends ReduceAccumulatorCallback, + >(accumulator: Acc): (arrayLike: L) => T; function reduceWith< R, L extends ArrayLike, - Acc extends FoldAccumulatorCallback - > (accumulator: Acc, initialValue: R): (list: L) => R; + Acc extends FoldAccumulatorCallback, + >(accumulator: Acc, initialValue: R): (list: L) => R; - function slice (arrayLike: ArrayLike, start: number, end: number): Array; + function slice( + arrayLike: ArrayLike, + start: number, + end: number + ): Array; - function sliceAt (start: number, end: number): (arrayLike: ArrayLike) => Array; + function sliceAt( + start: number, + end: number + ): (arrayLike: ArrayLike) => Array; - function type (value: any): string; + function type(value: any): string; /* ------------------------- * * ***** FUNCTION ***** * @@ -476,90 +481,91 @@ declare module "lamb" { T, Args extends any[], Fns extends Array<(...args: Args) => T>, - > (functions: Fns): (...args: Args) => T[]; - - function invokeOn< - TG extends Object - > (target: TG): (method: M, ...args: any[]) => M extends keyof TG + >(functions: Fns): (...args: Args) => T[]; + + function invokeOn( + target: TG + ): ( + method: M, + ...args: any[] + ) => M extends keyof TG ? TG[M] extends AnyFunction ? ReturnType : never : undefined; - function pipe (functions: []): (...args: Args) => Args["length"] extends 0 ? undefined : typeof args[0]; + function pipe( + functions: [] + ): ( + ...args: Args + ) => Args["length"] extends 0 ? undefined : (typeof args)[0]; function pipe< Fns extends AnyFunction[], Args extends Parameters, - R extends PipeArgsLastReturnType> - > (functions: PipeArgs extends Fns ? Fns : PipeArgs): (...args: Args) => R; + R extends PipeArgsLastReturnType>, + >( + functions: PipeArgs extends Fns ? Fns : PipeArgs + ): (...args: Args) => R; - function unary (fn: (a: T, ...args: any[]) => R): UnaryFunction; + function unary(fn: (a: T, ...args: any[]) => R): UnaryFunction; /* ------------------------- * * ***** LOGIC ***** * * ------------------------- */ - function allOf< - T, - P extends (value: T) => boolean - > (predicates: Array

): P; + function allOf boolean>(predicates: Array

): P; - function anyOf< - T, - P extends (value: T) => boolean - > (predicates: Array

): P; + function anyOf boolean>(predicates: Array

): P; - function condition< - T, - U extends T, - TR, - FR, - P extends Predicate - > (predicate: P, trueFn: (value: U) => TR, falseFn: (value: Exclude) => FR): (value: T) => U extends T ? TR : FR; + function condition>( + predicate: P, + trueFn: (value: U) => TR, + falseFn: (value: Exclude) => FR + ): (value: T) => U extends T ? TR : FR; - function gt (a: Ord, b: Ord): boolean; + function gt(a: Ord, b: Ord): boolean; - function gte (a: Ord, b: Ord): boolean; + function gte(a: Ord, b: Ord): boolean; - function lt (a: Ord, b: Ord): boolean; + function lt(a: Ord, b: Ord): boolean; - function lte (a: Ord, b: Ord): boolean; + function lte(a: Ord, b: Ord): boolean; - function isGT (b: Ord): (a: Ord) => boolean; + function isGT(b: Ord): (a: Ord) => boolean; - function isGTE (b: Ord): (a: Ord) => boolean; + function isGTE(b: Ord): (a: Ord) => boolean; - function isLT (b: Ord): (a: Ord) => boolean; + function isLT(b: Ord): (a: Ord) => boolean; - function isLTE (b: Ord): (a: Ord) => boolean; + function isLTE(b: Ord): (a: Ord) => boolean; function unless< R, T, U extends T, P extends Predicate, - F extends UnaryFunction, R> - > (predicate: P, fn: F): (value: T | U) => U extends T ? T : R; + F extends UnaryFunction, R>, + >(predicate: P, fn: F): (value: T | U) => U extends T ? T : R; function unless< R, T, P extends UnaryFunction, - F extends UnaryFunction - > (predicate: P, fn: F): (value: T) => ReturnType

extends true ? T : R; + F extends UnaryFunction, + >(predicate: P, fn: F): (value: T) => ReturnType

extends true ? T : R; function when< R, T, U extends T, P extends Predicate, - F extends UnaryFunction, R> - > (predicate: P, fn: F): (value: T | U) => U extends T ? T : T; + F extends UnaryFunction, R>, + >(predicate: P, fn: F): (value: T | U) => U extends T ? T : T; function when< R, T, P extends UnaryFunction, - F extends UnaryFunction - > (predicate: P, fn: F): (value: T) => ReturnType

extends true ? R : T; + F extends UnaryFunction, + >(predicate: P, fn: F): (value: T) => ReturnType

extends true ? R : T; /* ------------------------- * * ***** MATH ***** * @@ -571,99 +577,100 @@ declare module "lamb" { * ***** OBJECT ***** * * ------------------------- */ - function enumerables< - K extends PropertyKey, - S extends Record - > (source: S): Array; + function enumerables>( + source: S + ): Array; - function getKey< - K extends PropertyKey, - S extends Record - > (key: K): (source: S) => K extends keyof S ? S[K] : undefined; + function getKey>( + key: K + ): (source: S) => K extends keyof S ? S[K] : undefined; - function getPath< - T, - S extends Record - > (path: string, separator?: string): (source: S) => T | undefined; + function getPath>( + path: string, + separator?: string + ): (source: S) => T | undefined; - function getPathIn< - T, - S extends Record - > (source: S, path: string, separator?: string): T | undefined; + function getPathIn>( + source: S, + path: string, + separator?: string + ): T | undefined; - function hasKeyValue< - K extends PropertyKey, - T, - S extends Record - > (key: K, value: T): (source: S) => boolean; + function hasKeyValue>( + key: K, + value: T + ): (source: S) => boolean; - function hasPathValue< - T, - S extends Record - > (path: string, value: T): (source: S) => boolean; + function hasPathValue>( + path: string, + value: T + ): (source: S) => boolean; - function keys, K extends keyof S> (source: S): Array; + function keys, K extends keyof S>( + source: S + ): Array; function mapValues< T, U, S extends Record, - F extends ObjectIteratorCallback - > (source: S, fn: F): Record; + F extends ObjectIteratorCallback, + >(source: S, fn: F): Record; function mapValuesWith< T, U, S extends Record, - F extends ObjectIteratorCallback - > (fn: F): (source: S) => Record; + F extends ObjectIteratorCallback, + >(fn: F): (source: S) => Record; function ownPairs< S extends Record, - K extends keyof S & string - > (source: S): Array<[K, S[K]]>; + K extends keyof S & string, + >(source: S): Array<[K, S[K]]>; - function pick< - S extends Record, - K extends string - > (whitelist: K[]): (source: S) => Pick; + function pick, K extends string>( + whitelist: K[] + ): (source: S) => Pick; function pickIf< S extends Record, - P extends ObjectIteratorCallback - > (predicate: P): (source: S) => Partial; + P extends ObjectIteratorCallback, + >(predicate: P): (source: S) => Partial; - function pickIn< - S extends Record, - K extends string - > (source: S, whitelist: K[]): Pick; + function pickIn, K extends string>( + source: S, + whitelist: K[] + ): Pick; function rename< DK extends string, KM extends Record, - S extends Record - > (keyMap: KM): (source: S) => { [K in keyof S as K extends keyof KM ? KM[K] : K]: S[K] }; + S extends Record, + >( + keyMap: KM + ): (source: S) => { + [K in keyof S as K extends keyof KM ? KM[K] : K]: S[K]; + }; - function setKey< - S extends Record, - T, - K extends string - > (key: K, value: T): (source: S) => S & { [k in K]: T }; + function setKey, T, K extends string>( + key: K, + value: T + ): (source: S) => S & { [k in K]: T }; - function skip< - S extends Record, - K extends string - > (blacklist: K[]): (source: S) => Omit; + function skip, K extends string>( + blacklist: K[] + ): (source: S) => Omit; function skipIf< S extends Record, - P extends ObjectIteratorCallback - > (predicate: P): (source: S) => Partial; + P extends ObjectIteratorCallback, + >(predicate: P): (source: S) => Partial; - function skipIn< - S extends Record, - K extends string - > (source: S, blacklist: K[]): Omit; + function skipIn, K extends string>( + source: S, + blacklist: K[] + ): Omit; /* ------------------------- * * ***** PRIVATES ***** * @@ -677,11 +684,11 @@ declare module "lamb" { * ***** TYPE ***** * * ------------------------- */ - function isNil (value: any): value is null | undefined; + function isNil(value: any): value is null | undefined; - function isNull (value: any): value is null; + function isNull(value: any): value is null; - function isUndefined (value: any): value is undefined; + function isUndefined(value: any): value is undefined; - function isType (typeName: string): Predicate; + function isType(typeName: string): Predicate; } diff --git a/web-wallet/src/lib/components/AddressPicker/AddressPicker.css b/web-wallet/src/lib/components/AddressPicker/AddressPicker.css index 4d7cc9adef..79a6d67bdf 100644 --- a/web-wallet/src/lib/components/AddressPicker/AddressPicker.css +++ b/web-wallet/src/lib/components/AddressPicker/AddressPicker.css @@ -1,103 +1,105 @@ .address-picker { - position: relative; - background-color: var(--surface-color); - padding: 1em; - border-radius: 1.25rem; - user-select: none; - z-index: 2; + position: relative; + background-color: var(--surface-color); + padding: 1em; + border-radius: 1.25rem; + user-select: none; + z-index: 2; } .address-picker__current-address { - width: 100%; - text-align: center; - font-family: monospace; + width: 100%; + text-align: center; + font-family: monospace; } .address-picker__copy-address-button-wrapper { - background-color: var(--secondary-color); - border-radius: 50%; + background-color: var(--secondary-color); + border-radius: 50%; } .address-picker__copy-address-button { - aspect-ratio: 1/1; - width: 1.5em; + aspect-ratio: 1/1; + width: 1.5em; } .address-picker__copy-address-button:hover { - cursor: copy; + cursor: copy; } -.address-picker__copy-address-button, .address-picker__copy-address-button:hover { - color: var(--primary-color) !important; +.address-picker__copy-address-button, +.address-picker__copy-address-button:hover { + color: var(--primary-color) !important; } .address-picker__address { - max-width: 100%; - all: unset; + max-width: 100%; + all: unset; } -.address-picker__address:hover, .address-picker__address--selected { - color: var(--secondary-color); +.address-picker__address:hover, +.address-picker__address--selected { + color: var(--secondary-color); } .address-picker__address:hover { - cursor: pointer; + cursor: pointer; } .address-picker__trigger { - display: flex; - justify-content: center; - align-items: center; - gap: var(--default-gap); + display: flex; + justify-content: center; + align-items: center; + gap: var(--default-gap); } .address-picker__drop-down { - display: flex; - position: absolute; - top: 100%; - left: 0; - z-index: 2; + display: flex; + position: absolute; + top: 100%; + left: 0; + z-index: 2; - background-color: var(--surface-color); - padding: 0 1em 1em 1em; - border-bottom-left-radius: 1.25rem; - border-bottom-right-radius: 1.25rem; + background-color: var(--surface-color); + padding: 0 1em 1em 1em; + border-bottom-left-radius: 1.25rem; + border-bottom-right-radius: 1.25rem; - flex-direction: column; - gap: var(--default-gap); - align-items: center; - width: 100%; + flex-direction: column; + gap: var(--default-gap); + align-items: center; + width: 100%; } .address-picker__address-options { - overflow-y: auto; - width: 100%; - max-height: 20svh; + overflow-y: auto; + width: 100%; + max-height: 20svh; } .address-picker__address-option-button { - all: unset; - text-overflow: ellipsis; - overflow: hidden; - width: 100%; - display: block; - text-align: center; - padding: .5em 0; + all: unset; + text-overflow: ellipsis; + overflow: hidden; + width: 100%; + display: block; + text-align: center; + padding: 0.5em 0; } .address-picker__generating-address-wrapper { - display: flex; - flex-direction: row; - align-self: flex-start; - gap: var(--small-gap) + display: flex; + flex-direction: row; + align-self: flex-start; + gap: var(--small-gap); } .address-picker--expanded { - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } .address-picker__generate-address-button { - text-align: left; - width: 100% + text-align: left; + width: 100%; } diff --git a/web-wallet/src/lib/components/AddressPicker/AddressPicker.svelte b/web-wallet/src/lib/components/AddressPicker/AddressPicker.svelte index 8322224a93..f1bb5cbada 100644 --- a/web-wallet/src/lib/components/AddressPicker/AddressPicker.svelte +++ b/web-wallet/src/lib/components/AddressPicker/AddressPicker.svelte @@ -1,13 +1,23 @@ - + {#if expanded} - + {/if}

- + class:address-picker--expanded={expanded} +>
- - + on:keydown={handleDropDownKeyDown} + > + + -

{middleEllipsis( - currentAddress, - calculateAdaptiveCharCount(screenWidth) - )}

+

+ {middleEllipsis( + currentAddress, + calculateAdaptiveCharCount(screenWidth) + )} +

+ }}>{address} {/each} -
+
{#if isAddingAddress}
- +

Generating Address

- + {:else}
{/if} diff --git a/web-wallet/src/lib/components/Balance/Balance.svelte b/web-wallet/src/lib/components/Balance/Balance.svelte index 2f2122c4fa..ac81b0da84 100644 --- a/web-wallet/src/lib/components/Balance/Balance.svelte +++ b/web-wallet/src/lib/components/Balance/Balance.svelte @@ -1,4 +1,4 @@ - + -
+

Your Balance:

@@ -60,5 +54,5 @@

{/if} - +
diff --git a/web-wallet/src/lib/components/ContractOperations/ContractOperations.svelte b/web-wallet/src/lib/components/ContractOperations/ContractOperations.svelte index 27c346b52e..5a6f6cf43c 100644 --- a/web-wallet/src/lib/components/ContractOperations/ContractOperations.svelte +++ b/web-wallet/src/lib/components/ContractOperations/ContractOperations.svelte @@ -1,4 +1,4 @@ - + @@ -35,9 +35,11 @@ disabled={operation.disabled} icon={{ path: operationIcons[operation.id] ?? mdiHelpCircleOutline, - size: "normal" + size: "normal", + }} + on:click={() => { + dispatch("operationChange", operation.id); }} - on:click={() => { dispatch("operationChange", operation.id); }} text={operation.label} variant={operation.primary ? "secondary" : "tertiary"} /> @@ -49,7 +51,8 @@ .contract-operations { list-style-type: none; - &, &__operation { + &, + &__operation { width: 100%; } diff --git a/web-wallet/src/lib/components/ContractStatusesList/ContractStatusesList.svelte b/web-wallet/src/lib/components/ContractStatusesList/ContractStatusesList.svelte index c0fbd74f0d..de878a4066 100644 --- a/web-wallet/src/lib/components/ContractStatusesList/ContractStatusesList.svelte +++ b/web-wallet/src/lib/components/ContractStatusesList/ContractStatusesList.svelte @@ -1,4 +1,4 @@ - +
- diff --git a/web-wallet/src/lib/components/GasSettings/GasSettings.svelte b/web-wallet/src/lib/components/GasSettings/GasSettings.svelte index 73f40b0c00..a569bb39fa 100644 --- a/web-wallet/src/lib/components/GasSettings/GasSettings.svelte +++ b/web-wallet/src/lib/components/GasSettings/GasSettings.svelte @@ -27,7 +27,7 @@
- +
- +
@@ -332,6 +338,6 @@ } :global(.operation__send-address--invalid) { - color: var(--error-color); + color: var(--error-color); } diff --git a/web-wallet/src/lib/components/Stake/Stake.svelte b/web-wallet/src/lib/components/Stake/Stake.svelte index 387cd10cd0..65c5ed99f5 100644 --- a/web-wallet/src/lib/components/Stake/Stake.svelte +++ b/web-wallet/src/lib/components/Stake/Stake.svelte @@ -1,9 +1,13 @@ - +
@@ -72,14 +77,16 @@ {#await items} - + {:then transactions}
{#if transactions.length} {#each getOrderedTransactions(transactions) as transaction (transaction.id)}
Hash
-
+
{middleEllipsis( transaction.id, - calculateAdaptiveCharCount(screenWidth, 320, 640, 5, 20) + calculateAdaptiveCharCount( + screenWidth, + 320, + 640, + 5, + 20 + ) )} @@ -96,12 +109,17 @@ {#if transaction.tx_type}
Type
- +
{/if}
Block
- {new Intl.NumberFormat(language).format(transaction.block_height)} + {new Intl.NumberFormat(language).format( + transaction.block_height + )}
Amount
@@ -131,109 +149,108 @@ {/each} {:else}
- +

You have no transaction history

{/if}
- {:catch e} - + {/await} -
diff --git a/web-wallet/src/lib/components/__tests__/AddressPicker.spec.js b/web-wallet/src/lib/components/__tests__/AddressPicker.spec.js index 3179b1632a..ecbf7aaada 100644 --- a/web-wallet/src/lib/components/__tests__/AddressPicker.spec.js +++ b/web-wallet/src/lib/components/__tests__/AddressPicker.spec.js @@ -8,7 +8,7 @@ import { AddressPicker } from ".."; global.ResizeObserver = vi.fn().mockImplementation(() => ({ observe: vi.fn(), unobserve: vi.fn(), - disconnect: vi.fn() + disconnect: vi.fn(), })); describe("AddressPicker", () => { @@ -19,8 +19,8 @@ describe("AddressPicker", () => { beforeEach(() => { Object.assign(navigator, { clipboard: { - writeText: vi.fn().mockResolvedValue(undefined) - } + writeText: vi.fn().mockResolvedValue(undefined), + }, }); }); @@ -39,6 +39,8 @@ describe("AddressPicker", () => { await fireEvent.click(component); - expect(navigator.clipboard.writeText).toHaveBeenCalledWith(currentAddress); + expect(navigator.clipboard.writeText).toHaveBeenCalledWith( + currentAddress + ); }); }); diff --git a/web-wallet/src/lib/components/__tests__/Balance.spec.js b/web-wallet/src/lib/components/__tests__/Balance.spec.js index b5d5594d9c..d517306512 100644 --- a/web-wallet/src/lib/components/__tests__/Balance.spec.js +++ b/web-wallet/src/lib/components/__tests__/Balance.spec.js @@ -1,9 +1,4 @@ -import { - afterEach, - describe, - expect, - it -} from "vitest"; +import { afterEach, describe, expect, it } from "vitest"; import { cleanup, render } from "@testing-library/svelte"; import { skipIn } from "lamb"; @@ -15,11 +10,11 @@ describe("Balance", () => { fiatPrice: 10, locale: "en", tokenCurrency: "DUSK", - tokens: 2000000 + tokens: 2000000, }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; afterEach(cleanup); @@ -40,7 +35,7 @@ describe("Balance", () => { fiatPrice: 20, locale: "it", tokenCurrency: "DUSK", - tokens: 4000000 + tokens: 4000000, }); expect(container.firstChild).toMatchSnapshot(); @@ -50,9 +45,12 @@ describe("Balance", () => { const props = { ...baseProps, className: "foo bar", - id: "balance" + id: "balance", }; - const { container, rerender } = render(Balance, { ...baseOptions, props }); + const { container, rerender } = render(Balance, { + ...baseOptions, + props, + }); expect(container.firstChild).toHaveClass("foo bar"); expect(container.firstChild).toHaveAttribute("id", "balance"); @@ -60,7 +58,7 @@ describe("Balance", () => { rerender({ ...props, className: "qux", - id: "new-balance" + id: "new-balance", }); expect(container.firstChild).toHaveClass("qux"); diff --git a/web-wallet/src/lib/components/__tests__/ContractOperations.spec.js b/web-wallet/src/lib/components/__tests__/ContractOperations.spec.js index b58336251d..c7eedef8a9 100644 --- a/web-wallet/src/lib/components/__tests__/ContractOperations.spec.js +++ b/web-wallet/src/lib/components/__tests__/ContractOperations.spec.js @@ -1,50 +1,46 @@ -import { - afterEach, - describe, - expect, - it, - vi -} from "vitest"; -import { - cleanup, - fireEvent, - render -} from "@testing-library/svelte"; +import { afterEach, describe, expect, it, vi } from "vitest"; +import { cleanup, fireEvent, render } from "@testing-library/svelte"; import { ContractOperations } from ".."; describe("ContractOperations", () => { const baseProps = { - items: [{ - disabled: false, - id: "send", - label: "Send", - primary: true - }, { - disabled: false, - id: "receive", - label: "Receive", - primary: false - }, { - disabled: true, - id: "stake", - label: "stake", - primary: true - }, { - disabled: false, - id: "unstake", - label: "unstake", - primary: false - }, { - disabled: false, - id: "withdraw-rewards", - label: "withdraw rewards", - primary: false - }] + items: [ + { + disabled: false, + id: "send", + label: "Send", + primary: true, + }, + { + disabled: false, + id: "receive", + label: "Receive", + primary: false, + }, + { + disabled: true, + id: "stake", + label: "stake", + primary: true, + }, + { + disabled: false, + id: "unstake", + label: "unstake", + primary: false, + }, + { + disabled: false, + id: "withdraw-rewards", + label: "withdraw rewards", + primary: false, + }, + ], }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; afterEach(cleanup); @@ -58,9 +54,12 @@ describe("ContractOperations", () => { it("should be able to render the component without items", () => { const props = { ...baseProps, - items: [] + items: [], }; - const { container } = render(ContractOperations, { ...baseOptions, props }); + const { container } = render(ContractOperations, { + ...baseOptions, + props, + }); expect(container.firstChild).toMatchSnapshot(); }); @@ -68,21 +67,29 @@ describe("ContractOperations", () => { it("should use a default icon if the operation is not on the known list", () => { const props = { ...baseProps, - items: [{ - disabled: false, - id: "foo-operation", - label: "Foo operation", - primary: true - }] + items: [ + { + disabled: false, + id: "foo-operation", + label: "Foo operation", + primary: true, + }, + ], }; - const { container } = render(ContractOperations, { ...baseOptions, props }); + const { container } = render(ContractOperations, { + ...baseOptions, + props, + }); expect(container.firstChild).toMatchSnapshot(); }); - it("should dispatch a \"operationChange\" event when a operation button is clicked", () => { + it('should dispatch a "operationChange" event when a operation button is clicked', () => { const handleOperationChange = vi.fn(); - const { component, getByRole } = render(ContractOperations, baseOptions); + const { component, getByRole } = render( + ContractOperations, + baseOptions + ); const btnReceive = getByRole("button", { name: "Receive" }); component.$on("operationChange", handleOperationChange); diff --git a/web-wallet/src/lib/components/__tests__/ContractStatusesList.spec.js b/web-wallet/src/lib/components/__tests__/ContractStatusesList.spec.js index bccd05e52c..5c93d74473 100644 --- a/web-wallet/src/lib/components/__tests__/ContractStatusesList.spec.js +++ b/web-wallet/src/lib/components/__tests__/ContractStatusesList.spec.js @@ -1,29 +1,28 @@ -import { - afterEach, - describe, - expect, - it -} from "vitest"; +import { afterEach, describe, expect, it } from "vitest"; import { cleanup, render } from "@testing-library/svelte"; import { ContractStatusesList } from ".."; describe("ContractStatusesList", () => { const baseProps = { - items: [{ - "label": "Spendable", - "value": "99,899.999724165" - }, { - "label": "Total Locked", - "value": "1,000.000000000" - }, { - "label": "Rewards", - "value": "99,288.000000000" - }] + items: [ + { + label: "Spendable", + value: "99,899.999724165", + }, + { + label: "Total Locked", + value: "1,000.000000000", + }, + { + label: "Rewards", + value: "99,288.000000000", + }, + ], }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; afterEach(cleanup); @@ -37,9 +36,12 @@ describe("ContractStatusesList", () => { it("should be able to render the component without items", () => { const props = { ...baseProps, - items: [] + items: [], }; - const { container } = render(ContractStatusesList, { ...baseOptions, props }); + const { container } = render(ContractStatusesList, { + ...baseOptions, + props, + }); expect(container.firstChild).toMatchSnapshot(); }); diff --git a/web-wallet/src/lib/components/__tests__/GasControls.spec.js b/web-wallet/src/lib/components/__tests__/GasControls.spec.js index 8034599224..aa18a1e17f 100644 --- a/web-wallet/src/lib/components/__tests__/GasControls.spec.js +++ b/web-wallet/src/lib/components/__tests__/GasControls.spec.js @@ -1,15 +1,5 @@ -import { - afterEach, - describe, - expect, - it, - vi -} from "vitest"; -import { - cleanup, - fireEvent, - render -} from "@testing-library/svelte"; +import { afterEach, describe, expect, it, vi } from "vitest"; +import { cleanup, fireEvent, render } from "@testing-library/svelte"; import { GasControls } from ".."; /** @@ -17,10 +7,11 @@ import { GasControls } from ".."; * @param {*} value * @returns {Promise} */ -const fireInput = (input, value) => fireEvent.input(input, { target: { value } }); +const fireInput = (input, value) => + fireEvent.input(input, { target: { value } }); /** @param {HTMLElement} element */ -function asInput (element) { +function asInput(element) { // eslint-disable-next-line no-extra-parens return /** @type {HTMLInputElement} */ (element); } @@ -31,11 +22,11 @@ describe("GasControls", () => { limitLower: 10, limitUpper: 100, price: 10, - priceLower: 1 + priceLower: 1, }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; const eventHandler = vi.fn(); @@ -57,7 +48,7 @@ describe("GasControls", () => { expect(container).toMatchSnapshot(); }); - it("should dispatch a \"gasSettings\" event when the price or the limit are changed with valid gas settings", async () => { + it('should dispatch a "gasSettings" event when the price or the limit are changed with valid gas settings', async () => { const { component, getByLabelText } = render(GasControls, baseOptions); const priceInput = asInput(getByLabelText(/price/i)); const limitInput = asInput(getByLabelText(/limit/i)); @@ -70,7 +61,7 @@ describe("GasControls", () => { expect(eventHandler.mock.lastCall[0].detail).toStrictEqual({ isValidGas: true, limit: baseProps.limit, - price: 15 + price: 15, }); expect(priceInput.valueAsNumber).toBe(15); @@ -80,13 +71,13 @@ describe("GasControls", () => { expect(eventHandler.mock.lastCall[0].detail).toStrictEqual({ isValidGas: true, limit: 25, - price: 15 + price: 15, }); expect(limitInput.valueAsNumber).toBe(25); expect(priceInput.max).toBe("25"); }); - it("should dispatch a \"gasSettings\" event when the price or the limit are changed with invalid gas settings", async () => { + it('should dispatch a "gasSettings" event when the price or the limit are changed with invalid gas settings', async () => { const { component, getByLabelText } = render(GasControls, baseOptions); const priceInput = asInput(getByLabelText(/price/i)); const limitInput = asInput(getByLabelText(/limit/i)); @@ -99,7 +90,7 @@ describe("GasControls", () => { expect(eventHandler.mock.lastCall[0].detail).toStrictEqual({ isValidGas: false, limit: baseProps.limit, - price: 25 + price: 25, }); expect(priceInput.valueAsNumber).toBe(25); @@ -109,7 +100,7 @@ describe("GasControls", () => { expect(eventHandler.mock.lastCall[0].detail).toStrictEqual({ isValidGas: false, limit: 105, - price: 25 + price: 25, }); expect(limitInput.valueAsNumber).toBe(105); expect(priceInput.max).toBe("105"); diff --git a/web-wallet/src/lib/components/__tests__/GasFee.spec.js b/web-wallet/src/lib/components/__tests__/GasFee.spec.js index 08a75a9607..79d2410129 100644 --- a/web-wallet/src/lib/components/__tests__/GasFee.spec.js +++ b/web-wallet/src/lib/components/__tests__/GasFee.spec.js @@ -1,9 +1,4 @@ -import { - afterEach, - describe, - expect, - it -} from "vitest"; +import { afterEach, describe, expect, it } from "vitest"; import { cleanup, render } from "@testing-library/svelte"; import { GasFee } from ".."; @@ -14,17 +9,21 @@ import { createCurrencyFormatter } from "$lib/dusk/currency"; describe("GasFee", () => { const settings = get(settingsStore); const duskFormatter = createCurrencyFormatter(settings.language, "DUSK", 9); - const fee = duskFormatter(settings.gasPrice * settings.gasLimit * 0.000000001); + const fee = duskFormatter( + settings.gasPrice * settings.gasLimit * 0.000000001 + ); afterEach(cleanup); it("renders the GasFee component", () => { const baseProps = { - fee: fee + fee: fee, }; const { container } = render(GasFee, baseProps); - expect(container.querySelector(".gas-fee__amount-value")?.innerHTML).toBe(fee); + expect( + container.querySelector(".gas-fee__amount-value")?.innerHTML + ).toBe(fee); expect(container.firstChild).toMatchSnapshot(); }); diff --git a/web-wallet/src/lib/components/__tests__/GasSettings.spec.js b/web-wallet/src/lib/components/__tests__/GasSettings.spec.js index 040d647ae0..e22928fe47 100644 --- a/web-wallet/src/lib/components/__tests__/GasSettings.spec.js +++ b/web-wallet/src/lib/components/__tests__/GasSettings.spec.js @@ -1,10 +1,4 @@ -import { - afterEach, - describe, - expect, - it, - vi -} from "vitest"; +import { afterEach, describe, expect, it, vi } from "vitest"; import { cleanup, fireEvent, render } from "@testing-library/svelte"; import { GasSettings } from ".."; @@ -15,7 +9,9 @@ import { createCurrencyFormatter } from "$lib/dusk/currency"; describe("GasSettings", () => { const settings = get(settingsStore); const duskFormatter = createCurrencyFormatter(settings.language, "DUSK", 9); - const fee = duskFormatter(settings.gasPrice * settings.gasLimit * 0.000000001); + const fee = duskFormatter( + settings.gasPrice * settings.gasLimit * 0.000000001 + ); const baseProps = { fee: fee, @@ -23,12 +19,12 @@ describe("GasSettings", () => { limitLower: 10000000, limitUpper: 1000000000, price: 1, - priceLower: 1 + priceLower: 1, }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; afterEach(cleanup); @@ -49,9 +45,12 @@ describe("GasSettings", () => { expect(container.firstChild).toMatchSnapshot(); }); - it("checks \"gasSettings\" event is dispatched on click with the correct event data", async () => { + it('checks "gasSettings" event is dispatched on click with the correct event data', async () => { const eventHandler = vi.fn(); - const { component, getByRole, getAllByRole } = render(GasSettings, baseOptions); + const { component, getByRole, getAllByRole } = render( + GasSettings, + baseOptions + ); const editButton = getByRole("button", { name: "EDIT" }); expect(() => getAllByRole("spinbutton")).toThrow(); @@ -62,22 +61,26 @@ describe("GasSettings", () => { const [priceInput, limitInput] = getAllByRole("spinbutton"); - await fireEvent.input(limitInput, { target: { value: baseProps.limitLower } }); + await fireEvent.input(limitInput, { + target: { value: baseProps.limitLower }, + }); expect(eventHandler).toHaveBeenCalledTimes(1); expect(eventHandler.mock.lastCall[0].detail).toStrictEqual({ isValidGas: true, limit: baseProps.limitLower, - price: baseProps.price + price: baseProps.price, }); - await fireEvent.input(priceInput, { target: { value: baseProps.price * 2 } }); + await fireEvent.input(priceInput, { + target: { value: baseProps.price * 2 }, + }); expect(eventHandler).toHaveBeenCalledTimes(2); expect(eventHandler.mock.lastCall[0].detail).toStrictEqual({ isValidGas: true, limit: baseProps.limitLower, - price: baseProps.price * 2 + price: baseProps.price * 2, }); }); }); diff --git a/web-wallet/src/lib/components/__tests__/OperationResult.spec.js b/web-wallet/src/lib/components/__tests__/OperationResult.spec.js index fcad984918..7a9c5e7013 100644 --- a/web-wallet/src/lib/components/__tests__/OperationResult.spec.js +++ b/web-wallet/src/lib/components/__tests__/OperationResult.spec.js @@ -1,10 +1,4 @@ -import { - afterEach, - describe, - expect, - it, - vi -} from "vitest"; +import { afterEach, describe, expect, it, vi } from "vitest"; import { cleanup, render } from "@testing-library/svelte"; import { OperationResult } from ".."; @@ -15,23 +9,27 @@ describe("OperationResult", () => { const delay = 1000; /** @type {(delay: number) => Promise} */ - const rejectAfter = ms => new Promise((resolve, reject) => { - setTimeout(() => reject(new Error("some error")), ms); - }); + const rejectAfter = (ms) => + new Promise((resolve, reject) => { + setTimeout(() => reject(new Error("some error")), ms); + }); /** @type {(delay: number) => Promise} */ - const resolveAfter = ms => new Promise(resolve => { setTimeout(resolve, ms); }); + const resolveAfter = (ms) => + new Promise((resolve) => { + setTimeout(resolve, ms); + }); const onBeforeLeave = vi.fn(); const baseProps = { onBeforeLeave, - operation: resolveAfter(delay) + operation: resolveAfter(delay), }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; afterEach(() => { @@ -48,9 +46,12 @@ describe("OperationResult", () => { it("should accept a custom message for the pending state", () => { const props = { ...baseProps, - pendingMessage: "Transaction pending" + pendingMessage: "Transaction pending", }; - const { container } = render(OperationResult, { ...baseOptions, props }); + const { container } = render(OperationResult, { + ...baseOptions, + props, + }); expect(container.firstChild).toMatchSnapshot(); }); @@ -66,10 +67,13 @@ describe("OperationResult", () => { it("should accept a custom message for the successful state", async () => { const props = { ...baseProps, - successMessage: "Transaction completed" + successMessage: "Transaction completed", }; - const { container } = render(OperationResult, { ...baseOptions, props }); + const { container } = render(OperationResult, { + ...baseOptions, + props, + }); await vi.advanceTimersByTimeAsync(delay); @@ -91,10 +95,13 @@ describe("OperationResult", () => { it("should be able to render the `OperationResult` in a failure state", async () => { const props = { ...baseProps, - operation: rejectAfter(delay) + operation: rejectAfter(delay), }; - const { container } = render(OperationResult, { ...baseOptions, props }); + const { container } = render(OperationResult, { + ...baseOptions, + props, + }); await vi.advanceTimersByTimeAsync(delay); @@ -105,10 +112,13 @@ describe("OperationResult", () => { const props = { ...baseProps, errorMessage: "Transaction failed", - operation: rejectAfter(delay) + operation: rejectAfter(delay), }; - const { container } = render(OperationResult, { ...baseOptions, props }); + const { container } = render(OperationResult, { + ...baseOptions, + props, + }); await vi.advanceTimersByTimeAsync(delay); diff --git a/web-wallet/src/lib/components/__tests__/ScanQR.spec.js b/web-wallet/src/lib/components/__tests__/ScanQR.spec.js index aba767eaae..a7cd7955cc 100644 --- a/web-wallet/src/lib/components/__tests__/ScanQR.spec.js +++ b/web-wallet/src/lib/components/__tests__/ScanQR.spec.js @@ -1,21 +1,16 @@ -import { - afterEach, - describe, - expect, - it -} from "vitest"; +import { afterEach, describe, expect, it } from "vitest"; import { cleanup, render } from "@testing-library/svelte"; import { ScanQR } from ".."; describe("ScanQR", () => { const baseProps = { - scanner: undefined + scanner: undefined, }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; afterEach(cleanup); diff --git a/web-wallet/src/lib/components/__tests__/Send.spec.js b/web-wallet/src/lib/components/__tests__/Send.spec.js index 4fbaa37886..6bfe3fff3e 100644 --- a/web-wallet/src/lib/components/__tests__/Send.spec.js +++ b/web-wallet/src/lib/components/__tests__/Send.spec.js @@ -1,11 +1,4 @@ -import { - afterAll, - afterEach, - describe, - expect, - it, - vi -} from "vitest"; +import { afterAll, afterEach, describe, expect, it, vi } from "vitest"; import { cleanup, fireEvent, render } from "@testing-library/svelte"; import { deductLuxFeeFrom } from "$lib/contracts"; @@ -26,13 +19,15 @@ describe("Send", () => { gasLimitLower: 10000000, gasLimitUpper: 1000000000, gasPrice: 1, - gasPriceLower: 1 + gasPriceLower: 1, }, spendable: 1000, - statuses: [{ - label: "Spendable", - value: "1,000.000000000" - }] + statuses: [ + { + label: "Spendable", + value: "1,000.000000000", + }, + ], }; const invalidAddress = @@ -59,8 +54,8 @@ describe("Send", () => { gasSettings: { ...baseProps.gasSettings, gasLimit: 40000000, - gasPrice: 40000000 - } + gasPrice: 40000000, + }, }; const { getByRole } = render(Send, props); const next = getByRole("button", { name: "Next" }); @@ -129,7 +124,9 @@ describe("Send", () => { const nextButton = getByRole("button", { name: "Next" }); const addressInput = getByRole("textbox"); - await fireEvent.input(addressInput, { target: { value: invalidAddress } }); + await fireEvent.input(addressInput, { + target: { value: invalidAddress }, + }); expect(addressInput).toHaveValue(invalidAddress); @@ -167,8 +164,14 @@ describe("Send", () => { await fireEvent.input(addressInput, { target: { value: address } }); await fireEvent.click(getByRole("button", { name: "Next" })); - const value = getAsHTMLElement(container, ".operation__review-amount span"); - const key = getAsHTMLElement(container, ".operation__review-address span"); + const value = getAsHTMLElement( + container, + ".operation__review-amount span" + ); + const key = getAsHTMLElement( + container, + ".operation__review-address span" + ); expect(value.textContent).toBe(baseProps.formatter(amount)); expect(key.textContent).toBe(address); @@ -202,13 +205,12 @@ describe("Send", () => { await vi.advanceTimersToNextTimerAsync(); expect(baseProps.execute).toHaveBeenCalledTimes(1); - expect(baseProps.execute) - .toHaveBeenCalledWith( - address, - amount, - baseProps.gasSettings.gasPrice, - baseProps.gasSettings.gasLimit - ); + expect(baseProps.execute).toHaveBeenCalledWith( + address, + amount, + baseProps.gasSettings.gasPrice, + baseProps.gasSettings.gasLimit + ); const explorerLink = getByRole("link", { name: /explorer/i }); @@ -237,13 +239,12 @@ describe("Send", () => { await vi.advanceTimersToNextTimerAsync(); expect(baseProps.execute).toHaveBeenCalledTimes(1); - expect(baseProps.execute) - .toHaveBeenCalledWith( - address, - amount, - baseProps.gasSettings.gasPrice, - baseProps.gasSettings.gasLimit - ); + expect(baseProps.execute).toHaveBeenCalledWith( + address, + amount, + baseProps.gasSettings.gasPrice, + baseProps.gasSettings.gasLimit + ); expect(getByText("Transaction failed")).toBeInTheDocument(); expect(getByText(errorMessage)).toBeInTheDocument(); }); @@ -266,13 +267,12 @@ describe("Send", () => { await vi.advanceTimersToNextTimerAsync(); expect(baseProps.execute).toHaveBeenCalledTimes(1); - expect(baseProps.execute) - .toHaveBeenCalledWith( - address, - amount, - baseProps.gasSettings.gasPrice, - baseProps.gasSettings.gasLimit - ); + expect(baseProps.execute).toHaveBeenCalledWith( + address, + amount, + baseProps.gasSettings.gasPrice, + baseProps.gasSettings.gasLimit + ); expect(getByText("Transaction completed")).toBeInTheDocument(); expect(() => getByRole("link", { name: /explorer/i })).toThrow(); }); diff --git a/web-wallet/src/lib/components/__tests__/Stake.spec.js b/web-wallet/src/lib/components/__tests__/Stake.spec.js index 2bcda32f84..e525182e9a 100644 --- a/web-wallet/src/lib/components/__tests__/Stake.spec.js +++ b/web-wallet/src/lib/components/__tests__/Stake.spec.js @@ -1,11 +1,4 @@ -import { - afterAll, - afterEach, - describe, - expect, - it, - vi -} from "vitest"; +import { afterAll, afterEach, describe, expect, it, vi } from "vitest"; import { cleanup, fireEvent, render } from "@testing-library/svelte"; import { deductLuxFeeFrom } from "$lib/contracts"; @@ -18,7 +11,8 @@ import { Stake } from ".."; * @param {*} value * @returns {Promise} */ -const fireInput = (input, value) => fireEvent.input(input, { target: { value } }); +const fireInput = (input, value) => + fireEvent.input(input, { target: { value } }); describe("Stake", () => { const formatter = createCurrencyFormatter("en", "DUSK", 9); @@ -35,26 +29,30 @@ describe("Stake", () => { gasLimitLower: 10000000, gasLimitUpper: 1000000000, gasPrice: 1, - gasPriceLower: 1 + gasPriceLower: 1, }, hideStakingNotice: true, rewards: 345, spendable: 10000, staked: 278, - statuses: [{ - label: "Spendable", - value: "1,000.000000000" - }, { - label: "Total Locked", - value: "278.000000000" - }, { - label: "Rewards", - value: "345.000000000" - }] + statuses: [ + { + label: "Spendable", + value: "1,000.000000000", + }, + { + label: "Total Locked", + value: "278.000000000", + }, + { + label: "Rewards", + value: "345.000000000", + }, + ], }; const baseOptions = { props: baseProps, - target: document.body + target: document.body, }; const maxSpendable = deductLuxFeeFrom( @@ -72,8 +70,8 @@ describe("Stake", () => { ...baseOptions.target, props: { ...baseProps, - hideStakingNotice: false - } + hideStakingNotice: false, + }, }; vi.spyOn(Math, "random").mockReturnValue(42); @@ -100,8 +98,8 @@ describe("Stake", () => { gasSettings: { ...baseProps.gasSettings, gasLimit: 40000000, - gasPrice: 40000000 - } + gasPrice: 40000000, + }, }; const currentMaxSpendable = deductLuxFeeFrom( props.spendable, @@ -114,7 +112,9 @@ describe("Stake", () => { await fireInput(amountInput, 1000); expect(nextButton).toBeDisabled(); expect(amountInput.getAttribute("min")).toBe("1000"); - expect(amountInput.getAttribute("max")).toBe(currentMaxSpendable.toString()); + expect(amountInput.getAttribute("max")).toBe( + currentMaxSpendable.toString() + ); }); it("should set the max amount in the textbox if the user clicks the related button", async () => { @@ -135,7 +135,9 @@ describe("Stake", () => { expect(nextButton).toBeEnabled(); - await fireEvent.input(amountInput, { target: { value: baseProps.spendable * 2 } }); + await fireEvent.input(amountInput, { + target: { value: baseProps.spendable * 2 }, + }); expect(nextButton).toBeDisabled(); }); @@ -169,8 +171,11 @@ describe("Stake", () => { await vi.advanceTimersToNextTimerAsync(); expect(baseProps.execute).toHaveBeenCalledTimes(1); - expect(baseProps.execute) - .toHaveBeenCalledWith(1000, baseProps.gasSettings.gasPrice, baseProps.gasSettings.gasLimit); + expect(baseProps.execute).toHaveBeenCalledWith( + 1000, + baseProps.gasSettings.gasPrice, + baseProps.gasSettings.gasLimit + ); const explorerLink = getByRole("link", { name: /explorer/i }); @@ -194,8 +199,11 @@ describe("Stake", () => { await vi.advanceTimersToNextTimerAsync(); expect(baseProps.execute).toHaveBeenCalledTimes(1); - expect(baseProps.execute) - .toHaveBeenCalledWith(2567, baseProps.gasSettings.gasPrice, baseProps.gasSettings.gasLimit); + expect(baseProps.execute).toHaveBeenCalledWith( + 2567, + baseProps.gasSettings.gasPrice, + baseProps.gasSettings.gasLimit + ); expect(getByText("Transaction failed")).toBeInTheDocument(); expect(getByText(errorMessage)).toBeInTheDocument(); }); @@ -212,12 +220,11 @@ describe("Stake", () => { await vi.advanceTimersToNextTimerAsync(); expect(baseProps.execute).toHaveBeenCalledTimes(1); - expect(baseProps.execute) - .toHaveBeenCalledWith( - maxSpendable, - baseProps.gasSettings.gasPrice, - baseProps.gasSettings.gasLimit - ); + expect(baseProps.execute).toHaveBeenCalledWith( + maxSpendable, + baseProps.gasSettings.gasPrice, + baseProps.gasSettings.gasLimit + ); expect(getByText("Transaction completed")).toBeInTheDocument(); expect(() => getByRole("link", { name: /explorer/i })).toThrow(); }); diff --git a/web-wallet/src/lib/components/__tests__/Transactions.spec.js b/web-wallet/src/lib/components/__tests__/Transactions.spec.js index 4fb6a4f45e..7056ca5674 100644 --- a/web-wallet/src/lib/components/__tests__/Transactions.spec.js +++ b/web-wallet/src/lib/components/__tests__/Transactions.spec.js @@ -5,14 +5,17 @@ import { settingsStore } from "$lib/stores"; import { transactions } from "$lib/mock-data"; import { sortByHeightDesc } from "$lib/transactions"; -import { createFeeFormatter, createTransferFormatter } from "$lib/dusk/currency"; +import { + createFeeFormatter, + createTransferFormatter, +} from "$lib/dusk/currency"; import Transactions from "../Transactions/Transactions.svelte"; global.ResizeObserver = vi.fn().mockImplementation(() => ({ observe: vi.fn(), unobserve: vi.fn(), - disconnect: vi.fn() + disconnect: vi.fn(), })); vi.useFakeTimers(); @@ -20,7 +23,8 @@ vi.useFakeTimers(); describe("Transactions", () => { const transactionsPromise = Promise.resolve(transactions); const emptyTransactionsPromise = Promise.resolve([]); - const blockExplorerBaseUrl = "https://explorer.dusk.network/transactions/transaction?id="; + const blockExplorerBaseUrl = + "https://explorer.dusk.network/transactions/transaction?id="; const highestTransactionID = sortByHeightDesc(transactions)[0].id; const settings = get(settingsStore); const language = settings.language; @@ -29,7 +33,7 @@ describe("Transactions", () => { const baseProps = { language, - items: transactionsPromise + items: transactionsPromise, }; afterEach(() => { @@ -46,7 +50,7 @@ describe("Transactions", () => { it("renders transactions correctly when items are fulfilled", async () => { const props = { ...baseProps, - limit: 1 + limit: 1, }; const { getByText, container } = render(Transactions, props); @@ -55,9 +59,12 @@ describe("Transactions", () => { const transaction = sortByHeightDesc(transactions)[0]; - const transactionAmount = getByText(transferFormatter(transaction.amount)); - const transactionBlockHeight = - getByText(new Intl.NumberFormat(language).format(transaction.block_height)); + const transactionAmount = getByText( + transferFormatter(transaction.amount) + ); + const transactionBlockHeight = getByText( + new Intl.NumberFormat(language).format(transaction.block_height) + ); const transactionType = getByText(transaction.tx_type.toUpperCase()); const transactionFee = getByText(feeFormatter(transaction.fee)); @@ -72,7 +79,7 @@ describe("Transactions", () => { it("renders the correct amount of Transactions, as the limit supplied", async () => { const props = { ...baseProps, - limit: 3 + limit: 3, }; const { getAllByText, container } = render(Transactions, props); @@ -93,24 +100,29 @@ describe("Transactions", () => { const sortedTransactions = sortByHeightDesc(transactions); - const transactionElements = container.querySelectorAll(".transactions-list"); + const transactionElements = + container.querySelectorAll(".transactions-list"); sortedTransactions.forEach((transaction, index) => { - expect(transactionElements[index]).toHaveTextContent(transaction.id); + expect(transactionElements[index]).toHaveTextContent( + transaction.id + ); }); }); it("renders the Transactions with the correct CTA to the Block Explorer", async () => { const props = { ...baseProps, - limit: 1 + limit: 1, }; const { getByRole } = render(Transactions, props); await vi.advanceTimersToNextTimerAsync(); - const transactionHrefBlockExplorerAnchor = getByRole("link", { name: highestTransactionID }); + const transactionHrefBlockExplorerAnchor = getByRole("link", { + name: highestTransactionID, + }); expect(transactionHrefBlockExplorerAnchor).toBeInTheDocument(); expect(transactionHrefBlockExplorerAnchor).toHaveAttribute( @@ -122,7 +134,7 @@ describe("Transactions", () => { it("displays empty state when no transactions are present", async () => { const props = { ...baseProps, - items: emptyTransactionsPromise + items: emptyTransactionsPromise, }; const { getByText } = render(Transactions, props); @@ -134,24 +146,29 @@ describe("Transactions", () => { expect(emptyState).toBeInTheDocument(); }); - it("displays the \"View all transactions\" CTA if limit is supplied", async () => { + it('displays the "View all transactions" CTA if limit is supplied', async () => { const props = { ...baseProps, items: emptyTransactionsPromise, - limit: 1 + limit: 1, }; const { getByRole } = render(Transactions, props); - const viewAllTransactionAnchor = getByRole("link", { name: "View all transactions" }); + const viewAllTransactionAnchor = getByRole("link", { + name: "View all transactions", + }); expect(viewAllTransactionAnchor).toBeInTheDocument(); - expect(viewAllTransactionAnchor).toHaveAttribute("href", "/dashboard/transactions"); + expect(viewAllTransactionAnchor).toHaveAttribute( + "href", + "/dashboard/transactions" + ); }); - it("displays the \"Back\" CTA if no limit is supplied", async () => { + it('displays the "Back" CTA if no limit is supplied', async () => { const props = { ...baseProps, - items: emptyTransactionsPromise + items: emptyTransactionsPromise, }; const { getByRole } = render(Transactions, props); @@ -162,10 +179,12 @@ describe("Transactions", () => { }); it("handles error state when items are rejected", async () => { - const promiseReject = Promise.reject(new Error("An error has occurred")); + const promiseReject = Promise.reject( + new Error("An error has occurred") + ); const props = { ...baseProps, - items: promiseReject + items: promiseReject, }; const { getByText } = render(Transactions, props); diff --git a/web-wallet/src/lib/containers/StakeContract/StakeContract.svelte b/web-wallet/src/lib/containers/StakeContract/StakeContract.svelte index 8c4d0a0a2b..842929c95c 100644 --- a/web-wallet/src/lib/containers/StakeContract/StakeContract.svelte +++ b/web-wallet/src/lib/containers/StakeContract/StakeContract.svelte @@ -1,4 +1,4 @@ - + @@ -51,9 +55,17 @@ {#if text} {text} {/if} - + {:else if icon} - + {#if text} {text} {/if} diff --git a/web-wallet/src/lib/dusk/components/Badge/Badge.svelte b/web-wallet/src/lib/dusk/components/Badge/Badge.svelte index ef2a15790a..3a7cc60d4b 100644 --- a/web-wallet/src/lib/dusk/components/Badge/Badge.svelte +++ b/web-wallet/src/lib/dusk/components/Badge/Badge.svelte @@ -12,7 +12,7 @@ $: classes = makeClassName([ "dusk-badge", `dusk-badge--variant-${variant}`, - className + className, ]); diff --git a/web-wallet/src/lib/dusk/components/Button/Button.svelte b/web-wallet/src/lib/dusk/components/Button/Button.svelte index a3440a69b8..4b3ecd68c9 100644 --- a/web-wallet/src/lib/dusk/components/Button/Button.svelte +++ b/web-wallet/src/lib/dusk/components/Button/Button.svelte @@ -1,4 +1,4 @@ - + @@ -50,9 +54,9 @@ {#if text} {text} {/if} - + {:else if icon} - + {#if text} {text} {/if} diff --git a/web-wallet/src/lib/dusk/components/Card/Card.svelte b/web-wallet/src/lib/dusk/components/Card/Card.svelte index 720bbb4675..f3ee7437b0 100644 --- a/web-wallet/src/lib/dusk/components/Card/Card.svelte +++ b/web-wallet/src/lib/dusk/components/Card/Card.svelte @@ -27,19 +27,21 @@ this={tag} {...$$restProps} class={classes} - class:dusk-card--on-surface={onSurface}> + class:dusk-card--on-surface={onSurface} +>
+ class:dusk-card__header--toggle-off={hasToggle && !isToggled} + > {#if iconPath} - + {/if}

{heading}

{#if hasToggle} - + {/if}
{#if !hasToggle || isToggled} - + {/if} diff --git a/web-wallet/src/lib/dusk/components/ErrorDetails/ErrorDetails.svelte b/web-wallet/src/lib/dusk/components/ErrorDetails/ErrorDetails.svelte index 41a3143427..495ae7741a 100644 --- a/web-wallet/src/lib/dusk/components/ErrorDetails/ErrorDetails.svelte +++ b/web-wallet/src/lib/dusk/components/ErrorDetails/ErrorDetails.svelte @@ -1,4 +1,4 @@ - + diff --git a/web-wallet/src/lib/dusk/components/Icon/CircularIcon.svelte b/web-wallet/src/lib/dusk/components/Icon/CircularIcon.svelte index e5dce93cca..c72e445a64 100644 --- a/web-wallet/src/lib/dusk/components/Icon/CircularIcon.svelte +++ b/web-wallet/src/lib/dusk/components/Icon/CircularIcon.svelte @@ -1,4 +1,4 @@ - +
- + style={`background-color: ${bgColor ? `${bgColor}` : "var(--secondary-color)"}; + color: ${color ? `${color}` : "var(--on-secondary-color)"}`} + {...commonAttributes} +> +
diff --git a/web-wallet/src/lib/dusk/components/Icon/Icon.svelte b/web-wallet/src/lib/dusk/components/Icon/Icon.svelte index fa338d72b7..f2fd8154bd 100644 --- a/web-wallet/src/lib/dusk/components/Icon/Icon.svelte +++ b/web-wallet/src/lib/dusk/components/Icon/Icon.svelte @@ -1,4 +1,4 @@ - + {#if isInStack} - - + + {:else} - - + + {/if} diff --git a/web-wallet/src/lib/dusk/components/Mnemonic/Mnemonic.svelte b/web-wallet/src/lib/dusk/components/Mnemonic/Mnemonic.svelte index 1ef5b025f7..c000dadd80 100644 --- a/web-wallet/src/lib/dusk/components/Mnemonic/Mnemonic.svelte +++ b/web-wallet/src/lib/dusk/components/Mnemonic/Mnemonic.svelte @@ -42,7 +42,7 @@ * @param {string} word * @param {string} index */ - function updateEnteredPhrase (word, index) { + function updateEnteredPhrase(word, index) { enteredMnemonicPhrase[currentIndex] = word; enteredWordIndex[currentIndex] = index; currentInput = ""; @@ -58,22 +58,22 @@ * @param {{ key: string }} event * @param {string} index */ - function handleKeyDownOnAuthenticateTextbox (event, index) { + function handleKeyDownOnAuthenticateTextbox(event, index) { if (event.key === "Enter" && suggestions.length === 1) { updateEnteredPhrase(suggestions[0], index); } } // @ts-ignore - function handleWordButtonClick (event, index) { + function handleWordButtonClick(event, index) { updateEnteredPhrase(event.currentTarget.dataset.value, index); } - function focusWordTextboxInput () { + function focusWordTextboxInput() { textboxElement?.focus(); } - function undoLastWord () { + function undoLastWord() { if (currentIndex === 0) { return; } @@ -83,12 +83,17 @@ enteredWordIndex[currentIndex] = ""; } - $: suggestions = currentInput && findFirstNMatches(enDictionary, currentInput.toLowerCase(), 3); + $: suggestions = + currentInput && + findFirstNMatches(enDictionary, currentInput.toLowerCase(), 3); const pasteSeed = () => { - navigator.clipboard.readText() + navigator.clipboard + .readText() .then((data) => { - const sanitizedData = data.replace(/[^a-zA-Z\s]/g, "").toLowerCase(); + const sanitizedData = data + .replace(/[^a-zA-Z\s]/g, "") + .toLowerCase(); const words = sanitizedData.trim().split(/\s+/); if (words.length !== 12) { @@ -96,10 +101,11 @@ } currentIndex = 0; - words.forEach(word => { + words.forEach((word) => { updateEnteredPhrase(word, currentIndex.toString()); }); - }).catch(err => { + }) + .catch((err) => { if (err.name === "NotAllowedError") { toast("error", "Clipboard access denied", mdiAlertOutline); } else { @@ -109,12 +115,11 @@ }; const shouldShowPaste = - "clipboard" in navigator && typeof navigator.clipboard.readText === "function"; - + "clipboard" in navigator && + typeof navigator.clipboard.readText === "function";
-
{#if type === "authenticate" && shouldShowPaste}
- +
+ : "dusk-mnemonic__validate-actions-wrapper"} + > {#if type === "authenticate" && enteredWordIndex.includes("")} handleKeyDownOnAuthenticateTextbox(e, currentIndex.toString())} + on:keydown={(e) => + handleKeyDownOnAuthenticateTextbox( + e, + currentIndex.toString() + )} maxlength={8} type="text" - bind:value={currentInput}/> + bind:value={currentInput} + /> {#if suggestions.length}
{#each suggestions as suggestion, index (`${suggestion}-${index}`)} @@ -153,7 +165,8 @@ variant="tertiary" text={suggestion} data-value={suggestion} - on:click={handleWordButtonClick}/> + on:click={handleWordButtonClick} + /> {/each}
{/if} @@ -163,9 +176,9 @@ variant="tertiary" text={word} data-value={word} - disabled={enteredWordIndex.includes(index.toString())} - on:click={(e) => handleWordButtonClick(e, index.toString())}/> + on:click={(e) => handleWordButtonClick(e, index.toString())} + /> {/each} {/if}
diff --git a/web-wallet/src/lib/dusk/components/ProgressBar/ProgressBar.svelte b/web-wallet/src/lib/dusk/components/ProgressBar/ProgressBar.svelte index 8ed1366d4d..0d004030c5 100644 --- a/web-wallet/src/lib/dusk/components/ProgressBar/ProgressBar.svelte +++ b/web-wallet/src/lib/dusk/components/ProgressBar/ProgressBar.svelte @@ -1,5 +1,4 @@ @@ -9,8 +8,8 @@ style={currentPercentage !== undefined ? `width: ${currentPercentage}%` : undefined} - class:dusk-progress-bar__filler--undetermined={currentPercentage - === undefined} + class:dusk-progress-bar__filler--undetermined={currentPercentage === + undefined} class="dusk-progress-bar__filler" />
diff --git a/web-wallet/src/lib/dusk/components/QrCode/QrCode.svelte b/web-wallet/src/lib/dusk/components/QrCode/QrCode.svelte index 268175c380..59196d377e 100644 --- a/web-wallet/src/lib/dusk/components/QrCode/QrCode.svelte +++ b/web-wallet/src/lib/dusk/components/QrCode/QrCode.svelte @@ -31,9 +31,9 @@ QRCode.toDataURL(value, { color: { dark: qrColor, - light: bgColor + light: bgColor, }, - width + width, }).catch((/** @type {String} */ error) => { dispatch("error", error); diff --git a/web-wallet/src/lib/dusk/components/Select/Options.svelte b/web-wallet/src/lib/dusk/components/Select/Options.svelte index 5219082d6f..910bab3e60 100644 --- a/web-wallet/src/lib/dusk/components/Select/Options.svelte +++ b/web-wallet/src/lib/dusk/components/Select/Options.svelte @@ -1,4 +1,4 @@ - + -
+
- Web Wallet v{import.meta.env.APP_VERSION} ({import.meta.env.APP_BUILD_INFO}) + Web Wallet v{import.meta.env.APP_VERSION} ({import.meta.env + .APP_BUILD_INFO})
diff --git a/web-wallet/src/routes/(welcome)/setup/AllSet.svelte b/web-wallet/src/routes/(welcome)/setup/AllSet.svelte index 1966c688d5..2b6b45e692 100644 --- a/web-wallet/src/routes/(welcome)/setup/AllSet.svelte +++ b/web-wallet/src/routes/(welcome)/setup/AllSet.svelte @@ -11,7 +11,8 @@ width="205" height="182" id="all_set_illustration" - alt="All Set"/> + alt="All Set" + /> diff --git a/web-wallet/src/routes/(welcome)/setup/PasswordSetup.svelte b/web-wallet/src/routes/(welcome)/setup/PasswordSetup.svelte index 2c8ab9687e..510db15533 100644 --- a/web-wallet/src/routes/(welcome)/setup/PasswordSetup.svelte +++ b/web-wallet/src/routes/(welcome)/setup/PasswordSetup.svelte @@ -1,9 +1,5 @@ - +

Please store your password safely.

+ placeholder="Set Password" + />
+ placeholder="Confirm Password" + /> {#if password.length < 8} - Password must be at least 8 characters + Password must be at least 8 characters {:else if confirmPassword && password !== confirmPassword} Passwords do not match + confirm-password--meta--error">Passwords do not match {/if}
- +

Setting a password for your web wallet is optional. Doing so allows you the convenience of opening your wallet file using a password, but it @@ -75,7 +75,7 @@ font-size: 0.75em; margin-top: 0.8em; margin-left: 1em; - opacity: .5; + opacity: 0.5; &--error { color: var(--danger-color); diff --git a/web-wallet/src/routes/(welcome)/setup/TermsOfService.svelte b/web-wallet/src/routes/(welcome)/setup/TermsOfService.svelte index bd26e89458..fa78fab2be 100644 --- a/web-wallet/src/routes/(welcome)/setup/TermsOfService.svelte +++ b/web-wallet/src/routes/(welcome)/setup/TermsOfService.svelte @@ -1,10 +1,5 @@ @@ -24,16 +22,15 @@

Ensure you have backed up the Mnemonic phrase.

{#if filteredMnemonic.size === 12 && !isValid}
- +

Mnemonic does not match.

{/if}
- diff --git a/web-wallet/src/routes/(welcome)/setup/create/SwapNDUSK.svelte b/web-wallet/src/routes/(welcome)/setup/create/SwapNDUSK.svelte index 175806111c..e31bb38743 100644 --- a/web-wallet/src/routes/(welcome)/setup/create/SwapNDUSK.svelte +++ b/web-wallet/src/routes/(welcome)/setup/create/SwapNDUSK.svelte @@ -4,8 +4,8 @@

- The ERC20 token swap functionality is currently disabled - and will be provided after the launch of the Dusk mainnet. + The ERC20 token swap functionality is currently disabled and will be + provided after the launch of the Dusk mainnet.