diff --git a/frontend/pronunciationAppFront/package-lock.json b/frontend/pronunciationAppFront/package-lock.json index 96c25f82d..c3324b258 100644 --- a/frontend/pronunciationAppFront/package-lock.json +++ b/frontend/pronunciationAppFront/package-lock.json @@ -8,6 +8,13 @@ "name": "pronunciationappfront", "version": "0.0.0", "dependencies": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", + "@fontsource/roboto": "^5.1.1", + "@mui/icons-material": "^6.4.0", + "@mui/material": "^6.4.1", + "@vitejs/plugin-react": "^4.3.4", + "axios": "^1.7.9", "react": "^18.3.1", "react-dom": "^18.3.1" }, @@ -21,9 +28,430 @@ "eslint-plugin-react-hooks": "^5.0.0", "eslint-plugin-react-refresh": "^0.4.16", "globals": "^15.14.0", - "vite": "^6.0.5" + "vite": "^6.0.11" } }, + "node_modules/@ampproject/remapping": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz", + "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==", + "license": "Apache-2.0", + "dependencies": { + "@jridgewell/gen-mapping": "^0.3.5", + "@jridgewell/trace-mapping": "^0.3.24" + }, + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/@babel/code-frame": { + "version": "7.26.2", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.26.2.tgz", + "integrity": "sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==", + "dependencies": { + "@babel/helper-validator-identifier": "^7.25.9", + "js-tokens": "^4.0.0", + "picocolors": "^1.0.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/compat-data": { + "version": "7.26.5", + "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.26.5.tgz", + "integrity": "sha512-XvcZi1KWf88RVbF9wn8MN6tYFloU5qX8KjuF3E1PVBmJ9eypXfs4GRiJwLuTZL0iSnJUKn1BFPa5BPZZJyFzPg==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/core": { + "version": "7.26.7", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.7.tgz", + "integrity": "sha512-SRijHmF0PSPgLIBYlWnG0hyeJLwXE2CgpsXaMOrtt2yp9/86ALw6oUlj9KYuZ0JN07T4eBMVIW4li/9S1j2BGA==", + "license": "MIT", + "dependencies": { + "@ampproject/remapping": "^2.2.0", + "@babel/code-frame": "^7.26.2", + "@babel/generator": "^7.26.5", + "@babel/helper-compilation-targets": "^7.26.5", + "@babel/helper-module-transforms": "^7.26.0", + "@babel/helpers": "^7.26.7", + "@babel/parser": "^7.26.7", + "@babel/template": "^7.25.9", + "@babel/traverse": "^7.26.7", + "@babel/types": "^7.26.7", + "convert-source-map": "^2.0.0", + "debug": "^4.1.0", + "gensync": "^1.0.0-beta.2", + "json5": "^2.2.3", + "semver": "^6.3.1" + }, + "engines": { + "node": ">=6.9.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/babel" + } + }, + "node_modules/@babel/core/node_modules/convert-source-map": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz", + "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==", + "license": "MIT" + }, + "node_modules/@babel/generator": { + "version": "7.26.5", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.26.5.tgz", + "integrity": "sha512-2caSP6fN9I7HOe6nqhtft7V4g7/V/gfDsC3Ag4W7kEzzvRGKqiv0pu0HogPiZ3KaVSoNDhUws6IJjDjpfmYIXw==", + "dependencies": { + "@babel/parser": "^7.26.5", + "@babel/types": "^7.26.5", + "@jridgewell/gen-mapping": "^0.3.5", + "@jridgewell/trace-mapping": "^0.3.25", + "jsesc": "^3.0.2" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-compilation-targets": { + "version": "7.26.5", + "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.26.5.tgz", + "integrity": "sha512-IXuyn5EkouFJscIDuFF5EsiSolseme1s0CZB+QxVugqJLYmKdxI1VfIBOst0SUu4rnk2Z7kqTwmoO1lp3HIfnA==", + "license": "MIT", + "dependencies": { + "@babel/compat-data": "^7.26.5", + "@babel/helper-validator-option": "^7.25.9", + "browserslist": "^4.24.0", + "lru-cache": "^5.1.1", + "semver": "^6.3.1" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-module-imports": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.25.9.tgz", + "integrity": "sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==", + "dependencies": { + "@babel/traverse": "^7.25.9", + "@babel/types": "^7.25.9" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-module-transforms": { + "version": "7.26.0", + "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.26.0.tgz", + "integrity": "sha512-xO+xu6B5K2czEnQye6BHA7DolFFmS3LB7stHZFaOLb1pAwO1HWLS8fXA+eh0A2yIvltPVmx3eNNDBJA2SLHXFw==", + "license": "MIT", + "dependencies": { + "@babel/helper-module-imports": "^7.25.9", + "@babel/helper-validator-identifier": "^7.25.9", + "@babel/traverse": "^7.25.9" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0" + } + }, + "node_modules/@babel/helper-plugin-utils": { + "version": "7.26.5", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.26.5.tgz", + "integrity": "sha512-RS+jZcRdZdRFzMyr+wcsaqOmld1/EqTghfaBGQQd/WnRdzdlvSZ//kF7U8VQTxf1ynZ4cjUcYgjVGx13ewNPMg==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-string-parser": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz", + "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==", + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-validator-identifier": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz", + "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==", + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helper-validator-option": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.25.9.tgz", + "integrity": "sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/helpers": { + "version": "7.26.7", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.26.7.tgz", + "integrity": "sha512-8NHiL98vsi0mbPQmYAGWwfcFaOy4j2HY49fXJCfuDcdE7fMIsH9a7GdaeXpIBsbT7307WU8KCMp5pUVDNL4f9A==", + "license": "MIT", + "dependencies": { + "@babel/template": "^7.25.9", + "@babel/types": "^7.26.7" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/parser": { + "version": "7.26.7", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.7.tgz", + "integrity": "sha512-kEvgGGgEjRUutvdVvZhbn/BxVt+5VSpwXz1j3WYXQbXDo8KzFOPNG2GQbdAiNq8g6wn1yKk7C/qrke03a84V+w==", + "license": "MIT", + "dependencies": { + "@babel/types": "^7.26.7" + }, + "bin": { + "parser": "bin/babel-parser.js" + }, + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/@babel/plugin-transform-react-jsx-self": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.25.9.tgz", + "integrity": "sha512-y8quW6p0WHkEhmErnfe58r7x0A70uKphQm8Sp8cV7tjNQwK56sNVK0M73LK3WuYmsuyrftut4xAkjjgU0twaMg==", + "license": "MIT", + "dependencies": { + "@babel/helper-plugin-utils": "^7.25.9" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@babel/plugin-transform-react-jsx-source": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.25.9.tgz", + "integrity": "sha512-+iqjT8xmXhhYv4/uiYd8FNQsraMFZIfxVSqxxVSZP0WbbSAWvBXAul0m/zu+7Vv4O/3WtApy9pmaTMiumEZgfg==", + "license": "MIT", + "dependencies": { + "@babel/helper-plugin-utils": "^7.25.9" + }, + "engines": { + "node": ">=6.9.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0-0" + } + }, + "node_modules/@babel/runtime": { + "version": "7.26.0", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.0.tgz", + "integrity": "sha512-FDSOghenHTiToteC/QRlv2q3DhPZ/oOXTBoirfWNx1Cx3TMVcGWQtMMmQcSvb/JjpNeGzx8Pq/b4fKEJuWm1sw==", + "dependencies": { + "regenerator-runtime": "^0.14.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/template": { + "version": "7.25.9", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.25.9.tgz", + "integrity": "sha512-9DGttpmPvIxBb/2uwpVo3dqJ+O6RooAFOS+lB+xDqoE2PVCE8nfoHMdZLpfCQRLwvohzXISPZcgxt80xLfsuwg==", + "dependencies": { + "@babel/code-frame": "^7.25.9", + "@babel/parser": "^7.25.9", + "@babel/types": "^7.25.9" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/traverse": { + "version": "7.26.7", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.26.7.tgz", + "integrity": "sha512-1x1sgeyRLC3r5fQOM0/xtQKsYjyxmFjaOrLJNtZ81inNjyJHGIolTULPiSc/2qe1/qfpFLisLQYFnnZl7QoedA==", + "license": "MIT", + "dependencies": { + "@babel/code-frame": "^7.26.2", + "@babel/generator": "^7.26.5", + "@babel/parser": "^7.26.7", + "@babel/template": "^7.25.9", + "@babel/types": "^7.26.7", + "debug": "^4.3.1", + "globals": "^11.1.0" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@babel/traverse/node_modules/globals": { + "version": "11.12.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", + "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", + "engines": { + "node": ">=4" + } + }, + "node_modules/@babel/types": { + "version": "7.26.7", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.7.tgz", + "integrity": "sha512-t8kDRGrKXyp6+tjUh7hw2RLyclsW4TRoRvRHtSyAX9Bb5ldlFh+90YAYY6awRXrlB4G5G2izNeGySpATlFzmOg==", + "license": "MIT", + "dependencies": { + "@babel/helper-string-parser": "^7.25.9", + "@babel/helper-validator-identifier": "^7.25.9" + }, + "engines": { + "node": ">=6.9.0" + } + }, + "node_modules/@emotion/babel-plugin": { + "version": "11.13.5", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz", + "integrity": "sha512-pxHCpT2ex+0q+HH91/zsdHkw/lXd468DIN2zvfvLtPKLLMo6gQj7oLObq8PhkrxOZb/gGCq03S3Z7PDhS8pduQ==", + "dependencies": { + "@babel/helper-module-imports": "^7.16.7", + "@babel/runtime": "^7.18.3", + "@emotion/hash": "^0.9.2", + "@emotion/memoize": "^0.9.0", + "@emotion/serialize": "^1.3.3", + "babel-plugin-macros": "^3.1.0", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.2.0" + } + }, + "node_modules/@emotion/cache": { + "version": "11.14.0", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.14.0.tgz", + "integrity": "sha512-L/B1lc/TViYk4DcpGxtAVbx0ZyiKM5ktoIyafGkH6zg/tj+mA+NE//aPYKG0k8kCHSHVJrpLpcAlOBEXQ3SavA==", + "dependencies": { + "@emotion/memoize": "^0.9.0", + "@emotion/sheet": "^1.4.0", + "@emotion/utils": "^1.4.2", + "@emotion/weak-memoize": "^0.4.0", + "stylis": "4.2.0" + } + }, + "node_modules/@emotion/hash": { + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", + "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==" + }, + "node_modules/@emotion/is-prop-valid": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.1.tgz", + "integrity": "sha512-/ACwoqx7XQi9knQs/G0qKvv5teDMhD7bXYns9N/wM8ah8iNb8jZ2uNO0YOgiq2o2poIvVtJS2YALasQuMSQ7Kw==", + "dependencies": { + "@emotion/memoize": "^0.9.0" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz", + "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==" + }, + "node_modules/@emotion/react": { + "version": "11.14.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz", + "integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.18.3", + "@emotion/babel-plugin": "^11.13.5", + "@emotion/cache": "^11.14.0", + "@emotion/serialize": "^1.3.3", + "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0", + "@emotion/utils": "^1.4.2", + "@emotion/weak-memoize": "^0.4.0", + "hoist-non-react-statics": "^3.3.1" + }, + "peerDependencies": { + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/serialize": { + "version": "1.3.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.3.tgz", + "integrity": "sha512-EISGqt7sSNWHGI76hC7x1CksiXPahbxEOrC5RjmFRJTqLyEK9/9hZvBbiYn70dw4wuwMKiEMCUlR6ZXTSWQqxA==", + "dependencies": { + "@emotion/hash": "^0.9.2", + "@emotion/memoize": "^0.9.0", + "@emotion/unitless": "^0.10.0", + "@emotion/utils": "^1.4.2", + "csstype": "^3.0.2" + } + }, + "node_modules/@emotion/sheet": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz", + "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==" + }, + "node_modules/@emotion/styled": { + "version": "11.14.0", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.14.0.tgz", + "integrity": "sha512-XxfOnXFffatap2IyCeJyNov3kiDQWoR08gPUQxvbL7fxKryGBKUZUkG6Hz48DZwVrJSVh9sJboyV1Ds4OW6SgA==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.18.3", + "@emotion/babel-plugin": "^11.13.5", + "@emotion/is-prop-valid": "^1.3.0", + "@emotion/serialize": "^1.3.3", + "@emotion/use-insertion-effect-with-fallbacks": "^1.2.0", + "@emotion/utils": "^1.4.2" + }, + "peerDependencies": { + "@emotion/react": "^11.0.0-rc.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/unitless": { + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz", + "integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==" + }, + "node_modules/@emotion/use-insertion-effect-with-fallbacks": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.2.0.tgz", + "integrity": "sha512-yJMtVdH59sxi/aVJBpk9FQq+OR8ll5GT8oWd57UpeaKEVGab41JWaCFA7FRLoMLloOZF/c/wsPoe+bfGmRKgDg==", + "peerDependencies": { + "react": ">=16.8.0" + } + }, + "node_modules/@emotion/utils": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.2.tgz", + "integrity": "sha512-3vLclRofFziIa3J2wDh9jjbkUz9qk5Vi3IZ/FSTKViB0k+ef0fPV7dYrUIugbgupYDx7v9ud/SjrtEP8Y4xLoA==" + }, + "node_modules/@emotion/weak-memoize": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz", + "integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==" + }, "node_modules/@esbuild/aix-ppc64": { "version": "0.24.2", "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.24.2.tgz", @@ -31,7 +459,6 @@ "cpu": [ "ppc64" ], - "dev": true, "optional": true, "os": [ "aix" @@ -47,7 +474,6 @@ "cpu": [ "arm" ], - "dev": true, "optional": true, "os": [ "android" @@ -63,7 +489,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "android" @@ -79,7 +504,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "android" @@ -95,7 +519,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "darwin" @@ -111,7 +534,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "darwin" @@ -127,7 +549,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "freebsd" @@ -143,7 +564,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "freebsd" @@ -159,7 +579,6 @@ "cpu": [ "arm" ], - "dev": true, "optional": true, "os": [ "linux" @@ -175,7 +594,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -191,7 +609,6 @@ "cpu": [ "ia32" ], - "dev": true, "optional": true, "os": [ "linux" @@ -207,7 +624,6 @@ "cpu": [ "loong64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -223,7 +639,6 @@ "cpu": [ "mips64el" ], - "dev": true, "optional": true, "os": [ "linux" @@ -239,7 +654,6 @@ "cpu": [ "ppc64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -255,7 +669,6 @@ "cpu": [ "riscv64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -271,7 +684,6 @@ "cpu": [ "s390x" ], - "dev": true, "optional": true, "os": [ "linux" @@ -287,7 +699,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -303,7 +714,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "netbsd" @@ -319,7 +729,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "netbsd" @@ -335,7 +744,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "openbsd" @@ -351,7 +759,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "openbsd" @@ -367,7 +774,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "sunos" @@ -383,7 +789,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "win32" @@ -399,7 +804,6 @@ "cpu": [ "ia32" ], - "dev": true, "optional": true, "os": [ "win32" @@ -415,7 +819,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "win32" @@ -554,6 +957,11 @@ "node": "^18.18.0 || ^20.9.0 || >=21.1.0" } }, + "node_modules/@fontsource/roboto": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.1.1.tgz", + "integrity": "sha512-XwVVXtERDQIM7HPUIbyDe0FP4SRovpjF7zMI8M7pbqFp3ahLJsJTd18h+E6pkar6UbV3btbwkKjYARr5M+SQow==" + }, "node_modules/@humanfs/core": { "version": "0.19.1", "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz", @@ -615,6 +1023,298 @@ "url": "https://github.com/sponsors/nzakas" } }, + "node_modules/@jridgewell/gen-mapping": { + "version": "0.3.8", + "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", + "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==", + "dependencies": { + "@jridgewell/set-array": "^1.2.1", + "@jridgewell/sourcemap-codec": "^1.4.10", + "@jridgewell/trace-mapping": "^0.3.24" + }, + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/@jridgewell/resolve-uri": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz", + "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==", + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/@jridgewell/set-array": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", + "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/@jridgewell/sourcemap-codec": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz", + "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==" + }, + "node_modules/@jridgewell/trace-mapping": { + "version": "0.3.25", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz", + "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==", + "dependencies": { + "@jridgewell/resolve-uri": "^3.1.0", + "@jridgewell/sourcemap-codec": "^1.4.14" + } + }, + "node_modules/@mui/core-downloads-tracker": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.4.1.tgz", + "integrity": "sha512-SfDLWMV5b5oXgDf3NTa2hCTPC1d2defhDH2WgFKmAiejC4mSfXYbyi+AFCLzpizauXhgBm8OaZy9BHKnrSpahQ==", + "license": "MIT", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + } + }, + "node_modules/@mui/icons-material": { + "version": "6.4.0", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-6.4.0.tgz", + "integrity": "sha512-zF0Vqt8a+Zp2Oz8P+WvJflba6lLe3PhxIz1NNqn+n4A+wKLPbkeqY8ShmKjPyiCTg0RMbPrp993oUDl9xGsDlQ==", + "dependencies": { + "@babel/runtime": "^7.26.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, + "peerDependencies": { + "@mui/material": "^6.4.0", + "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/material": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-6.4.1.tgz", + "integrity": "sha512-MFBfia6UiKxyoLeGkAh8M15bkeDmfnsUTMRJd/vTQue6YQ8AQ6lw9HqDthyYghzDEWIvZO/lQQzLrZE8XwNJLA==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.26.0", + "@mui/core-downloads-tracker": "^6.4.1", + "@mui/system": "^6.4.1", + "@mui/types": "^7.2.21", + "@mui/utils": "^6.4.1", + "@popperjs/core": "^2.11.8", + "@types/react-transition-group": "^4.4.12", + "clsx": "^2.1.1", + "csstype": "^3.1.3", + "prop-types": "^15.8.1", + "react-is": "^19.0.0", + "react-transition-group": "^4.4.5" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, + "peerDependencies": { + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@mui/material-pigment-css": "^6.4.1", + "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, + "@mui/material-pigment-css": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/material/node_modules/react-is": { + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.0.0.tgz", + "integrity": "sha512-H91OHcwjZsbq3ClIDHMzBShc1rotbfACdWENsmEf0IFvZ3FgGPtdHMcsv45bQ1hAbgdfiA8SnxTKfDS+x/8m2g==" + }, + "node_modules/@mui/private-theming": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-6.4.1.tgz", + "integrity": "sha512-DcT7mwK89owwgcEuiE7w458te4CIjHbYWW6Kn6PiR6eLtxBsoBYphA968uqsQAOBQDpbYxvkuFLwhgk4bxoN/Q==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.26.0", + "@mui/utils": "^6.4.1", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/styled-engine": { + "version": "6.4.0", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-6.4.0.tgz", + "integrity": "sha512-ek/ZrDujrger12P6o4luQIfRd2IziH7jQod2WMbLqGE03Iy0zUwYmckRTVhRQTLPNccpD8KXGcALJF+uaUQlbg==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.26.0", + "@emotion/cache": "^11.13.5", + "@emotion/serialize": "^1.3.3", + "@emotion/sheet": "^1.4.0", + "csstype": "^3.1.3", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, + "peerDependencies": { + "@emotion/react": "^11.4.1", + "@emotion/styled": "^11.3.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + } + } + }, + "node_modules/@mui/system": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-6.4.1.tgz", + "integrity": "sha512-rgQzgcsHCTtzF9MZ+sL0tOhf2ZBLazpjrujClcb4Siju5lTrK0xX4PsiropActzCemNfM+mOu+0jezAVnfRK8g==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.26.0", + "@mui/private-theming": "^6.4.1", + "@mui/styled-engine": "^6.4.0", + "@mui/types": "^7.2.21", + "@mui/utils": "^6.4.1", + "clsx": "^2.1.1", + "csstype": "^3.1.3", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, + "peerDependencies": { + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/types": { + "version": "7.2.21", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.21.tgz", + "integrity": "sha512-6HstngiUxNqLU+/DPqlUJDIPbzUBxIVHb1MmXP0eTWDIROiCR2viugXpEif0PPe2mLqqakPzzRClWAnK+8UJww==", + "license": "MIT", + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/utils": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.4.1.tgz", + "integrity": "sha512-iQUDUeYh87SvR4lVojaRaYnQix8BbRV51MxaV6MBmqthecQoxwSbS5e2wnbDJUeFxY2ppV505CiqPLtd0OWkqw==", + "license": "MIT", + "dependencies": { + "@babel/runtime": "^7.26.0", + "@mui/types": "^7.2.21", + "@types/prop-types": "^15.7.14", + "clsx": "^2.1.1", + "prop-types": "^15.8.1", + "react-is": "^19.0.0" + }, + "engines": { + "node": ">=14.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0", + "react": "^17.0.0 || ^18.0.0 || ^19.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/utils/node_modules/react-is": { + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.0.0.tgz", + "integrity": "sha512-H91OHcwjZsbq3ClIDHMzBShc1rotbfACdWENsmEf0IFvZ3FgGPtdHMcsv45bQ1hAbgdfiA8SnxTKfDS+x/8m2g==", + "license": "MIT" + }, + "node_modules/@popperjs/core": { + "version": "2.11.8", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@rollup/rollup-android-arm-eabi": { "version": "4.30.1", "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.30.1.tgz", @@ -622,7 +1322,6 @@ "cpu": [ "arm" ], - "dev": true, "optional": true, "os": [ "android" @@ -635,7 +1334,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "android" @@ -648,7 +1346,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "darwin" @@ -661,7 +1358,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "darwin" @@ -674,7 +1370,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "freebsd" @@ -687,7 +1382,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "freebsd" @@ -700,7 +1394,6 @@ "cpu": [ "arm" ], - "dev": true, "optional": true, "os": [ "linux" @@ -713,7 +1406,6 @@ "cpu": [ "arm" ], - "dev": true, "optional": true, "os": [ "linux" @@ -726,7 +1418,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -739,7 +1430,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -752,7 +1442,6 @@ "cpu": [ "loong64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -765,7 +1454,6 @@ "cpu": [ "ppc64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -778,7 +1466,6 @@ "cpu": [ "riscv64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -791,7 +1478,6 @@ "cpu": [ "s390x" ], - "dev": true, "optional": true, "os": [ "linux" @@ -804,7 +1490,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -817,7 +1502,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "linux" @@ -830,7 +1514,6 @@ "cpu": [ "arm64" ], - "dev": true, "optional": true, "os": [ "win32" @@ -843,7 +1526,6 @@ "cpu": [ "ia32" ], - "dev": true, "optional": true, "os": [ "win32" @@ -856,7 +1538,6 @@ "cpu": [ "x64" ], - "dev": true, "optional": true, "os": [ "win32" @@ -1072,14 +1753,54 @@ "integrity": "sha512-V5gRru+aD8YVyCOMAjMpWR1Ui577DD5KSJsHP8RAxopAH22jFz6GZd/qxqjO6MJHQhcsjvjOFXyDhyLQUnMveQ==", "dev": true, "dependencies": { - "@swc/counter": "^0.1.3" + "@swc/counter": "^0.1.3" + } + }, + "node_modules/@types/babel__core": { + "version": "7.20.5", + "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", + "integrity": "sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==", + "license": "MIT", + "dependencies": { + "@babel/parser": "^7.20.7", + "@babel/types": "^7.20.7", + "@types/babel__generator": "*", + "@types/babel__template": "*", + "@types/babel__traverse": "*" + } + }, + "node_modules/@types/babel__generator": { + "version": "7.6.8", + "resolved": "https://registry.npmjs.org/@types/babel__generator/-/babel__generator-7.6.8.tgz", + "integrity": "sha512-ASsj+tpEDsEiFr1arWrlN6V3mdfjRMZt6LtK/Vp/kreFLnr5QH5+DhvD5nINYZXzwJvXeGq+05iUXcAzVrqWtw==", + "license": "MIT", + "dependencies": { + "@babel/types": "^7.0.0" + } + }, + "node_modules/@types/babel__template": { + "version": "7.4.4", + "resolved": "https://registry.npmjs.org/@types/babel__template/-/babel__template-7.4.4.tgz", + "integrity": "sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==", + "license": "MIT", + "dependencies": { + "@babel/parser": "^7.1.0", + "@babel/types": "^7.0.0" + } + }, + "node_modules/@types/babel__traverse": { + "version": "7.20.6", + "resolved": "https://registry.npmjs.org/@types/babel__traverse/-/babel__traverse-7.20.6.tgz", + "integrity": "sha512-r1bzfrm0tomOI8g1SzvCaQHo6Lcv6zu0EA+W2kHrt8dyrHQxGzBBL4kdkzIS+jBMV+EYcMAEAqXqYaLJq5rOZg==", + "license": "MIT", + "dependencies": { + "@babel/types": "^7.20.7" } }, "node_modules/@types/estree": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.6.tgz", - "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==", - "dev": true + "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==" }, "node_modules/@types/json-schema": { "version": "7.0.15", @@ -1087,17 +1808,20 @@ "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", "dev": true }, + "node_modules/@types/parse-json": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.2.tgz", + "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==" + }, "node_modules/@types/prop-types": { "version": "15.7.14", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz", - "integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ==", - "dev": true + "integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ==" }, "node_modules/@types/react": { "version": "18.3.18", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.18.tgz", "integrity": "sha512-t4yC+vtgnkYjNSKlFx1jkAhH8LgTo2N/7Qvi83kdEaUtMDiwpbLAktKDaAMlRcJ5eSxZkH74eEGt1ky31d7kfQ==", - "dev": true, "dependencies": { "@types/prop-types": "*", "csstype": "^3.0.2" @@ -1112,6 +1836,33 @@ "@types/react": "^18.0.0" } }, + "node_modules/@types/react-transition-group": { + "version": "4.4.12", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.12.tgz", + "integrity": "sha512-8TV6R3h2j7a91c+1DXdJi3Syo69zzIZbz7Lg5tORM5LEJG7X/E6a1V3drRyBRZq7/utz7A+c4OgYLiLcYGHG6w==", + "peerDependencies": { + "@types/react": "*" + } + }, + "node_modules/@vitejs/plugin-react": { + "version": "4.3.4", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.4.tgz", + "integrity": "sha512-SCCPBJtYLdE8PX/7ZQAs1QAZ8Jqwih+0VBLum1EGqmCCQal+MIUqLCzj3ZUy8ufbC0cAM4LRlSTm7IQJwWT4ug==", + "license": "MIT", + "dependencies": { + "@babel/core": "^7.26.0", + "@babel/plugin-transform-react-jsx-self": "^7.25.9", + "@babel/plugin-transform-react-jsx-source": "^7.25.9", + "@types/babel__core": "^7.20.5", + "react-refresh": "^0.14.2" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "peerDependencies": { + "vite": "^4.2.0 || ^5.0.0 || ^6.0.0" + } + }, "node_modules/@vitejs/plugin-react-swc": { "version": "3.7.2", "resolved": "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-3.7.2.tgz", @@ -1311,6 +2062,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/asynckit": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz", + "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" + }, "node_modules/available-typed-arrays": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz", @@ -1326,6 +2082,50 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/axios": { + "version": "1.7.9", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.9.tgz", + "integrity": "sha512-LhLcE7Hbiryz8oMDdDptSrWowmB4Bl6RCt6sIJKpRB4XtVf0iEgewX3au/pJqm+Py1kCASkb/FFKjxQaLtxJvw==", + "license": "MIT", + "dependencies": { + "follow-redirects": "^1.15.6", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, + "node_modules/babel-plugin-macros": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-3.1.0.tgz", + "integrity": "sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "cosmiconfig": "^7.0.0", + "resolve": "^1.19.0" + }, + "engines": { + "node": ">=10", + "npm": ">=6" + } + }, + "node_modules/babel-plugin-macros/node_modules/resolve": { + "version": "1.22.10", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.10.tgz", + "integrity": "sha512-NPRy+/ncIMeDlTAsuqwKIiferiawhefFJtkNSW0qZJEqMEb+qBt/77B/jGeeek+F0uOeN05CDa6HXbbIgtVX4w==", + "dependencies": { + "is-core-module": "^2.16.0", + "path-parse": "^1.0.7", + "supports-preserve-symlinks-flag": "^1.0.0" + }, + "bin": { + "resolve": "bin/resolve" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/balanced-match": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", @@ -1342,6 +2142,38 @@ "concat-map": "0.0.1" } }, + "node_modules/browserslist": { + "version": "4.24.4", + "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.24.4.tgz", + "integrity": "sha512-KDi1Ny1gSePi1vm0q4oxSF8b4DR44GF4BbmS2YdhPLOEqd8pDviZOGH/GsmRwoWJ2+5Lr085X7naowMwKHDG1A==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/browserslist" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/browserslist" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "caniuse-lite": "^1.0.30001688", + "electron-to-chromium": "^1.5.73", + "node-releases": "^2.0.19", + "update-browserslist-db": "^1.1.1" + }, + "bin": { + "browserslist": "cli.js" + }, + "engines": { + "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" + } + }, "node_modules/call-bind": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz", @@ -1393,11 +2225,30 @@ "version": "3.1.0", "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==", - "dev": true, "engines": { "node": ">=6" } }, + "node_modules/caniuse-lite": { + "version": "1.0.30001695", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001695.tgz", + "integrity": "sha512-vHyLade6wTgI2u1ec3WQBxv+2BrTERV28UXQu9LO6lZ9pYeMk34vjXFLOxo1A4UBA8XTL4njRQZdno/yYaSmWw==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/browserslist" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/caniuse-lite" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "CC-BY-4.0" + }, "node_modules/chalk": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", @@ -1414,6 +2265,15 @@ "url": "https://github.com/chalk/chalk?sponsor=1" } }, + "node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/color-convert": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", @@ -1432,12 +2292,51 @@ "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", "dev": true }, + "node_modules/combined-stream": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz", + "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==", + "dependencies": { + "delayed-stream": "~1.0.0" + }, + "engines": { + "node": ">= 0.8" + } + }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", "dev": true }, + "node_modules/convert-source-map": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz", + "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==" + }, + "node_modules/cosmiconfig": { + "version": "7.1.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz", + "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==", + "dependencies": { + "@types/parse-json": "^4.0.0", + "import-fresh": "^3.2.1", + "parse-json": "^5.0.0", + "path-type": "^4.0.0", + "yaml": "^1.10.0" + }, + "engines": { + "node": ">=10" + } + }, + "node_modules/cosmiconfig/node_modules/yaml": { + "version": "1.10.2", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", + "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==", + "engines": { + "node": ">= 6" + } + }, "node_modules/cross-spawn": { "version": "7.0.6", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", @@ -1455,8 +2354,7 @@ "node_modules/csstype": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "dev": true + "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" }, "node_modules/data-view-buffer": { "version": "1.0.2", @@ -1513,7 +2411,6 @@ "version": "4.4.0", "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz", "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==", - "dev": true, "dependencies": { "ms": "^2.1.3" }, @@ -1566,6 +2463,14 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/delayed-stream": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", + "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==", + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/doctrine": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz", @@ -1578,6 +2483,15 @@ "node": ">=0.10.0" } }, + "node_modules/dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "dependencies": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "node_modules/dunder-proto": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz", @@ -1592,6 +2506,20 @@ "node": ">= 0.4" } }, + "node_modules/electron-to-chromium": { + "version": "1.5.88", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.88.tgz", + "integrity": "sha512-K3C2qf1o+bGzbilTDCTBhTQcMS9KW60yTAaTeeXsfvQuTDDwlokLam/AdqlqcSy9u4UainDgsHV23ksXAOgamw==", + "license": "ISC" + }, + "node_modules/error-ex": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz", + "integrity": "sha512-7dFHNmqeFSEt2ZBsCriorKnn3Z2pj+fd9kmI6QoWw4//DL+icEBfc0U7qJCisqrTsKTjw4fNFy2pW9OqStD84g==", + "dependencies": { + "is-arrayish": "^0.2.1" + } + }, "node_modules/es-abstract": { "version": "1.23.9", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.9.tgz", @@ -1759,7 +2687,6 @@ "version": "0.24.2", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.24.2.tgz", "integrity": "sha512-+9egpBW8I3CD5XPe0n6BfT5fxLzxrlDzqydF3aviG+9ni1lDC/OvMHcxqEFV0+LANZG5R1bFMWfUrjVsdwxJvA==", - "dev": true, "hasInstallScript": true, "bin": { "esbuild": "bin/esbuild" @@ -1795,11 +2722,19 @@ "@esbuild/win32-x64": "0.24.2" } }, + "node_modules/escalade": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz", + "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==", + "license": "MIT", + "engines": { + "node": ">=6" + } + }, "node_modules/escape-string-regexp": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", - "dev": true, "engines": { "node": ">=10" }, @@ -2036,6 +2971,11 @@ "node": ">=16.0.0" } }, + "node_modules/find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -2071,6 +3011,25 @@ "integrity": "sha512-AiwGJM8YcNOaobumgtng+6NHuOqC3A7MixFeDafM3X9cIUM+xUXoS5Vfgf+OihAYe20fxqNM9yPBXJzRtZ/4eA==", "dev": true }, + "node_modules/follow-redirects": { + "version": "1.15.9", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.9.tgz", + "integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==", + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/RubenVerborgh" + } + ], + "engines": { + "node": ">=4.0" + }, + "peerDependenciesMeta": { + "debug": { + "optional": true + } + } + }, "node_modules/for-each": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", @@ -2080,11 +3039,23 @@ "is-callable": "^1.1.3" } }, + "node_modules/form-data": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.1.tgz", + "integrity": "sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/fsevents": { "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", - "dev": true, "hasInstallScript": true, "optional": true, "os": [ @@ -2098,7 +3069,6 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", - "dev": true, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -2132,6 +3102,15 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/gensync": { + "version": "1.0.0-beta.2", + "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz", + "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==", + "license": "MIT", + "engines": { + "node": ">=6.9.0" + } + }, "node_modules/get-intrinsic": { "version": "1.2.7", "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.7.tgz", @@ -2317,7 +3296,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==", - "dev": true, "dependencies": { "function-bind": "^1.1.2" }, @@ -2325,6 +3303,14 @@ "node": ">= 0.4" } }, + "node_modules/hoist-non-react-statics": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", + "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "dependencies": { + "react-is": "^16.7.0" + } + }, "node_modules/ignore": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", @@ -2338,7 +3324,6 @@ "version": "3.3.0", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz", "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==", - "dev": true, "dependencies": { "parent-module": "^1.0.0", "resolve-from": "^4.0.0" @@ -2390,6 +3375,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-arrayish": { + "version": "0.2.1", + "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", + "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==" + }, "node_modules/is-async-function": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.0.tgz", @@ -2455,7 +3445,6 @@ "version": "2.16.1", "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz", "integrity": "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==", - "dev": true, "dependencies": { "hasown": "^2.0.2" }, @@ -2763,12 +3752,28 @@ "js-yaml": "bin/js-yaml.js" } }, + "node_modules/jsesc": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz", + "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==", + "bin": { + "jsesc": "bin/jsesc" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/json-buffer": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz", "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==", "dev": true }, + "node_modules/json-parse-even-better-errors": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz", + "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==" + }, "node_modules/json-schema-traverse": { "version": "0.4.1", "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", @@ -2781,6 +3786,18 @@ "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==", "dev": true }, + "node_modules/json5": { + "version": "2.2.3", + "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz", + "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==", + "license": "MIT", + "bin": { + "json5": "lib/cli.js" + }, + "engines": { + "node": ">=6" + } + }, "node_modules/jsx-ast-utils": { "version": "3.3.5", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz", @@ -2818,6 +3835,11 @@ "node": ">= 0.8.0" } }, + "node_modules/lines-and-columns": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz", + "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==" + }, "node_modules/locate-path": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", @@ -2850,6 +3872,15 @@ "loose-envify": "cli.js" } }, + "node_modules/lru-cache": { + "version": "5.1.1", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", + "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==", + "license": "ISC", + "dependencies": { + "yallist": "^3.0.2" + } + }, "node_modules/math-intrinsics": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz", @@ -2859,6 +3890,25 @@ "node": ">= 0.4" } }, + "node_modules/mime-db": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", + "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==", + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/mime-types": { + "version": "2.1.35", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", + "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==", + "dependencies": { + "mime-db": "1.52.0" + }, + "engines": { + "node": ">= 0.6" + } + }, "node_modules/minimatch": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", @@ -2874,14 +3924,12 @@ "node_modules/ms": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", - "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", - "dev": true + "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==" }, "node_modules/nanoid": { "version": "3.3.8", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.8.tgz", "integrity": "sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==", - "dev": true, "funding": [ { "type": "github", @@ -2901,11 +3949,16 @@ "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==", "dev": true }, + "node_modules/node-releases": { + "version": "2.0.19", + "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz", + "integrity": "sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==", + "license": "MIT" + }, "node_modules/object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -3069,7 +4122,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==", - "dev": true, "dependencies": { "callsites": "^3.0.0" }, @@ -3077,6 +4129,23 @@ "node": ">=6" } }, + "node_modules/parse-json": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz", + "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==", + "dependencies": { + "@babel/code-frame": "^7.0.0", + "error-ex": "^1.3.1", + "json-parse-even-better-errors": "^2.3.0", + "lines-and-columns": "^1.1.6" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/path-exists": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", @@ -3098,14 +4167,20 @@ "node_modules/path-parse": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", - "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==", - "dev": true + "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==" + }, + "node_modules/path-type": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", + "engines": { + "node": ">=8" + } }, "node_modules/picocolors": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", - "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==", - "dev": true + "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==" }, "node_modules/possible-typed-array-names": { "version": "1.0.0", @@ -3120,7 +4195,6 @@ "version": "8.4.49", "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.49.tgz", "integrity": "sha512-OCVPnIObs4N29kxTjzLfUryOkvZEq+pf8jTF0lg8E7uETuWHA+v7j3c/xJmiqpX450191LlmZfUKkXxkTry7nA==", - "dev": true, "funding": [ { "type": "opencollective", @@ -3157,13 +4231,17 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", - "dev": true, "dependencies": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", "react-is": "^16.13.1" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "node_modules/punycode": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz", @@ -3199,8 +4277,31 @@ "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", - "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true + "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" + }, + "node_modules/react-refresh": { + "version": "0.14.2", + "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.2.tgz", + "integrity": "sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==", + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/react-transition-group": { + "version": "4.4.5", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", + "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", + "dependencies": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "peerDependencies": { + "react": ">=16.6.0", + "react-dom": ">=16.6.0" + } }, "node_modules/reflect.getprototypeof": { "version": "1.0.10", @@ -3224,6 +4325,11 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/regenerator-runtime": { + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", + "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==" + }, "node_modules/regexp.prototype.flags": { "version": "1.5.4", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz", @@ -3265,7 +4371,6 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==", - "dev": true, "engines": { "node": ">=4" } @@ -3274,7 +4379,6 @@ "version": "4.30.1", "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.30.1.tgz", "integrity": "sha512-mlJ4glW020fPuLi7DkM/lN97mYEZGWeqBnrljzN0gs7GLctqX3lNWxKQ7Gl712UAX+6fog/L3jh4gb7R6aVi3w==", - "dev": true, "dependencies": { "@types/estree": "1.0.6" }, @@ -3372,7 +4476,6 @@ "version": "6.3.1", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", - "dev": true, "bin": { "semver": "bin/semver.js" } @@ -3516,11 +4619,18 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==", + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/source-map-js": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", - "dev": true, "engines": { "node": ">=0.10.0" } @@ -3630,6 +4740,11 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/stylis": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz", + "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==" + }, "node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", @@ -3646,7 +4761,6 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", - "dev": true, "engines": { "node": ">= 0.4" }, @@ -3758,6 +4872,36 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/update-browserslist-db": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.2.tgz", + "integrity": "sha512-PPypAm5qvlD7XMZC3BujecnaOxwhrtoFR+Dqkk5Aa/6DssiH0ibKoketaj9w8LP7Bont1rYeoV5plxD7RTEPRg==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/browserslist" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/browserslist" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "escalade": "^3.2.0", + "picocolors": "^1.1.1" + }, + "bin": { + "update-browserslist-db": "cli.js" + }, + "peerDependencies": { + "browserslist": ">= 4.21.0" + } + }, "node_modules/uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", @@ -3768,10 +4912,10 @@ } }, "node_modules/vite": { - "version": "6.0.7", - "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.7.tgz", - "integrity": "sha512-RDt8r/7qx9940f8FcOIAH9PTViRrghKaK2K1jY3RaAURrEUbm9Du1mJ72G+jlhtG3WwodnfzY8ORQZbBavZEAQ==", - "dev": true, + "version": "6.0.11", + "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.11.tgz", + "integrity": "sha512-4VL9mQPKoHy4+FE0NnRE/kbY51TOfaknxAjt3fJbGJxhIpBZiqVzlZDEesWWsuREXHwNdAoOFZ9MkPEVXczHwg==", + "license": "MIT", "dependencies": { "esbuild": "^0.24.2", "postcss": "^8.4.49", @@ -3946,6 +5090,25 @@ "node": ">=0.10.0" } }, + "node_modules/yallist": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz", + "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==", + "license": "ISC" + }, + "node_modules/yaml": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.7.0.tgz", + "integrity": "sha512-+hSoy/QHluxmC9kCIJyL/uyFmLmc+e5CFR5Wa+bpIhIj85LVb9ZH2nVnqrHoSvKogwODv0ClqZkmiSSaIH5LTA==", + "optional": true, + "peer": true, + "bin": { + "yaml": "bin.mjs" + }, + "engines": { + "node": ">= 14" + } + }, "node_modules/yocto-queue": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", diff --git a/frontend/pronunciationAppFront/package.json b/frontend/pronunciationAppFront/package.json index 19d0c456f..9af6387c6 100644 --- a/frontend/pronunciationAppFront/package.json +++ b/frontend/pronunciationAppFront/package.json @@ -10,6 +10,13 @@ "preview": "vite preview" }, "dependencies": { + "@emotion/react": "^11.14.0", + "@emotion/styled": "^11.14.0", + "@fontsource/roboto": "^5.1.1", + "@mui/icons-material": "^6.4.0", + "@mui/material": "^6.4.1", + "@vitejs/plugin-react": "^4.3.4", + "axios": "^1.7.9", "react": "^18.3.1", "react-dom": "^18.3.1" }, @@ -23,6 +30,6 @@ "eslint-plugin-react-hooks": "^5.0.0", "eslint-plugin-react-refresh": "^0.4.16", "globals": "^15.14.0", - "vite": "^6.0.5" + "vite": "^6.0.11" } } diff --git a/frontend/pronunciationAppFront/src/App.css b/frontend/pronunciationAppFront/src/App.css index b9d355df2..d7882d451 100644 --- a/frontend/pronunciationAppFront/src/App.css +++ b/frontend/pronunciationAppFront/src/App.css @@ -5,38 +5,7 @@ text-align: center; } -.logo { - height: 6em; - padding: 1.5em; - will-change: filter; - transition: filter 300ms; -} -.logo:hover { - filter: drop-shadow(0 0 2em #646cffaa); -} -.logo.react:hover { - filter: drop-shadow(0 0 2em #61dafbaa); -} - -@keyframes logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } -} -@media (prefers-reduced-motion: no-preference) { - a:nth-of-type(2) .logo { - animation: logo-spin infinite 20s linear; - } -} - -.card { - padding: 2em; -} - -.read-the-docs { - color: #888; -} +ul { + list-style-type: none; +} \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/App.jsx b/frontend/pronunciationAppFront/src/App.jsx index f67355ae0..181bb4580 100644 --- a/frontend/pronunciationAppFront/src/App.jsx +++ b/frontend/pronunciationAppFront/src/App.jsx @@ -1,35 +1,26 @@ -import { useState } from 'react' -import reactLogo from './assets/react.svg' -import viteLogo from '/vite.svg' import './App.css' +import Cards from "./Cards.jsx" +import UsersList from './users.jsx'; +import Header from "./Header.jsx"; +import About from './about.jsx' +import layout from './Layout.jsx'; +import nopage from './noPage.jsx'; +import Practice from './Practice.jsx'; +import { Route } from '@mui/icons-material'; -function App() { - const [count, setCount] = useState(0) +export default function App() { - return ( - <> -
- - Vite logo - - - React logo - -
-

Vite + React

-
- -

- Edit src/App.jsx and save to test HMR -

-
-

- Click on the Vite and React logos to learn more -

- - ) -} +return( + + + }> + } /> + } /> + } /> + }/> + + + +); -export default App +}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/BoxAnimation.css b/frontend/pronunciationAppFront/src/BoxAnimation.css new file mode 100644 index 000000000..47599cbeb --- /dev/null +++ b/frontend/pronunciationAppFront/src/BoxAnimation.css @@ -0,0 +1,23 @@ +@keyframes backgroundAnimation { + 0% { + background-position: 0% 50%; + } + 50% { + background-position: 100% 50%; + } + 100% { + background-position: 0% 50%; + } + } + + .animated-box { + background: linear-gradient(90deg, #ff7e5f, #feb47b, #86e3ce, #d4a5a5); + background-size: 300% 300%; + animation: backgroundAnimation 6s ease infinite; + } + .animated-box:hover { + background: linear-gradient(90deg, #ff7e5f, #feb47b, #86e3ce, #d4a5a5); + background-size: 300% 300%; + animation: backgroundAnimation 0.5s ease infinite; + transform: scale(1.1); + } \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/Cards.css b/frontend/pronunciationAppFront/src/Cards.css new file mode 100644 index 000000000..e08ec7521 --- /dev/null +++ b/frontend/pronunciationAppFront/src/Cards.css @@ -0,0 +1,8 @@ +.card { + transition: transform 0.3s ease-in-out; + } + + .card:hover { + transform: scale(1.05); + } + \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/Cards.jsx b/frontend/pronunciationAppFront/src/Cards.jsx new file mode 100644 index 000000000..36ec28e88 --- /dev/null +++ b/frontend/pronunciationAppFront/src/Cards.jsx @@ -0,0 +1,154 @@ +import { useState, useEffect } from "react"; +import { + Box, + Card, + CardContent, + Typography, + Container, + Grid, + Button, + Tabs, + Tab, +} from "@mui/material"; + +import { fetchWords } from "./data-api.js"; + +// Componente de la pestaña +function TabPanel(props) { + const { children, value, index, ...other } = props; + + return ( + + ); +} + +export default function WordList() { + const [words, setWords] = useState([]); + const [filteredWords, setFilteredWords] = useState([]); + const [level, setLevel] = useState("ALL"); + const [tabValue, setTabValue] = useState(0); // Estado para manejar las pestañas + + useEffect(() => { + const getWords = async () => { + try { + const data = await fetchWords(); + setWords(data); + setFilteredWords(data); + } catch (error) { + console.error("Failed to fetch words:", error); + } + }; + + getWords(); + }, []); + + // filtro de la dificultad + const handleFilter = (level) => { + setLevel(level); + if (level === "ALL") { + setFilteredWords(words); + } else { + const filtered = words.filter((word) => word.level === level); + setFilteredWords(filtered); + } + }; + + // cambio de pestaña + const handleTabChange = (event, newValue) => { + setTabValue(newValue); + }; + + return ( + + + + Word Filter + + + {/* Botones para filtrar */} +
+ + + + +
+ + {/* Lista de palabras */} + + {filteredWords.map((word) => ( + + + + + {word.word} + + + + + + + + Pronunciation: {word.pronunciation}
+ Phonetic: {word.phonetic}
+ Theme: {word.theme}
+ Level: {word.level} + + + + + Synonyms: {word.synonym} + + + + + + ))} + + + + ); +} \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/Doc.md b/frontend/pronunciationAppFront/src/Doc.md new file mode 100644 index 000000000..b642b2a8b --- /dev/null +++ b/frontend/pronunciationAppFront/src/Doc.md @@ -0,0 +1,157 @@ + +# PronunciationApp v0.1 + +## Project Description + +PronunciationApp is an application designed to help users improve their English pronunciation. The app uses a combination of modern technologies such as React, Material-UI, and Axios to provide a smooth and attractive user experience. + +## Technologies Used + +- **React**: JavaScript library for building user interfaces. +- **Material-UI (MUI)**: React component library for design and styles. +- **Axios**: HTTP client for making API requests. +- **Postman Mock Server**: Mock server for testing and development without a real backend. +- **Hooks**: For state management and side effects in React. + +## Installation + +To install and run the project locally, follow these steps: + +1. **Clone the repository**: + ```bash + git clone https://github.com/your-username/pronunciationApp.git + cd pronunciationApp + ``` + +2. **Install dependencies**: + ```bash + npm install + ``` + +3. **Start the development server**: + ```bash + npm run dev + ``` + +4. **Open the application** in your browser: + ``` + http://localhost:3000 + ``` + +## Project Structure + +- **`src/App.jsx`**: Main component of the application. +- **`src/Cards.jsx`**: Component that displays word cards with their pronunciation. +- **`src/Header.jsx`**: Component that displays the welcome section and user profile. +- **`src/data-api.js`**: Module that handles API requests. +- **`src/index.css`**: Global styles for the application. +- **`src/BoxAnimation.css`**: CSS animations for components. + +## Using Material-UI + +To use Material-UI in the project, the following packages have been installed: + +```bash +npm install @mui/material @emotion/react @emotion/styled @mui/icons-material @fontsource/roboto +``` + +### Example of Using a Material-UI Component + +```jsx +import React from 'react'; +import Button from '@mui/material/Button'; + +function App() { + return ( + + ); +} + +export default App; +``` + +## Using Axios for Data Fetching + +The project uses Axios to make HTTP requests to a Postman mock server. Here is an example of how to make a request: + +```jsx +import axios from "axios"; + +const BASE_URL = "https://c7a98a5b-adbe-4893-ac26-6ea827cccc21.mock.pstmn.io/"; + +export const fetchWords = async () => { + try { + const response = await axios.get(`${BASE_URL}/list`); + return response.data.words; + } catch (error) { + console.error("Error fetching words:", error); + throw error; + } +}; +``` + +## Data Flow + +1. **Postman Mock Server**: Simulates an API endpoint, providing predefined responses. +2. **Axios**: Makes an HTTP GET request to the mock server. +3. **useEffect**: Triggers the Axios request when the component mounts. +4. **useState**: Stores the fetched data in the component's state. +5. **words.map()**: Iterates over the array of words stored in the state. +6. **Render**: Displays each word as a Material-UI Card component in the user interface. + +## Example of Rendering Cards + +```jsx +import React, { useState, useEffect } from 'react'; +import { fetchWords } from './data-api'; +import { Card, CardContent, Typography, Container, Grid } from '@mui/material'; + +export default function WordList() { + const [words, setWords] = useState([]); + + useEffect(() => { + const getWords = async () => { + try { + const data = await fetchWords(); + setWords(data); + } catch (error) { + console.error('Failed to fetch words:', error); + } + }; + + getWords(); + }, []); + + return ( + + + {words.map((word) => ( + + + + + {word.word} + + + Pronunciation: {word.pronunciation} + + + + + ))} + + + ); +} +``` + +## More info. + +This document provides an overview of the project, its structure, and tech used. For more details, see the specific files in the repository. +``` + +``` +This document was made with the help of DeepSeek. + diff --git a/frontend/pronunciationAppFront/src/Header.jsx b/frontend/pronunciationAppFront/src/Header.jsx new file mode 100644 index 000000000..7300460ea --- /dev/null +++ b/frontend/pronunciationAppFront/src/Header.jsx @@ -0,0 +1,33 @@ +export default function HeroSection(){ + + +return ( + <> +

