Skip to content

Commit

Permalink
Merge pull request #57 from ChainSafe/lykhoyda/migrate_to_parcel2_web…
Browse files Browse the repository at this point in the history
…_wallet

Lykhoyda/migrate to parcel2 web wallet
  • Loading branch information
Lykhoyda authored Feb 3, 2025
2 parents 0535f55 + 1491bc2 commit d6f552c
Show file tree
Hide file tree
Showing 55 changed files with 3,736 additions and 1,422 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/deploy-demo.yml
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ jobs:
run: yarn install --immutable

- name: Build
run: yarn build
run: yarn demo-wallet:build

- name: Deploy to Netlify
uses: nwtgck/[email protected]
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -25,3 +25,4 @@ packages/demo-wallet/dist/*
packages/e2e-tests/dist/*
!/packages/e2e-tests/dist/serve.json

!/packages/web-wallet/dist/_headers
11 changes: 7 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,16 @@
},
"packageManager": "[email protected]",
"scripts": {
"serve": "yarn workspace @webzjs/demo-wallet run serve",
"dev": "yarn run just:build-keys && yarn run snap:start & yarn run demo-wallet:dev",
"build": "yarn workspace @webzjs/demo-wallet run build",
"demo-wallet:dev": "yarn workspace @webzjs/demo-wallet run dev",
"dev": "yarn workspace @webzjs/web-wallet run dev & yarn run snap:start",
"demo-wallet:serve": "yarn workspace @webzjs/demo-wallet run serve",
"demo-wallet:dev": "yarn run just:build-keys && yarn run snap:start & yarn run web-wallet:dev",
"demo-wallet:build": "yarn workspace @webzjs/demo-wallet run build",
"web-wallet:dev": "yarn workspace @webzjs/web-wallet run dev & yarn run snap:start",
"web-wallet:build": "yarn workspace @webzjs/web-wallet run build",
"test:e2e": "yarn workspace @webzjs/e2e-tests test",
"snap:start": "yarn workspace @webzjs/zcash-snap run start",
"snap:build": "yarn workspace @webzjs/zcash-snap run build",
"just:build": "just build",
"just:build-keys": "just build-keys"
}
}
2 changes: 1 addition & 1 deletion packages/web-wallet/.env
Original file line number Diff line number Diff line change
@@ -1 +1 @@
SNAP_ORIGIN=""
SNAP_ORIGIN="local:http://localhost:8080"
6 changes: 6 additions & 0 deletions packages/web-wallet/.parcelrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"extends": "@parcel/config-default",
"transformers": {
"*.svg": ["...", "@parcel/transformer-svg-react"]
}
}
5 changes: 5 additions & 0 deletions packages/web-wallet/.postcssrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"plugins": {
"@tailwindcss/postcss": {}
}
}
3 changes: 3 additions & 0 deletions packages/web-wallet/dist/_headers
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
/*
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
3 changes: 2 additions & 1 deletion packages/web-wallet/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,11 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="src/styles/index.css" rel="stylesheet">
<title>WebZjs Web Wallet</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
<script type="module" src="./src/main.tsx"></script>
</body>
</html>
42 changes: 25 additions & 17 deletions packages/web-wallet/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,13 @@
"private": true,
"version": "0.0.0",
"type": "module",
"source": [
"index.html",
"../../node_modules/@webzjs/webz-wallet/snippets/wasm-bindgen-rayon-3e04391371ad0a8e/src/workerHelpers.worker.js"
],
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
"dev": "node server.js",
"build": "parcel build index.html --dist-dir dist"
},
"dependencies": {
"@metamask/providers": "^18.2.0",
Expand All @@ -23,22 +25,28 @@
},
"devDependencies": {
"@eslint/js": "^9.13.0",
"@fontsource/inter": "^5.1.0",
"@fontsource/roboto": "^5.1.0",
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"eslint": "^9.13.0",
"@parcel/core": "^2.13.3",
"@parcel/transformer-svg-react": "^2.13.3",
"@tailwindcss/postcss": "^4.0.0",
"@types/express": "^4",
"@types/node": "^22.10.10",
"@types/react": "^19.0.8",
"@types/react-dom": "^19.0.3",
"@types/styled-components": "^5.1.34",
"@typescript-eslint/eslint-plugin": "^8.21.0",
"@typescript-eslint/parser": "^8.21.0",
"connect-history-api-fallback": "^2.0.0",
"dotenv": "^16.4.7",
"eslint": "^9.18.0",
"eslint-config-react-app": "^7.0.1",
"eslint-plugin-react-hooks": "^5.0.0",
"eslint-plugin-react-refresh": "^0.4.14",
"express": "^4.21.2",
"globals": "^15.11.0",
"parcel": "^2.13.3",
"path": "^0.12.7",
"postcss": "^8.4.47",
"tailwindcss": "^3.4.14",
"typescript": "~5.6.2",
"typescript-eslint": "^8.11.0",
"vite": "^6.0.7",
"vite-plugin-svgr": "^4.3.0"
"tailwindcss": "^4.0.0",
"typescript": "^5.7.3",
"typescript-eslint": "^8.11.0"
}
}
6 changes: 0 additions & 6 deletions packages/web-wallet/postcss.config.js

This file was deleted.

52 changes: 52 additions & 0 deletions packages/web-wallet/server.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import express from 'express';
import { fileURLToPath } from 'url';
import { dirname, join } from 'path';
import { Parcel } from '@parcel/core';
import history from 'connect-history-api-fallback';
import dotenv from 'dotenv';

dotenv.config();

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

async function run() {
const bundler = new Parcel({
entries: 'index.html',
defaultConfig: '@parcel/config-default',
mode: 'development',
defaultTargetOptions: {
distDir: 'dist',
},
});

// Watch in background
await bundler.watch((err) => {
if (err) {
console.error('Build error:', err.diagnostics);
} else {
console.log('Parcel build successful');
}
});

const app = express();

// Set custom headers (for WASM multi-threading)
app.use((req, res, next) => {
res.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
res.setHeader('Cross-Origin-Embedder-Policy', 'require-corp');
next();
});

app.use(history());
app.use(express.static(join(__dirname, 'dist')));

app.listen(3000, () => {
console.log('Server running on http://localhost:3000');
});
}

run().catch((err) => {
console.error(err);
process.exit(1);
});
4 changes: 2 additions & 2 deletions packages/web-wallet/src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import { useInterval } from 'usehooks-ts';
import { useWebZjsActions } from '@hooks/useWebzjsActions';
import Layout from '@components/Layout/Layout';
import { Outlet, useLocation } from 'react-router-dom';
import { RESCAN_INTERVAL } from './config/constants';
import { useEffect } from 'react';
import { useWebZjsActions } from './hooks';
import Layout from './components/Layout/Layout';

function App() {
const { triggerRescan } = useWebZjsActions();
Expand Down
Binary file added packages/web-wallet/src/assets/chainsafe.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 0 additions & 9 deletions packages/web-wallet/src/assets/chainsafe.svg

This file was deleted.

Binary file added packages/web-wallet/src/assets/form-transfer.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
50 changes: 25 additions & 25 deletions packages/web-wallet/src/assets/index.ts
Original file line number Diff line number Diff line change
@@ -1,32 +1,32 @@
import { ReactComponent as ChainsafeSvg } from './chainsafe.svg';
import { ReactComponent as FormTransferSvg } from './form-transfer.svg';
import { ReactComponent as MetaMaskLogoSvg } from './metaMask-logo.svg';
import { ReactComponent as MetaMaskSnapsLogoSvg } from './metamask-snaps-logo.svg';
import { ReactComponent as ZcashSvg } from './zcash.svg';
import { ReactComponent as ZcashYellowSvg } from './zcash-yellow.svg';
import ChainsafePNG from './chainsafe.png';
import FormTransferSvg from './form-transfer.svg';
import MetaMaskLogoPNG from './metaMask-logo.png';
import MetaMaskSnapsLogoPNG from './metamask-snaps-logo.png';
import ZcashPNG from './zcash.png';
import ZcashYellowPNG from './zcash-yellow.png';

// Icons
import { ReactComponent as ArrowReceiveSvg } from './icons/arrow-receive.svg';
import { ReactComponent as ArrowTransferSvg } from './icons/arrow-transfer.svg';
import { ReactComponent as ClockSvg } from './icons/clock.svg';
import { ReactComponent as ShieldSvg } from './icons/shield.svg';
import { ReactComponent as ShieldDividedSvg } from './icons/shield-divided.svg';
import { ReactComponent as SummarySvg } from './icons/summary.svg';
import { ReactComponent as CoinsSvg } from './icons/coins.svg';
import { ReactComponent as ChevronSVG } from './icons/chevron.svg';
import { ReactComponent as CheckSVG } from './icons/check.svg';
import { ReactComponent as WarningSVG } from './icons/warning.svg';
import { ReactComponent as EyeSvg } from './icons/eye.svg';
import { ReactComponent as EyeSlashSvg } from './icons/eye-slash.svg';
import { ReactComponent as CircleSvg } from './icons/circle.svg';
import { ReactComponent as CircleDashedSvg } from './icons/circle-dashed.svg';
import ArrowReceiveSvg from './icons/arrow-receive.svg';
import ArrowTransferSvg from './icons/arrow-transfer.svg';
import ClockSvg from './icons/clock.svg';
import ShieldSvg from './icons/shield.svg';
import ShieldDividedSvg from './icons/shield-divided.svg';
import SummarySvg from './icons/summary.svg';
import CoinsSvg from './icons/coins.svg';
import ChevronSVG from './icons/chevron.svg';
import CheckSVG from './icons/check.svg';
import WarningSVG from './icons/warning.svg';
import EyeSvg from './icons/eye.svg';
import EyeSlashSvg from './icons/eye-slash.svg';
import CircleSvg from './icons/circle.svg';
import CircleDashedSvg from './icons/circle-dashed.svg';

export {
ChainsafeSvg,
MetaMaskLogoSvg,
MetaMaskSnapsLogoSvg,
ZcashSvg,
ZcashYellowSvg,
ChainsafePNG,
MetaMaskLogoPNG,
MetaMaskSnapsLogoPNG,
ZcashPNG,
ZcashYellowPNG,
FormTransferSvg,
ArrowReceiveSvg,
ArrowTransferSvg,
Expand Down
Binary file added packages/web-wallet/src/assets/metaMask-logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 0 additions & 9 deletions packages/web-wallet/src/assets/metaMask-logo.svg

This file was deleted.

Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit d6f552c

Please sign in to comment.