diff --git a/boxes/bootstrap.sh b/boxes/bootstrap.sh index c8bf46d90085..2b370cb8484d 100755 --- a/boxes/bootstrap.sh +++ b/boxes/bootstrap.sh @@ -35,7 +35,7 @@ function test { function test_cmds { for browser in chromium webkit; do - for box in vanilla react; do + for box in vanilla react vite; do echo "boxes/scripts/run_test.sh $box $browser" done done diff --git a/boxes/boxes/react/webpack.config.js b/boxes/boxes/react/webpack.config.js index 3cf890b3e06e..ed649c359629 100644 --- a/boxes/boxes/react/webpack.config.js +++ b/boxes/boxes/react/webpack.config.js @@ -2,6 +2,8 @@ import CopyPlugin from 'copy-webpack-plugin'; import { createRequire } from 'module'; import webpack from 'webpack'; import HtmlWebpackPlugin from 'html-webpack-plugin'; +import { resolve } from 'path'; + const require = createRequire(import.meta.url); export default (_, argv) => ({ @@ -31,7 +33,7 @@ export default (_, argv) => ({ new CopyPlugin({ patterns: [ { - context: '../../../barretenberg/ts/dest/browser', + context: resolve(require.resolve('@aztec/aztec.js'), '../'), from: '*.gz', }, ], diff --git a/boxes/boxes/vite/.env b/boxes/boxes/vite/.env deleted file mode 100644 index 6f73ed0c33bd..000000000000 --- a/boxes/boxes/vite/.env +++ /dev/null @@ -1 +0,0 @@ -VITE_AZTEC_NODE_URL=http://localhost:8080 \ No newline at end of file diff --git a/boxes/boxes/vite/.gitignore b/boxes/boxes/vite/.gitignore index 4137dee7a54f..560d0337d678 100644 --- a/boxes/boxes/vite/.gitignore +++ b/boxes/boxes/vite/.gitignore @@ -25,3 +25,4 @@ dist-ssr artifacts/* codegenCache.json +test-results/ \ No newline at end of file diff --git a/boxes/boxes/vite/package.json b/boxes/boxes/vite/package.json index 83bbaa49f429..0697700e6e0c 100644 --- a/boxes/boxes/vite/package.json +++ b/boxes/boxes/vite/package.json @@ -1,5 +1,5 @@ { - "name": "vite", + "name": "@aztec/vite", "private": true, "version": "0.0.0", "type": "module", @@ -8,9 +8,11 @@ "codegen": "${AZTEC_BUILDER:-aztec} codegen src/contracts/target -o artifacts", "clean": "rm -rf ./dist .tsbuildinfo ./artifacts ./src/contracts/target", "prep": "yarn clean && yarn compile && yarn codegen", - "dev": "vite", "build": "yarn prep && tsc -b && vite build", - "lint": "eslint .", + "serve": "vite", + "test": "npx playwright test", + "formatting": "prettier --check ./src && eslint ./src", + "formatting:fix": "prettier -w ./src", "preview": "vite preview" }, "dependencies": { diff --git a/boxes/boxes/vite/playwright.config.ts b/boxes/boxes/vite/playwright.config.ts new file mode 100644 index 000000000000..6adbb4038bfb --- /dev/null +++ b/boxes/boxes/vite/playwright.config.ts @@ -0,0 +1,37 @@ +import { defineConfig, devices } from "@playwright/test"; + +export default defineConfig({ + testDir: "./tests", + testMatch: "**.spec.ts", + fullyParallel: true, + retries: 3, + workers: process.env.CI ? 1 : 3, + reporter: "list", + use: { + baseURL: "http://127.0.0.1:5173", + trace: "on-first-retry", + screenshot: "only-on-failure", + video: "on-first-retry", + }, + expect: { + timeout: 90000, + }, + projects: [ + { + name: "chromium", + use: { ...devices["Desktop Chrome"] }, + }, + { + name: "firefox", + use: { ...devices["Desktop Firefox"] }, + }, + { + name: "webkit", + use: { ...devices["Desktop Safari"] }, + }, + ], + webServer: { + command: "yarn serve --host", + port: 5173, + }, +}); diff --git a/boxes/boxes/vite/src/config.ts b/boxes/boxes/vite/src/config.ts index 41856ff88a3d..9267e2a8d840 100644 --- a/boxes/boxes/vite/src/config.ts +++ b/boxes/boxes/vite/src/config.ts @@ -16,11 +16,6 @@ import { createStore } from "@aztec/kv-store/indexeddb"; import { BBWASMLazyPrivateKernelProver } from "@aztec/bb-prover/wasm/lazy"; import { WASMSimulator } from "@aztec/simulator/client"; -process.env = Object.keys(import.meta.env).reduce((acc, key) => { - acc[key.replace("VITE_", "")] = import.meta.env[key]; - return acc; -}, {}); - const SECRET_KEY = Fr.random(); export class PrivateEnv { @@ -28,16 +23,14 @@ export class PrivateEnv { accountContract; accountManager: AccountManager; - constructor( - private secretKey: Fr, - private nodeURL: string, - ) {} + constructor(private secretKey: Fr) {} async init() { + const nodeURL = process.env.AZTEC_NODE_URL ?? "http://localhost:8080"; + const config = getPXEServiceConfig(); config.dataDirectory = "pxe"; - config.proverEnabled = true; - const aztecNode = await createAztecNodeClient(this.nodeURL); + const aztecNode = await createAztecNodeClient(nodeURL); const simulationProvider = new WASMSimulator(); const proofCreator = new BBWASMLazyPrivateKernelProver( simulationProvider, @@ -52,7 +45,7 @@ export class PrivateEnv { const store = await createStore( "pxe_data", configWithContracts, - createLogger("pxe:data:indexeddb"), + createLogger("pxe:data:idb"), ); const keyStore = new KeyStore(store); @@ -87,10 +80,7 @@ export class PrivateEnv { } } -export const deployerEnv = new PrivateEnv( - SECRET_KEY, - process.env.AZTEC_NODE_URL, -); +export const deployerEnv = new PrivateEnv(SECRET_KEY); const IGNORE_FUNCTIONS = [ "constructor", diff --git a/boxes/boxes/vite/src/main.tsx b/boxes/boxes/vite/src/main.tsx index eff7ccc67760..7e083b822a21 100644 --- a/boxes/boxes/vite/src/main.tsx +++ b/boxes/boxes/vite/src/main.tsx @@ -3,6 +3,11 @@ import { createRoot } from "react-dom/client"; import "./index.css"; import App from "./App.tsx"; +process.env = Object.keys(import.meta.env).reduce((acc, key) => { + acc[key.replace("VITE_", "")] = import.meta.env[key]; + return acc; +}, {}); + createRoot(document.getElementById("root")!).render( diff --git a/boxes/boxes/vite/tests/browser.spec.ts b/boxes/boxes/vite/tests/browser.spec.ts new file mode 100644 index 000000000000..45072b6edd2d --- /dev/null +++ b/boxes/boxes/vite/tests/browser.spec.ts @@ -0,0 +1,25 @@ +import { test, expect } from '@playwright/test'; + +test('test', async ({ page }) => { + test.slow(); + await page.goto('/'); + + // Deploy contract + await page.getByRole('button', { name: 'Deploy dummy contract' }).click(); + await expect(page.getByText('Deploying contract...')).toBeVisible(); + await expect(page.getByText('Address:')).toBeVisible(); + + // Read number + await page.getByRole('button', { name: 'Read' }).click(); + await expect(page.getByText('Number is:')).toBeVisible(); + + // Set number + await page.locator('#numberToSet').fill('1'); + await page.getByRole('button', { name: 'Write' }).click(); + await expect(page.getByText('Setting number...')).toBeVisible(); + await expect(page.getByText('Number set to: 1')).toBeVisible(); + + // Read number + await page.getByRole('button', { name: 'Read' }).click(); + await expect(page.getByText('Number is: 1')).toBeVisible(); +}); diff --git a/boxes/boxes/vite/tests/node.test.ts b/boxes/boxes/vite/tests/node.test.ts new file mode 100644 index 000000000000..89d4da53f0c8 --- /dev/null +++ b/boxes/boxes/vite/tests/node.test.ts @@ -0,0 +1,45 @@ +import { AccountWallet, CompleteAddress, Contract, Fr, createLogger } from '@aztec/aztec.js'; +import { BoxReactContract } from '../artifacts/BoxReact.js'; +import { deployerEnv } from '../src/config.js'; + +const logger = createLogger('aztec:http-pxe-client'); + +describe('BoxReact Contract Tests', () => { + let wallet: AccountWallet; + let contract: Contract; + const numberToSet = Fr.random(); + let accountCompleteAddress: CompleteAddress; + + beforeAll(async () => { + wallet = await deployerEnv.getWallet(); + accountCompleteAddress = wallet.getCompleteAddress(); + const salt = Fr.random(); + + contract = await BoxReactContract.deploy( + wallet, + Fr.random(), + accountCompleteAddress.address + ) + .send({ contractAddressSalt: salt }) + .deployed(); + + logger.info(`L2 contract deployed at ${contract.address}`); + }, 60000); + + test('Can set a number', async () => { + logger.info(`${await wallet.getRegisteredAccounts()}`); + + await contract.methods + .setNumber( + numberToSet, + accountCompleteAddress.address + ) + .send() + .wait(); + }, 40000); + + test('Can read a number', async () => { + const viewTxReceipt = await contract.methods.getNumber(accountCompleteAddress.address).simulate(); + expect(numberToSet.toBigInt()).toEqual(viewTxReceipt.value); + }, 40000); +}); diff --git a/boxes/docker-compose.yml b/boxes/docker-compose.yml index 73791dfdc9b5..a8c8c3a2ec3f 100644 --- a/boxes/docker-compose.yml +++ b/boxes/docker-compose.yml @@ -49,6 +49,7 @@ services: ETHEREUM_HOST: http://ethereum:8545 L1_CHAIN_ID: 31337 PXE_URL: http://aztec:8080 + VITE_AZTEC_NODE_URL: http://aztec:8080 BOX: ${BOX:-vanilla} CI: ${CI:-} BROWSER: ${BROWSER:-chromium} diff --git a/boxes/yarn.lock b/boxes/yarn.lock index 2f35a3788f18..a56741755c45 100644 --- a/boxes/yarn.lock +++ b/boxes/yarn.lock @@ -134,6 +134,37 @@ __metadata: languageName: unknown linkType: soft +"@aztec/vite@workspace:boxes/vite": + version: 0.0.0-use.local + resolution: "@aztec/vite@workspace:boxes/vite" + dependencies: + "@aztec/accounts": "npm:latest" + "@aztec/aztec.js": "npm:latest" + "@aztec/bb-prover": "npm:latest" + "@aztec/circuit-types": "npm:latest" + "@aztec/key-store": "npm:latest" + "@aztec/kv-store": "npm:latest" + "@aztec/pxe": "npm:latest" + "@aztec/simulator": "npm:latest" + "@eslint/js": "npm:^9.13.0" + "@types/react": "npm:^18.3.12" + "@types/react-dom": "npm:^18.3.1" + "@vitejs/plugin-react-swc": "npm:^3.7.2" + eslint: "npm:^9.13.0" + eslint-plugin-react-hooks: "npm:^5.1.0" + eslint-plugin-react-refresh: "npm:^0.4.16" + globals: "npm:^15.11.0" + react: "npm:^18.3.1" + react-dom: "npm:^18.3.1" + react-toastify: "npm:^10.0.6" + typescript: "npm:~5.6.2" + typescript-eslint: "npm:^8.11.0" + vite: "npm:^6.0.3" + vite-plugin-node-polyfills: "npm:^0.23.0" + vite-plugin-static-copy: "npm:^2.2.0" + languageName: unknown + linkType: soft + "@babel/code-frame@npm:^7.0.0, @babel/code-frame@npm:^7.12.13, @babel/code-frame@npm:^7.25.9": version: 7.26.2 resolution: "@babel/code-frame@npm:7.26.2" @@ -12292,37 +12323,6 @@ __metadata: languageName: node linkType: hard -"vite@workspace:boxes/vite": - version: 0.0.0-use.local - resolution: "vite@workspace:boxes/vite" - dependencies: - "@aztec/accounts": "npm:latest" - "@aztec/aztec.js": "npm:latest" - "@aztec/bb-prover": "npm:latest" - "@aztec/circuit-types": "npm:latest" - "@aztec/key-store": "npm:latest" - "@aztec/kv-store": "npm:latest" - "@aztec/pxe": "npm:latest" - "@aztec/simulator": "npm:latest" - "@eslint/js": "npm:^9.13.0" - "@types/react": "npm:^18.3.12" - "@types/react-dom": "npm:^18.3.1" - "@vitejs/plugin-react-swc": "npm:^3.7.2" - eslint: "npm:^9.13.0" - eslint-plugin-react-hooks: "npm:^5.1.0" - eslint-plugin-react-refresh: "npm:^0.4.16" - globals: "npm:^15.11.0" - react: "npm:^18.3.1" - react-dom: "npm:^18.3.1" - react-toastify: "npm:^10.0.6" - typescript: "npm:~5.6.2" - typescript-eslint: "npm:^8.11.0" - vite: "npm:^6.0.3" - vite-plugin-node-polyfills: "npm:^0.23.0" - vite-plugin-static-copy: "npm:^2.2.0" - languageName: unknown - linkType: soft - "vitest@npm:^2.0.5": version: 2.0.5 resolution: "vitest@npm:2.0.5" diff --git a/gaztec/package.json b/gaztec/package.json index 5d79c28bf803..0d0d6d8d0de5 100644 --- a/gaztec/package.json +++ b/gaztec/package.json @@ -1,5 +1,6 @@ { - "name": "vite", + "name": "gaztec", + "packageManager": "yarn@4.5.2", "private": true, "version": "0.0.0", "type": "module", @@ -26,6 +27,7 @@ "@mui/icons-material": "^6.3.1", "@mui/material": "^6.3.1", "@mui/styles": "^6.3.1", + "nosleep.js": "^0.12.0", "react": "^18.3.1", "react-dom": "^18.3.1", "react-dropzone": "^14.3.5" @@ -42,8 +44,8 @@ "globals": "^15.14.0", "typescript": "~5.7.3", "typescript-eslint": "^8.11.0", - "vite": "^6.0.7", - "vite-plugin-node-polyfills": "^0.22.0", + "vite": "^6.0.11", + "vite-plugin-node-polyfills": "^0.23.0", "vite-plugin-static-copy": "^2.2.0" } } diff --git a/gaztec/src/aztecEnv.ts b/gaztec/src/aztecEnv.ts index 000152e577fe..c2ef318f3011 100644 --- a/gaztec/src/aztecEnv.ts +++ b/gaztec/src/aztecEnv.ts @@ -6,6 +6,7 @@ import { AccountWalletWithSecretKey, AztecAddress, Contract, + Logger, } from "@aztec/aztec.js"; import { PXEService } from "@aztec/pxe/service"; import { PXEServiceConfig, getPXEServiceConfig } from "@aztec/pxe/config"; @@ -27,6 +28,68 @@ process.env = Object.keys(import.meta.env).reduce((acc, key) => { debug.enable("*"); +const logLevel = [ + "silent", + "fatal", + "error", + "warn", + "info", + "verbose", + "debug", + "trace", +] as const; + +type Log = { + type: (typeof logLevel)[number]; + timestamp: number; + prefix: string; + message: string; + data: any; +}; + +export class WebLogger { + private static instance: WebLogger; + private logs: Log[] = []; + + private constructor(private setLogs: (logs: Log[]) => void) {} + + static create(setLogs: (logs: Log[]) => void) { + WebLogger.instance = new WebLogger(setLogs); + } + + static getInstance() { + return WebLogger.instance; + } + + createLogger(prefix: string): Logger { + return new Proxy(createLogger(prefix), { + get: (target, prop, receiver) => { + if (logLevel.includes(prop as (typeof logLevel)[number])) { + return function () { + const args = [prop, prefix, ...arguments] as Parameters< + WebLogger["handleLog"] + >; + WebLogger.getInstance().handleLog(...args); + target[prop].apply(this, arguments); + }; + } else { + return target[prop]; + } + }, + }); + } + + private handleLog( + type: (typeof logLevel)[number], + prefix: string, + message: string, + data: any + ) { + this.logs.unshift({ type, prefix, message, data, timestamp: Date.now() }); + this.setLogs([...this.logs]); + } +} + export const AztecContext = createContext<{ pxe: PXE | null; nodeURL: string; @@ -37,6 +100,12 @@ export const AztecContext = createContext<{ currentContractAddress: AztecAddress; currentContract: Contract; currentTx: ContractFunctionInteractionTx; + logs: Log[]; + logsOpen: boolean; + drawerOpen: boolean; + setDrawerOpen: (drawerOpen: boolean) => void; + setLogsOpen: (logsOpen: boolean) => void; + setLogs: (logs: Log[]) => void; setWalletDB: (walletDB: WalletDB) => void; setPXEInitialized: (isPXEInitialized: boolean) => void; setWallet: (wallet: AccountWalletWithSecretKey) => void; @@ -56,6 +125,12 @@ export const AztecContext = createContext<{ currentContract: null, currentContractAddress: null, currentTx: null, + logs: [], + logsOpen: false, + drawerOpen: false, + setDrawerOpen: (drawerOpen: boolean) => {}, + setLogsOpen: (logsOpen: boolean) => {}, + setLogs: (logs: Log[]) => {}, setWalletDB: (walletDB: WalletDB) => {}, setPXEInitialized: (isPXEInitialized: boolean) => {}, setWallet: (wallet: AccountWalletWithSecretKey) => {}, @@ -73,7 +148,12 @@ export class AztecEnv { return aztecNode; } - static async initPXE(aztecNode: AztecNode): Promise { + static async initPXE( + aztecNode: AztecNode, + setLogs: (logs: Log[]) => void + ): Promise { + WebLogger.create(setLogs); + const config = getPXEServiceConfig(); config.dataDirectory = "pxe"; config.proverEnabled = true; @@ -81,7 +161,8 @@ export class AztecEnv { const simulationProvider = new WASMSimulator(); const proofCreator = new BBWASMLazyPrivateKernelProver( simulationProvider, - 16 + 16, + WebLogger.getInstance().createLogger("bb:wasm:lazy") ); const l1Contracts = await aztecNode.getL1ContractAddresses(); const configWithContracts = { @@ -92,7 +173,7 @@ export class AztecEnv { const store = await createStore( "pxe_data", configWithContracts, - createLogger("pxe:data:indexeddb") + WebLogger.getInstance().createLogger("pxe:data:indexeddb") ); const keyStore = new KeyStore(store); @@ -107,7 +188,8 @@ export class AztecEnv { tips, proofCreator, simulationProvider, - config + config, + WebLogger.getInstance().createLogger("pxe:service") ); await pxe.init(); return pxe; diff --git a/gaztec/src/components/contract/components/deployContractDialog.tsx b/gaztec/src/components/contract/components/deployContractDialog.tsx index 11ff31a7ab1f..222719470e43 100644 --- a/gaztec/src/components/contract/components/deployContractDialog.tsx +++ b/gaztec/src/components/contract/components/deployContractDialog.tsx @@ -51,8 +51,9 @@ export function DeployContractDialog({ const [initializer, setInitializer] = useState(null); const [parameters, setParameters] = useState([]); const [deploying, setDeploying] = useState(false); - const [aliasedAddresses, setAliasedAddresses] = useState([]); - const { walletDB, wallet } = useContext(AztecContext); + const [_aliasedAddresses, setAliasedAddresses] = useState([]); + const { walletDB, wallet, setLogsOpen, setDrawerOpen } = + useContext(AztecContext); useEffect(() => { const defaultInitializer = getDefaultInitializer(contractArtifact); @@ -78,6 +79,7 @@ export function DeployContractDialog({ const deploy = async () => { setDeploying(true); + setLogsOpen(true); const nodeInfo = await wallet.getNodeInfo(); const expectedAztecNrVersion = `${GITHUB_TAG_PREFIX}-v${nodeInfo.nodeVersion}`; diff --git a/gaztec/src/components/contract/contract.tsx b/gaztec/src/components/contract/contract.tsx index 4ae9c89b65ea..292544a1fc08 100644 --- a/gaztec/src/components/contract/contract.tsx +++ b/gaztec/src/components/contract/contract.tsx @@ -42,7 +42,7 @@ import { CreateAuthwitDialog } from "./components/createAuthwitDialog"; const container = css({ display: "flex", height: "100vh", - width: "75vw", + width: "100%", overflow: "hidden", justifyContent: "center", alignItems: "center", @@ -53,9 +53,9 @@ const dropZoneContainer = css({ flexDirection: "column", width: "100%", height: "80%", - border: "5px dashed black", + border: "3px dashed black", borderRadius: "15px", - margin: "5rem", + margin: "0rem 2rem 2rem 2rem", }); const contractFnContainer = css({ @@ -66,11 +66,40 @@ const contractFnContainer = css({ height: "100%", }); +const headerContainer = css({ + display: "flex", + flexDirection: "column", + flexGrow: 1, + flexWrap: "wrap", + margin: "0 0.5rem", + padding: "0.1rem", + overflow: "hidden", + justifyContent: "stretch", + marginBottom: "0.5rem", +}); + const header = css({ display: "flex", + width: "100%", + alignItems: "center", + justifyContent: "space-between", +}); + +const search = css({ + display: "flex", + overflow: "hidden", + "@media (width <= 800px)": { + width: "100%", + }, + "@media (width > 800px)": { + maxWidth: "500px", + }, +}); + +const contractActions = css({ + display: "flex", + flexDirection: "row", alignItems: "center", - margin: "0 1rem", - padding: "1rem", }); const simulationContainer = css({ @@ -81,6 +110,7 @@ const simulationContainer = css({ const checkBoxLabel = css({ height: "1.5rem", + marginLeft: "-10px", }); const loadingArtifactContainer = css({ @@ -323,125 +353,135 @@ export function ContractComponent() { ) ) : (
-
- - {contractArtifact.name} - - - - - setFilters({ ...filters, searchTerm: e.target.value }) - } - endAdornment={ - - - - } - /> -
- - setFilters({ ...filters, private: e.target.checked }) - } - /> - } - label="Private" - /> - - setFilters({ ...filters, public: e.target.checked }) - } - /> +
+
+ + {contractArtifact.name} + + {!currentContract && wallet && ( +
+ + + + +
+ )} + {currentContract && ( +
+ + {formatFrAsString(currentContract.address.toString())} + + + { + setCurrentContractAddress(null); + setCurrentContract(null); + setContractArtifact(null); + }} + > + + +
+ )} +
+
+ + + setFilters({ ...filters, searchTerm: e.target.value }) } - label="Public" - /> - - setFilters({ - ...filters, - unconstrained: e.target.checked, - }) - } - /> + endAdornment={ + + + } - label="Unconstrained" - /> -
- -
- {!currentContract && wallet && ( - <> - - - - - - )} - {currentContract && ( - <> - - {formatFrAsString(currentContract.address.toString())} - - - { - setCurrentContractAddress(null); - setCurrentContract(null); - setContractArtifact(null); +
- - - - )} + + setFilters({ ...filters, private: e.target.checked }) + } + /> + } + label="Private" + /> + + setFilters({ ...filters, public: e.target.checked }) + } + /> + } + label="Public" + /> + + setFilters({ + ...filters, + unconstrained: e.target.checked, + }) + } + /> + } + label="Unconstrained" + /> +
+ +
{contractArtifact.functions .filter( (fn) => + !fn.isInternal && !FORBIDDEN_FUNCTIONS.includes(fn.name) && ((filters.private && fn.functionType === "private") || (filters.public && fn.functionType === "public") || @@ -456,7 +496,8 @@ export function ContractComponent() { variant="outlined" sx={{ backgroundColor: "primary.light", - margin: "1rem", + margin: "0.5rem", + overflow: "hidden", }} > @@ -520,6 +561,7 @@ export function ContractComponent() { disabled={!wallet || !currentContract || isWorking} color="secondary" variant="contained" + size="small" onClick={() => simulate(fn.name)} endIcon={} > @@ -532,6 +574,7 @@ export function ContractComponent() { isWorking || fn.functionType === "unconstrained" } + size="small" color="secondary" variant="contained" onClick={() => send(fn.name)} @@ -546,6 +589,7 @@ export function ContractComponent() { isWorking || fn.functionType === "unconstrained" } + size="small" color="secondary" variant="contained" onClick={() => @@ -557,7 +601,7 @@ export function ContractComponent() { } endIcon={} > - Create authwit + Authwit diff --git a/gaztec/src/components/contract/dropzone.css b/gaztec/src/components/contract/dropzone.css index 5fe7b18ae4fc..385470db582f 100644 --- a/gaztec/src/components/contract/dropzone.css +++ b/gaztec/src/components/contract/dropzone.css @@ -1,8 +1,10 @@ .dropzone { - color: black; - width: 100%; - height: 100%; - display: flex; - justify-content: center; - align-items: center; -} \ No newline at end of file + color: black; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + padding: 2rem; + text-align: center; +} diff --git a/gaztec/src/components/home/home.tsx b/gaztec/src/components/home/home.tsx index 40eeb01507ed..53961430e981 100644 --- a/gaztec/src/components/home/home.tsx +++ b/gaztec/src/components/home/home.tsx @@ -3,6 +3,10 @@ import { ContractComponent } from "../contract/contract"; import { SidebarComponent } from "../sidebar/sidebar"; import { useState } from "react"; import { AztecContext } from "../../aztecEnv"; +import NoSleep from "nosleep.js"; +import { LogPanel } from "../logPanel/logPanel"; +import logoURL from "../../assets/Aztec_logo.png"; +import { Box, Drawer } from "@mui/material"; const layout = css({ display: "flex", @@ -10,6 +14,29 @@ const layout = css({ height: "100%", }); +const logo = css({ + width: "100%", + padding: "0.5rem", +}); + +const collapsedDrawer = css({ + height: "100%", + width: "4rem", + backgroundColor: "var(--mui-palette-primary-light)", + overflow: "hidden", +}); + +const noSleep = new NoSleep(); + +function enableNoSleep() { + noSleep.enable(); + document.removeEventListener("touchstart", enableNoSleep, false); +} + +// Enable wake lock. +// (must be wrapped in a user input event handler e.g. a mouse or touch handler) +document.addEventListener("touchstart", enableNoSleep, false); + export default function Home() { const [pxe, setPXE] = useState(null); const [wallet, setWallet] = useState(null); @@ -21,6 +48,9 @@ export default function Home() { const [currentContract, setCurrentContract] = useState(null); const [currentTx, setCurrentTx] = useState(null); const [currentContractAddress, setCurrentContractAddress] = useState(null); + const [logs, setLogs] = useState([]); + const [logsOpen, setLogsOpen] = useState(false); + const [drawerOpen, setDrawerOpen] = useState(false); const AztecContextInitialValue = { pxe, @@ -33,6 +63,12 @@ export default function Home() { currentTx, node, currentContractAddress, + logs, + logsOpen, + drawerOpen, + setDrawerOpen, + setLogsOpen, + setLogs, setAztecNode, setCurrentTx, setWalletDB, @@ -48,7 +84,23 @@ export default function Home() { return (
- +
setDrawerOpen(!drawerOpen)}> + +
+ setDrawerOpen(false)} + variant="temporary" + open={drawerOpen} + > + + +
diff --git a/gaztec/src/components/logPanel/logPanel.tsx b/gaztec/src/components/logPanel/logPanel.tsx new file mode 100644 index 000000000000..886d8e5d4076 --- /dev/null +++ b/gaztec/src/components/logPanel/logPanel.tsx @@ -0,0 +1,168 @@ +import { css, Global } from "@emotion/react"; +import { AztecContext } from "../../aztecEnv"; +import { useContext, useState } from "react"; +import { + CircularProgress, + CssBaseline, + Fab, + styled, + SwipeableDrawer, + Typography, +} from "@mui/material"; +import ArticleIcon from "@mui/icons-material/Article"; + +const Root = styled("div")(({ theme }) => ({ + height: "100%", + ...theme.applyStyles("dark", { + backgroundColor: theme.palette.background.default, + }), +})); + +const StyledBox = styled("div")(({ theme }) => ({ + backgroundColor: "#fff", + ...theme.applyStyles("dark", { + backgroundColor: "var(--mui-palette-primary)", + }), +})); + +const Puller = styled("div")(({ theme }) => ({ + width: 30, + height: 6, + backgroundColor: "var(--mui-palette-primary-light)", + borderRadius: 3, + position: "absolute", + top: 8, + left: "calc(50% - 20px)", + ...theme.applyStyles("dark", { + backgroundColor: "var(--mui-palette-primary-dark)", + }), +})); + +const logContainer = css({ + display: "flex", + flexDirection: "row", + backgroundColor: "var(--mui-palette-primary-light)", + margin: "0.1rem", + padding: "0.1rem 0.25rem", + borderRadius: "0.5rem", +}); + +const logPrefix = css({ + width: "8rem", + minWidth: "8rem", + overflow: "hidden", +}); + +const logContent = css({ + whiteSpace: "nowrap", + textOverflow: "ellipsis", + flexGrow: 1, + overflow: "hidden", + ":hover": css({ + whiteSpace: "unset", + textOverflow: "unset", + wordWrap: "break-word", + }), +}); + +const logTimestamp = css({}); + +const safeStringify = (obj: any) => + JSON.stringify(obj, (_, v) => (typeof v === "bigint" ? v.toString() : v)); + +const drawerBleeding = 56; + +export function LogPanel() { + const { logs, logsOpen, setLogsOpen } = useContext(AztecContext); + + const toggleDrawer = (newOpen: boolean) => () => { + setLogsOpen(newOpen); + }; + return ( + <> + + + .MuiPaper-root": { + height: `calc(50% - ${drawerBleeding}px)`, + overflow: "visible", + }, + }} + /> + + + + + {logs.length} logs + + + + {logs.map((log, index) => ( +
+
+ + {log.prefix}:  + +
+
+ + {log.message}  + + {safeStringify(log.data)} + + +
+
+ + + + {log.timestamp - + (logs[index + 1]?.timestamp ?? log.timestamp)} + ms + +
+
+ ))} + + + + + + + + ); +} diff --git a/gaztec/src/components/sidebar/components/txsPanel.tsx b/gaztec/src/components/sidebar/components/txsPanel.tsx new file mode 100644 index 000000000000..0d59705021f7 --- /dev/null +++ b/gaztec/src/components/sidebar/components/txsPanel.tsx @@ -0,0 +1,100 @@ +import { css } from "@emotion/react"; +import { useContext, useEffect, useState } from "react"; +import { AztecContext } from "../../../aztecEnv"; +import { Typography } from "@mui/material"; +import { + convertFromUTF8BufferAsString, + formatFrAsString, +} from "../../../utils/conversion"; +import { ContractFunctionInteractionTx } from "../../../utils/txs"; +import { TxHash } from "@aztec/aztec.js"; + +const txPanel = css({ + width: "100%", + backgroundColor: "var(--mui-palette-primary-main)", + maxHeight: "30vh", + overflowY: "auto", + borderRadius: "0.5rem", +}); + +const txData = css({ + display: "flex", + flexDirection: "column", + alignItems: "center", + padding: "0.5rem", + backgroundColor: "var(--mui-palette-primary-light)", + borderRadius: "0.5rem", + margin: "0.5rem", +}); + +export function TxsPanel() { + const [transactions, setTransactions] = useState([]); + + const { currentTx, currentContractAddress, walletDB } = + useContext(AztecContext); + + useEffect(() => { + const refreshTransactions = async () => { + const txsPerContract = await walletDB.retrieveTxsPerContract( + currentContractAddress + ); + const txHashes = txsPerContract.map((txHash) => + TxHash.fromString(convertFromUTF8BufferAsString(txHash)) + ); + const txs: ContractFunctionInteractionTx[] = await Promise.all( + txHashes.map(async (txHash) => { + const txData = await walletDB.retrieveTxData(txHash); + return { + contractAddress: currentContractAddress, + txHash: txData.txHash, + status: convertFromUTF8BufferAsString(txData.status), + fnName: convertFromUTF8BufferAsString(txData.fnName), + date: parseInt(convertFromUTF8BufferAsString(txData.date)), + } as ContractFunctionInteractionTx; + }) + ); + txs.sort((a, b) => (b.date >= a.date ? -1 : 1)); + if ( + currentTx && + currentTx.contractAddress === currentContractAddress && + (!currentTx.txHash || + !txs.find((tx) => tx.txHash.equals(currentTx.txHash))) + ) { + txs.unshift(currentTx); + } + setTransactions(txs); + }; + if (currentContractAddress && walletDB) { + refreshTransactions(); + } else { + setTransactions([]); + } + }, [currentContractAddress, currentTx]); + + return ( +
+ {transactions.map((tx) => ( +
+
+ + {tx.txHash ? formatFrAsString(tx.txHash.toString()) : "()"} +  -  + + + {tx.receipt + ? tx.receipt.status.toUpperCase() + : tx.status.toUpperCase()} +   + {tx.receipt && tx.receipt.status === "error" + ? tx.receipt.error + : tx.error} + +
+ + {tx.fnName}@{formatFrAsString(tx.contractAddress.toString())} + +
+ ))} +
+ ); +} diff --git a/gaztec/src/components/sidebar/sidebar.tsx b/gaztec/src/components/sidebar/sidebar.tsx index 8cac97869e2d..71190125e4ab 100644 --- a/gaztec/src/components/sidebar/sidebar.tsx +++ b/gaztec/src/components/sidebar/sidebar.tsx @@ -3,38 +3,30 @@ import InputLabel from "@mui/material/InputLabel"; import MenuItem from "@mui/material/MenuItem"; import FormControl from "@mui/material/FormControl"; import Select, { SelectChangeEvent } from "@mui/material/Select"; -import { AztecEnv, AztecContext } from "../../aztecEnv"; +import { AztecEnv, AztecContext, WebLogger } from "../../aztecEnv"; import { createStore } from "@aztec/kv-store/indexeddb"; -import { - AccountWalletWithSecretKey, - Fr, - TxHash, - createLogger, - AztecAddress, -} from "@aztec/aztec.js"; +import { AccountWalletWithSecretKey, Fr, AztecAddress } from "@aztec/aztec.js"; import { WalletDB } from "../../utils/storage"; import { useContext, useEffect, useState } from "react"; import { CreateAccountDialog } from "./components/createAccountDialog"; import { getSchnorrAccount } from "@aztec/accounts/schnorr"; import AddIcon from "@mui/icons-material/Add"; -import logoURL from "../../assets/Aztec_logo.png"; import { Button, Divider, Typography } from "@mui/material"; import { formatFrAsString, parseAliasedBuffersAsString, } from "../../utils/conversion"; -import { convertFromUTF8BufferAsString } from "../../utils/conversion"; -import { ContractFunctionInteractionTx } from "../../utils/txs"; import ContactsIcon from "@mui/icons-material/Contacts"; import { CopyToClipboardButton } from "../common/copyToClipboardButton"; import { AddSendersDialog } from "./components/addSenderDialog"; import { deriveSigningKey } from "@aztec/circuits.js/keys"; +import { TxsPanel } from "./components/txsPanel"; const container = css({ display: "flex", flexDirection: "column", height: "100%", - width: "25vw", + width: "100%", backgroundColor: "var(--mui-palette-primary-light)", overflow: "hidden", padding: "0 0.5rem", @@ -57,30 +49,6 @@ const header = css({ marginBottom: "1rem", }); -const logo = css({ - height: "90%", - margin: "0.5rem 1rem 0rem 0rem", -}); - -const txPanel = css({ - marginBottom: "0.5rem", - width: "100%", - backgroundColor: "var(--mui-palette-primary-main)", - maxHeight: "30vh", - overflowY: "auto", - borderRadius: "0.5rem", -}); - -const txData = css({ - display: "flex", - flexDirection: "column", - alignItems: "center", - padding: "0.5rem", - backgroundColor: "var(--mui-palette-primary-light)", - borderRadius: "0.5rem", - margin: "0.5rem", -}); - const NETWORKS = [ { nodeURL: "http://localhost:8080", @@ -99,7 +67,7 @@ export function SidebarComponent() { setWallet, setCurrentContractAddress, setAztecNode, - currentTx, + setLogs, currentContractAddress, wallet, walletDB, @@ -107,9 +75,9 @@ export function SidebarComponent() { isPXEInitialized, pxe, } = useContext(AztecContext); + const [changingNetworks, setChangingNetworks] = useState(false); const [accounts, setAccounts] = useState([]); const [contracts, setContracts] = useState([]); - const [transactions, setTransactions] = useState([]); const [openCreateAccountDialog, setOpenCreateAccountDialog] = useState(false); const [openAddSendersDialog, setOpenAddSendersDialog] = useState(false); @@ -134,15 +102,17 @@ export function SidebarComponent() { }; const handleNetworkChange = async (event: SelectChangeEvent) => { + setChangingNetworks(true); setPXEInitialized(false); const nodeURL = event.target.value; setNodeURL(nodeURL); const node = await AztecEnv.connectToNode(nodeURL); setAztecNode(node); - const pxe = await AztecEnv.initPXE(node); + const pxe = await AztecEnv.initPXE(node, setLogs); const rollupAddress = (await pxe.getNodeInfo()).l1ContractAddresses .rollupAddress; - const walletLogger = createLogger("wallet:data:indexeddb"); + const walletLogger = + WebLogger.getInstance().createLogger("wallet:data:idb"); const walletDBStore = await createStore( `wallet-${rollupAddress}`, { dataDirectory: "wallet", dataStoreMapSizeKB: 2e10 }, @@ -153,6 +123,7 @@ export function SidebarComponent() { setPXE(pxe); setWalletDB(walletDB); setPXEInitialized(true); + setChangingNetworks(false); }; useEffect(() => { @@ -175,44 +146,6 @@ export function SidebarComponent() { } }, [wallet, walletDB, pxe]); - useEffect(() => { - const refreshTransactions = async () => { - const txsPerContract = await walletDB.retrieveTxsPerContract( - currentContractAddress - ); - const txHashes = txsPerContract.map((txHash) => - TxHash.fromString(convertFromUTF8BufferAsString(txHash)) - ); - const txs: ContractFunctionInteractionTx[] = await Promise.all( - txHashes.map(async (txHash) => { - const txData = await walletDB.retrieveTxData(txHash); - return { - contractAddress: currentContractAddress, - txHash: txData.txHash, - status: convertFromUTF8BufferAsString(txData.status), - fnName: convertFromUTF8BufferAsString(txData.fnName), - date: parseInt(convertFromUTF8BufferAsString(txData.date)), - } as ContractFunctionInteractionTx; - }) - ); - txs.sort((a, b) => (b.date >= a.date ? -1 : 1)); - if ( - currentTx && - currentTx.contractAddress === currentContractAddress && - (!currentTx.txHash || - !txs.find((tx) => tx.txHash.equals(currentTx.txHash))) - ) { - txs.unshift(currentTx); - } - setTransactions(txs); - }; - if (currentContractAddress && walletDB) { - refreshTransactions(); - } else { - setTransactions([]); - } - }, [currentContractAddress, currentTx]); - const handleAccountChange = async (event: SelectChangeEvent) => { if (event.target.value == "") { return; @@ -273,7 +206,6 @@ export function SidebarComponent() { return (
- {NETWORKS.map((network) => ( @@ -373,30 +306,7 @@ export function SidebarComponent() {
Transactions -
- {transactions.map((tx) => ( -
-
- - {tx.txHash ? formatFrAsString(tx.txHash.toString()) : "()"} -  -  - - - {tx.receipt - ? tx.receipt.status.toUpperCase() - : tx.status.toUpperCase()} -   - {tx.receipt && tx.receipt.status === "error" - ? tx.receipt.error - : tx.error} - -
- - {tx.fnName}@{formatFrAsString(tx.contractAddress.toString())} - -
- ))} -
+ =4.8.4 <5.8.0" - checksum: 10c0/993784b04533b13c3f3919c793cfc3a369fa61692e1a2d72de6fba27df247c275d852cdcbc4e393c310b73fce8d34d210a9b632b66f4d761a1a3b4781f8fa93f + checksum: 10c0/eecc23e05287cc99a43855d64c0f0898f690ee14b8c31b60ba92ce9732443f6b0c9695514b276fb2ecd27e64c15d4c38cd28b570779115525b4dfdbba60e81ca languageName: node linkType: hard -"@typescript-eslint/parser@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/parser@npm:8.19.1" +"@typescript-eslint/parser@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/parser@npm:8.22.0" dependencies: - "@typescript-eslint/scope-manager": "npm:8.19.1" - "@typescript-eslint/types": "npm:8.19.1" - "@typescript-eslint/typescript-estree": "npm:8.19.1" - "@typescript-eslint/visitor-keys": "npm:8.19.1" + "@typescript-eslint/scope-manager": "npm:8.22.0" + "@typescript-eslint/types": "npm:8.22.0" + "@typescript-eslint/typescript-estree": "npm:8.22.0" + "@typescript-eslint/visitor-keys": "npm:8.22.0" debug: "npm:^4.3.4" peerDependencies: eslint: ^8.57.0 || ^9.0.0 typescript: ">=4.8.4 <5.8.0" - checksum: 10c0/1afbd2d0a25f439943bdc94637417429574eb3889a2a1ce24bd425721713aca213808a975bb518a6616171783bc04fa973167f05fc6a96cfd88c1d1666077ad4 + checksum: 10c0/6575684d4724aa908b0d6a29db5d5054b9277804844ee4179c77371f8b8b84534b9b7e4df0e282c5f39729ae6f0019208a6b83f0ca5d0f06f9da5a06d8ddb4fd languageName: node linkType: hard -"@typescript-eslint/scope-manager@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/scope-manager@npm:8.19.1" +"@typescript-eslint/scope-manager@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/scope-manager@npm:8.22.0" dependencies: - "@typescript-eslint/types": "npm:8.19.1" - "@typescript-eslint/visitor-keys": "npm:8.19.1" - checksum: 10c0/7dca0c28ad27a0c7e26499e0f584f98efdcf34087f46aadc661b36c310484b90655e83818bafd249b5a28c7094a69c54d553f6cd403869bf134f95a9148733f5 + "@typescript-eslint/types": "npm:8.22.0" + "@typescript-eslint/visitor-keys": "npm:8.22.0" + checksum: 10c0/f393ab32086f4b095fcd77169abb5200ad94f282860944d164cec8c9b70090c36235f49b066ba24dfd953201b7730e48200a254e5950a9a3565acdacbbc0fd64 languageName: node linkType: hard -"@typescript-eslint/type-utils@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/type-utils@npm:8.19.1" +"@typescript-eslint/type-utils@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/type-utils@npm:8.22.0" dependencies: - "@typescript-eslint/typescript-estree": "npm:8.19.1" - "@typescript-eslint/utils": "npm:8.19.1" + "@typescript-eslint/typescript-estree": "npm:8.22.0" + "@typescript-eslint/utils": "npm:8.22.0" debug: "npm:^4.3.4" ts-api-utils: "npm:^2.0.0" peerDependencies: eslint: ^8.57.0 || ^9.0.0 typescript: ">=4.8.4 <5.8.0" - checksum: 10c0/757592b515beec58c079c605aa648ba94d985ae48ba40460034e849c7bc2b603b1da6113e59688e284608c9d5ccaa27adf0a14fb032cb1782200c6acae51ddd2 + checksum: 10c0/dc457d9184dc2156eda225c63de03b1052d75464d6393edaf0f1728eecf64170f73e19bc9b9d4a4a029870ce25015b59bd6705e1e18b731ca4fcecac4398bfb7 languageName: node linkType: hard -"@typescript-eslint/types@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/types@npm:8.19.1" - checksum: 10c0/e907bf096d5ed7a812a1e537a98dd881ab5d2d47e072225bfffaa218c1433115a148b27a15744db8374b46dac721617c6d13a1da255fdeb369cf193416533f6e +"@typescript-eslint/types@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/types@npm:8.22.0" + checksum: 10c0/6357d0937e2b84ddb00763d05053fe50f2270fa428aa11f1ad6a1293827cf54da7e6d4d20b00b9d4f633b6982a2eb0e494f05285daa1279d8a3493f0d8abae18 languageName: node linkType: hard -"@typescript-eslint/typescript-estree@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/typescript-estree@npm:8.19.1" +"@typescript-eslint/typescript-estree@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/typescript-estree@npm:8.22.0" dependencies: - "@typescript-eslint/types": "npm:8.19.1" - "@typescript-eslint/visitor-keys": "npm:8.19.1" + "@typescript-eslint/types": "npm:8.22.0" + "@typescript-eslint/visitor-keys": "npm:8.22.0" debug: "npm:^4.3.4" fast-glob: "npm:^3.3.2" is-glob: "npm:^4.0.3" @@ -1370,32 +1370,32 @@ __metadata: ts-api-utils: "npm:^2.0.0" peerDependencies: typescript: ">=4.8.4 <5.8.0" - checksum: 10c0/549d9d565a58a25fc8397a555506f2e8d29a740f5b6ed9105479e22de5aab89d9d535959034a8e9d4115adb435de09ee6987d28e8922052eea577842ddce1a7a + checksum: 10c0/0a9d77fbadfb1e54c06abde424e461103576595c70e50ae8a15a3d7c07f125f253f505208e1ea5cc483b9073d95fc10ce0c4ddfe0fe08ec2aceda6314c341e0d languageName: node linkType: hard -"@typescript-eslint/utils@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/utils@npm:8.19.1" +"@typescript-eslint/utils@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/utils@npm:8.22.0" dependencies: "@eslint-community/eslint-utils": "npm:^4.4.0" - "@typescript-eslint/scope-manager": "npm:8.19.1" - "@typescript-eslint/types": "npm:8.19.1" - "@typescript-eslint/typescript-estree": "npm:8.19.1" + "@typescript-eslint/scope-manager": "npm:8.22.0" + "@typescript-eslint/types": "npm:8.22.0" + "@typescript-eslint/typescript-estree": "npm:8.22.0" peerDependencies: eslint: ^8.57.0 || ^9.0.0 typescript: ">=4.8.4 <5.8.0" - checksum: 10c0/f7d2fe9a2bd8cb3ae6fafe5e465882a6784b2acf81d43d194c579381b92651c2ffc0fca69d2a35eee119f539622752a0e9ec063aaec7576d5d2bfe68b441980d + checksum: 10c0/6f1e3f9c0fb865c8cef4fdca04679cea7357ed011338b54d80550e9ad5369a3f24cbe4b0985d293192fe351fa133e5f4ea401f47af90bb46c21903bfe087b398 languageName: node linkType: hard -"@typescript-eslint/visitor-keys@npm:8.19.1": - version: 8.19.1 - resolution: "@typescript-eslint/visitor-keys@npm:8.19.1" +"@typescript-eslint/visitor-keys@npm:8.22.0": + version: 8.22.0 + resolution: "@typescript-eslint/visitor-keys@npm:8.22.0" dependencies: - "@typescript-eslint/types": "npm:8.19.1" + "@typescript-eslint/types": "npm:8.22.0" eslint-visitor-keys: "npm:^4.2.0" - checksum: 10c0/117537450a099f51f3f0d39186f248ae370bdc1b7f6975dbdbffcfc89e6e1aa47c1870db790d4f778a48f2c1f6cd9c269b63867c12afaa424367c63dabee8fd0 + checksum: 10c0/fd83d2feadaf79950427fbbc3d23ca01cf4646ce7e0dd515a9c881d31ec1cc768e7b8898d3af065e31df39452501a3345092581cbfccac89e89d293519540557 languageName: node linkType: hard @@ -1410,10 +1410,10 @@ __metadata: languageName: node linkType: hard -"abbrev@npm:^2.0.0": - version: 2.0.0 - resolution: "abbrev@npm:2.0.0" - checksum: 10c0/f742a5a107473946f426c691c08daba61a1d15942616f300b5d32fd735be88fef5cba24201757b6c407fd564555fb48c751cfa33519b2605c8a7aadd22baf372 +"abbrev@npm:^3.0.0": + version: 3.0.0 + resolution: "abbrev@npm:3.0.0" + checksum: 10c0/049704186396f571650eb7b22ed3627b77a5aedf98bb83caf2eac81ca2a3e25e795394b0464cfb2d6076df3db6a5312139eac5b6a126ca296ac53c5008069c28 languageName: node linkType: hard @@ -2171,11 +2171,11 @@ __metadata: linkType: hard "es-object-atoms@npm:^1.0.0": - version: 1.0.0 - resolution: "es-object-atoms@npm:1.0.0" + version: 1.1.1 + resolution: "es-object-atoms@npm:1.1.1" dependencies: es-errors: "npm:^1.3.0" - checksum: 10c0/1fed3d102eb27ab8d983337bb7c8b159dd2a1e63ff833ec54eea1311c96d5b08223b433060ba240541ca8adba9eee6b0a60cdbf2f80634b784febc9cc8b687b4 + checksum: 10c0/65364812ca4daf48eb76e2a3b7a89b3f6a2e62a1c420766ce9f692665a29d94fe41fe88b65f24106f449859549711e4b40d9fb8002d862dfd7eb1c512d10be0c languageName: node linkType: hard @@ -2315,15 +2315,15 @@ __metadata: linkType: hard "eslint@npm:^9.13.0": - version: 9.18.0 - resolution: "eslint@npm:9.18.0" + version: 9.19.0 + resolution: "eslint@npm:9.19.0" dependencies: "@eslint-community/eslint-utils": "npm:^4.2.0" "@eslint-community/regexpp": "npm:^4.12.1" "@eslint/config-array": "npm:^0.19.0" "@eslint/core": "npm:^0.10.0" "@eslint/eslintrc": "npm:^3.2.0" - "@eslint/js": "npm:9.18.0" + "@eslint/js": "npm:9.19.0" "@eslint/plugin-kit": "npm:^0.2.5" "@humanfs/node": "npm:^0.16.6" "@humanwhocodes/module-importer": "npm:^1.0.1" @@ -2359,7 +2359,7 @@ __metadata: optional: true bin: eslint: bin/eslint.js - checksum: 10c0/7f592ad228b9bd627a24870fdc875bacdab7bf535d4b67316c4cb791e90d0125130a74769f3c407b0c4b7027b3082ef33864a63ee1024552a60a17db60493f15 + checksum: 10c0/3b0dfaeff6a831de086884a3e2432f18468fe37c69f35e1a0a9a2833d9994a65b6dd2a524aaee28f361c849035ad9d15e3841029b67d261d0abd62c7de6d51f5 languageName: node linkType: hard @@ -2473,11 +2473,11 @@ __metadata: linkType: hard "fastq@npm:^1.6.0": - version: 1.18.0 - resolution: "fastq@npm:1.18.0" + version: 1.19.0 + resolution: "fastq@npm:1.19.0" dependencies: reusify: "npm:^1.0.4" - checksum: 10c0/7be87ecc41762adbddf558d24182f50a4b1a3ef3ee807d33b7623da7aee5faecdcc94fce5aa13fe91df93e269f383232bbcdb2dc5338cd1826503d6063221f36 + checksum: 10c0/d6a001638f1574a696660fcbba5300d017760432372c801632c325ca7c16819604841c92fd3ccadcdacec0966ca336363a5ff57bc5f0be335d8ea7ac6087b98f languageName: node linkType: hard @@ -2543,11 +2543,11 @@ __metadata: linkType: hard "for-each@npm:^0.3.3": - version: 0.3.3 - resolution: "for-each@npm:0.3.3" + version: 0.3.4 + resolution: "for-each@npm:0.3.4" dependencies: - is-callable: "npm:^1.1.3" - checksum: 10c0/22330d8a2db728dbf003ec9182c2d421fbcd2969b02b4f97ec288721cda63eb28f2c08585ddccd0f77cb2930af8d958005c9e72f47141dc51816127a118f39aa + is-callable: "npm:^1.2.7" + checksum: 10c0/6b2016c0a0fe3107c70a233923cac74f07bedb5a1847636039fa6bcc3df09aefa554cfec23c3342ad365acac1f95e799d9f8e220cb82a4c7b8a84f969234302f languageName: node linkType: hard @@ -2607,6 +2607,46 @@ __metadata: languageName: node linkType: hard +"gaztec@workspace:.": + version: 0.0.0-use.local + resolution: "gaztec@workspace:." + dependencies: + "@aztec/accounts": "link:../yarn-project/accounts" + "@aztec/aztec.js": "link:../yarn-project/aztec.js" + "@aztec/bb-prover": "link:../yarn-project/bb-prover" + "@aztec/circuits.js": "link:../yarn-project/circuits.js" + "@aztec/foundation": "link:../yarn-project/foundation" + "@aztec/key-store": "link:../yarn-project/key-store" + "@aztec/kv-store": "link:../yarn-project/kv-store" + "@aztec/pxe": "link:../yarn-project/pxe" + "@aztec/simulator": "link:../yarn-project/simulator" + "@emotion/react": "npm:^11.14.0" + "@emotion/styled": "npm:^11.14.0" + "@eslint/js": "npm:^9.18.0" + "@fontsource/roboto": "npm:^5.1.1" + "@mui/icons-material": "npm:^6.3.1" + "@mui/material": "npm:^6.3.1" + "@mui/styles": "npm:^6.3.1" + "@types/node": "npm:^22.10.5" + "@types/react": "npm:^19.0.6" + "@types/react-dom": "npm:^19.0.3" + "@vitejs/plugin-react-swc": "npm:^3.7.2" + eslint: "npm:^9.13.0" + eslint-plugin-react-hooks: "npm:^5.1.0" + eslint-plugin-react-refresh: "npm:^0.4.18" + globals: "npm:^15.14.0" + nosleep.js: "npm:^0.12.0" + react: "npm:^18.3.1" + react-dom: "npm:^18.3.1" + react-dropzone: "npm:^14.3.5" + typescript: "npm:~5.7.3" + typescript-eslint: "npm:^8.11.0" + vite: "npm:^6.0.11" + vite-plugin-node-polyfills: "npm:^0.23.0" + vite-plugin-static-copy: "npm:^2.2.0" + languageName: unknown + linkType: soft + "get-intrinsic@npm:^1.2.4, get-intrinsic@npm:^1.2.5, get-intrinsic@npm:^1.2.6": version: 1.2.7 resolution: "get-intrinsic@npm:1.2.7" @@ -2927,7 +2967,7 @@ __metadata: languageName: node linkType: hard -"is-callable@npm:^1.1.3": +"is-callable@npm:^1.2.7": version: 1.2.7 resolution: "is-callable@npm:1.2.7" checksum: 10c0/ceebaeb9d92e8adee604076971dd6000d38d6afc40bb843ea8e45c5579b57671c3f3b50d7f04869618242c6cee08d1b67806a8cb8edaaaf7c0748b3720d6066f @@ -3485,7 +3525,7 @@ __metadata: languageName: node linkType: hard -"nanoid@npm:^3.3.7": +"nanoid@npm:^3.3.8": version: 3.3.8 resolution: "nanoid@npm:3.3.8" bin: @@ -3564,13 +3604,13 @@ __metadata: linkType: hard "nopt@npm:^8.0.0": - version: 8.0.0 - resolution: "nopt@npm:8.0.0" + version: 8.1.0 + resolution: "nopt@npm:8.1.0" dependencies: - abbrev: "npm:^2.0.0" + abbrev: "npm:^3.0.0" bin: nopt: bin/nopt.js - checksum: 10c0/19cb986f79abaca2d0f0b560021da7b32ee6fcc3de48f3eaeb0c324d36755c17754f886a754c091f01f740c17caf7d6aea8237b7fbaf39f476ae5e30a249f18f + checksum: 10c0/62e9ea70c7a3eb91d162d2c706b6606c041e4e7b547cbbb48f8b3695af457dd6479904d7ace600856bf923dd8d1ed0696f06195c8c20f02ac87c1da0e1d315ef languageName: node linkType: hard @@ -3581,6 +3621,13 @@ __metadata: languageName: node linkType: hard +"nosleep.js@npm:^0.12.0": + version: 0.12.0 + resolution: "nosleep.js@npm:0.12.0" + checksum: 10c0/a9557206344c85078c46c8f2739066335cc06644d3ec6b0798ed3a1e0b89f929f2fe9bf9285df6d6ae1bd96f08940682a8a08c540fd73f4fff318a4144723055 + languageName: node + linkType: hard + "object-assign@npm:^4.1.1": version: 4.1.1 resolution: "object-assign@npm:4.1.1" @@ -3817,13 +3864,13 @@ __metadata: linkType: hard "postcss@npm:^8.4.49": - version: 8.4.49 - resolution: "postcss@npm:8.4.49" + version: 8.5.1 + resolution: "postcss@npm:8.5.1" dependencies: - nanoid: "npm:^3.3.7" + nanoid: "npm:^3.3.8" picocolors: "npm:^1.1.1" source-map-js: "npm:^1.2.1" - checksum: 10c0/f1b3f17aaf36d136f59ec373459f18129908235e65dbdc3aee5eef8eba0756106f52de5ec4682e29a2eab53eb25170e7e871b3e4b52a8f1de3d344a514306be3 + checksum: 10c0/c4d90c59c98e8a0c102b77d3f4cac190f883b42d63dc60e2f3ed840f16197c0c8e25a4327d2e9a847b45a985612317dc0534178feeebd0a1cf3eb0eecf75cae4 languageName: node linkType: hard @@ -3905,11 +3952,11 @@ __metadata: linkType: hard "qs@npm:^6.12.3": - version: 6.13.1 - resolution: "qs@npm:6.13.1" + version: 6.14.0 + resolution: "qs@npm:6.14.0" dependencies: - side-channel: "npm:^1.0.6" - checksum: 10c0/5ef527c0d62ffca5501322f0832d800ddc78eeb00da3b906f1b260ca0492721f8cdc13ee4b8fd8ac314a6ec37b948798c7b603ccc167e954088df392092f160c + side-channel: "npm:^1.1.0" + checksum: 10c0/8ea5d91bf34f440598ee389d4a7d95820e3b837d3fd9f433871f7924801becaa0cd3b3b4628d49a7784d06a8aea9bc4554d2b6d8d584e2d221dc06238a42909c languageName: node linkType: hard @@ -4120,28 +4167,28 @@ __metadata: linkType: hard "rollup@npm:^4.23.0": - version: 4.30.1 - resolution: "rollup@npm:4.30.1" - dependencies: - "@rollup/rollup-android-arm-eabi": "npm:4.30.1" - "@rollup/rollup-android-arm64": "npm:4.30.1" - "@rollup/rollup-darwin-arm64": "npm:4.30.1" - "@rollup/rollup-darwin-x64": "npm:4.30.1" - "@rollup/rollup-freebsd-arm64": "npm:4.30.1" - "@rollup/rollup-freebsd-x64": "npm:4.30.1" - "@rollup/rollup-linux-arm-gnueabihf": "npm:4.30.1" - "@rollup/rollup-linux-arm-musleabihf": "npm:4.30.1" - "@rollup/rollup-linux-arm64-gnu": "npm:4.30.1" - "@rollup/rollup-linux-arm64-musl": "npm:4.30.1" - "@rollup/rollup-linux-loongarch64-gnu": "npm:4.30.1" - "@rollup/rollup-linux-powerpc64le-gnu": "npm:4.30.1" - "@rollup/rollup-linux-riscv64-gnu": "npm:4.30.1" - "@rollup/rollup-linux-s390x-gnu": "npm:4.30.1" - "@rollup/rollup-linux-x64-gnu": "npm:4.30.1" - "@rollup/rollup-linux-x64-musl": "npm:4.30.1" - "@rollup/rollup-win32-arm64-msvc": "npm:4.30.1" - "@rollup/rollup-win32-ia32-msvc": "npm:4.30.1" - "@rollup/rollup-win32-x64-msvc": "npm:4.30.1" + version: 4.32.1 + resolution: "rollup@npm:4.32.1" + dependencies: + "@rollup/rollup-android-arm-eabi": "npm:4.32.1" + "@rollup/rollup-android-arm64": "npm:4.32.1" + "@rollup/rollup-darwin-arm64": "npm:4.32.1" + "@rollup/rollup-darwin-x64": "npm:4.32.1" + "@rollup/rollup-freebsd-arm64": "npm:4.32.1" + "@rollup/rollup-freebsd-x64": "npm:4.32.1" + "@rollup/rollup-linux-arm-gnueabihf": "npm:4.32.1" + "@rollup/rollup-linux-arm-musleabihf": "npm:4.32.1" + "@rollup/rollup-linux-arm64-gnu": "npm:4.32.1" + "@rollup/rollup-linux-arm64-musl": "npm:4.32.1" + "@rollup/rollup-linux-loongarch64-gnu": "npm:4.32.1" + "@rollup/rollup-linux-powerpc64le-gnu": "npm:4.32.1" + "@rollup/rollup-linux-riscv64-gnu": "npm:4.32.1" + "@rollup/rollup-linux-s390x-gnu": "npm:4.32.1" + "@rollup/rollup-linux-x64-gnu": "npm:4.32.1" + "@rollup/rollup-linux-x64-musl": "npm:4.32.1" + "@rollup/rollup-win32-arm64-msvc": "npm:4.32.1" + "@rollup/rollup-win32-ia32-msvc": "npm:4.32.1" + "@rollup/rollup-win32-x64-msvc": "npm:4.32.1" "@types/estree": "npm:1.0.6" fsevents: "npm:~2.3.2" dependenciesMeta: @@ -4187,7 +4234,7 @@ __metadata: optional: true bin: rollup: dist/bin/rollup - checksum: 10c0/a318c57e2ca9741e1503bcd75483949c6e83edd72234a468010a3098a34248f523e44f7ad4fde90dc5c2da56abc1b78ac42a9329e1dbd708682728adbd8df7cc + checksum: 10c0/b40339d207ee873d5cb78456381d11be367ed44bf02506bb7b1e70ad24537b4e2f06f7b24a1d9dff054c34330e032cfbedecf217228dfdc850d421b49d640144 languageName: node linkType: hard @@ -4242,11 +4289,11 @@ __metadata: linkType: hard "semver@npm:^7.3.5, semver@npm:^7.6.0": - version: 7.6.3 - resolution: "semver@npm:7.6.3" + version: 7.7.0 + resolution: "semver@npm:7.7.0" bin: semver: bin/semver.js - checksum: 10c0/88f33e148b210c153873cb08cfe1e281d518aaa9a666d4d148add6560db5cd3c582f3a08ccb91f38d5f379ead256da9931234ed122057f40bb5766e65e58adaf + checksum: 10c0/bcd1c03209b4be7d8ca86c976a0410beba7d4ec1d49d846a4be154b958db1ff5eaee50760c1d4f4070b19dee3236b8672d3e09642c53ea23740398bba2538a2d languageName: node linkType: hard @@ -4334,7 +4381,7 @@ __metadata: languageName: node linkType: hard -"side-channel@npm:^1.0.6": +"side-channel@npm:^1.1.0": version: 1.1.0 resolution: "side-channel@npm:1.1.0" dependencies: @@ -4594,16 +4641,16 @@ __metadata: linkType: hard "typescript-eslint@npm:^8.11.0": - version: 8.19.1 - resolution: "typescript-eslint@npm:8.19.1" + version: 8.22.0 + resolution: "typescript-eslint@npm:8.22.0" dependencies: - "@typescript-eslint/eslint-plugin": "npm:8.19.1" - "@typescript-eslint/parser": "npm:8.19.1" - "@typescript-eslint/utils": "npm:8.19.1" + "@typescript-eslint/eslint-plugin": "npm:8.22.0" + "@typescript-eslint/parser": "npm:8.22.0" + "@typescript-eslint/utils": "npm:8.22.0" peerDependencies: eslint: ^8.57.0 || ^9.0.0 typescript: ">=4.8.4 <5.8.0" - checksum: 10c0/59cdb590a0b38bfca1634c421c1acd2d1bfc8a7325af8fb1332421103dd98d454d349d4f82175088cf06216c1540dc1a73d1dca44cff16dd1d08f969feeb0c0b + checksum: 10c0/d7a5ec4a08d0eb0a7cc0bf81919f0305a9fbb091b187cef6d3fa220c1673414dcb46e6cd5c9325050d3df2bbb283756399c1b2720eb4eadaab0bdc3cc8302405 languageName: node linkType: hard @@ -4698,15 +4745,15 @@ __metadata: languageName: node linkType: hard -"vite-plugin-node-polyfills@npm:^0.22.0": - version: 0.22.0 - resolution: "vite-plugin-node-polyfills@npm:0.22.0" +"vite-plugin-node-polyfills@npm:^0.23.0": + version: 0.23.0 + resolution: "vite-plugin-node-polyfills@npm:0.23.0" dependencies: "@rollup/plugin-inject": "npm:^5.0.5" node-stdlib-browser: "npm:^1.2.0" peerDependencies: - vite: ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0 - checksum: 10c0/f8ddc452eb6fba280977d037f8a6406aa522e69590641ce72ce5bb31c3498856a9f63ab3671bc6a822dcd1ff9ba5cac02cacef4a0e170fd8500cdeeb38c81675 + vite: ^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 + checksum: 10c0/439088aa71852737433f360fe5e99f246884885afb11715106b2e4c3c4f0dfc162037831b6b5a2ab4be30faafe5db6a3af37bbdf7eda5788dae2fdb9a44e029e languageName: node linkType: hard @@ -4724,9 +4771,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:^6.0.7": - version: 6.0.7 - resolution: "vite@npm:6.0.7" +"vite@npm:^6.0.11": + version: 6.0.11 + resolution: "vite@npm:6.0.11" dependencies: esbuild: "npm:^0.24.2" fsevents: "npm:~2.3.3" @@ -4772,49 +4819,10 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10c0/ae81047b4290a7206b9394a39a782d509e9610462e7946422ba22d5bc615b5a322c07e33d7bf9dd0b3312ec3f5c63353b725913d1519324bfdf539b4f1e03f52 + checksum: 10c0/a0537f9bf8d6ded740646a4aa44b8dbf442d3005e75f7b27e981ef6011f22d4759f5eb643a393c0ffb8d21e2f50fb5f774d3a53108fb96a10b0f83697e8efe84 languageName: node linkType: hard -"vite@workspace:.": - version: 0.0.0-use.local - resolution: "vite@workspace:." - dependencies: - "@aztec/accounts": "link:../yarn-project/accounts" - "@aztec/aztec.js": "link:../yarn-project/aztec.js" - "@aztec/bb-prover": "link:../yarn-project/bb-prover" - "@aztec/circuits.js": "link:../yarn-project/circuits.js" - "@aztec/foundation": "link:../yarn-project/foundation" - "@aztec/key-store": "link:../yarn-project/key-store" - "@aztec/kv-store": "link:../yarn-project/kv-store" - "@aztec/pxe": "link:../yarn-project/pxe" - "@aztec/simulator": "link:../yarn-project/simulator" - "@emotion/react": "npm:^11.14.0" - "@emotion/styled": "npm:^11.14.0" - "@eslint/js": "npm:^9.18.0" - "@fontsource/roboto": "npm:^5.1.1" - "@mui/icons-material": "npm:^6.3.1" - "@mui/material": "npm:^6.3.1" - "@mui/styles": "npm:^6.3.1" - "@types/node": "npm:^22.10.5" - "@types/react": "npm:^19.0.6" - "@types/react-dom": "npm:^19.0.3" - "@vitejs/plugin-react-swc": "npm:^3.7.2" - eslint: "npm:^9.13.0" - eslint-plugin-react-hooks: "npm:^5.1.0" - eslint-plugin-react-refresh: "npm:^0.4.18" - globals: "npm:^15.14.0" - react: "npm:^18.3.1" - react-dom: "npm:^18.3.1" - react-dropzone: "npm:^14.3.5" - typescript: "npm:~5.7.3" - typescript-eslint: "npm:^8.11.0" - vite: "npm:^6.0.7" - vite-plugin-node-polyfills: "npm:^0.22.0" - vite-plugin-static-copy: "npm:^2.2.0" - languageName: unknown - linkType: soft - "vm-browserify@npm:^1.0.1": version: 1.1.2 resolution: "vm-browserify@npm:1.1.2" diff --git a/yarn-project/aztec.js/webpack.config.js b/yarn-project/aztec.js/webpack.config.js index 66be751776f1..16268c444956 100644 --- a/yarn-project/aztec.js/webpack.config.js +++ b/yarn-project/aztec.js/webpack.config.js @@ -52,7 +52,8 @@ export default { new CopyPlugin({ patterns: [ { - context: '../../barretenberg/ts/dest/browser', + // createRequire resolves the cjs version, so we need to go up one level + context: resolve(require.resolve('@aztec/bb.js'), '../../browser'), from: '*.gz', }, ], diff --git a/yarn-project/bootstrap.sh b/yarn-project/bootstrap.sh index f0098329a57b..3bfde823b009 100755 --- a/yarn-project/bootstrap.sh +++ b/yarn-project/bootstrap.sh @@ -38,6 +38,7 @@ function build { fi esac + denoise 'cd aztec.js && yarn build:web' denoise 'cd end-to-end && yarn build:web' # Upload common patterns for artifacts: dest, fixtures, build, artifacts, generated diff --git a/yarn-project/noir-protocol-circuits-types/src/scripts/generate_client_artifacts_helper.ts b/yarn-project/noir-protocol-circuits-types/src/scripts/generate_client_artifacts_helper.ts index 103f077c44e7..1e7166fbf720 100644 --- a/yarn-project/noir-protocol-circuits-types/src/scripts/generate_client_artifacts_helper.ts +++ b/yarn-project/noir-protocol-circuits-types/src/scripts/generate_client_artifacts_helper.ts @@ -46,9 +46,7 @@ function generateImportFunction() { }) .map(artifactName => { return `case '${artifactName}': { - const { default: compiledCircuit } = await import(\`../artifacts/${artifactName}.json\`, { - assert: { type: 'json' }, - }); + const { default: compiledCircuit } = await import(\"../artifacts/${artifactName}.json\"); return compiledCircuit as NoirCompiledCircuit; }`; }); diff --git a/yarn-project/package.json b/yarn-project/package.json index fc206f3d9f1f..946d3c46406c 100644 --- a/yarn-project/package.json +++ b/yarn-project/package.json @@ -12,7 +12,7 @@ "format": "yarn prettier --cache -w .", "test": "RAYON_NUM_THREADS=4 FORCE_COLOR=true yarn workspaces foreach -A --exclude @aztec/aztec3-packages --exclude @aztec/prover-client -p -v run test --config=../jest.root.config.js", "build": "FORCE_COLOR=true yarn workspaces foreach -A --parallel --topological-dev --verbose --exclude @aztec/aztec3-packages --exclude @aztec/docs run build", - "build:fast": "cd foundation && yarn build && cd ../l1-artifacts && yarn build && cd ../circuits.js && yarn build && cd ../aztec.js && yarn build && cd .. && yarn generate && tsc -b", + "build:fast": "cd foundation && yarn build && cd ../l1-artifacts && yarn build && cd ../circuits.js && yarn build && cd .. && yarn generate && tsc -b", "build:dev": "./watch.sh", "generate": "FORCE_COLOR=true yarn workspaces foreach -A --parallel --topological-dev --verbose run generate", "clean": "yarn workspaces foreach -A -p -v run clean" diff --git a/yarn-project/pxe/src/pxe_service/pxe_service.ts b/yarn-project/pxe/src/pxe_service/pxe_service.ts index e26e7ca84686..3094bb24242a 100644 --- a/yarn-project/pxe/src/pxe_service/pxe_service.ts +++ b/yarn-project/pxe/src/pxe_service/pxe_service.ts @@ -100,10 +100,13 @@ export class PXEService implements PXE { private proofCreator: PrivateKernelProver, private simulationProvider: SimulationProvider, config: PXEServiceConfig, - logSuffix?: string, + loggerOrSuffix?: string | Logger, ) { - this.log = createLogger(logSuffix ? `pxe:service:${logSuffix}` : `pxe:service`); - this.synchronizer = new Synchronizer(node, db, tipsStore, config, logSuffix); + this.log = + !loggerOrSuffix || typeof loggerOrSuffix === 'string' + ? createLogger(loggerOrSuffix ? `pxe:service:${loggerOrSuffix}` : `pxe:service`) + : loggerOrSuffix; + this.synchronizer = new Synchronizer(node, db, tipsStore, config, loggerOrSuffix); this.contractDataOracle = new ContractDataOracle(db); this.simulator = getAcirSimulator(db, node, keyStore, this.simulationProvider, this.contractDataOracle); this.packageVersion = getPackageInfo().version; diff --git a/yarn-project/pxe/src/synchronizer/synchronizer.ts b/yarn-project/pxe/src/synchronizer/synchronizer.ts index 225787866df0..c0e93b02fb84 100644 --- a/yarn-project/pxe/src/synchronizer/synchronizer.ts +++ b/yarn-project/pxe/src/synchronizer/synchronizer.ts @@ -27,9 +27,12 @@ export class Synchronizer implements L2BlockStreamEventHandler { private db: PxeDatabase, private l2TipsStore: L2TipsStore, config: Partial> = {}, - logSuffix?: string, + loggerOrSuffix?: string | Logger, ) { - this.log = createLogger(logSuffix ? `pxe:synchronizer:${logSuffix}` : 'pxe:synchronizer'); + this.log = + !loggerOrSuffix || typeof loggerOrSuffix === 'string' + ? createLogger(loggerOrSuffix ? `pxe:synchronizer:${loggerOrSuffix}` : `pxe:synchronizer`) + : loggerOrSuffix; this.blockStream = this.createBlockStream(config); }