Learn English once and for all

+
+

Practice Real-World Conversations

+ Practice Real-World Conversations + +
+ +); + + +} \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/Layout.jsx b/frontend/pronunciationAppFront/src/Layout.jsx new file mode 100644 index 000000000..7067d6f09 --- /dev/null +++ b/frontend/pronunciationAppFront/src/Layout.jsx @@ -0,0 +1,49 @@ +import {Link, Outlet} from "react-router-dom"; +import { AppBar, Toolbar, Typography, Button, Container } from "@mui/material"; +import {styled} from "@mui/material"; + + +const StyledLink = styled(Link)({ + color : "#4b6cb7", + textDecoration: "none", + marginLef: "20px", + "&:hover":{ + color:"#FFFFF", + }, +}); + +export default function layout(){ + return( + <> + + + + + Pronunciation App + + + + + + + + {""} + + + + ); +} \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/Practice.jsx b/frontend/pronunciationAppFront/src/Practice.jsx new file mode 100644 index 000000000..efbae33df --- /dev/null +++ b/frontend/pronunciationAppFront/src/Practice.jsx @@ -0,0 +1,13 @@ +import Cards from './Cards' + +export default function Practice (){ + + + return( + <> + {""} +

Practice

+ + + + )}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/about.jsx b/frontend/pronunciationAppFront/src/about.jsx new file mode 100644 index 000000000..7911812a1 --- /dev/null +++ b/frontend/pronunciationAppFront/src/about.jsx @@ -0,0 +1,3 @@ +export default function About(){ + return

About

+}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/assets/Flag_of_the_United_Kingdom.gif b/frontend/pronunciationAppFront/src/assets/Flag_of_the_United_Kingdom.gif new file mode 100644 index 000000000..69ff27b39 Binary files /dev/null and b/frontend/pronunciationAppFront/src/assets/Flag_of_the_United_Kingdom.gif differ diff --git a/frontend/pronunciationAppFront/src/assets/british.gif b/frontend/pronunciationAppFront/src/assets/british.gif new file mode 100644 index 000000000..11e614089 Binary files /dev/null and b/frontend/pronunciationAppFront/src/assets/british.gif differ diff --git a/frontend/pronunciationAppFront/src/assets/dancing.gif b/frontend/pronunciationAppFront/src/assets/dancing.gif new file mode 100644 index 000000000..70c7b5af6 Binary files /dev/null and b/frontend/pronunciationAppFront/src/assets/dancing.gif differ diff --git a/frontend/pronunciationAppFront/src/assets/list.json b/frontend/pronunciationAppFront/src/assets/list.json new file mode 100644 index 000000000..64e5d0b2f --- /dev/null +++ b/frontend/pronunciationAppFront/src/assets/list.json @@ -0,0 +1,404 @@ +{ + "words": [ + { + "id": 1, + "word": "Worcestershire", + "theme": "Places", + "level": "🔴 HARD", + "phonetic": "/ˈwʊs.tə.ʃɪə/", + "synonym": "County" + }, + { + "id": 2, + "word": "Anemone", + "theme": "Nature", + "level": "🟠 MEDIUM", + "phonetic": "/əˈnem.ə.ni/", + "synonym": "Sea flower" + }, + { + "id": 3, + "word": "Colonel", + "theme": "Ranks", + "level": "🔴 HARD", + "phonetic": "/ˈkɜːr.nəl/", + "synonym": "Officer" + }, + { + "id": 4, + "word": "Rural", + "theme": "Places", + "level": "🟠 MEDIUM", + "phonetic": "/ˈrʊə.rəl/", + "synonym": "Countryside" + }, + { + "id": 5, + "word": "Squirrel", + "theme": "Animals", + "level": "🔴 HARD", + "phonetic": "/ˈskwɪr.əl/", + "synonym": "Rodent" + }, + { + "id": 6, + "word": "February", + "theme": "Time", + "level": "🟠 MEDIUM", + "phonetic": "/ˈfeb.ruː.er.i/", + "synonym": "Month" + }, + { + "id": 7, + "word": "Quinoa", + "theme": "Food", + "level": "🟠 MEDIUM", + "phonetic": "/ˈkiːn.wɑː/", + "synonym": "Grain" + }, + { + "id": 8, + "word": "Coup", + "theme": "Politics", + "level": "🔴 HARD", + "phonetic": "/kuː/", + "synonym": "Overthrow" + }, + { + "id": 9, + "word": "Schedule", + "theme": "Work", + "level": "🟠 MEDIUM", + "phonetic": "/ˈʃed.juːl/ (UK), /ˈskedʒ.uːl/ (US)", + "synonym": "Timetable" + }, + { + "id": 10, + "word": "Penguin", + "theme": "Animals", + "level": "🟢 EASY", + "phonetic": "/ˈpɛŋ.ɡwɪn/", + "synonym": "Bird" + }, + { + "id": 11, + "word": "Debris", + "theme": "Nature", + "level": "🔴 HARD", + "phonetic": "/ˈdeɪ.briː/", + "synonym": "Rubble" + }, + { + "id": 12, + "word": "Enthusiasm", + "theme": "Feelings", + "level": "🟠 MEDIUM", + "phonetic": "/ɪnˈθjuː.zi.æz.əm/", + "synonym": "Excitement" + }, + { + "id": 13, + "word": "Gauge", + "theme": "Measurements", + "level": "🔴 HARD", + "phonetic": "/ɡeɪdʒ/", + "synonym": "Measure" + }, + { + "id": 14, + "word": "Mischievous", + "theme": "Behavior", + "level": "🔴 HARD", + "phonetic": "/ˈmɪs.tʃə.vəs/", + "synonym": "Naughty" + }, + { + "id": 15, + "word": "Onomatopoeia", + "theme": "Language", + "level": "🔴 HARD", + "phonetic": "/ˌɒn.əˌmæt.əˈpiː.ə/", + "synonym": "Sound word" + }, + { + "id": 16, + "word": "Epitome", + "theme": "Descriptions", + "level": "🔴 HARD", + "phonetic": "/ɪˈpɪt.ə.mi/", + "synonym": "Perfect example" + }, + { + "id": 17, + "word": "Choir", + "theme": "Music", + "level": "🔴 HARD", + "phonetic": "/kwaɪər/", + "synonym": "Chorus" + }, + { + "id": 18, + "word": "Plough", + "theme": "Agriculture", + "level": "🔴 HARD", + "phonetic": "/plaʊ/", + "synonym": "Tool" + }, + { + "id": 19, + "word": "Indict", + "theme": "Law", + "level": "🔴 HARD", + "phonetic": "/ɪnˈdaɪt/", + "synonym": "Accuse" + }, + { + "id": 20, + "word": "Hierarchy", + "theme": "Organizations", + "level": "🟠 MEDIUM", + "phonetic": "/ˈhaɪə.rɑː.ki/", + "synonym": "Ranking" + }, + { + "id": 21, + "word": "Yacht", + "theme": "Transport", + "level": "🔴 HARD", + "phonetic": "/jɒt/", + "synonym": "Boat" + }, + { + "id": 22, + "word": "Subtle", + "theme": "Descriptions", + "level": "🔴 HARD", + "phonetic": "/ˈsʌt.l/", + "synonym": "Delicate" + }, + { + "id": 23, + "word": "Sergeant", + "theme": "Ranks", + "level": "🟠 MEDIUM", + "phonetic": "/ˈsɑː.dʒənt/", + "synonym": "Officer" + }, + { + "id": 24, + "word": "Rendezvous", + "theme": "Meetings", + "level": "🔴 HARD", + "phonetic": "/ˈrɒn.deɪ.vuː/", + "synonym": "Meeting point" + }, + { + "id": 25, + "word": "Aisle", + "theme": "Places", + "level": "🔴 HARD", + "phonetic": "/aɪl/", + "synonym": "Corridor" + }, + { + "id": 26, + "word": "Hyperbole", + "theme": "Language", + "level": "🔴 HARD", + "phonetic": "/haɪˈpɜː.bəl.i/", + "synonym": "Exaggeration" + }, + { + "id": 27, + "word": "Anonymous", + "theme": "Identity", + "level": "🟠 MEDIUM", + "phonetic": "/əˈnɒn.ɪ.məs/", + "synonym": "Nameless" + }, + { + "id": 28, + "word": "Phenomenon", + "theme": "Science", + "level": "🔴 HARD", + "phonetic": "/fəˈnɒm.ɪ.nən/", + "synonym": "Event" + }, + { + "id": 29, + "word": "Cliché", + "theme": "Language", + "level": "🟠 MEDIUM", + "phonetic": "/ˈkliː.ʃeɪ/", + "synonym": "Overused idea" + }, + { + "id": 30, + "word": "Fuchsia", + "theme": "Colors", + "level": "🔴 HARD", + "phonetic": "/ˈfjuː.ʃə/", + "synonym": "Purple-pink" + }, + { + "id": 31, + "word": "Vicinity", + "theme": "Places", + "level": "🟠 MEDIUM", + "phonetic": "/vəˈsɪn.ɪ.ti/", + "synonym": "Nearby area" + }, + { + "id": 32, + "word": "Debut", + "theme": "Performances", + "level": "🟠 MEDIUM", + "phonetic": "/ˈdeɪ.bju/", + "synonym": "First appearance" + }, + { + "id": 33, + "word": "Cache", + "theme": "Technology", + "level": "🔴 HARD", + "phonetic": "/kæʃ/", + "synonym": "Storage" + }, + { + "id": 34, + "word": "Genre", + "theme": "Art", + "level": "🔴 HARD", + "phonetic": "/ˈʒɒn.rə/", + "synonym": "Category" + }, + { + "id": 35, + "word": "Debacle", + "theme": "Events", + "level": "🔴 HARD", + "phonetic": "/deɪˈbɑː.kl/", + "synonym": "Failure" + }, + { + "id": 36, + "word": "Sovereign", + "theme": "Politics", + "level": "🟠 MEDIUM", + "phonetic": "/ˈsɒv.rɪn/", + "synonym": "Monarch" + }, + { + "id": 37, + "word": "Entrepreneur", + "theme": "Business", + "level": "🔴 HARD", + "phonetic": "/ˌɒn.trə.prəˈnɜːr/", + "synonym": "Businessperson" + }, + { + "id": 38, + "word": "Genre", + "theme": "Art", + "level": "🔴 HARD", + "phonetic": "/ˈʒɒn.rə/", + "synonym": "Category" + }, + { + "id": 39, + "word": "Aesthetic", + "theme": "Art", + "level": "🟠 MEDIUM", + "phonetic": "/esˈθet.ɪk/", + "synonym": "Style" + }, + { + "id": 40, + "word": "Gnaw", + "theme": "Actions", + "level": "🔴 HARD", + "phonetic": "/nɔː/", + "synonym": "Chew" + }, + { + "id": 41, + "word": "Surveillance", + "theme": "Technology", + "level": "🔴 HARD", + "phonetic": "/sɜːˈveɪ.ləns/", + "synonym": "Monitoring" + }, + { + "id": 42, + "word": "Segue", + "theme": "Transitions", + "level": "🔴 HARD", + "phonetic": "/ˈseɡ.weɪ/", + "synonym": "Transition" + }, + { + "id": 43, + "word": "Fluorescent", + "theme": "Science", + "level": "🔴 HARD", + "phonetic": "/flɔːˈres.ənt/", + "synonym": "Glowing" + }, + { + "id": 44, + "word": "Vengeance", + "theme": "Revenge", + "level": "🟠 MEDIUM", + "phonetic": "/ˈven.dʒəns/", + "synonym": "Revenge" + }, + { + "id": 45, + "word": "Colonel", + "theme": "Ranks", + "level": "🔴 HARD", + "phonetic": "/ˈkɜːr.nəl/", + "synonym": "Officer" + }, + { + "id": 46, + "word": "Connoisseur", + "theme": "Expertise", + "level": "🔴 HARD", + "phonetic": "/ˌkɒn.əˈsɜːr/", + "synonym": "Expert" + }, + { + "id": 47, + "word": "Zucchini", + "theme": "Food", + "level": "🟠 MEDIUM", + "phonetic": "/zuːˈkiː.ni/", + "synonym": "Courgette" + }, + { + "id": 48, + "word": "Parliament", + "theme": "Politics", + "level": "🟠 MEDIUM", + "phonetic": "/ˈpɑː.lɪə.mənt/", + "synonym": "Government" + }, + { + "id": 49, + "word": "Acquiesce", + "theme": "Agreement", + "level": "🔴 HARD", + "phonetic": "/ˌæk.wiˈes/", + "synonym": "Comply" + }, + { + "id": 50, + "word": "Camouflage", + "theme": "Nature", + "level": "🟠 MEDIUM", + "phonetic": "/ˈkæm.ə.flɑːʒ/", + "synonym": "Concealment" + } + ] +} \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/assets/react.svg b/frontend/pronunciationAppFront/src/assets/react.svg deleted file mode 100644 index 6c87de9bb..000000000 --- a/frontend/pronunciationAppFront/src/assets/react.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/data-api.js b/frontend/pronunciationAppFront/src/data-api.js new file mode 100644 index 000000000..fdc0af630 --- /dev/null +++ b/frontend/pronunciationAppFront/src/data-api.js @@ -0,0 +1,23 @@ +import axios from "axios"; + +const BASE_URL = "https://c7a98a5b-adbe-4893-ac26-6ea827cccc21.mock.pstmn.io/"; + +export const fetchWords = async () => { + try { + const response = await axios.get(`${BASE_URL}/list`); + return response.data.words; + } catch (error) { + console.error("Error fetching words:", error); + throw error; + } +}; + +export const fetchUsers = async () => { + try { + const response = await axios.get(`${BASE_URL}/users`); + return response.data[0]; + } catch (error) { + console.error("Error fetching users:", error); + throw error; + } +}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/data-apilocal.js b/frontend/pronunciationAppFront/src/data-apilocal.js new file mode 100644 index 000000000..69163c0c5 --- /dev/null +++ b/frontend/pronunciationAppFront/src/data-apilocal.js @@ -0,0 +1,14 @@ +// api.js +import axios from "axios"; + + + +export const fetchWords = async () => { + try { + const response = await axios.get("./src/assets/list.json"); + return response.data.words; + } catch (error) { + console.error("Error fetching words:", error); + throw error; + } +}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/home.jsx b/frontend/pronunciationAppFront/src/home.jsx new file mode 100644 index 000000000..3d213ca64 --- /dev/null +++ b/frontend/pronunciationAppFront/src/home.jsx @@ -0,0 +1,14 @@ +import Header from './Header.jsx' + + +export default function home (){ + return( + <> +

