diff --git a/package-lock.json b/package-lock.json index 965438bc4..b5ae07823 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2039,6 +2039,10 @@ "safe-buffer": "^5.1.2" } }, + "node_modules/@bitcoin-computer/nft": { + "resolved": "packages/nft", + "link": true + }, "node_modules/@bitcoin-computer/node": { "resolved": "packages/node", "link": true @@ -5709,9 +5713,9 @@ "integrity": "sha512-dJvrYWxP/UcXm36Qn36fxhUKu8A/xMRXVT2cliFF1Z7UA9liG5Psj3ezNSZw+5puH2czDXRLcXQxf8JbJt0ejg==" }, "node_modules/@types/node": { - "version": "20.11.25", - "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.25.tgz", - "integrity": "sha512-TBHyJxk2b7HceLVGFcpAUjsa5zIdsPWlR6XHfyGzd0SFu+/NFgQgMAl96MSDZgQDvJAvV6BKsFOrt6zIL09JDw==", + "version": "20.11.30", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.30.tgz", + "integrity": "sha512-dHM6ZxwlmuZaRmUPfv1p+KrdD1Dci04FbdEm/9wEMouFqxYoFl5aMkt0VMAUtYRQDyYvD41WJLukhq/ha3YuTw==", "dependencies": { "undici-types": "~5.26.4" } @@ -28657,9 +28661,9 @@ }, "packages/chat": { "name": "@bitcoin-computer/chat", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", @@ -28962,10 +28966,10 @@ }, "packages/components": { "name": "@bitcoin-computer/components", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "ISC", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "flowbite": "^2.3.0", "react": "^18.2.0", "react-dom": "^18.2.0" @@ -28976,10 +28980,10 @@ }, "packages/cra-template": { "name": "@bitcoin-computer/cra-template", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/components": "^0.17.2-beta.0", - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/components": "^0.18.0-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "@testing-library/jest-dom": "^6.4.2", "@testing-library/react": "^14.2.1", "@testing-library/user-event": "^14.5.2", @@ -29034,10 +29038,10 @@ }, "packages/explorer": { "name": "@bitcoin-computer/explorer", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/components": "^0.17.2-beta.0", - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/components": "^0.18.0-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "@testing-library/jest-dom": "^6.4.2", "@testing-library/react": "^14.2.1", "@testing-library/user-event": "^14.5.2", @@ -29074,11 +29078,11 @@ }, "packages/lib": { "name": "@bitcoin-computer/lib", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "CC-BY-ND-4.0", "dependencies": { "@babel/parser": "^7.23.9", - "@bitcoin-computer/nakamotojs": "^0.17.2-beta.0", + "@bitcoin-computer/nakamotojs": "^0.18.0-beta.0", "@bitcoin-computer/tiny-secp256k1": "^2.2.1", "@endo/static-module-record": "^1.0.4", "axios": "1.6.7", @@ -29122,6 +29126,23 @@ "node": ">=16" } }, + "packages/lib/node_modules/@bitcoin-computer/nakamotojs": { + "version": "0.18.0-beta.0", + "resolved": "https://registry.npmjs.org/@bitcoin-computer/nakamotojs/-/nakamotojs-0.18.0-beta.0.tgz", + "integrity": "sha512-IlugYM4QP5QQ4QzPNZaOUXH76hoQkRGzqKO4YRWVGLb8mIbfmf86qvQ+fgo/TN6bZzxoXfGmza6efNPEBmaT4w==", + "dependencies": { + "@noble/hashes": "^1.2.0", + "bech32": "^2.0.0", + "bip174": "^2.1.0", + "bs58check": "^3.0.1", + "buffer": "^6.0.3", + "typeforce": "^1.11.3", + "varuint-bitcoin": "^1.1.2" + }, + "engines": { + "node": ">=8.0.0" + } + }, "packages/lib/node_modules/assertion-error": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.1.0.tgz", @@ -29193,7 +29214,7 @@ }, "packages/nakamotojs": { "name": "@bitcoin-computer/nakamotojs", - "version": "0.17.2-beta.0", + "version": "0.18.1-beta.0", "license": "MIT", "dependencies": { "@noble/hashes": "^1.2.0", @@ -29542,14 +29563,74 @@ "typescript": ">=2.7" } }, + "packages/nft": { + "name": "@bitcoin-computer/nft", + "version": "0.18.0-beta.0", + "dependencies": { + "@bitcoin-computer/components": "^0.18.0-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", + "@bitcoin-computer/swap": "^0.18.0-beta.0", + "@bitcoin-computer/TBC721": "^0.18.0-beta.0", + "@testing-library/jest-dom": "^6.4.2", + "@testing-library/react": "^14.2.1", + "@testing-library/user-event": "^14.5.2", + "@types/jest": "^29.5.12", + "@types/node": "^20.11.21", + "@types/react": "^18.2.60", + "@types/react-dom": "^18.2.19", + "flowbite": "^2.3.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-icons": "^5.0.1", + "react-router-dom": "^6.22.1", + "react-scripts": "5.0.1", + "tailwindcss": "^3.4.1", + "typescript": "^4.9.5", + "web-vitals": "^3.5.2" + }, + "devDependencies": { + "@types/chai": "^4.3.12", + "@types/expect": "^24.3.0", + "@types/mocha": "^10.0.6", + "@types/node": "~18.0.0", + "chai": "^5.1.0", + "dotenv": "^16.4.5", + "eslint": "^8.57.0", + "eslint-config-airbnb-typescript": "^17.1.0", + "eslint-config-prettier": "~9.1.0", + "eslint-plugin-import": "^2.29.1", + "mocha": "^10.3.0", + "prettier": "~3.2.5", + "typescript": "~5.3.3" + } + }, + "packages/nft/node_modules/@types/node": { + "version": "18.0.6", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.0.6.tgz", + "integrity": "sha512-/xUq6H2aQm261exT6iZTMifUySEt4GR5KX8eYyY+C4MSNPqSh9oNIP7tz2GLKTlFaiBbgZNxffoR3CVRG+cljw==", + "dev": true + }, + "packages/nft/node_modules/typescript": { + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.3.tgz", + "integrity": "sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==", + "dev": true, + "bin": { + "tsc": "bin/tsc", + "tsserver": "bin/tsserver" + }, + "engines": { + "node": ">=14.17" + } + }, "packages/node": { "name": "@bitcoin-computer/node", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "CC-BY-ND-4.0", "dependencies": { "@babel/core": "^7.23.9", - "@bitcoin-computer/lib": "^0.17.2-beta.0", - "@bitcoin-computer/nakamotojs": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", + "@bitcoin-computer/nakamotojs": "^0.18.0-beta.0", "@bitcoin-computer/tiny-secp256k1": "^2.2.1", "@types/chai": "^4.3.1", "@types/mocha": "^10.0.6", @@ -29583,11 +29664,27 @@ "winston-daily-rotate-file": "^5.0.0", "zeromq": "6.0.0-beta.6" }, - "devDependencies": {}, "engines": { "node": ">=16" } }, + "packages/node/node_modules/@bitcoin-computer/nakamotojs": { + "version": "0.18.0-beta.0", + "resolved": "https://registry.npmjs.org/@bitcoin-computer/nakamotojs/-/nakamotojs-0.18.0-beta.0.tgz", + "integrity": "sha512-IlugYM4QP5QQ4QzPNZaOUXH76hoQkRGzqKO4YRWVGLb8mIbfmf86qvQ+fgo/TN6bZzxoXfGmza6efNPEBmaT4w==", + "dependencies": { + "@noble/hashes": "^1.2.0", + "bech32": "^2.0.0", + "bip174": "^2.1.0", + "bs58check": "^3.0.1", + "buffer": "^6.0.3", + "typeforce": "^1.11.3", + "varuint-bitcoin": "^1.1.2" + }, + "engines": { + "node": ">=8.0.0" + } + }, "packages/node/node_modules/assertion-error": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-1.1.0.tgz", @@ -29674,10 +29771,10 @@ }, "packages/nodejs-template": { "name": "@bitcoin-computer/nodejs-template", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "MIT", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0" + "@bitcoin-computer/lib": "^0.18.0-beta.0" }, "devDependencies": { "@types/mocha": "^10.0.6", @@ -29742,7 +29839,7 @@ }, "packages/secp256k1": { "name": "@bitcoin-computer/secp256k1", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "MIT", "dependencies": { "uint8array-tools": "0.0.7" @@ -30380,16 +30477,16 @@ }, "packages/swap": { "name": "@bitcoin-computer/swap", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "MIT", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", - "@bitcoin-computer/nakamotojs": "^0.17.2-beta.0", - "@bitcoin-computer/TBC721": "^0.17.2-beta.0" + "@bitcoin-computer/lib": "^0.18.0-beta.0", + "@bitcoin-computer/nakamotojs": "^0.18.0-beta.0", + "@bitcoin-computer/TBC721": "^0.18.0-beta.0" }, "devDependencies": { "@types/mocha": "^9.1.1", - "@types/node": "~18.0.0", + "@types/node": "~20.11.21", "@typescript-eslint/eslint-plugin": "^5.10.0", "@typescript-eslint/parser": "^5.10.0", "chai": "^4.3.6", @@ -30405,7 +30502,24 @@ "ts-node": "^10.8.1", "tslib": "~2.4.0", "tsutils": "~3.21.0", - "typescript": "~4.7.2" + "typescript": "~5.3.3" + } + }, + "packages/swap/node_modules/@bitcoin-computer/nakamotojs": { + "version": "0.18.0-beta.0", + "resolved": "https://registry.npmjs.org/@bitcoin-computer/nakamotojs/-/nakamotojs-0.18.0-beta.0.tgz", + "integrity": "sha512-IlugYM4QP5QQ4QzPNZaOUXH76hoQkRGzqKO4YRWVGLb8mIbfmf86qvQ+fgo/TN6bZzxoXfGmza6efNPEBmaT4w==", + "dependencies": { + "@noble/hashes": "^1.2.0", + "bech32": "^2.0.0", + "bip174": "^2.1.0", + "bs58check": "^3.0.1", + "buffer": "^6.0.3", + "typeforce": "^1.11.3", + "varuint-bitcoin": "^1.1.2" + }, + "engines": { + "node": ">=8.0.0" } }, "packages/swap/node_modules/@types/mocha": { @@ -30414,12 +30528,6 @@ "integrity": "sha512-Z61JK7DKDtdKTWwLeElSEBcWGRLY8g95ic5FoQqI9CMx0ns/Ghep3B4DfcEimiKMvtamNVULVNKEsiwV3aQmXw==", "dev": true }, - "packages/swap/node_modules/@types/node": { - "version": "18.0.6", - "resolved": "https://registry.npmjs.org/@types/node/-/node-18.0.6.tgz", - "integrity": "sha512-/xUq6H2aQm261exT6iZTMifUySEt4GR5KX8eYyY+C4MSNPqSh9oNIP7tz2GLKTlFaiBbgZNxffoR3CVRG+cljw==", - "dev": true - }, "packages/swap/node_modules/@typescript-eslint/eslint-plugin": { "version": "5.62.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz", @@ -30775,16 +30883,16 @@ "dev": true }, "packages/swap/node_modules/typescript": { - "version": "4.7.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz", - "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", + "version": "5.3.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.3.3.tgz", + "integrity": "sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==", "dev": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" }, "engines": { - "node": ">=4.2.0" + "node": ">=14.17" } }, "packages/swap/node_modules/yallist": { @@ -30795,10 +30903,10 @@ }, "packages/TBC20": { "name": "@bitcoin-computer/TBC20", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "Apache-2.0", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "eslint-plugin-prettier": "^5.1.3", "ts-node": "^10.9.2", "tslib": "~2.6.2" @@ -30821,9 +30929,9 @@ }, "packages/TBC20-app": { "name": "@bitcoin-computer/TBC20-app", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "@testing-library/jest-dom": "^6.4.2", "@testing-library/react": "^14.2.1", "@testing-library/user-event": "^14.5.2", @@ -30913,10 +31021,10 @@ }, "packages/TBC404": { "name": "@bitcoin-computer/TBC404", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "MIT", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0" + "@bitcoin-computer/lib": "^0.18.0-beta.0" }, "devDependencies": { "@types/mocha": "^9.1.1", @@ -30941,10 +31049,10 @@ }, "packages/TBC404-app": { "name": "@bitcoin-computer/TBC404-app", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/components": "^0.17.2-beta.0", - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/components": "^0.18.0-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "@testing-library/jest-dom": "^6.4.2", "@testing-library/react": "^14.2.1", "@testing-library/user-event": "^14.5.2", @@ -31369,10 +31477,10 @@ }, "packages/TBC721": { "name": "@bitcoin-computer/TBC721", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "license": "MIT", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "chai-match-pattern": "^1.3.0", "eslint-plugin-prettier": "^5.1.3", "ts-node": "^10.9.2", @@ -31396,9 +31504,9 @@ }, "packages/TBC721-app": { "name": "@bitcoin-computer/TBC721-app", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "react": "^18.2.0", "react-dom": "^18.2.0", "react-icons": "^5.0.1", @@ -31451,9 +31559,9 @@ }, "packages/wallet": { "name": "@bitcoin-computer/wallet", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { - "@bitcoin-computer/lib": "^0.17.2-beta.0", + "@bitcoin-computer/lib": "^0.18.0-beta.0", "@testing-library/jest-dom": "^6.4.2", "@testing-library/react": "^14.2.1", "@testing-library/user-event": "^14.5.2", @@ -31487,7 +31595,7 @@ }, "packages/website": { "name": "@bitcoin-computer/website", - "version": "0.17.2-beta.0", + "version": "0.18.0-beta.0", "dependencies": { "@emotion/react": "^11.11.4", "@emotion/styled": "^11.11.0", diff --git a/packages/TBC20/test/token.test.ts b/packages/TBC20/test/token.test.ts index 95789199b..6939a2482 100644 --- a/packages/TBC20/test/token.test.ts +++ b/packages/TBC20/test/token.test.ts @@ -5,7 +5,7 @@ import { Computer } from '@bitcoin-computer/lib' import dotenv from 'dotenv' import { TBC20, Token } from '../src/token' -// If you want to connect to your local Bitcoin Computer Node, create a .env file +// If you want to connect to your local Bitcoin Computer Node, create a .env file // in the monorepo root level and add the following line: // BCN_URL=http://localhost:1031 @@ -49,7 +49,7 @@ describe('Token', () => { describe('Transferring the NFT', () => { let newToken: Token - it('Sender transfers the NFT to receiver', async () => { + it('Sender transfers the NFT to receiver', async () => { newToken = await token.transfer(receiver.getPublicKey(), 1) }) diff --git a/packages/TBC404-app/src/App.tsx b/packages/TBC404-app/src/App.tsx index a844e275c..db968a582 100644 --- a/packages/TBC404-app/src/App.tsx +++ b/packages/TBC404-app/src/App.tsx @@ -1,13 +1,15 @@ import "./App.css" -import { useEffect } from "react" +import { useEffect, useState } from "react" import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom" import { Navbar } from "./components/Navbar" import { initFlowbite } from "flowbite" -import { Auth, Error404, UtilsContext, Wallet, SmartObject, Transaction } from "@bitcoin-computer/components" +import { Auth, Error404, UtilsContext, Wallet, SmartObject, Transaction, ComputerContext } from "@bitcoin-computer/components" import Mint from "./components/Mint" import { AllAssets, MyAssets } from "./components/Assets" export default function App() { + const [computer] = useState(Auth.getComputer()) + useEffect(() => { initFlowbite() }, []) @@ -16,20 +18,22 @@ export default function App() { - - - -
- - } /> - } /> - } /> - } /> - } /> - } /> - } /> - -
+ + + + +
+ + } /> + } /> + } /> + } /> + } /> + } /> + } /> + +
+ ) diff --git a/packages/TBC404-app/src/components/Mint.tsx b/packages/TBC404-app/src/components/Mint.tsx index 12b60f26b..f8fca7969 100644 --- a/packages/TBC404-app/src/components/Mint.tsx +++ b/packages/TBC404-app/src/components/Mint.tsx @@ -1,5 +1,5 @@ -import { useState } from "react" -import { Auth, Modal } from "@bitcoin-computer/components" +import { useContext, useState } from "react" +import { ComputerContext, Modal } from "@bitcoin-computer/components" import { Token } from "../contracts/token" import { Link } from "react-router-dom" @@ -49,7 +49,7 @@ function ErrorContent(msg: string) { } export default function Mint() { - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const [successRev, setSuccessRev] = useState('') const [errorMsg, setErrorMsg] = useState('') diff --git a/packages/TBC404/test/main.test.ts b/packages/TBC404/test/main.test.ts index 7db0c17c5..125f081d4 100644 --- a/packages/TBC404/test/main.test.ts +++ b/packages/TBC404/test/main.test.ts @@ -4,14 +4,14 @@ import { expect } from 'chai' import * as chai from 'chai' import chaiMatchPattern from 'chai-match-pattern' import { Computer } from '@bitcoin-computer/lib' -import { Counter } from '../src/main' import dotenv from 'dotenv' +import { Counter } from '../src/main' -// If you want to connect to your local Bitcoin Computer Node, create a .env file +// If you want to connect to your local Bitcoin Computer Node, create a .env file // in the monorepo root level and add the following line: // BCN_URL=http://localhost:1031 -dotenv.config({ path: '../../.env'}) +dotenv.config({ path: '../../.env' }) const url = process.env.BCN_URL diff --git a/packages/components/built/Auth.js b/packages/components/built/Auth.js index cc1423c86..5049ca4ca 100644 --- a/packages/components/built/Auth.js +++ b/packages/components/built/Auth.js @@ -48,8 +48,9 @@ function getPath(chain, network) { } function getEnvVariable(name) { var res = process.env[name]; - if (typeof res === "undefined") - throw new Error("Cannot find environment variable \"".concat(name, "\".\nDid you forget to copy the .env.example file into a .env file?")); + if (typeof res === "undefined") { + throw new Error("Cannot find environment variable \"".concat(name, "\" in the .env file.")); + } else return res; } diff --git a/packages/components/built/ComputerContext.d.ts b/packages/components/built/ComputerContext.d.ts new file mode 100644 index 000000000..0d2bf2e52 --- /dev/null +++ b/packages/components/built/ComputerContext.d.ts @@ -0,0 +1,3 @@ +/// +import { Computer } from '@bitcoin-computer/lib'; +export declare const ComputerContext: import("react").Context; diff --git a/packages/components/built/ComputerContext.js b/packages/components/built/ComputerContext.js new file mode 100644 index 000000000..4dc658ef0 --- /dev/null +++ b/packages/components/built/ComputerContext.js @@ -0,0 +1,3 @@ +import { Computer } from '@bitcoin-computer/lib'; +import { createContext } from 'react'; +export var ComputerContext = createContext(new Computer()); diff --git a/packages/components/built/Gallery.js b/packages/components/built/Gallery.js index 130acb6f3..bb0ffe321 100644 --- a/packages/components/built/Gallery.js +++ b/packages/components/built/Gallery.js @@ -46,12 +46,12 @@ var __generator = (this && this.__generator) || function (thisArg, body) { } }; import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime"; -import { useEffect, useState } from "react"; +import { useContext, useEffect, useState } from "react"; import { Link, useLocation } from "react-router-dom"; import { jsonMap, strip, toObject } from "./common/utils"; -import { Auth } from "./Auth"; import { initFlowbite } from "flowbite"; import { useUtilsComponents } from "./UtilsContext"; +import { ComputerContext } from "./ComputerContext"; function HomePageCard(_a) { var content = _a.content; return (_jsx("div", __assign({ className: "block w-80 p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700 dark:hover:bg-gray-700" }, { children: _jsx("pre", __assign({ className: "font-normal overflow-auto text-gray-700 dark:text-gray-400 text-xs" }, { children: content() })) }))); @@ -101,7 +101,7 @@ function Pagination(_a) { export default function WithPagination(q) { var _this = this; var contractsPerPage = 12; - var computer = useState(Auth.getComputer())[0]; + var computer = useContext(ComputerContext); var showLoader = useUtilsComponents().showLoader; var _a = useState(0), pageNum = _a[0], setPageNum = _a[1]; var _b = useState(true), isNextAvailable = _b[0], setIsNextAvailable = _b[1]; diff --git a/packages/components/built/SmartObject.js b/packages/components/built/SmartObject.js index 0166d84fd..0eed6c450 100644 --- a/packages/components/built/SmartObject.js +++ b/packages/components/built/SmartObject.js @@ -46,15 +46,15 @@ var __generator = (this && this.__generator) || function (thisArg, body) { } }; import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime"; -import { useEffect, useState } from "react"; +import { useContext, useEffect, useState } from "react"; import { Link, useLocation, useNavigate, useParams } from "react-router-dom"; import { capitalizeFirstLetter, toObject } from "./common/utils"; import reactStringReplace from "react-string-replace"; -import { Auth } from "./Auth"; import { Card } from "./Card"; import { Modal } from "./Modal"; import { FunctionResultModalContent } from "./common/SmartCallExecutionResult"; import { SmartObjectFunction } from "./SmartObjectFunction"; +import { ComputerContext } from "./ComputerContext"; var keywords = ["_id", "_rev", "_owners", "_root", "_amount"]; var modalId = "smart-object-info-modal"; export var getFnParamNames = function (fn) { @@ -93,7 +93,7 @@ function Component() { var params = useParams(); var navigate = useNavigate(); var rev = useState(params.rev || "")[0]; - var computer = useState(Auth.getComputer())[0]; + var computer = useContext(ComputerContext); var _a = useState(null), smartObject = _a[0], setSmartObject = _a[1]; var _b = useState(false), functionsExist = _b[0], setFunctionsExist = _b[1]; var _c = useState({}), functionResult = _c[0], setFunctionResult = _c[1]; @@ -140,7 +140,7 @@ function Component() { setFunctionsExist(funcExist); }, [smartObject]); var _e = rev.split(":"), txId = _e[0], outNum = _e[1]; - return (_jsxs(_Fragment, { children: [_jsxs("div", { children: [_jsx("h1", __assign({ className: "mb-2 text-5xl font-extrabold dark:text-white" }, { children: "Object" })), _jsxs("p", __assign({ className: "mb-6 text-lg font-normal text-gray-500 lg:text-xl dark:text-gray-400" }, { children: [_jsx(Link, __assign({ to: "/transactions/".concat(txId), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: txId })), ":", outNum] })), _jsx(SmartObjectValues, { smartObject: smartObject }), _jsx(SmartObjectFunction, { computer: computer, smartObject: smartObject, functionsExist: functionsExist, options: options, setFunctionResult: setFunctionResult, setShow: setShow, setModalTitle: setModalTitle })] }), _jsx(Modal.Component, { title: modalTitle, content: FunctionResultModalContent, contentData: { functionResult: functionResult }, id: modalId })] })); + return (_jsxs(_Fragment, { children: [_jsxs("div", { children: [_jsx("h1", __assign({ className: "mb-2 text-5xl font-extrabold dark:text-white" }, { children: "Object" })), _jsxs("p", __assign({ className: "mb-6 text-lg font-normal text-gray-500 lg:text-xl dark:text-gray-400" }, { children: [_jsx(Link, __assign({ to: "/transactions/".concat(txId), className: "font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: txId })), ":", outNum] })), _jsx(SmartObjectValues, { smartObject: smartObject }), _jsx(SmartObjectFunction, { smartObject: smartObject, functionsExist: functionsExist, options: options, setFunctionResult: setFunctionResult, setShow: setShow, setModalTitle: setModalTitle })] }), _jsx(Modal.Component, { title: modalTitle, content: FunctionResultModalContent, contentData: { functionResult: functionResult }, id: modalId })] })); } export var SmartObject = { Component: Component, diff --git a/packages/components/built/SmartObjectFunction.d.ts b/packages/components/built/SmartObjectFunction.d.ts index 0361ca1f2..84be033db 100644 --- a/packages/components/built/SmartObjectFunction.d.ts +++ b/packages/components/built/SmartObjectFunction.d.ts @@ -1,4 +1,4 @@ export declare const getErrorMessage: (error: any) => string; export declare const getFnParamNames: (fn: string) => string[]; export declare const getValueForType: (type: string, stringValue: string) => string | number | true | null | undefined; -export declare const SmartObjectFunction: ({ computer, smartObject, functionsExist, options, setFunctionResult, setShow, setModalTitle, }: any) => import("react/jsx-runtime").JSX.Element; +export declare const SmartObjectFunction: ({ smartObject, functionsExist, options, setFunctionResult, setShow, setModalTitle, }: any) => import("react/jsx-runtime").JSX.Element; diff --git a/packages/components/built/SmartObjectFunction.js b/packages/components/built/SmartObjectFunction.js index b85a0bf14..24b0a0da2 100644 --- a/packages/components/built/SmartObjectFunction.js +++ b/packages/components/built/SmartObjectFunction.js @@ -46,10 +46,11 @@ var __generator = (this && this.__generator) || function (thisArg, body) { } }; import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; -import { useState } from "react"; +import { useContext, useState } from "react"; import { TypeSelectionDropdown } from "./common/TypeSelectionDropdown"; import { isValidRev, sleep } from "./common/utils"; import { UtilsContext } from "./UtilsContext"; +import { ComputerContext } from "./ComputerContext"; export var getErrorMessage = function (error) { var _a, _b, _c, _d, _e, _f; if (((_b = (_a = error === null || error === void 0 ? void 0 : error.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.error) === @@ -86,9 +87,10 @@ export var getValueForType = function (type, stringValue) { } }; export var SmartObjectFunction = function (_a) { - var computer = _a.computer, smartObject = _a.smartObject, functionsExist = _a.functionsExist, options = _a.options, setFunctionResult = _a.setFunctionResult, setShow = _a.setShow, setModalTitle = _a.setModalTitle; + var smartObject = _a.smartObject, functionsExist = _a.functionsExist, options = _a.options, setFunctionResult = _a.setFunctionResult, setShow = _a.setShow, setModalTitle = _a.setModalTitle; var _b = useState({}), formState = _b[0], setFormState = _b[1]; var showLoader = UtilsContext.useUtilsComponents().showLoader; + var computer = useContext(ComputerContext); var handleSmartObjectMethod = function (event, smartObject, fnName, params) { return __awaiter(void 0, void 0, void 0, function () { var revMap_1, tx, res, error_1; return __generator(this, function (_a) { diff --git a/packages/components/built/Transaction.js b/packages/components/built/Transaction.js index 330bc5e70..e61f6ef52 100644 --- a/packages/components/built/Transaction.js +++ b/packages/components/built/Transaction.js @@ -46,11 +46,11 @@ var __generator = (this && this.__generator) || function (thisArg, body) { } }; import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime"; -import { useEffect, useState } from "react"; +import { useContext, useEffect, useState } from "react"; import { Link, useLocation, useParams } from "react-router-dom"; import reactStringReplace from "react-string-replace"; import { Card } from "./Card"; -import { Auth } from "./Auth"; +import { ComputerContext } from "./ComputerContext"; function ExpressionCard(_a) { var content = _a.content, env = _a.env; var entries = Object.entries(env); @@ -71,7 +71,7 @@ function Component() { var _this = this; var location = useLocation(); var params = useParams(); - var computer = useState(Auth.getComputer())[0]; + var computer = useContext(ComputerContext); var _a = useState(params.txn), txn = _a[0], setTxn = _a[1]; var _b = useState(null), txnData = _b[0], setTxnData = _b[1]; var _c = useState(null), rpcTxnData = _c[0], setRPCTxnData = _c[1]; diff --git a/packages/components/built/Wallet.js b/packages/components/built/Wallet.js index 3585ad9ff..d551bb4e7 100644 --- a/packages/components/built/Wallet.js +++ b/packages/components/built/Wallet.js @@ -46,11 +46,12 @@ var __generator = (this && this.__generator) || function (thisArg, body) { } }; import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime"; -import { useCallback, useEffect, useState } from "react"; +import { useCallback, useContext, useEffect, useState } from "react"; import { HiRefresh } from "react-icons/hi"; import { Auth } from "./Auth"; import { Drawer } from "./Drawer"; import { UtilsContext } from "./UtilsContext"; +import { ComputerContext } from "./ComputerContext"; var Balance = function (_a) { var computer = _a.computer; var _b = useState(0), balance = _b[0], setBalance = _b[1]; @@ -121,7 +122,7 @@ var LogOut = function () { return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: "mb-6" }, { children: [_jsx("h6", __assign({ className: "text-lg font-bold dark:text-white" }, { children: "Log out" })), _jsx("p", __assign({ className: "mb-1 text-sm text-gray-500 dark:text-gray-400" }, { children: "Logging out will delete your mnemonic. Make sure to write it down." }))] })), _jsx("div", __assign({ className: "grid grid-cols-2 gap-4" }, { children: _jsx("button", __assign({ onClick: Auth.logout, className: "rounded-lg border border-gray-200 bg-white px-4 py-2 text-center text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700" }, { children: "Log out" })) }))] })); }; export function Wallet() { - var computer = useState(Auth.getComputer())[0]; + var computer = useContext(ComputerContext); var Content = function () { return (_jsxs(_Fragment, { children: [_jsx("h4", __assign({ className: "mb-8 text-2xl font-bold dark:text-white" }, { children: "Wallet" })), _jsx(Balance, { computer: computer }), _jsx(Address, { computer: computer }), _jsx(PublicKey, { computer: computer }), _jsx(Path, { computer: computer }), _jsx(Mnemonic, { computer: computer }), _jsx("hr", { className: "h-px my-6 bg-gray-200 border-0 dark:bg-gray-700" }), _jsx(Chain, { computer: computer }), _jsx(Network, { computer: computer }), _jsx(Url, { computer: computer }), _jsx("hr", { className: "h-px my-6 bg-gray-200 border-0 dark:bg-gray-700" }), _jsx(LogOut, {})] })); }; return _jsx(Drawer.Component, { Content: Content, id: "wallet-drawer" }); } diff --git a/packages/components/built/index.d.ts b/packages/components/built/index.d.ts index 60c417c81..e9ac5b0d8 100644 --- a/packages/components/built/index.d.ts +++ b/packages/components/built/index.d.ts @@ -6,6 +6,7 @@ export { SmartObject } from "./SmartObject"; export { Transaction } from "./Transaction"; export { Error404 } from "./Error404"; export { UtilsContext } from "./UtilsContext"; +export { ComputerContext } from "./ComputerContext"; export { FunctionResultModalContent } from "./common/SmartCallExecutionResult"; export { Drawer } from "./Drawer"; export { Wallet } from "./Wallet"; diff --git a/packages/components/built/index.js b/packages/components/built/index.js index 60c417c81..e9ac5b0d8 100644 --- a/packages/components/built/index.js +++ b/packages/components/built/index.js @@ -6,6 +6,7 @@ export { SmartObject } from "./SmartObject"; export { Transaction } from "./Transaction"; export { Error404 } from "./Error404"; export { UtilsContext } from "./UtilsContext"; +export { ComputerContext } from "./ComputerContext"; export { FunctionResultModalContent } from "./common/SmartCallExecutionResult"; export { Drawer } from "./Drawer"; export { Wallet } from "./Wallet"; diff --git a/packages/components/package.json b/packages/components/package.json index fa87cf2e2..499c3fab5 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -6,7 +6,7 @@ "types": "built/index.d.ts", "scripts": { "tsc-compile": "rm -rf built/* && tsc", - "install-monorepo": "cd ../../ && npm install && cd packages/components", + "install-monorepo": "cd ../../../ && npm run delete-node-modules && npm install && cd monorepo/packages/components", "compile": "npm run tsc-compile && npm run install-monorepo" }, "author": "", diff --git a/packages/components/src/Auth.tsx b/packages/components/src/Auth.tsx index af3b55a2d..b49772c7e 100644 --- a/packages/components/src/Auth.tsx +++ b/packages/components/src/Auth.tsx @@ -39,10 +39,9 @@ function getPath(chain: string, network: string): string { function getEnvVariable(name: string) { const res = process.env[name] - if (typeof res === "undefined") - throw new Error( - `Cannot find environment variable "${name}".\nDid you forget to copy the .env.example file into a .env file?` - ) + if (typeof res === "undefined") { + throw new Error(`Cannot find environment variable "${name}" in the .env file.`) + } else return res } diff --git a/packages/components/src/ComputerContext.tsx b/packages/components/src/ComputerContext.tsx new file mode 100644 index 000000000..94b2c6d7d --- /dev/null +++ b/packages/components/src/ComputerContext.tsx @@ -0,0 +1,4 @@ +import { Computer } from '@bitcoin-computer/lib' +import { createContext } from 'react' + +export const ComputerContext = createContext(new Computer()) \ No newline at end of file diff --git a/packages/components/src/Gallery.tsx b/packages/components/src/Gallery.tsx index 0a767e42e..8dbf5d7cc 100644 --- a/packages/components/src/Gallery.tsx +++ b/packages/components/src/Gallery.tsx @@ -1,10 +1,10 @@ import { Computer } from "@bitcoin-computer/lib" -import { useEffect, useState } from "react" +import { useContext, useEffect, useState } from "react" import { Link, useLocation } from "react-router-dom" import { jsonMap, strip, toObject } from "./common/utils" -import { Auth } from "./Auth" import { initFlowbite } from "flowbite" import { useUtilsComponents } from "./UtilsContext" +import { ComputerContext } from "./ComputerContext" export type Class = new (...args: any) => any @@ -155,7 +155,7 @@ function Pagination({ isPrevAvailable, handlePrev, isNextAvailable, handleNext } export default function WithPagination(q: UserQuery) { const contractsPerPage = 12 - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const { showLoader } = useUtilsComponents() const [pageNum, setPageNum] = useState(0) const [isNextAvailable, setIsNextAvailable] = useState(true) diff --git a/packages/components/src/SmartObject.tsx b/packages/components/src/SmartObject.tsx index 6352e5d11..df8de48c4 100644 --- a/packages/components/src/SmartObject.tsx +++ b/packages/components/src/SmartObject.tsx @@ -1,12 +1,12 @@ -import { useEffect, useState } from "react" +import { useContext, useEffect, useState } from "react" import { Link, useLocation, useNavigate, useParams } from "react-router-dom" import { capitalizeFirstLetter, toObject } from "./common/utils" import reactStringReplace from "react-string-replace" -import { Auth } from "./Auth" import { Card } from "./Card" import { Modal } from "./Modal" import { FunctionResultModalContent } from "./common/SmartCallExecutionResult" import { SmartObjectFunction } from "./SmartObjectFunction" +import { ComputerContext } from "./ComputerContext" const keywords = ["_id", "_rev", "_owners", "_root", "_amount"] const modalId = "smart-object-info-modal" @@ -161,7 +161,7 @@ function Component() { const params = useParams() const navigate = useNavigate() const [rev] = useState(params.rev || "") - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const [smartObject, setSmartObject] = useState(null) const [functionsExist, setFunctionsExist] = useState(false) const [functionResult, setFunctionResult] = useState({}) @@ -224,7 +224,6 @@ function Component() { { if ( @@ -41,7 +42,6 @@ export const getValueForType = (type: string, stringValue: string) => { } export const SmartObjectFunction = ({ - computer, smartObject, functionsExist, options, @@ -51,6 +51,8 @@ export const SmartObjectFunction = ({ }: any) => { const [formState, setFormState] = useState({}) const { showLoader } = UtilsContext.useUtilsComponents() + const computer = useContext(ComputerContext) + const handleSmartObjectMethod = async ( event: any, @@ -86,7 +88,7 @@ export const SmartObjectFunction = ({ sign: true, }) - await computer.broadcast(tx) + await computer.broadcast(tx!) await sleep(1000) const res = await computer.query({ ids: [smartObject._id] }) setFunctionResult({ _rev: res[0] }) diff --git a/packages/components/src/Transaction.tsx b/packages/components/src/Transaction.tsx index 138876d8f..3417bf578 100644 --- a/packages/components/src/Transaction.tsx +++ b/packages/components/src/Transaction.tsx @@ -1,8 +1,8 @@ -import { useEffect, useState } from "react" +import { useContext, useEffect, useState } from "react" import { Link, useLocation, useParams } from "react-router-dom" import reactStringReplace from "react-string-replace" import { Card } from "./Card" -import { Auth } from "./Auth" +import { ComputerContext } from "./ComputerContext" function ExpressionCard({ content, env }: { content: string; env: { [s: string]: string } }) { const entries = Object.entries(env) @@ -27,7 +27,7 @@ function ExpressionCard({ content, env }: { content: string; env: { [s: string]: function Component() { const location = useLocation() const params = useParams() - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const [txn, setTxn] = useState(params.txn) const [txnData, setTxnData] = useState(null) const [rpcTxnData, setRPCTxnData] = useState(null) diff --git a/packages/components/src/Wallet.tsx b/packages/components/src/Wallet.tsx index 736fed706..8111ad35a 100644 --- a/packages/components/src/Wallet.tsx +++ b/packages/components/src/Wallet.tsx @@ -1,8 +1,9 @@ -import { useCallback, useEffect, useState } from "react" +import { useCallback, useContext, useEffect, useState } from "react" import { HiRefresh } from "react-icons/hi" import { Auth } from "./Auth" import { Drawer } from "./Drawer" import { UtilsContext } from "./UtilsContext" +import { ComputerContext } from "./ComputerContext" const Balance = ({ computer }: any) => { const [balance, setBalance] = useState(0) @@ -154,7 +155,8 @@ const LogOut = () => { } export function Wallet() { - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) + const Content = () => ( <> diff --git a/packages/components/src/index.tsx b/packages/components/src/index.tsx index 75ac24116..f9ab23b2f 100644 --- a/packages/components/src/index.tsx +++ b/packages/components/src/index.tsx @@ -6,6 +6,7 @@ export { SmartObject } from "./SmartObject" export { Transaction } from "./Transaction" export { Error404 } from "./Error404" export { UtilsContext } from "./UtilsContext" +export { ComputerContext } from "./ComputerContext" export { FunctionResultModalContent } from "./common/SmartCallExecutionResult" export { Drawer } from "./Drawer" export { Wallet } from "./Wallet" diff --git a/packages/cra-template/src/App.tsx b/packages/cra-template/src/App.tsx index a844e275c..a52841d29 100644 --- a/packages/cra-template/src/App.tsx +++ b/packages/cra-template/src/App.tsx @@ -1,13 +1,15 @@ import "./App.css" -import { useEffect } from "react" +import { useContext, useEffect, useState } from "react" import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom" import { Navbar } from "./components/Navbar" import { initFlowbite } from "flowbite" -import { Auth, Error404, UtilsContext, Wallet, SmartObject, Transaction } from "@bitcoin-computer/components" +import { Auth, Error404, UtilsContext, Wallet, SmartObject, Transaction, ComputerContext } from "@bitcoin-computer/components" import Mint from "./components/Mint" import { AllAssets, MyAssets } from "./components/Assets" export default function App() { + const [computer] = useState(Auth.getComputer()) + useEffect(() => { initFlowbite() }, []) @@ -16,20 +18,22 @@ export default function App() { - - - -
- - } /> - } /> - } /> - } /> - } /> - } /> - } /> - -
+ + + + +
+ + } /> + } /> + } /> + } /> + } /> + } /> + } /> + +
+ ) diff --git a/packages/cra-template/src/components/Mint.tsx b/packages/cra-template/src/components/Mint.tsx index c8db397f7..68173dcfc 100644 --- a/packages/cra-template/src/components/Mint.tsx +++ b/packages/cra-template/src/components/Mint.tsx @@ -1,5 +1,5 @@ -import { useState } from "react" -import { Auth, Modal } from "@bitcoin-computer/components" +import { useContext, useState } from "react" +import { ComputerContext, Modal } from "@bitcoin-computer/components" import { Counter } from "../contracts/counter" import { Link } from "react-router-dom" @@ -49,7 +49,7 @@ function ErrorContent(msg: string) { } export default function Mint() { - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const [successRev, setSuccessRev] = useState('') const [errorMsg, setErrorMsg] = useState('') diff --git a/packages/explorer/src/App.tsx b/packages/explorer/src/App.tsx index 942e437c0..8b18bfef7 100644 --- a/packages/explorer/src/App.tsx +++ b/packages/explorer/src/App.tsx @@ -1,5 +1,5 @@ import './App.css' -import { useEffect } from 'react' +import { useContext, useEffect, useState } from 'react' import { BrowserRouter, Route, Routes, Navigate } from 'react-router-dom' import NavBar from './components/Navbar' import Block from './components/Block' @@ -15,8 +15,12 @@ import { Error404, UtilsContext, Wallet, + ComputerContext } from '@bitcoin-computer/components' + export default function App() { + const [computer] = useState(Auth.getComputer()) + useEffect(() => { initFlowbite() }, []) @@ -25,21 +29,23 @@ export default function App() { - - - -
- - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - -
+ + + + +
+ + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + +
+ ) diff --git a/packages/explorer/src/components/Block.tsx b/packages/explorer/src/components/Block.tsx index 9144e8a53..4c2e495ac 100644 --- a/packages/explorer/src/components/Block.tsx +++ b/packages/explorer/src/components/Block.tsx @@ -1,12 +1,12 @@ -import { useEffect, useState } from 'react' +import { useContext, useEffect, useState } from 'react' import { Link, useLocation, useNavigate, useParams } from 'react-router-dom' -import { Auth, UtilsContext } from '@bitcoin-computer/components' +import { ComputerContext, UtilsContext } from '@bitcoin-computer/components' function Block() { const navigate = useNavigate() const location = useLocation() const params = useParams() - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const [block] = useState(params.block) const [isLoading, setIsLoading] = useState(false) const [blockData, setBlockData] = useState(null) diff --git a/packages/explorer/src/components/Blocks.tsx b/packages/explorer/src/components/Blocks.tsx index 150788f35..8bf884464 100644 --- a/packages/explorer/src/components/Blocks.tsx +++ b/packages/explorer/src/components/Blocks.tsx @@ -1,10 +1,10 @@ -import { useEffect, useState } from 'react' +import { useContext, useEffect, useState } from 'react' import { useNavigate } from 'react-router-dom' -import { Auth, UtilsContext } from '@bitcoin-computer/components' +import { ComputerContext, UtilsContext } from '@bitcoin-computer/components' export default function Blocks() { const navigate = useNavigate() - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const blocksPerPage = 100 const { showSnackBar, showLoader } = UtilsContext.useUtilsComponents() diff --git a/packages/explorer/src/components/Module.tsx b/packages/explorer/src/components/Module.tsx index 57cb00344..5225f3da5 100644 --- a/packages/explorer/src/components/Module.tsx +++ b/packages/explorer/src/components/Module.tsx @@ -1,11 +1,11 @@ -import { useEffect, useState } from 'react' +import { useContext, useEffect, useState } from 'react' import { useParams } from 'react-router-dom' import { capitalizeFirstLetter } from '../utils' import { Card } from './Card' -import { Auth, UtilsContext } from '@bitcoin-computer/components' +import { ComputerContext, UtilsContext } from '@bitcoin-computer/components' function Module() { - const [computer] = useState(Auth.getComputer()) + const computer = useContext(ComputerContext) const params = useParams() const [modSpec] = useState(params.rev) const [module, setModule] = useState({}) diff --git a/packages/explorer/src/components/Navbar.tsx b/packages/explorer/src/components/Navbar.tsx index 0fa6e66b6..adb9d2045 100644 --- a/packages/explorer/src/components/Navbar.tsx +++ b/packages/explorer/src/components/Navbar.tsx @@ -41,10 +41,26 @@ function formatChainAndNetwork(chain: string, network: string) { } function ModalContent() { + const [chain, setChain] = useState('') + const [network, setNetwork] = useState('') const [url, setUrl] = useState('') - function setNetwork(e: React.SyntheticEvent) { + const { showSnackBar } = UtilsContext.useUtilsComponents() + + function submit(e: React.SyntheticEvent) { e.preventDefault() - localStorage.setItem('URL', url) + + const isValidChain = ['LTC', 'BTC', 'DOGE'].includes(chain) + const isValidNetwork = ['mainnet', 'testnet', 'regtest'].includes(network) + + if (!isValidChain || !isValidNetwork) { + showSnackBar('Error setting chain, network, or url', false) + } else { + localStorage.setItem('URL', url) + localStorage.setItem('CHAIN', chain) + localStorage.setItem('NETWORK', network) + window.location.href = "/" + } + } function closeModal() { @@ -52,14 +68,14 @@ function ModalContent() { } return ( -
+
-
@@ -123,7 +164,8 @@ function NotLoggedMenu() { setDropDownLabel(formatChainAndNetwork(chain, network)) window.location.href = '/' } catch (err) { - showSnackBar('Error setting chain and network', false) + if (err instanceof Error && !err.message.startsWith('Cannot find environment variable ')) + throw err Modal.get(modalId).show() } } @@ -139,20 +181,8 @@ function NotLoggedMenu() { className="flex items-center justify-between w-full py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:border-0 md:hover:text-blue-700 md:p-0 md:w-auto dark:text-white md:dark:hover:text-blue-500 dark:focus:text-white dark:border-gray-700 dark:hover:bg-gray-700 md:dark:hover:bg-transparent" > {dropDownLabel} -