diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 0000000..9a2a0e2 --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +v20 diff --git a/public/index.html b/index.html similarity index 67% rename from public/index.html rename to index.html index 53832ae..08a8bd2 100644 --- a/public/index.html +++ b/index.html @@ -2,13 +2,14 @@ - + - + + @@ -25,16 +26,7 @@ manifest.json provides metadata used when your web app is installed on a user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ --> - - + Script Wiz diff --git a/package.json b/package.json index a62d699..1dd59f5 100644 --- a/package.json +++ b/package.json @@ -2,37 +2,41 @@ "name": "script-wiz-ui", "version": "0.1.18", "private": false, + "type": "module", + "engines" : { + "npm" : ">=9.8.0", + "node" : ">=20" + }, "dependencies": { - "@monaco-editor/react": "^4.4.1", - "@noble/secp256k1": "^1.7.1", + "@monaco-editor/react": "^4.6.0", + "@noble/secp256k1": "^2.0.0", "@script-wiz/lib": "^0.1.99", - "@testing-library/jest-dom": "^5.11.4", - "@testing-library/react": "^11.1.0", - "@testing-library/user-event": "^12.1.10", - "@types/jest": "^26.0.15", - "@types/node": "^12.0.0", - "@types/react": "^17.0.0", - "@types/react-dom": "^17.0.0", - "axios": "^0.26.0", + "@testing-library/jest-dom": "^6.1.4", + "@testing-library/react": "^14.0.0", + "@testing-library/user-event": "^14.5.1", + "@types/jest": "^29.5.6", + "@types/node": "^20.8.9", + "@types/react": "^18.2.25", + "@types/react-dom": "^18.2.10", + "@vitejs/plugin-react-swc": "^3.4.0", + "axios": "^1.6.0", "big-integer": "^1.6.51", "bn.js": "^5.2.1", - "monaco-editor": "^0.33.0", - "react": "^17.0.2", - "react-dom": "^17.0.2", - "react-mosaic-component": "^5.0.0", - "react-router-dom": "^5.3.0", - "react-scripts": "4.0.3", + "monaco-editor": "^0.44.0", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "react-mosaic-component": "^6.1.0", + "react-router-dom": "^6.16.0", "rsuite": "^5.5.0", "sass": "^1.49.7", - "typescript": "^4.1.2", - "web-vitals": "^1.0.1" + "typescript": "^5.2.2", + "vite": "^4.5.0", + "web-vitals": "^3.5.0" }, "scripts": { - "start": "react-scripts start", - "build": "react-scripts build", - "test": "react-scripts test", - "eject": "react-scripts eject", - "format": "prettier --write './src/**/*.{ts,tsx}'" + "start": "vite", + "build": "tsc && vite build", + "serve": "vite preview" }, "eslintConfig": { "extends": [ @@ -54,7 +58,8 @@ }, "devDependencies": { "@types/bn.js": "^5.1.1", - "@types/react-router-dom": "^5.3.0" + "@types/react-router-dom": "^5.3.0", + "vite-plugin-node-polyfills": "^0.15.0" }, "homepage": "https://ide.scriptwiz.app" } diff --git a/src/components/Svg/SvgType.ts b/src/components/Svg/SvgType.ts index ddae77d..e16a9b0 100644 --- a/src/components/Svg/SvgType.ts +++ b/src/components/Svg/SvgType.ts @@ -1,5 +1,6 @@ export type SvgType = { path: string; + children?: React.ReactNode; fill?: string; bgColor?: string; color?: string; diff --git a/src/index.scss b/src/index.scss index 0895a03..c7409c5 100644 --- a/src/index.scss +++ b/src/index.scss @@ -1,4 +1,4 @@ -@import '~rsuite/dist/rsuite.min.css'; +@import 'rsuite/dist/rsuite.min.css'; body { margin: 0; diff --git a/src/index.tsx b/src/index.tsx index 00324be..1b4b5e9 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import ReactDOM from 'react-dom'; +import { createRoot } from 'react-dom/client'; import './index.scss'; import App from './App'; import reportWebVitals from './reportWebVitals'; @@ -12,16 +12,19 @@ declare global { } } -ReactDOM.render( - +const domNode = document.getElementById('root')!; +const root = createRoot(domNode); + +// Disabling strict mode to avoid uncaught promise with Monaco: https://github.com/suren-atoyan/monaco-react/issues/440 +root.render( + // - , - document.getElementById('root'), + // , ); // If you want to start measuring performance in your app, pass a function -// to log results (for example: reportWebVitals(console.log)) +// to log results (for example: reportWebVitals(co nsole.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals reportWebVitals(); diff --git a/src/pages/EcCalculator/EcCalculator.tsx b/src/pages/EcCalculator/EcCalculator.tsx index 86ea817..cef3862 100644 --- a/src/pages/EcCalculator/EcCalculator.tsx +++ b/src/pages/EcCalculator/EcCalculator.tsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import { Button, Input, InputGroup, Tooltip, Whisper, RadioGroup, Radio, Checkbox } from 'rsuite'; import CopyIcon from '../../components/Svg/Icons/Copy'; -import { Point } from '@noble/secp256k1'; +import { ProjectivePoint } from '@noble/secp256k1'; import { ValueType } from 'rsuite/esm/Radio'; import BN from 'bn.js'; import { validHex } from '../../utils/helper'; @@ -38,9 +38,9 @@ export const EcCalculator = () => { const pointMultiplation = () => { try { - const data = new Point(BigInt('0x' + point1), BigInt('0x' + ecinpY)).multiply(BigInt('0x' + point2)); - const yAxis = bigInt(data.y.toString(16), 16); - // const yAxis = yfromX(data.x.toString(16)); + const data = new ProjectivePoint(BigInt(point1), BigInt(ecinpY), BigInt(1)).multiply(BigInt(point2)); + const affinePoint = data.toAffine(); // This is a hypothetical method. + const yAxis = bigInt(affinePoint.y.toString(16), 16); setMulResult({ x: data.x.toString(16), y: yAxis.toString(16), isOdd: yAxis.isOdd() }); } catch (error) { diff --git a/src/router/AppRouter.tsx b/src/router/AppRouter.tsx index 7462dc2..9936307 100644 --- a/src/router/AppRouter.tsx +++ b/src/router/AppRouter.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { BrowserRouter as Router, Switch, Route } from 'react-router-dom'; +import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'; import { ROUTE_PATH } from './ROUTE_PATH'; import { Helper } from '../pages/Helper/Helper'; import { Home } from '../pages/Home/Home'; @@ -13,16 +13,16 @@ import { BitCalculator } from '../pages/256BitCalculator/256BitCalculator'; export const AppRouter = (): JSX.Element => { return ( - - - - - - - - - - + + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + ); }; diff --git a/src/types.ts b/src/types.ts new file mode 100644 index 0000000..a0993ed --- /dev/null +++ b/src/types.ts @@ -0,0 +1,4 @@ +declare module '*.png' { + const value: any; + export = value; +} diff --git a/tsconfig.json b/tsconfig.json index a273b0c..34bbca6 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,6 +1,6 @@ { "compilerOptions": { - "target": "es5", + "target": "ESNext", "lib": [ "dom", "dom.iterable", diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..4a0f9d9 --- /dev/null +++ b/vite.config.js @@ -0,0 +1,12 @@ +import { defineConfig } from 'vite' +import { nodePolyfills } from 'vite-plugin-node-polyfills' +import react from '@vitejs/plugin-react-swc' + +// https://vitejs.dev/config/ +export default defineConfig({ + base: '/', + plugins: [react(), nodePolyfills()], + build: { + outDir: 'build', + } +})