Home

+

Welcome to Pronunciation App

+ + < Header/> + + + ) +}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/index.css b/frontend/pronunciationAppFront/src/index.css index 6119ad9a8..a725d7716 100644 --- a/frontend/pronunciationAppFront/src/index.css +++ b/frontend/pronunciationAppFront/src/index.css @@ -1,11 +1,10 @@ :root { - font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; + font-family: Inter, system-ui, Avenir, Roboto, Arial, sans-serif; line-height: 1.5; font-weight: 400; color-scheme: light dark; color: rgba(255, 255, 255, 0.87); - background-color: #242424; font-synthesis: none; text-rendering: optimizeLegibility; @@ -13,56 +12,32 @@ -moz-osx-font-smoothing: grayscale; } -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - body { margin: 0; + + background: linear-gradient(to right, #8e44ad, #3498db); + background-size: 200% 200%; + animation: gradient 15s ease infinite; display: flex; - place-items: center; - min-width: 320px; - min-height: 100vh; -} - -h1 { - font-size: 3.2em; - line-height: 1.1; -} - -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: #1a1a1a; - cursor: pointer; - transition: border-color 0.25s; -} -button:hover { - border-color: #646cff; -} -button:focus, -button:focus-visible { - outline: 4px auto -webkit-focus-ring-color; + justify-content: center; + align-items: center; + font-family: Arial, sans-serif; } -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; +@keyframes gradient { + 0% { + background-position: 0% 50%; } - a:hover { - color: #747bff; + 50% { + background-position: 100% 50%; } - button { - background-color: #f9f9f9; + 100% { + background-position: 0% 50%; } } + +h1 { + color: white; + text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); +} + diff --git a/frontend/pronunciationAppFront/src/main.jsx b/frontend/pronunciationAppFront/src/main.jsx index b9a1a6dea..4ec53d92f 100644 --- a/frontend/pronunciationAppFront/src/main.jsx +++ b/frontend/pronunciationAppFront/src/main.jsx @@ -2,6 +2,10 @@ import { StrictMode } from 'react' import { createRoot } from 'react-dom/client' import './index.css' import App from './App.jsx' +import "@fontsource/roboto/300.css"; +import "@fontsource/roboto/400.css"; +import "@fontsource/roboto/500.css"; +import "@fontsource/roboto/700.css"; createRoot(document.getElementById('root')).render( diff --git a/frontend/pronunciationAppFront/src/noPage.jsx b/frontend/pronunciationAppFront/src/noPage.jsx new file mode 100644 index 000000000..264b4e47b --- /dev/null +++ b/frontend/pronunciationAppFront/src/noPage.jsx @@ -0,0 +1,3 @@ +export default function nopage(){ + return

Page Not found. Error 404

+}; \ No newline at end of file diff --git a/frontend/pronunciationAppFront/src/users.jsx b/frontend/pronunciationAppFront/src/users.jsx new file mode 100644 index 000000000..088b545e5 --- /dev/null +++ b/frontend/pronunciationAppFront/src/users.jsx @@ -0,0 +1,69 @@ +import React, { useEffect, useState } from "react"; +import { fetchUsers } from "./data-api.js"; +import { Avatar, Box } from "@mui/material"; +import "./BoxAnimation.css"; + +export default function UsersList () { + const [users, setUsers] = useState([]); + const [loading, setLoading] = useState(true); + const [error, setError] = useState(null); + + useEffect(() => { + const getUsers = async () => { + try { + const data = await fetchUsers(); + setUsers(data); + } catch (err) { + setError("Error fetching users."); + } finally { + setLoading(false); + } + }; + + getUsers(); + }, []); + + if (loading) return

Loading users...

; + if (error) return

{error}

; + + return ( + +
+ + +

User:

+
    + + +

    {users.name}

    +

    {users.email}

    + + +
+ +
+ + ); +}; diff --git a/frontend/pronunciationAppFront/vite.config.js b/frontend/pronunciationAppFront/vite.config.js index 2328e170b..0466183af 100644 --- a/frontend/pronunciationAppFront/vite.config.js +++ b/frontend/pronunciationAppFront/vite.config.js @@ -1,7 +1,6 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react-swc' +import { defineConfig } from 'vite'; +import react from '@vitejs/plugin-react'; -// https://vite.dev/config/ export default defineConfig({ plugins: [react()], -}) +}); diff --git a/frontend/resources/CreateReactviteProject.md b/frontend/resources/create-React-vite/createReactviteProject.md similarity index 100% rename from frontend/resources/CreateReactviteProject.md rename to frontend/resources/create-React-vite/createReactviteProject.md diff --git a/frontend/resources/pronunciationAppFront-v0.0-project-structure.png b/frontend/resources/create-React-vite/pronunciationAppFront-v0.0-project-structure.png similarity index 100% rename from frontend/resources/pronunciationAppFront-v0.0-project-structure.png rename to frontend/resources/create-React-vite/pronunciationAppFront-v0.0-project-structure.png diff --git a/frontend/resources/pronunciationAppFront-v0.0-run-dev.png b/frontend/resources/create-React-vite/pronunciationAppFront-v0.0-run-dev.png similarity index 100% rename from frontend/resources/pronunciationAppFront-v0.0-run-dev.png rename to frontend/resources/create-React-vite/pronunciationAppFront-v0.0-run-dev.png diff --git a/frontend/resources/create-React-vite/pronunciationAppFront-v0.0-web-1.png b/frontend/resources/create-React-vite/pronunciationAppFront-v0.0-web-1.png new file mode 100644 index 000000000..653a20fa5 Binary files /dev/null and b/frontend/resources/create-React-vite/pronunciationAppFront-v0.0-web-1.png differ diff --git a/frontend/resources/pronunciationAppFront-v0.0-web.png b/frontend/resources/create-React-vite/pronunciationAppFront-v0.0-web.png similarity index 100% rename from frontend/resources/pronunciationAppFront-v0.0-web.png rename to frontend/resources/create-React-vite/pronunciationAppFront-v0.0-web.png diff --git a/frontend/resources/data-JSON/words.json b/frontend/resources/data-JSON/words.json new file mode 100644 index 000000000..863968d84 --- /dev/null +++ b/frontend/resources/data-JSON/words.json @@ -0,0 +1,54 @@ +{ + "words": [ + { + "id": "8b9248a4e0b64bbccf82e7723a3734279bf9bbc4", + "word": "benevolent", + "pronunciation": "/bɪˈnɛvələnt/" + }, + { + "id": "3a7bd3e2a07e8c7e9b6e0d2c1f4a5b8d9c0e3f2", + "word": "serendipity", + "pronunciation": "/ˌserənˈdɪpɪti/" + }, + { + "id": "5c9d7f3e1a2b4d6e8g0h9i7j6k5l4m3n2o1p", + "word": "ephemeral", + "pronunciation": "/ɪˈfɛmərəl/" + }, + { + "id": "2f4e6d8c0b2a4d6e8f0a2c4e6g8i0k2m4o6q", + "word": "ubiquitous", + "pronunciation": "/juːˈbɪkwɪtəs/" + }, + { + "id": "7h9j1l3n5p7r9t1v3x5z7b9d1f3h5j7l9n", + "word": "mellifluous", + "pronunciation": "/məˈlɪfluəs/" + }, + { + "id": "1a3c5e7g9i1k3m5o7q9s1u3w5y7a9c1e3", + "word": "eloquent", + "pronunciation": "/ˈɛləkwənt/" + }, + { + "id": "4b6d8f0h2j4l6n8p0r2t4v6x8z0b2d4f6", + "word": "quintessential", + "pronunciation": "/ˌkwɪntɪˈsenʃəl/" + }, + { + "id": "9k1m3o5q7s9u1w3y5a7c9e1g3i5k7m9o", + "word": "ethereal", + "pronunciation": "/ɪˈθɪəriəl/" + }, + { + "id": "2p4r6t8v0x2z4b6d8f0h2j4l6n8p0r2t", + "word": "surreptitious", + "pronunciation": "/ˌsʌrəpˈtɪʃəs/" + }, + { + "id": "5u7w9y1a3c5e7g9i1k3m5o7q9s1u3w5", + "word": "labyrinthine", + "pronunciation": "/ˌlæbəˈrɪnθaɪn/" + } + ] +} diff --git a/frontend/resources/material-ui/material-ui-install.md b/frontend/resources/material-ui/material-ui-install.md new file mode 100644 index 000000000..4d588e785 --- /dev/null +++ b/frontend/resources/material-ui/material-ui-install.md @@ -0,0 +1,61 @@ +# Material React UI + +To install Material-UI (now known as MUI) for React using npm, follow these steps: + +1. Open your terminal and navigate to your React project directory. + +2. Run the following command to install MUI and its peer dependencies: + +```bash +npm install @mui/material @emotion/react @emotion/styled +``` + +3. If you want to use icons, install the icons package: + +```bash +npm install @mui/icons-material +``` + +4. For optimal font loading, install Roboto font: + +```bash +npm install @fontsource/roboto +``` + +After installation, you can import and use MUI components in your React application. Here's a basic example of how to use a MUI component: + +```jsx +import React from 'react'; +import Button from '@mui/material/Button'; + +function App() { + return ( + + ); +} + +export default App; +``` + +Remember to import the Roboto font in your main `index.js` or `App.js` file: + +```jsx +import '@fontsource/roboto/300.css'; +import '@fontsource/roboto/400.css'; +import '@fontsource/roboto/500.css'; +import '@fontsource/roboto/700.css'; +``` + +This setup will allow you to use MUI components and styles in your React application[1][2][3]. + +Citations: +[1] https://v3.mui.com/getting-started/installation/ +[2] https://v5-0-6.mui.com/getting-started/installation/ +[3] https://mui.com/material-ui/getting-started/installation/ +[4] https://v4.mui.com/getting-started/installation/ +[5] https://www.educative.io/answers/how-to-install-material-ui-v5 +[6] https://www.npmjs.com/package/@mui/material +[7] https://v4.mui.com/es/getting-started/installation/ +[8] https://www.npmjs.com/package/@material-ui/core diff --git a/frontend/resources/pronunciationAppFront-v0.1-flow-data-1.png b/frontend/resources/pronunciationAppFront-v0.1-flow-data-1.png new file mode 100644 index 000000000..34e15a47d Binary files /dev/null and b/frontend/resources/pronunciationAppFront-v0.1-flow-data-1.png differ diff --git a/frontend/resources/pronunciationAppFront-v0.1-flow-data-2.png b/frontend/resources/pronunciationAppFront-v0.1-flow-data-2.png new file mode 100644 index 000000000..bbeee187a Binary files /dev/null and b/frontend/resources/pronunciationAppFront-v0.1-flow-data-2.png differ diff --git a/frontend/resources/pronunciationAppFront-v0.1-flow-data-3.png b/frontend/resources/pronunciationAppFront-v0.1-flow-data-3.png new file mode 100644 index 000000000..b39d8202e Binary files /dev/null and b/frontend/resources/pronunciationAppFront-v0.1-flow-data-3.png differ diff --git a/frontend/resources/pronunciationAppFront-v0.1-render-1-cards.png b/frontend/resources/pronunciationAppFront-v0.1-render-1-cards.png new file mode 100644 index 000000000..a9395cef5 Binary files /dev/null and b/frontend/resources/pronunciationAppFront-v0.1-render-1-cards.png differ diff --git a/frontend/resources/pronunciationAppFront-v0.1-render-2-cards.png b/frontend/resources/pronunciationAppFront-v0.1-render-2-cards.png new file mode 100644 index 000000000..4a0bf0ac0 Binary files /dev/null and b/frontend/resources/pronunciationAppFront-v0.1-render-2-cards.png differ diff --git a/frontend/resources/pronunciationAppFront-v0.1-render-3-cards.png b/frontend/resources/pronunciationAppFront-v0.1-render-3-cards.png new file mode 100644 index 000000000..15fe15340 Binary files /dev/null and b/frontend/resources/pronunciationAppFront-v0.1-render-3-cards.png differ diff --git a/frontend/resources/pronunciatonApp-v0.1.md b/frontend/resources/pronunciatonApp-v0.1.md new file mode 100644 index 000000000..df186c74f --- /dev/null +++ b/frontend/resources/pronunciatonApp-v0.1.md @@ -0,0 +1,146 @@ +# PronunciationApp v0.1 + +## Reference Lab + +- [Lab#RE06-1: healthyFood Restaurant – albertprofe wiki](https://albertprofe.dev/reactjs/rjslab6-1.html): with AWS workflow CD/CI deploy +- [Lab#RE01-1: API Rest Axios – albertprofe wiki](https://albertprofe.dev/reactjs/rjslab1.html): with Axios + +## Postman Mock Data Server + +> A **Postman mock server is a simulated API endpoint that mimics the behavior of a real server** without the need for a fully implemented backend. It allows developers to test and prototype APIs by returning predefined responses to requests. + +```js +const BASE_URL = 'https://a387bb02-2aa0-41a6-b8f7-9cc5247b9d5f.mock.pstmn.io'; +``` + +`Mock servers` are created from Postman collections, which contain saved examples of requests and responses. When a request is sent to the mock server, it matches the incoming request to the closest saved example and returns the corresponding response. + +- [Configure and use a Postman mock server | Postman Docs](https://learning.postman.com/docs/designing-and-developing-your-api/mocking-data/setting-up-mock/) + +These servers can be public or private, with private servers requiring an API key for access. They're useful for API development, testing, and simulating various scenarios without relying on a live backend. + +`Mock servers` can also simulate network delays and generate dynamic responses using variables and templates, enhancing the realism of API testing. They're particularly valuable in the early stages of API development, allowing frontend and backend teams to work concurrently without waiting for a fully functional API. + +### Fake data words + +```json +{ "words" : [ { "id": "8b9248a4e0b64bbccf82e7723a3734279bf9bbc4", "word": "benevolent", "pronunciation": "/bɪˈnɛvələnt/" }, { "id": "3a7bd3e2a07e8c7e9b6e0d2c1f4a5b8d9c0e3f2", "word": "serendipity", "pronunciation": "/ˌserənˈdɪpɪti/" }, { "id": "5c9d7f3e1a2b4d6e8g0h9i7j6k5l4m3n2o1p", "word": "ephemeral", "pronunciation": "/ɪˈfɛmərəl/" }, { "id": "2f4e6d8c0b2a4d6e8f0a2c4e6g8i0k2m4o6q", "word": "ubiquitous", "pronunciation": "/juːˈbɪkwɪtəs/" }, { "id": "7h9j1l3n5p7r9t1v3x5z7b9d1f3h5j7l9n", "word": "mellifluous", "pronunciation": "/məˈlɪfluəs/" }, { "id": "1a3c5e7g9i1k3m5o7q9s1u3w5y7a9c1e3", "word": "eloquent", "pronunciation": "/ˈɛləkwənt/" }, { "id": "4b6d8f0h2j4l6n8p0r2t4v6x8z0b2d4f6", "word": "quintessential", "pronunciation": "/ˌkwɪntɪˈsenʃəl/" }, { "id": "9k1m3o5q7s9u1w3y5a7c9e1g3i5k7m9o", "word": "ethereal", "pronunciation": "/ɪˈθɪəriəl/" }, { "id": "2p4r6t8v0x2z4b6d8f0h2j4l6n8p0r2t", "word": "surreptitious", "pronunciation": "/ˌsʌrəpˈtɪʃəs/" }, { "id": "5u7w9y1a3c5e7g9i1k3m5o7q9s1u3w5", "word": "labyrinthine", "pronunciation": "/ˌlæbəˈrɪnθaɪn/" } ]} +``` + +## Project + +### Tech stack + +Draft-sandbox coupled code using: + +- `Material UI`, + +- `Postam` Mock Data Server API endpoint, + +- `Axios` for data fetching, + +- `Hooks` for state management + +- and rendering the words + + - from the provided API endpoint using `map` js function + +This code combines the Material UI components with Axios for data fetching. It uses the `useState` and `useEffect` hooks to manage the state and side effects. The `fetchWords` function makes a GET request to the provided API endpoint to retrieve the word data. The component then renders the fetched words in a responsive grid of Material UI cards. + +Remember to install the necessary dependencies: + +```bash +npm install @mui/material @emotion/react @emotion/styled axios +``` + +This setup provides a clean, modern look with Material UI components and efficiently fetches data from the API using Axios. + +### Flow + +> This flow simulate API interactions without a real backend. + +The mock server returns predefined data, which Axios fetches in the useEffect hook. The fetched data is then stored in state using useState. Finally, the component maps over the state data, rendering each word as a card in the UI, creating a seamless development experience before the actual API is ready. + +The flow from a Postman mock server to rendering in React involves these steps: + +1. **Postman mock server**: Simulates an API endpoint, providing predefined responses to requests. + +2. **Axios**: Makes an HTTP GET request to the mock server URL. + +3. **useEffect**: Triggers the Axios request when the component mounts. + +4. **useState**: Stores the fetched data in the component's state. + +5. **words.map()**: Iterates over the array of words stored in state. + +6. **Render**: Displays each word as a Material UI Card component in the UI. + +### Code sandbox + +```js +import React, { useState, useEffect } from 'react'; +import axios from 'axios'; +import { + Box, + Card, + CardContent, + Typography, + Container, + Grid +} from '@mui/material'; + +const BASE_URL = 'https://a387bb02-2aa0-41a6-b8f7-9cc5247b9d5f.mock.pstmn.io'; + +const fetchWords = async () => { + try { + const response = await axios.get(`${BASE_URL}/words`); + return response.data.words; + } catch (error) { + console.error('Error fetching words:', error); + throw error; + } +}; + +export default function WordList() { + const [words, setWords] = useState([]); + + useEffect(() => { + const getWords = async () => { + try { + const data = await fetchWords(); + setWords(data); + } catch (error) { + console.error('Failed to fetch words:', error); + } + }; + + getWords(); + }, []); + + return ( + + + + Word List + + + {words.map((word) => ( + + + + + {word.word} + + + Pronunciation: {word.pronunciation} + + + + + ))} + + + + ); +} +```