Skip to content

Commit d74a036

Browse files
mds1wildmolassesgaryghayratdavidlapradeapbendi
authored
Quasar v2 / Vue 3 (#425)
* buid: update deps (https://quasar.dev/start/upgrade-guide\#option-1-convert-a-project) * build: polyfill all node.js modules * build: update App.vue * build: update router config * build: update i18n (does not update usage of it, which is still broken) * build: remove @vue/composition-api package * wip (revert this) * refactor: a bunch of fixes * build: update some deps * build/style: fix some errors and run prettier * wip * more fixes * more fixes * no more vue extend * style: prettier * more fixes * fix: this line is only needed for webpack v4, not v5 * hacking the hint * fix: i18n updates * fix: errors in i18n boot file * build: update deps to fix joi issue, blocknative/web3-onboard#1287 * build: dep updates * fix: stop files from erroring * fix: useRouter must be called in setUp * restore original template components with manual typing fixes * more fixes * fixes on where lifecycle hooks can be used * temporarily rename i18n files (so rename casing) * rename them back * perf: don't block on avatars * style: prettier * fix lint errors * lockfile upadte * downgrade node types * fix: pin ethers.js to 5.6.9, since 5.7.0 doesn't work with typechain: ethers-io/ethers.js#3322 * more fixes * component reactivity fixes * test: need hardhat explicitly installed locally to run umbra-js tests * update lockfile * fix: stronger pkx check * turn off autocomplete for input fields * fix: button click handlers were run twice, now only runs once * fix: network selector now works * fix: language selector default value * i18n param query fix (#427) * Add param query fix for i18n * style: add line break Co-authored-by: Matt Solomon <[email protected]> * chore: fix lint errors * test: fix missing mnemonic in CI * chore: fix typings for component refs * Upgrade i18n syntax (#428) * Upgrade i18n syntax * Fix typo * fix: FAQ link copying and auto-scrolling to element via URL * fix: receive table now works, cleanup typos/comments * Quasar v2 Fix Sends and Setup (#433) * Don't let Vue refs turn ethers objects into proxies * Prevent setup from erroring Error was: "proxy must report the same value for the non-writable, non-configurable property '"interface"' * Shamelessly copy dgrants note to improve our markRaw comment * fix: properly load avatar * chore: remove worker-loader package for quasar-v2 (#435) * chore: web worker updates for webpack v5 * chore: remove unneeded file * fix: correctly handle event types * fix: modelValue fixes * chore: remove console.logs from debugging * build: bump version * fix: vue router active class * chore: i18n warning cleanup * chore: typing fixes * chore: more i18n warning cleanup * chore: some umbra-js cleanup * chore: some frontend cleanup * chore: more frontend fixes * fix: itemEvents was dropped in favor of itemProps * fix: receive table pagination * chore: rename L2 tokens to just be ETH, since that's what their official bridges do * fix: improve payment link parsing * fix: i18n key * feat: show version in footer to facilitate debugging during phased rollout * fix: send form validation UX * feat: add hardcoded donation banner * Localize alert banner (#440) * Localize banner * fix: i18n updates when incorporating changes from master * Update copyright year to trigger a branch deploy --------- Co-authored-by: wildmolasses <[email protected]> Co-authored-by: Gary Ghayrat <[email protected]> Co-authored-by: David Laprade <[email protected]> Co-authored-by: Ben DiFrancesco <[email protected]>
1 parent b0ab5e7 commit d74a036

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

79 files changed

+7674
-8572
lines changed

.eslintrc.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ module.exports = {
2121
'eslint:recommended',
2222
'plugin:@typescript-eslint/recommended',
2323
'plugin:@typescript-eslint/recommended-requiring-type-checking',
24-
'plugin:vue/essential',
24+
'plugin:vue/vue3-essential',
2525
'prettier',
2626
'prettier/@typescript-eslint',
2727
'prettier/vue',

README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -137,4 +137,4 @@ Contributions to Umbra are welcome! Fork the project, create a new branch from m
137137

138138
Umbra is available under the [MIT](LICENSE.txt) license.
139139

140-
Copyright (c) 2022 ScopeLift
140+
Copyright (c) 2023 ScopeLift

contracts-core/.prettierignore

+1
Original file line numberDiff line numberDiff line change
@@ -10,3 +10,4 @@ typechain/
1010

1111
# files
1212
coverage.json
13+
*.sol

contracts-core/.solhint.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
"func-visibility": ["error", { "ignoreConstructors": true }],
1010
"not-rely-on-time": "off",
1111
"prettier/prettier": [
12-
"error",
12+
"warn",
1313
{
1414
"endOfLine": "auto"
1515
}

contracts-core/hardhat.config.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@ const chainIds = {
3636
// optional so that typechain can still build its types without hard failing on this.
3737
let mnemonic = '';
3838
if (!process.env.MNEMONIC) {
39-
console.warn('Please set your MNEMONIC in a .env file');
39+
console.warn('MNEMONIC not found in .env file, using default mnemonic');
40+
mnemonic = 'test test test test test test test test test test test junk';
4041
} else {
4142
mnemonic = process.env.MNEMONIC;
4243
}

contracts-core/package.json

+5-5
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "0.0.2",
44
"description": "Contracts for the Umbra Protocol",
55
"dependencies": {
6-
"@openzeppelin/contracts": "^3.4.1"
6+
"@openzeppelin/contracts": "3.4.1"
77
},
88
"devDependencies": {
99
"@commitlint/cli": "^9.1.2",
@@ -17,7 +17,7 @@
1717
"@nomiclabs/hardhat-web3": "^2.0.0",
1818
"@openzeppelin/test-helpers": "^0.5.10",
1919
"@truffle/debug-utils": "^4.1.1",
20-
"@typechain/ethers-v5": "^2.0.0",
20+
"@typechain/ethers-v5": "^10.2.0",
2121
"@types/chai": "^4.2.13",
2222
"@types/fs-extra": "^9.0.1",
2323
"@types/mocha": "^7.0.2",
@@ -30,7 +30,7 @@
3030
"eslint": "^7.11.0",
3131
"eslint-config-prettier": "^6.12.0",
3232
"ethereum-waffle": "^3.2.0",
33-
"ethers": "^5.6.8",
33+
"ethers": "5.6.9",
3434
"fs-extra": "^9.0.1",
3535
"hardhat": "^2.6.8",
3636
"hardhat-gas-reporter": "^1.0.4",
@@ -46,7 +46,7 @@
4646
"solidity-coverage": "^0.7.12",
4747
"ts-generator": "^0.1.1",
4848
"ts-node": "^8.10.2",
49-
"typechain": "^3.0.0",
49+
"typechain": "^8.1.1",
5050
"typescript": "^3.9.7"
5151
},
5252
"files": [
@@ -67,7 +67,7 @@
6767
"clean": "hardhat clean",
6868
"build": "hardhat compile",
6969
"lint": "yarn run lint:sol && yarn run lint:ts && yarn run prettier:list-different",
70-
"lint:sol": "solhint --config ./.solhint.json --max-warnings 9 \"contracts/**/*.sol\"",
70+
"lint:sol": "solhint --config ./.solhint.json --max-warnings 30 \"contracts/**/*.sol\"",
7171
"lint:ts": "eslint --ext .js,.ts .",
7272
"prettier": "prettier --write \"**/*.{js,json,md,sol,ts}\"",
7373
"prettier:list-different": "prettier --list-different \"**/*.{js,json,md,sol,ts}\"",

contracts-core/test/umbra-test.js

+2-12
Original file line numberDiff line numberDiff line change
@@ -42,18 +42,8 @@ describe('Umbra', () => {
4242
const mintTokenAmount = sumTokenAmounts([totalTokenAmount, tokenAmount, metaTokenTotal]);
4343

4444
before(async () => {
45-
[
46-
owner,
47-
tollCollector,
48-
tollReceiver,
49-
payer1,
50-
receiver1,
51-
payer2,
52-
receiver2,
53-
acceptor,
54-
other,
55-
relayer,
56-
] = await web3.eth.getAccounts();
45+
[owner, tollCollector, tollReceiver, payer1, receiver1, payer2, receiver2, acceptor, other, relayer] =
46+
await web3.eth.getAccounts();
5747
ctx.chainId = await web3.eth.getChainId();
5848
ctx.umbra = await Umbra.new(deployedToll, tollCollector, tollReceiver, { from: owner });
5949
ctx.token = await TestToken.new('TestToken', 'TT');

frontend/.eslintrc.js

+3
Original file line numberDiff line numberDiff line change
@@ -16,5 +16,8 @@ module.exports = {
1616
rules: {
1717
'@typescript-eslint/ban-ts-comment': 1,
1818
'@typescript-eslint/no-non-null-assertion': 0,
19+
// vue/no-v-model-argument is disabled to support QTable's use of v-model:pagination.
20+
// See https://quasar.dev/start/upgrade-guide#qtable
21+
'vue/no-v-model-argument': 'off',
1922
},
2023
};

frontend/README.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,8 @@ For more details on the internationalization approach and usage see [Quasar I18n
5656

5757
- Inside templates: `{{ $t('key-name') }}`
5858
- Inside attributes: `:label="$t('key-name')"`
59-
- Inside scripts, import `getCurrentInstance()` from `@vue/composition-api` and create an instance inside a function using `const vm = getCurrentInstance()!;` then use `vm.$i18n.tc('AccountReceiveTable.date-received')`
60-
- Inside `.ts` files, `import { i18n } from "../boot/i18n";` and use `i18n.tc('key-name')`.
59+
- Inside scripts, import `getCurrentInstance()` from `'vue'` and create an instance inside a function using `const vm = getCurrentInstance()!;` then use `vm.$i18n.tc('AccountReceiveTable.date-received')`
60+
- Inside `.ts` files, `import { tc } from "../boot/i18n";` and use `tc('key-name')`.
6161

6262
While embedding longer texts with styles and links inside template section of Vue components, there are a few options:
6363

@@ -123,6 +123,6 @@ While embedding longer texts with styles and links inside template section of Vu
123123
If you want to add a new langauge e.g. French, you need to:
124124

125125
1. Create a new json file in `/i18n/locales/` and name it according to the language code listed [here](https://www.roseindia.net/tutorials/I18N/locales-list.shtml) i.e., `fr.json`. You can also change your browser language in settings and `console.log(locale)` in the `src/boot/i18n.ts` file to see the language code.
126-
2. Copy the contents of `en-us.json` to your newly created `<language-code>.json` file and translate key values to the corresponding language of your choice.
126+
2. Copy the contents of `en-US.json` to your newly created `<language-code>.json` file and translate key values to the corresponding language of your choice.
127127
3. Import the `json` file into the `src/i18n/index.ts` file and export it to be used.
128128
4. Add the language name and language code to `supportedLanguages` in `src/store/settings.ts`.

frontend/package.json

+28-22
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@umbra/frontend",
3-
"version": "1.2.0",
3+
"version": "2.0.0",
44
"description": "Send and receive stealth payments with the Umbra protocol",
55
"productName": "Umbra",
66
"author": "Matt Solomon <[email protected]>",
@@ -17,43 +17,49 @@
1717
"precommit": "lint-staged"
1818
},
1919
"dependencies": {
20-
"@ledgerhq/devices": "^7.0.0",
20+
"@ledgerhq/devices": "^7.0.5",
2121
"@metamask/jazzicon": "^2.0.0",
22-
"@quasar/extras": "^1.0.0",
22+
"@quasar/extras": "^1.15.8",
2323
"@umbra/umbra-js": "^0.1.0",
2424
"@uniswap/token-lists": "^1.0.0-beta.19",
2525
"@unstoppabledomains/resolution": "8.3.1",
26-
"@vue/composition-api": "^0.6.4",
27-
"@web3-onboard/coinbase": "^2.1.3",
28-
"@web3-onboard/core": "^2.9.0",
29-
"@web3-onboard/injected-wallets": "^2.2.4",
30-
"@web3-onboard/ledger": "^2.3.1",
31-
"@web3-onboard/trezor": "^2.3.1",
32-
"@web3-onboard/walletconnect": "^2.1.3",
26+
"@web3-onboard/coinbase": "^2.2.0",
27+
"@web3-onboard/core": "^2.11.1",
28+
"@web3-onboard/injected-wallets": "^2.4.0",
29+
"@web3-onboard/ledger": "^2.3.2",
30+
"@web3-onboard/trezor": "^2.3.2",
31+
"@web3-onboard/walletconnect": "^2.2.2",
3332
"bnc-notify": "^1.5.1",
3433
"core-js": "^3.6.5",
35-
"ethers": "^5.6.8",
36-
"quasar": "^1.0.0",
37-
"vue-i18n": "8.27.1",
34+
"ethers": "5.6.9",
35+
"quasar": "2.10.2",
36+
"vue": "3.2.45",
37+
"vue-i18n": "^9.2.2",
38+
"vue-router": "4.1.6",
3839
"yaml-loader": "0.6.0"
3940
},
4041
"devDependencies": {
42+
"@babel/eslint-parser": "^7.19.1",
4143
"@intlify/vue-i18n-loader": "^4.2.0",
42-
"@quasar/app": "^2.0.0",
44+
"@quasar/app-webpack": "3.6.2",
4345
"@quasar/quasar-app-extension-dotenv": "^1.0.5",
4446
"@types/jest": "^27.4.1",
45-
"@types/node": "^12.17.15",
46-
"@typescript-eslint/eslint-plugin": "^3.3.0",
47-
"@typescript-eslint/parser": "^3.3.0",
48-
"babel-eslint": "^10.0.1",
49-
"eslint-loader": "^3.0.3",
50-
"eslint-plugin-vue": "^6.1.2",
47+
"@types/node": "^14.11.8",
48+
"@typescript-eslint/eslint-plugin": "^5.46.1",
49+
"@typescript-eslint/parser": "^5.46.1",
50+
"eslint-config-standard": "^17.0.0",
51+
"eslint-plugin-import": "^2.19.1",
52+
"eslint-plugin-node": "^11.0.0",
53+
"eslint-plugin-promise": "^6.1.0",
54+
"eslint-plugin-quasar": "^1.0.0",
55+
"eslint-plugin-vue": "^9.8.0",
56+
"eslint-webpack-plugin": "^3.2.0",
5157
"jest": "^27.5.1",
58+
"node-polyfill-webpack-plugin": "^2.0.1",
5259
"postinstall-postinstall": "^2.1.0",
5360
"quasar-app-extension-system-environment-variables": "^2.0.4",
5461
"ts-jest": "^27.1.3",
55-
"vue-i18n-extract": "^2.0.6",
56-
"worker-loader": "^3.0.8"
62+
"vue-i18n-extract": "^2.0.7"
5763
},
5864
"browserslist": [
5965
"last 10 Chrome versions",

frontend/quasar.conf.js

+28-21
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,18 @@
88
/* eslint-env node */
99
/* eslint-disable @typescript-eslint/no-var-requires */
1010
const { configure } = require('quasar/wrappers');
11+
const ESLintPlugin = require('eslint-webpack-plugin');
12+
const path = require('path');
1113

1214
module.exports = configure(function (ctx) {
1315
return {
1416
// https://quasar.dev/quasar-cli/supporting-ts
1517
supportTS: {
1618
tsCheckerConfig: {
17-
eslint: true,
19+
eslint: {
20+
enabled: true,
21+
files: './src/**/*.{ts,js,vue}',
22+
},
1823
},
1924
},
2025

@@ -24,7 +29,7 @@ module.exports = configure(function (ctx) {
2429
// app boot file (/src/boot)
2530
// --> boot files are part of "main.js"
2631
// https://quasar.dev/quasar-cli/boot-files
27-
boot: ['composition-api', 'components', 'error-handler', 'logger', 'i18n'],
32+
boot: ['components', 'error-handler', 'logger', 'i18n'],
2833

2934
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
3035
css: ['app.sass'],
@@ -63,29 +68,31 @@ module.exports = configure(function (ctx) {
6368
// Options below are automatically set depending on the env, set them if you want to override
6469
// extractCSS: false,
6570

66-
// https://quasar.dev/quasar-cli/handling-webpack
67-
extendWebpack(cfg) {
68-
// linting is slow in TS projects, we execute it only for production builds
69-
if (ctx.prod) {
70-
cfg.module.rules.push({
71-
enforce: 'pre',
72-
test: /\.(js|vue)$/,
73-
loader: 'eslint-loader',
74-
exclude: /node_modules/,
75-
});
76-
}
71+
chainWebpack: (chain) => {
72+
chain.module
73+
.rule('i18n-resource')
74+
.test(/\.(json5?|ya?ml)$/)
75+
.include.add(path.resolve(__dirname, './src/i18n'))
76+
.end()
77+
.type('javascript/auto')
78+
.use('i18n-resource')
79+
.loader('@intlify/vue-i18n-loader');
80+
chain.module
81+
.rule('i18n')
82+
.resourceQuery(/blockType=i18n/)
83+
.type('javascript/auto')
84+
.use('i18n')
85+
.loader('@intlify/vue-i18n-loader');
7786
},
78-
extendWebpack(cfg) {
79-
cfg.module.rules.push({
80-
resourceQuery: /blockType=i18n/,
81-
type: 'javascript/auto',
82-
use: [{ loader: '@kazupon/vue-i18n-loader' }, { loader: 'yaml-loader' }],
83-
});
87+
88+
chainWebpack(chain) {
89+
const nodePolyfillWebpackPlugin = require('node-polyfill-webpack-plugin');
90+
chain.plugin('node-polyfill').use(nodePolyfillWebpackPlugin);
91+
chain.plugin('eslint-webpack-plugin').use(ESLintPlugin, [{ extensions: ['js', 'ts', 'vue'] }]);
8492
},
8593
extendWebpack(cfg) {
8694
cfg.resolve.alias = {
8795
...cfg.resolve.alias, // This adds the existing aliases.
88-
'@ledgerhq/devices': '@ledgerhq/devices/lib-es', // https://github.com/LedgerHQ/ledger-live/issues/763#issuecomment-1209204659
8996
};
9097
},
9198
},
@@ -100,7 +107,7 @@ module.exports = configure(function (ctx) {
100107
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework
101108
framework: {
102109
iconSet: 'fontawesome-v5', // Quasar icon set
103-
lang: 'en-us', // Quasar language pack
110+
lang: 'en-US', // Quasar language pack
104111
config: {},
105112

106113
// Possible values for "importStrategy":

frontend/src/App.vue

+3-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
<template>
2-
<div id="q-app">
3-
<router-view />
4-
</div>
2+
<router-view />
53
</template>
4+
65
<script lang="ts">
7-
import { defineComponent } from '@vue/composition-api';
6+
import { defineComponent } from 'vue';
87
98
export default defineComponent({
109
name: 'App',

frontend/src/boot/components.ts

+7-7
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
// import something here
1+
import { Component } from 'vue';
22
import { boot } from 'quasar/wrappers';
33
import BaseButton from 'components/BaseButton.vue';
44
import BaseInput from 'components/BaseInput.vue';
@@ -7,10 +7,10 @@ import LoadingSpinner from 'components/LoadingSpinner.vue';
77
import ProgressIndicator from 'components/ProgressIndicator.vue';
88

99
// more info on params: https://quasar.dev/quasar-cli/cli-documentation/boot-files#Anatomy-of-a-boot-file
10-
export default boot(({ Vue }) => {
11-
Vue.component('base-button', BaseButton);
12-
Vue.component('base-input', BaseInput);
13-
Vue.component('base-select', BaseSelect);
14-
Vue.component('loading-spinner', LoadingSpinner);
15-
Vue.component('progress-indicator', ProgressIndicator);
10+
export default boot(({ app }) => {
11+
app.component('base-button', BaseButton as unknown as Component);
12+
app.component('base-input', BaseInput as unknown as Component);
13+
app.component('base-select', BaseSelect as unknown as Component);
14+
app.component('loading-spinner', LoadingSpinner as unknown as Component);
15+
app.component('progress-indicator', ProgressIndicator as unknown as Component);
1616
});

frontend/src/boot/composition-api.ts

-6
This file was deleted.

frontend/src/boot/error-handler.ts

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
11
import { boot } from 'quasar/wrappers';
22
import { handleError } from 'src/utils/alerts';
33

4-
export default boot(({ Vue }) => {
4+
export default boot(({ app }) => {
55
// Source: https://stackoverflow.com/questions/52071212/how-to-implement-global-error-handling-in-vue
66

77
// `info` is a Vue-specific error info, e.g. which lifecycle hook
88
// the error was found in. Only available in 2.2.0+
9-
Vue.config.errorHandler = function (err, _vm, info) {
9+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
10+
app.config.errorHandler = function (err: any, _vm: any, info: any) {
1011
console.log('Error info:', info);
11-
handleError(err);
12+
handleError(err); // eslint-disable-line @typescript-eslint/no-unsafe-argument
1213
};
1314

1415
// General JS (non-Vue) error handler
@@ -30,6 +31,6 @@ export default boot(({ Vue }) => {
3031
if (event.reason.code === -32000 && event.reason.message === 'already known') {
3132
return;
3233
}
33-
throw new Error(event.reason);
34+
throw new Error(<string>event.reason);
3435
});
3536
});

0 commit comments

Comments
 (0)