diff --git a/packages/components/built/Auth.d.ts b/packages/components/built/Auth.d.ts index 530919328..0cc6201e0 100644 --- a/packages/components/built/Auth.d.ts +++ b/packages/components/built/Auth.d.ts @@ -8,18 +8,16 @@ declare function getBip44Path({ purpose, coinType, account }?: { coinType?: number | undefined; account?: number | undefined; }): string; -declare function getUrl(chain: Chain, network: Network): string; -declare function defaultConfiguration(): { +declare function loggedOutConfiguration(): { chain: Chain; network: Network; - url: string; + url: string | undefined; }; -declare function browserConfiguration(): { +declare function loggedInConfiguration(): { mnemonic: string | null; chain: Chain; network: Network; - path: string | null; - url: string | null; + url: string | undefined; }; declare function getComputer(): Computer; declare function LoginForm(): import("react/jsx-runtime").JSX.Element; @@ -29,9 +27,8 @@ export declare const Auth: { logout: typeof logout; getCoinType: typeof getCoinType; getBip44Path: typeof getBip44Path; - getUrl: typeof getUrl; - defaultConfiguration: typeof defaultConfiguration; - browserConfiguration: typeof browserConfiguration; + defaultConfiguration: typeof loggedOutConfiguration; + browserConfiguration: typeof loggedInConfiguration; getComputer: typeof getComputer; LoginForm: typeof LoginForm; LoginModal: typeof LoginModal; diff --git a/packages/components/built/Auth.js b/packages/components/built/Auth.js index d8edf91bf..32f7aa44c 100644 --- a/packages/components/built/Auth.js +++ b/packages/components/built/Auth.js @@ -15,6 +15,7 @@ import { Computer } from "@bitcoin-computer/lib"; import { initFlowbite } from "flowbite"; import { useUtilsComponents } from "./UtilsContext"; import { Modal } from "./Modal"; +import { HiRefresh } from "react-icons/hi"; function isLoggedIn() { return !!localStorage.getItem("BIP_39_KEY"); } @@ -45,55 +46,27 @@ function getBip44Path(_a) { var _b = _a === void 0 ? {} : _a, _c = _b.purpose, purpose = _c === void 0 ? 44 : _c, _d = _b.coinType, coinType = _d === void 0 ? 2 : _d, _e = _b.account, account = _e === void 0 ? 0 : _e; return "m/".concat(purpose.toString(), "'/").concat(coinType.toString(), "'/").concat(account.toString(), "'"); } -function getPath(chain, network) { - return getBip44Path({ coinType: getCoinType(chain, network) }); -} -function getEnvVariable(name) { - var res = process.env[name]; - if (typeof res === "undefined") { - throw new Error("Cannot find environment variable \"".concat(name, "\" in the .env file.")); - } - else - return res; -} -function getUrl(chain, network) { - return getEnvVariable("REACT_APP_".concat(chain.toUpperCase(), "_").concat(network.toUpperCase(), "_URL")); -} -function defaultConfiguration() { - var chain = (localStorage.getItem("CHAIN") || - getEnvVariable("REACT_APP_CHAIN") || - "LTC"); - var network = (localStorage.getItem("NETWORK") || - getEnvVariable("REACT_APP_NETWORK") || - "regtest"); - var url = getUrl(chain, network); - return { chain: chain, network: network, url: url }; +function loggedOutConfiguration() { + return { + chain: process.env["REACT_APP_CHAIN"], + network: process.env["REACT_APP_NETWORK"], + url: process.env["REACT_APP_URL"] + }; } -function browserConfiguration() { - var keys = ["BIP_39_KEY", "CHAIN", "NETWORK", "PATH", "URL"]; - var someKeyIsUndefined = keys.some(function (key) { return typeof localStorage.getItem(key) === "undefined"; }); - if (someKeyIsUndefined) - throw new Error("Something went wrong, please log out and log in again"); +function loggedInConfiguration() { return { mnemonic: localStorage.getItem("BIP_39_KEY"), - chain: localStorage.getItem("CHAIN"), - network: localStorage.getItem("NETWORK"), - path: localStorage.getItem("PATH"), - url: localStorage.getItem("URL") + chain: (localStorage.getItem("CHAIN") || process.env['REACT_APP_CHAIN']), + network: (localStorage.getItem("NETWORK") || process.env['REACT_APP_NETWORK']), + url: localStorage.getItem("URL") || process.env['REACT_APP_URL'] }; } function getComputer() { - var configuration = isLoggedIn() ? browserConfiguration() : defaultConfiguration(); - return new Computer(configuration); + return new Computer(isLoggedIn() ? loggedInConfiguration() : loggedOutConfiguration()); } function MnemonicInput(_a) { var mnemonic = _a.mnemonic, setMnemonic = _a.setMnemonic; - var generateMnemonic = function (e) { - e.stopPropagation(); - e.preventDefault(); - setMnemonic(new Computer().getMnemonic()); - }; - return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: "flex justify-between" }, { children: [_jsx("label", __assign({ className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: "BIP 39 Mnemonic" })), _jsx("button", __assign({ onClick: generateMnemonic, className: "mb-2 text-sm font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: "Generate in Browser" }))] })), _jsx("input", { value: mnemonic, onChange: function (e) { return setMnemonic(e.target.value); }, className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white", required: true })] })); + return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: "flex justify-between" }, { children: [_jsx("label", __assign({ className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: "BIP 39 Mnemonic" })), _jsx(HiRefresh, { onClick: function () { return setMnemonic(new Computer().getMnemonic()); }, className: "w-4 h-4 ml-2 text-sm font-medium text-gray-900 dark:text-white inline cursor-pointer hover:text-slate-700 dark:hover:text-slate-100" })] })), _jsx("input", { value: mnemonic, onChange: function (e) { return setMnemonic(e.target.value); }, className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white", required: true })] })); } function ChainInput(_a) { var chain = _a.chain, setChain = _a.setChain; @@ -103,23 +76,9 @@ function NetworkInput(_a) { var network = _a.network, setNetwork = _a.setNetwork; return (_jsxs(_Fragment, { children: [_jsx("label", __assign({ className: "block mt-4 mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: "Network" })), _jsxs("fieldset", __assign({ className: "flex" }, { children: [_jsx("legend", __assign({ className: "sr-only" }, { children: "Network" })), _jsxs("div", __assign({ className: "flex items-center mr-4" }, { children: [_jsx("input", { onChange: function () { return setNetwork("mainnet"); }, checked: network === "mainnet", id: "network-mainnet", type: "radio", name: "network", value: "Mainnet", className: "w-4 h-4 border-gray-300 focus:ring-2 focus:ring-blue-300 dark:focus:ring-blue-600 dark:focus:bg-blue-600 dark:bg-gray-700 dark:border-gray-600" }), _jsx("label", __assign({ htmlFor: "network-mainnet", className: "block ms-2 text-sm font-medium text-gray-900 dark:text-gray-300" }, { children: "Mainnet" }))] })), _jsxs("div", __assign({ className: "flex items-center mr-4" }, { children: [_jsx("input", { onChange: function () { return setNetwork("testnet"); }, checked: network === "testnet", id: "network-testnet", type: "radio", name: "network", value: "Testnet", className: "w-4 h-4 border-gray-300 focus:ring-2 focus:ring-blue-300 dark:focus:ring-blue-600 dark:focus:bg-blue-600 dark:bg-gray-700 dark:border-gray-600" }), _jsx("label", __assign({ htmlFor: "network-testnet", className: "block ms-2 text-sm font-medium text-gray-900 dark:text-gray-300" }, { children: "Testnet" }))] })), _jsxs("div", __assign({ className: "flex items-center mr-4" }, { children: [_jsx("input", { onChange: function () { return setNetwork("regtest"); }, checked: network === "regtest", id: "network-regtest", type: "radio", name: "network", value: "Regtest", className: "w-4 h-4 border-gray-300 focus:ring-2 focus:ring-blue-300 dark:focus:ring-blue-600 dark:focus:bg-blue-600 dark:bg-gray-700 dark:border-gray-600" }), _jsx("label", __assign({ htmlFor: "network-regtest", className: "block ms-2 text-sm font-medium text-gray-900 dark:text-gray-300" }, { children: "Regtest" }))] }))] }))] })); } -function PathInput(_a) { - var chain = _a.chain, network = _a.network, path = _a.path, setPath = _a.setPath; - var setDefaultPath = function (e) { - e.stopPropagation(); - e.preventDefault(); - setPath(getPath(chain, network)); - }; - return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: "mt-4 flex justify-between" }, { children: [_jsx("label", __assign({ className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: "Path" })), _jsx("button", __assign({ onClick: setDefaultPath, className: "mb-2 text-sm font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: "Update BIP 44 Path" }))] })), _jsx("input", { value: path, onChange: function (e) { return setPath(e.target.value); }, className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white" })] })); -} function UrlInput(_a) { - var chain = _a.chain, network = _a.network, url = _a.url, setUrl = _a.setUrl; - var setDefaultUrl = function (e) { - e.stopPropagation(); - e.preventDefault(); - setUrl(getUrl(chain, network)); - }; - return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ className: "mt-4 flex justify-between" }, { children: [_jsx("label", __assign({ className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: "Node Url" })), _jsx("button", __assign({ onClick: setDefaultUrl, className: "mb-2 text-sm font-medium text-blue-600 dark:text-blue-500 hover:underline" }, { children: "Update Node Url" }))] })), _jsx("input", { value: url, onChange: function (e) { return setUrl(e.target.value); }, className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white" })] })); + var setUrl = _a.setUrl; + return (_jsxs(_Fragment, { children: [_jsx("div", __assign({ className: "mt-4 flex justify-between" }, { children: _jsx("label", __assign({ className: "block mb-2 text-sm font-medium text-gray-900 dark:text-white" }, { children: "Node Url" })) })), _jsx("input", { onChange: function (e) { return setUrl(e.target.value); }, className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400 dark:text-white" })] })); } function LoginButton(_a) { var mnemonic = _a.mnemonic, chain = _a.chain, network = _a.network, path = _a.path, url = _a.url; @@ -140,15 +99,14 @@ function LoginButton(_a) { return (_jsx(_Fragment, { children: _jsx("button", __assign({ onClick: login, type: "submit", className: "w-full text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800" }, { children: "Log In" })) })); } function LoginForm() { - var _a = useState(""), mnemonic = _a[0], setMnemonic = _a[1]; - var _b = useState("LTC"), chain = _b[0], setChain = _b[1]; - var _c = useState("regtest"), network = _c[0], setNetwork = _c[1]; - var _d = useState(getPath(chain, network)), path = _d[0], setPath = _d[1]; - var _e = useState(getUrl(chain, network)), url = _e[0], setUrl = _e[1]; + var _a = useState(new Computer().getMnemonic()), mnemonic = _a[0], setMnemonic = _a[1]; + var _b = useState(process.env['REACT_APP_CHAIN']), chain = _b[0], setChain = _b[1]; + var _c = useState(process.env['REACT_APP_NETWORK']), network = _c[0], setNetwork = _c[1]; + var _d = useState(process.env['REACT_APP_URL']), url = _d[0], setUrl = _d[1]; useEffect(function () { initFlowbite(); }, []); - return (_jsxs(_Fragment, { children: [_jsx("div", __assign({ className: "p-4 md:p-5 space-y-4" }, { children: _jsx("form", __assign({ className: "space-y-6" }, { children: _jsxs("div", { children: [_jsx(MnemonicInput, { mnemonic: mnemonic, setMnemonic: setMnemonic }), _jsx(ChainInput, { chain: chain, setChain: setChain }), _jsx(NetworkInput, { network: network, setNetwork: setNetwork }), _jsx(PathInput, { chain: chain, network: network, path: path, setPath: setPath }), _jsx(UrlInput, { chain: chain, network: network, url: url, setUrl: setUrl })] }) })) })), _jsx("div", __assign({ className: "flex items-center p-4 md:p-5 border-t border-gray-200 rounded-b dark:border-gray-600" }, { children: _jsx(LoginButton, { mnemonic: mnemonic, chain: chain, network: network, path: path, url: url }) }))] })); + return (_jsxs(_Fragment, { children: [_jsx("div", __assign({ className: "max-w-sm mx-auto p-4 md:p-5 space-y-4" }, { children: _jsx("form", __assign({ className: "space-y-6" }, { children: _jsxs("div", { children: [_jsx(MnemonicInput, { mnemonic: mnemonic, setMnemonic: setMnemonic }), !process.env['REACT_APP_CHAIN'] && _jsx(ChainInput, { chain: chain, setChain: setChain }), !process.env['REACT_APP_NETWORK'] && _jsx(NetworkInput, { network: network, setNetwork: setNetwork }), !process.env['REACT_APP_URL'] && _jsx(UrlInput, { setUrl: setUrl })] }) })) })), _jsx("div", __assign({ className: "max-w-sm mx-auto flex items-center p-4 md:p-5 border-t border-gray-200 rounded-b dark:border-gray-600" }, { children: _jsx(LoginButton, { mnemonic: mnemonic, chain: chain, network: network, url: url }) }))] })); } function LoginModal() { return _jsx(Modal.Component, { title: "Sign in", content: LoginForm, id: "sign-in-modal" }); @@ -158,9 +116,8 @@ export var Auth = { logout: logout, getCoinType: getCoinType, getBip44Path: getBip44Path, - getUrl: getUrl, - defaultConfiguration: defaultConfiguration, - browserConfiguration: browserConfiguration, + defaultConfiguration: loggedOutConfiguration, + browserConfiguration: loggedInConfiguration, getComputer: getComputer, LoginForm: LoginForm, LoginModal: LoginModal diff --git a/packages/components/built/Error404.d.ts b/packages/components/built/Error404.d.ts index 8b8f88a66..58becf8b9 100644 --- a/packages/components/built/Error404.d.ts +++ b/packages/components/built/Error404.d.ts @@ -1 +1,3 @@ -export declare const Error404: () => import("react/jsx-runtime").JSX.Element; +export declare const Error404: ({ message }: { + message?: string | undefined; +}) => import("react/jsx-runtime").JSX.Element; diff --git a/packages/components/built/Error404.js b/packages/components/built/Error404.js index 42afb47f2..3d1bc4e3b 100644 --- a/packages/components/built/Error404.js +++ b/packages/components/built/Error404.js @@ -9,5 +9,13 @@ var __assign = (this && this.__assign) || function () { }; return __assign.apply(this, arguments); }; -import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; -export var Error404 = function () { return (_jsx("section", __assign({ className: "w-full bg-white dark:bg-gray-900" }, { children: _jsx("div", __assign({ className: "py-8 px-4 mx-auto max-w-screen-xl lg:py-16 lg:px-6" }, { children: _jsxs("div", __assign({ className: "mx-auto max-w-screen-sm text-center" }, { children: [_jsx("h1", __assign({ className: "mb-4 text-6xl tracking-tight font-extrabold text-blue-700 dark:text-blue-600" }, { children: "404" })), _jsx("p", __assign({ className: "mb-4 text-3xl tracking-tight font-bold text-gray-700 md:text-4xl dark:text-white" }, { children: "Something's missing." })), _jsxs("p", __assign({ className: "mb-4 text-lg font-light text-gray-500 dark:text-gray-400" }, { children: ["Sorry, we can't find that page. You'll find lots to explore on the home page.", " "] })), _jsx("a", __assign({ href: "/", className: "inline-flex text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:focus:ring-blue-900 my-4" }, { children: "Back to Homepage" }))] })) })) }))); }; +import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime"; +export var Error404 = function (_a) { + var message = _a.message; + var Missing = function () { return (_jsxs(_Fragment, { children: [_jsx("h1", __assign({ className: "mb-4 text-6xl tracking-tight font-extrabold text-blue-700 dark:text-blue-600" }, { children: "404" })), _jsx("p", __assign({ className: "mb-4 text-3xl tracking-tight font-bold text-gray-700 md:text-4xl dark:text-white" }, { children: "Something's missing." })), _jsxs("p", __assign({ className: "mb-4 text-lg font-light text-gray-500 dark:text-gray-400" }, { children: ["Sorry, we can't find that page. You'll find lots to explore on the home page.", " "] })), _jsx("a", __assign({ href: "/", className: "inline-flex text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:focus:ring-blue-900 my-4" }, { children: "Back to Homepage" }))] })); }; + var Err = function (_a) { + var message = _a.message; + return (_jsxs(_Fragment, { children: [_jsx("h1", __assign({ className: "mb-4 text-6xl tracking-tight font-extrabold text-blue-700 dark:text-blue-600" }, { children: "400" })), _jsx("p", __assign({ className: "mb-4 text-3xl tracking-tight font-bold text-gray-700 md:text-4xl dark:text-white" }, { children: "Something went wrong." })), _jsx("p", __assign({ className: "mb-4 text-lg font-light text-gray-500 dark:text-gray-400" }, { children: message }))] })); + }; + return (_jsx("section", __assign({ className: "w-full bg-white dark:bg-gray-900" }, { children: _jsx("div", __assign({ className: "py-8 px-4 mx-auto max-w-screen-xl lg:py-16 lg:px-6" }, { children: _jsx("div", __assign({ className: "mx-auto max-w-screen-sm text-center" }, { children: message ? _jsx(Err, { message: message }) : _jsx(Missing, {}) })) })) }))); +}; diff --git a/packages/components/built/Modal.js b/packages/components/built/Modal.js index 1c14b7c73..e22935e0e 100644 --- a/packages/components/built/Modal.js +++ b/packages/components/built/Modal.js @@ -40,7 +40,7 @@ var ToggleButton = function (_a) { }; var Component = function (_a) { var title = _a.title, content = _a.content, contentData = _a.contentData, id = _a.id; - return (_jsx("div", __assign({ id: id, tabIndex: -1, "aria-hidden": "true", className: "hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full" }, { children: _jsx("div", __assign({ className: "relative p-4 w-full max-w-2xl max-h-full" }, { children: _jsxs("div", __assign({ className: "relative bg-white rounded-lg shadow dark:bg-gray-700" }, { children: [_jsxs("div", __assign({ className: "flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600" }, { children: [_jsx("h3", __assign({ className: "text-xl font-semibold text-gray-900 dark:text-white" }, { children: title })), _jsxs("button", __assign({ type: "button", className: "text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white", "data-modal-hide": id, "data-modal-target": id, onClick: function () { return hideModal(id); } }, { children: [_jsx("svg", __assign({ className: "w-3 h-3", "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 14" }, { children: _jsx("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" }) })), _jsx("span", __assign({ className: "sr-only" }, { children: "Close modal" }))] }))] })), content(contentData)] })) })) }))); + return (_jsx("div", __assign({ id: id, tabIndex: -1, "aria-hidden": "true", className: "hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 justify-center items-center w-full md:inset-0 h-[calc(100%-1rem)] max-h-full" }, { children: _jsx("div", __assign({ className: "relative p-4 w-full max-w-sm max-h-full" }, { children: _jsxs("div", __assign({ className: "relative bg-white rounded-lg shadow dark:bg-gray-700" }, { children: [_jsxs("div", __assign({ className: "flex items-center justify-between p-4 md:p-5 border-b rounded-t dark:border-gray-600" }, { children: [_jsx("h3", __assign({ className: "text-xl font-semibold text-gray-900 dark:text-white" }, { children: title })), _jsxs("button", __assign({ type: "button", className: "text-gray-400 bg-transparent hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm w-8 h-8 ms-auto inline-flex justify-center items-center dark:hover:bg-gray-600 dark:hover:text-white", "data-modal-hide": id, "data-modal-target": id, onClick: function () { return hideModal(id); } }, { children: [_jsx("svg", __assign({ className: "w-3 h-3", "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 14 14" }, { children: _jsx("path", { stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" }) })), _jsx("span", __assign({ className: "sr-only" }, { children: "Close modal" }))] }))] })), content(contentData)] })) })) }))); }; export var Modal = { get: get, diff --git a/packages/components/package.json b/packages/components/package.json index 60f2097a4..38ee7a334 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -7,7 +7,7 @@ "scripts": { "tsc-compile": "rm -rf built/* && tsc", "install-monorepo": "cd ../../../ && npm run delete-node-modules && npm install && cd monorepo/packages/components", - "compile": "npm run tsc-compile && npm run install-monorepo", + "build": "npm run tsc-compile && npm run install-monorepo", "lint": "eslint --fix . --ext .ts,.tsx --ignore-pattern built/", "lint-fix": "eslint src --fix", "prettier": "prettier --write \"src/**/*.{js,jsx,ts,tsx,css,scss,md}\"", diff --git a/packages/components/src/Auth.tsx b/packages/components/src/Auth.tsx index bb16a8e84..8a9c59b19 100644 --- a/packages/components/src/Auth.tsx +++ b/packages/components/src/Auth.tsx @@ -4,6 +4,7 @@ import { initFlowbite } from "flowbite" import { useUtilsComponents } from "./UtilsContext" import { Modal } from "./Modal" import type { Chain, Network } from "./common/types" +import { HiRefresh } from "react-icons/hi" function isLoggedIn(): boolean { return !!localStorage.getItem("BIP_39_KEY") @@ -34,49 +35,25 @@ function getBip44Path({ purpose = 44, coinType = 2, account = 0 } = {}) { return `m/${purpose.toString()}'/${coinType.toString()}'/${account.toString()}'` } -function getPath(chain: string, network: string): string { - return getBip44Path({ coinType: getCoinType(chain, network) }) -} - -function getEnvVariable(name: string) { - const res = process.env[name] - if (typeof res === "undefined") { - throw new Error(`Cannot find environment variable "${name}" in the .env file.`) - } else return res -} - -function getUrl(chain: Chain, network: Network) { - return getEnvVariable(`REACT_APP_${chain.toUpperCase()}_${network.toUpperCase()}_URL`) -} - -function defaultConfiguration() { - const chain = (localStorage.getItem("CHAIN") || - getEnvVariable(`REACT_APP_CHAIN`) || - "LTC") as Chain - const network = (localStorage.getItem("NETWORK") || - getEnvVariable(`REACT_APP_NETWORK`) || - "regtest") as Network - const url = getUrl(chain, network) - return { chain, network, url } +function loggedOutConfiguration() { + return { + chain: process.env[`REACT_APP_CHAIN`] as Chain, + network: process.env[`REACT_APP_NETWORK`] as Network, + url: process.env[`REACT_APP_URL`] + } } -function browserConfiguration() { - const keys = ["BIP_39_KEY", "CHAIN", "NETWORK", "PATH", "URL"] - const someKeyIsUndefined = keys.some((key) => typeof localStorage.getItem(key) === "undefined") - if (someKeyIsUndefined) throw new Error("Something went wrong, please log out and log in again") - +function loggedInConfiguration() { return { mnemonic: localStorage.getItem("BIP_39_KEY"), - chain: localStorage.getItem("CHAIN") as Chain, - network: localStorage.getItem("NETWORK") as Network, - path: localStorage.getItem("PATH"), - url: localStorage.getItem("URL") + chain: (localStorage.getItem("CHAIN") || process.env['REACT_APP_CHAIN']) as Chain, + network: (localStorage.getItem("NETWORK") || process.env['REACT_APP_NETWORK']) as Network, + url: localStorage.getItem("URL") || process.env['REACT_APP_URL'] } } function getComputer(): Computer { - const configuration: any = isLoggedIn() ? browserConfiguration() : defaultConfiguration() - return new Computer(configuration) + return new Computer(isLoggedIn() ? loggedInConfiguration() : loggedOutConfiguration()) } function MnemonicInput({ @@ -86,24 +63,16 @@ function MnemonicInput({ mnemonic: string setMnemonic: Dispatch }) { - const generateMnemonic = (e: React.MouseEvent) => { - e.stopPropagation() - e.preventDefault() - setMnemonic(new Computer().getMnemonic()) - } - return ( <>
- + setMnemonic(new Computer().getMnemonic())} + className="w-4 h-4 ml-2 text-sm font-medium text-gray-900 dark:text-white inline cursor-pointer hover:text-slate-700 dark:hover:text-slate-100" + />
}) { +function ChainInput({ chain, setChain }: { chain: Chain | undefined; setChain: Dispatch }) { return ( <>