From 5d1dc866291d34d38aac48aa7b79e00470994d31 Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Wed, 11 Jun 2025 10:26:16 -0700 Subject: [PATCH 01/13] flixster-start --- .env | 1 + package-lock.json | 1149 ++++++++++++++++++++---------------- package.json | 3 +- rendermovie/RenderMovie.js | 29 + src/App.css | 2 +- src/App.jsx | 53 +- src/CardContent.css | 26 + src/CardContent.jsx | 20 + src/Header.css | 19 + src/MovieList.css | 11 + src/MovieList.jsx | 30 + src/SearchComponents.jsx | 15 + src/Sort.jsx | 11 + src/index.css | 1 + 14 files changed, 847 insertions(+), 523 deletions(-) create mode 100644 .env create mode 100644 rendermovie/RenderMovie.js create mode 100644 src/CardContent.css create mode 100644 src/CardContent.jsx create mode 100644 src/Header.css create mode 100644 src/MovieList.css create mode 100644 src/MovieList.jsx create mode 100644 src/SearchComponents.jsx create mode 100644 src/Sort.jsx diff --git a/.env b/.env new file mode 100644 index 00000000..c2ea4059 --- /dev/null +++ b/.env @@ -0,0 +1 @@ +VITE_API_KEY = 64c88f7eb8d56a8d5f3b67328f56a36e \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 92a683d2..5bf30d95 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "flixster", "version": "0.0.0", "dependencies": { + "prop-types": "^15.8.1", "react": "^18.2.0", "react-dom": "^18.2.0" }, @@ -19,7 +20,7 @@ "eslint-plugin-react": "^7.34.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.6", - "vite": "^5.2.0" + "vite": "^6.3.5" } }, "node_modules/@aashutoshrathi/word-wrap": { @@ -36,6 +37,7 @@ "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz", "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==", "dev": true, + "license": "Apache-2.0", "dependencies": { "@jridgewell/gen-mapping": "^0.3.5", "@jridgewell/trace-mapping": "^0.3.24" @@ -45,43 +47,47 @@ } }, "node_modules/@babel/code-frame": { - "version": "7.24.2", - "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.2.tgz", - "integrity": "sha512-y5+tLQyV8pg3fsiln67BVLD1P13Eg4lh5RW9mF0zUuvLrv9uIQ4MCL+CRT+FTsBlBjcIan6PGsLcBN0m3ClUyQ==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.27.1.tgz", + "integrity": "sha512-cjQ7ZlQ0Mv3b47hABuTevyTuYN4i+loJKGeV9flcCgIK37cCXRh+L1bd3iBHlynerhQ7BhCkn2BPbQUL+rGqFg==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/highlight": "^7.24.2", - "picocolors": "^1.0.0" + "@babel/helper-validator-identifier": "^7.27.1", + "js-tokens": "^4.0.0", + "picocolors": "^1.1.1" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/compat-data": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.24.1.tgz", - "integrity": "sha512-Pc65opHDliVpRHuKfzI+gSA4zcgr65O4cl64fFJIWEEh8JoHIHh0Oez1Eo8Arz8zq/JhgKodQaxEwUPRtZylVA==", + "version": "7.27.5", + "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.27.5.tgz", + "integrity": "sha512-KiRAp/VoJaWkkte84TvUd9qjdbZAdiqyvMxrGl1N6vzFogKmaLgoM3L1kgtLicp2HP5fBJS8JrZKLVIZGVJAVg==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/core": { - "version": "7.24.3", - "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.3.tgz", - "integrity": "sha512-5FcvN1JHw2sHJChotgx8Ek0lyuh4kCKelgMTTqhYJJtloNvUfpAFMeNQUtdlIaktwrSV9LtCdqwk48wL2wBacQ==", + "version": "7.27.4", + "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.27.4.tgz", + "integrity": "sha512-bXYxrXFubeYdvB0NhD/NBB3Qi6aZeV20GOWVI47t2dkecCEoneR4NPVcb7abpXDEvejgrUfFtG6vG/zxAKmg+g==", "dev": true, + "license": "MIT", "dependencies": { "@ampproject/remapping": "^2.2.0", - "@babel/code-frame": "^7.24.2", - "@babel/generator": "^7.24.1", - "@babel/helper-compilation-targets": "^7.23.6", - "@babel/helper-module-transforms": "^7.23.3", - "@babel/helpers": "^7.24.1", - "@babel/parser": "^7.24.1", - "@babel/template": "^7.24.0", - "@babel/traverse": "^7.24.1", - "@babel/types": "^7.24.0", + "@babel/code-frame": "^7.27.1", + "@babel/generator": "^7.27.3", + "@babel/helper-compilation-targets": "^7.27.2", + "@babel/helper-module-transforms": "^7.27.3", + "@babel/helpers": "^7.27.4", + "@babel/parser": "^7.27.4", + "@babel/template": "^7.27.2", + "@babel/traverse": "^7.27.4", + "@babel/types": "^7.27.3", "convert-source-map": "^2.0.0", "debug": "^4.1.0", "gensync": "^1.0.0-beta.2", @@ -97,29 +103,32 @@ } }, "node_modules/@babel/generator": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.24.1.tgz", - "integrity": "sha512-DfCRfZsBcrPEHUfuBMgbJ1Ut01Y/itOs+hY2nFLgqsqXd52/iSiVq5TITtUasIUgm+IIKdY2/1I7auiQOEeC9A==", + "version": "7.27.5", + "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.27.5.tgz", + "integrity": "sha512-ZGhA37l0e/g2s1Cnzdix0O3aLYm66eF8aufiVteOgnwxgnRP8GoyMj7VWsgWnQbVKXyge7hqrFh2K2TQM6t1Hw==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/types": "^7.24.0", + "@babel/parser": "^7.27.5", + "@babel/types": "^7.27.3", "@jridgewell/gen-mapping": "^0.3.5", "@jridgewell/trace-mapping": "^0.3.25", - "jsesc": "^2.5.1" + "jsesc": "^3.0.2" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-compilation-targets": { - "version": "7.23.6", - "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.23.6.tgz", - "integrity": "sha512-9JB548GZoQVmzrFgp8o7KxdgkTGm6xs9DW0o/Pim72UDjzr5ObUQ6ZzYPqA+g9OTS2bBQoctLJrky0RDCAWRgQ==", + "version": "7.27.2", + "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.27.2.tgz", + "integrity": "sha512-2+1thGUUWWjLTYTHZWK1n8Yga0ijBz1XAhUXcKy81rd5g6yh7hGqMp45v7cadSbEHc9G3OTv45SyneRN3ps4DQ==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/compat-data": "^7.23.5", - "@babel/helper-validator-option": "^7.23.5", - "browserslist": "^4.22.2", + "@babel/compat-data": "^7.27.2", + "@babel/helper-validator-option": "^7.27.1", + "browserslist": "^4.24.0", "lru-cache": "^5.1.1", "semver": "^6.3.1" }, @@ -127,63 +136,30 @@ "node": ">=6.9.0" } }, - "node_modules/@babel/helper-environment-visitor": { - "version": "7.22.20", - "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz", - "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==", - "dev": true, - "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/@babel/helper-function-name": { - "version": "7.23.0", - "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz", - "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==", - "dev": true, - "dependencies": { - "@babel/template": "^7.22.15", - "@babel/types": "^7.23.0" - }, - "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/@babel/helper-hoist-variables": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz", - "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==", - "dev": true, - "dependencies": { - "@babel/types": "^7.22.5" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/helper-module-imports": { - "version": "7.24.3", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.24.3.tgz", - "integrity": "sha512-viKb0F9f2s0BCS22QSF308z/+1YWKV/76mwt61NBzS5izMzDPwdq1pTrzf+Li3npBWX9KdQbkeCt1jSAM7lZqg==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz", + "integrity": "sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/types": "^7.24.0" + "@babel/traverse": "^7.27.1", + "@babel/types": "^7.27.1" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-module-transforms": { - "version": "7.23.3", - "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz", - "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==", + "version": "7.27.3", + "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.27.3.tgz", + "integrity": "sha512-dSOvYwvyLsWBeIRyOeHXp5vPj5l1I011r52FM1+r1jCERv+aFXYk4whgQccYEGYxK2H3ZAIA8nuPkQ0HaUo3qg==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-environment-visitor": "^7.22.20", - "@babel/helper-module-imports": "^7.22.15", - "@babel/helper-simple-access": "^7.22.5", - "@babel/helper-split-export-declaration": "^7.22.6", - "@babel/helper-validator-identifier": "^7.22.20" + "@babel/helper-module-imports": "^7.27.1", + "@babel/helper-validator-identifier": "^7.27.1", + "@babel/traverse": "^7.27.3" }, "engines": { "node": ">=6.9.0" @@ -193,99 +169,68 @@ } }, "node_modules/@babel/helper-plugin-utils": { - "version": "7.24.0", - "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.0.tgz", - "integrity": "sha512-9cUznXMG0+FxRuJfvL82QlTqIzhVW9sL0KjMPHhAOOvpQGL8QtdxnBKILjBqxlHyliz0yCa1G903ZXI/FuHy2w==", - "dev": true, - "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/@babel/helper-simple-access": { - "version": "7.22.5", - "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz", - "integrity": "sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==", - "dev": true, - "dependencies": { - "@babel/types": "^7.22.5" - }, - "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/@babel/helper-split-export-declaration": { - "version": "7.22.6", - "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz", - "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.27.1.tgz", + "integrity": "sha512-1gn1Up5YXka3YYAHGKpbideQ5Yjf1tDa9qYcgysz+cNCXukyLl6DjPXhD3VRwSb8c0J9tA4b2+rHEZtc6R0tlw==", "dev": true, - "dependencies": { - "@babel/types": "^7.22.5" - }, + "license": "MIT", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-string-parser": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.1.tgz", - "integrity": "sha512-2ofRCjnnA9y+wk8b9IAREroeUP02KHp431N2mhKniy2yKIDKpbrHv9eXwm8cBeWQYcJmzv5qKCu65P47eCF7CQ==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz", + "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-validator-identifier": { - "version": "7.22.20", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.22.20.tgz", - "integrity": "sha512-Y4OZ+ytlatR8AI+8KZfKuL5urKp7qey08ha31L8b3BwewJAoJamTzyvxPR/5D+KkdJCGPq/+8TukHBlY10FX9A==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz", + "integrity": "sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helper-validator-option": { - "version": "7.23.5", - "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.23.5.tgz", - "integrity": "sha512-85ttAOMLsr53VgXkTbkx8oA6YTfT4q7/HzXSLEYmjcSTJPMPQtvq1BD79Byep5xMUYbGRzEpDsjUf3dyp54IKw==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz", + "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/helpers": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.24.1.tgz", - "integrity": "sha512-BpU09QqEe6ZCHuIHFphEFgvNSrubve1FtyMton26ekZ85gRGi6LrTF7zArARp2YvyFxloeiRmtSCq5sjh1WqIg==", + "version": "7.27.6", + "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.27.6.tgz", + "integrity": "sha512-muE8Tt8M22638HU31A3CgfSUciwz1fhATfoVai05aPXGor//CdWDCbnlY1yvBPo07njuVOCNGCSp/GTt12lIug==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/template": "^7.24.0", - "@babel/traverse": "^7.24.1", - "@babel/types": "^7.24.0" + "@babel/template": "^7.27.2", + "@babel/types": "^7.27.6" }, "engines": { "node": ">=6.9.0" } }, - "node_modules/@babel/highlight": { - "version": "7.24.2", - "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.2.tgz", - "integrity": "sha512-Yac1ao4flkTxTteCDZLEvdxg2fZfz1v8M4QpaGypq/WPDqg3ijHYbDfs+LG5hvzSoqaSZ9/Z9lKSP3CjZjv+pA==", + "node_modules/@babel/parser": { + "version": "7.27.5", + "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.27.5.tgz", + "integrity": "sha512-OsQd175SxWkGlzbny8J3K8TnnDD0N3lrIUtB92xwyRpzaenGZhxDvxN/JgU00U3CDZNj9tPuDJ5H0WS4Nt3vKg==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-validator-identifier": "^7.22.20", - "chalk": "^2.4.2", - "js-tokens": "^4.0.0", - "picocolors": "^1.0.0" + "@babel/types": "^7.27.3" }, - "engines": { - "node": ">=6.9.0" - } - }, - "node_modules/@babel/parser": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.1.tgz", - "integrity": "sha512-Zo9c7N3xdOIQrNip7Lc9wvRPzlRtovHVE4lkz8WEDr7uYh/GMQhSiIgFxGIArRHYdJE5kxtZjAf8rT0xhdLCzg==", - "dev": true, "bin": { "parser": "bin/babel-parser.js" }, @@ -294,12 +239,13 @@ } }, "node_modules/@babel/plugin-transform-react-jsx-self": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.24.1.tgz", - "integrity": "sha512-kDJgnPujTmAZ/9q2CN4m2/lRsUUPDvsG3+tSHWUJIzMGTt5U/b/fwWd3RO3n+5mjLrsBrVa5eKFRVSQbi3dF1w==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-self/-/plugin-transform-react-jsx-self-7.27.1.tgz", + "integrity": "sha512-6UzkCs+ejGdZ5mFFC/OCUrv028ab2fp1znZmCZjAOBKiBK2jXD1O+BPSfX8X2qjJ75fZBMSnQn3Rq2mrBJK2mw==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-plugin-utils": "^7.24.0" + "@babel/helper-plugin-utils": "^7.27.1" }, "engines": { "node": ">=6.9.0" @@ -309,12 +255,13 @@ } }, "node_modules/@babel/plugin-transform-react-jsx-source": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.24.1.tgz", - "integrity": "sha512-1v202n7aUq4uXAieRTKcwPzNyphlCuqHHDcdSNc+vdhoTEZcFMh+L5yZuCmGaIO7bs1nJUNfHB89TZyoL48xNA==", + "version": "7.27.1", + "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx-source/-/plugin-transform-react-jsx-source-7.27.1.tgz", + "integrity": "sha512-zbwoTsBruTeKB9hSq73ha66iFeJHuaFkUbwvqElnygoNbj/jHRsSeokowZFN3CZ64IvEqcmmkVe89OPXc7ldAw==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-plugin-utils": "^7.24.0" + "@babel/helper-plugin-utils": "^7.27.1" }, "engines": { "node": ">=6.9.0" @@ -324,33 +271,32 @@ } }, "node_modules/@babel/template": { - "version": "7.24.0", - "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.24.0.tgz", - "integrity": "sha512-Bkf2q8lMB0AFpX0NFEqSbx1OkTHf0f+0j82mkw+ZpzBnkk7e9Ql0891vlfgi+kHwOk8tQjiQHpqh4LaSa0fKEA==", + "version": "7.27.2", + "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz", + "integrity": "sha512-LPDZ85aEJyYSd18/DkjNh4/y1ntkE5KwUHWTiqgRxruuZL2F1yuHligVHLvcHY2vMHXttKFpJn6LwfI7cw7ODw==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/code-frame": "^7.23.5", - "@babel/parser": "^7.24.0", - "@babel/types": "^7.24.0" + "@babel/code-frame": "^7.27.1", + "@babel/parser": "^7.27.2", + "@babel/types": "^7.27.1" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@babel/traverse": { - "version": "7.24.1", - "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.24.1.tgz", - "integrity": "sha512-xuU6o9m68KeqZbQuDt2TcKSxUw/mrsvavlEqQ1leZ/B+C9tk6E4sRWy97WaXgvq5E+nU3cXMxv3WKOCanVMCmQ==", - "dev": true, - "dependencies": { - "@babel/code-frame": "^7.24.1", - "@babel/generator": "^7.24.1", - "@babel/helper-environment-visitor": "^7.22.20", - "@babel/helper-function-name": "^7.23.0", - "@babel/helper-hoist-variables": "^7.22.5", - "@babel/helper-split-export-declaration": "^7.22.6", - "@babel/parser": "^7.24.1", - "@babel/types": "^7.24.0", + "version": "7.27.4", + "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.27.4.tgz", + "integrity": "sha512-oNcu2QbHqts9BtOWJosOVJapWjBDSxGCpFvikNR5TGDYDQf3JwpIoMzIKrvfoti93cLfPJEG4tH9SPVeyCGgdA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@babel/code-frame": "^7.27.1", + "@babel/generator": "^7.27.3", + "@babel/parser": "^7.27.4", + "@babel/template": "^7.27.2", + "@babel/types": "^7.27.3", "debug": "^4.3.1", "globals": "^11.1.0" }, @@ -359,385 +305,442 @@ } }, "node_modules/@babel/types": { - "version": "7.24.0", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.24.0.tgz", - "integrity": "sha512-+j7a5c253RfKh8iABBhywc8NSfP5LURe7Uh4qpsh6jc+aLJguvmIUBdjSdEMQv2bENrCR5MfRdjGo7vzS/ob7w==", + "version": "7.27.6", + "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.27.6.tgz", + "integrity": "sha512-ETyHEk2VHHvl9b9jZP5IHPavHYk57EhanlRRuae9XCpb/j5bDCbPPMOBfCWhnl/7EDJz0jEMCi/RhccCE8r1+Q==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/helper-string-parser": "^7.23.4", - "@babel/helper-validator-identifier": "^7.22.20", - "to-fast-properties": "^2.0.0" + "@babel/helper-string-parser": "^7.27.1", + "@babel/helper-validator-identifier": "^7.27.1" }, "engines": { "node": ">=6.9.0" } }, "node_modules/@esbuild/aix-ppc64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.20.2.tgz", - "integrity": "sha512-D+EBOJHXdNZcLJRBkhENNG8Wji2kgc9AZ9KiPr1JuZjsNtyHzrsfLRrY0tk2H2aoFu6RANO1y1iPPUCDYWkb5g==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.5.tgz", + "integrity": "sha512-9o3TMmpmftaCMepOdA5k/yDw8SfInyzWWTjYTFCX3kPSDJMROQTb8jg+h9Cnwnmm1vOzvxN7gIfB5V2ewpjtGA==", "cpu": [ "ppc64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "aix" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/android-arm": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.20.2.tgz", - "integrity": "sha512-t98Ra6pw2VaDhqNWO2Oph2LXbz/EJcnLmKLGBJwEwXX/JAN83Fym1rU8l0JUWK6HkIbWONCSSatf4sf2NBRx/w==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.5.tgz", + "integrity": "sha512-AdJKSPeEHgi7/ZhuIPtcQKr5RQdo6OO2IL87JkianiMYMPbCtot9fxPbrMiBADOWWm3T2si9stAiVsGbTQFkbA==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/android-arm64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.20.2.tgz", - "integrity": "sha512-mRzjLacRtl/tWU0SvD8lUEwb61yP9cqQo6noDZP/O8VkwafSYwZ4yWy24kan8jE/IMERpYncRt2dw438LP3Xmg==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.5.tgz", + "integrity": "sha512-VGzGhj4lJO+TVGV1v8ntCZWJktV7SGCs3Pn1GRWI1SBFtRALoomm8k5E9Pmwg3HOAal2VDc2F9+PM/rEY6oIDg==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/android-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.20.2.tgz", - "integrity": "sha512-btzExgV+/lMGDDa194CcUQm53ncxzeBrWJcncOBxuC6ndBkKxnHdFJn86mCIgTELsooUmwUm9FkhSp5HYu00Rg==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.5.tgz", + "integrity": "sha512-D2GyJT1kjvO//drbRT3Hib9XPwQeWd9vZoBJn+bu/lVsOZ13cqNdDeqIF/xQ5/VmWvMduP6AmXvylO/PIc2isw==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/darwin-arm64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.20.2.tgz", - "integrity": "sha512-4J6IRT+10J3aJH3l1yzEg9y3wkTDgDk7TSDFX+wKFiWjqWp/iCfLIYzGyasx9l0SAFPT1HwSCR+0w/h1ES/MjA==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.5.tgz", + "integrity": "sha512-GtaBgammVvdF7aPIgH2jxMDdivezgFu6iKpmT+48+F8Hhg5J/sfnDieg0aeG/jfSvkYQU2/pceFPDKlqZzwnfQ==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "darwin" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/darwin-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.20.2.tgz", - "integrity": "sha512-tBcXp9KNphnNH0dfhv8KYkZhjc+H3XBkF5DKtswJblV7KlT9EI2+jeA8DgBjp908WEuYll6pF+UStUCfEpdysA==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.5.tgz", + "integrity": "sha512-1iT4FVL0dJ76/q1wd7XDsXrSW+oLoquptvh4CLR4kITDtqi2e/xwXwdCVH8hVHU43wgJdsq7Gxuzcs6Iq/7bxQ==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "darwin" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/freebsd-arm64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.20.2.tgz", - "integrity": "sha512-d3qI41G4SuLiCGCFGUrKsSeTXyWG6yem1KcGZVS+3FYlYhtNoNgYrWcvkOoaqMhwXSMrZRl69ArHsGJ9mYdbbw==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.5.tgz", + "integrity": "sha512-nk4tGP3JThz4La38Uy/gzyXtpkPW8zSAmoUhK9xKKXdBCzKODMc2adkB2+8om9BDYugz+uGV7sLmpTYzvmz6Sw==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "freebsd" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/freebsd-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.20.2.tgz", - "integrity": "sha512-d+DipyvHRuqEeM5zDivKV1KuXn9WeRX6vqSqIDgwIfPQtwMP4jaDsQsDncjTDDsExT4lR/91OLjRo8bmC1e+Cw==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.5.tgz", + "integrity": "sha512-PrikaNjiXdR2laW6OIjlbeuCPrPaAl0IwPIaRv+SMV8CiM8i2LqVUHFC1+8eORgWyY7yhQY+2U2fA55mBzReaw==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "freebsd" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-arm": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.20.2.tgz", - "integrity": "sha512-VhLPeR8HTMPccbuWWcEUD1Az68TqaTYyj6nfE4QByZIQEQVWBB8vup8PpR7y1QHL3CpcF6xd5WVBU/+SBEvGTg==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.5.tgz", + "integrity": "sha512-cPzojwW2okgh7ZlRpcBEtsX7WBuqbLrNXqLU89GxWbNt6uIg78ET82qifUy3W6OVww6ZWobWub5oqZOVtwolfw==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-arm64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.20.2.tgz", - "integrity": "sha512-9pb6rBjGvTFNira2FLIWqDk/uaf42sSyLE8j1rnUpuzsODBq7FvpwHYZxQ/It/8b+QOS1RYfqgGFNLRI+qlq2A==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.5.tgz", + "integrity": "sha512-Z9kfb1v6ZlGbWj8EJk9T6czVEjjq2ntSYLY2cw6pAZl4oKtfgQuS4HOq41M/BcoLPzrUbNd+R4BXFyH//nHxVg==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-ia32": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.20.2.tgz", - "integrity": "sha512-o10utieEkNPFDZFQm9CoP7Tvb33UutoJqg3qKf1PWVeeJhJw0Q347PxMvBgVVFgouYLGIhFYG0UGdBumROyiig==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.5.tgz", + "integrity": "sha512-sQ7l00M8bSv36GLV95BVAdhJ2QsIbCuCjh/uYrWiMQSUuV+LpXwIqhgJDcvMTj+VsQmqAHL2yYaasENvJ7CDKA==", "cpu": [ "ia32" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-loong64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.20.2.tgz", - "integrity": "sha512-PR7sp6R/UC4CFVomVINKJ80pMFlfDfMQMYynX7t1tNTeivQ6XdX5r2XovMmha/VjR1YN/HgHWsVcTRIMkymrgQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.5.tgz", + "integrity": "sha512-0ur7ae16hDUC4OL5iEnDb0tZHDxYmuQyhKhsPBV8f99f6Z9KQM02g33f93rNH5A30agMS46u2HP6qTdEt6Q1kg==", "cpu": [ "loong64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-mips64el": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.20.2.tgz", - "integrity": "sha512-4BlTqeutE/KnOiTG5Y6Sb/Hw6hsBOZapOVF6njAESHInhlQAghVVZL1ZpIctBOoTFbQyGW+LsVYZ8lSSB3wkjA==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.5.tgz", + "integrity": "sha512-kB/66P1OsHO5zLz0i6X0RxlQ+3cu0mkxS3TKFvkb5lin6uwZ/ttOkP3Z8lfR9mJOBk14ZwZ9182SIIWFGNmqmg==", "cpu": [ "mips64el" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-ppc64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.20.2.tgz", - "integrity": "sha512-rD3KsaDprDcfajSKdn25ooz5J5/fWBylaaXkuotBDGnMnDP1Uv5DLAN/45qfnf3JDYyJv/ytGHQaziHUdyzaAg==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.5.tgz", + "integrity": "sha512-UZCmJ7r9X2fe2D6jBmkLBMQetXPXIsZjQJCjgwpVDz+YMcS6oFR27alkgGv3Oqkv07bxdvw7fyB71/olceJhkQ==", "cpu": [ "ppc64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-riscv64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.20.2.tgz", - "integrity": "sha512-snwmBKacKmwTMmhLlz/3aH1Q9T8v45bKYGE3j26TsaOVtjIag4wLfWSiZykXzXuE1kbCE+zJRmwp+ZbIHinnVg==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.5.tgz", + "integrity": "sha512-kTxwu4mLyeOlsVIFPfQo+fQJAV9mh24xL+y+Bm6ej067sYANjyEw1dNHmvoqxJUCMnkBdKpvOn0Ahql6+4VyeA==", "cpu": [ "riscv64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-s390x": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.20.2.tgz", - "integrity": "sha512-wcWISOobRWNm3cezm5HOZcYz1sKoHLd8VL1dl309DiixxVFoFe/o8HnwuIwn6sXre88Nwj+VwZUvJf4AFxkyrQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.5.tgz", + "integrity": "sha512-K2dSKTKfmdh78uJ3NcWFiqyRrimfdinS5ErLSn3vluHNeHVnBAFWC8a4X5N+7FgVE1EjXS1QDZbpqZBjfrqMTQ==", "cpu": [ "s390x" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/linux-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.20.2.tgz", - "integrity": "sha512-1MdwI6OOTsfQfek8sLwgyjOXAu+wKhLEoaOLTjbijk6E2WONYpH9ZU2mNtR+lZ2B4uwr+usqGuVfFT9tMtGvGw==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.5.tgz", + "integrity": "sha512-uhj8N2obKTE6pSZ+aMUbqq+1nXxNjZIIjCjGLfsWvVpy7gKCOL6rsY1MhRh9zLtUtAI7vpgLMK6DxjO8Qm9lJw==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ], "engines": { - "node": ">=12" + "node": ">=18" + } + }, + "node_modules/@esbuild/netbsd-arm64": { + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.5.tgz", + "integrity": "sha512-pwHtMP9viAy1oHPvgxtOv+OkduK5ugofNTVDilIzBLpoWAM16r7b/mxBvfpuQDpRQFMfuVr5aLcn4yveGvBZvw==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "netbsd" + ], + "engines": { + "node": ">=18" } }, "node_modules/@esbuild/netbsd-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.20.2.tgz", - "integrity": "sha512-K8/DhBxcVQkzYc43yJXDSyjlFeHQJBiowJ0uVL6Tor3jGQfSGHNNJcWxNbOI8v5k82prYqzPuwkzHt3J1T1iZQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.5.tgz", + "integrity": "sha512-WOb5fKrvVTRMfWFNCroYWWklbnXH0Q5rZppjq0vQIdlsQKuw6mdSihwSo4RV/YdQ5UCKKvBy7/0ZZYLBZKIbwQ==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "netbsd" ], "engines": { - "node": ">=12" + "node": ">=18" + } + }, + "node_modules/@esbuild/openbsd-arm64": { + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.5.tgz", + "integrity": "sha512-7A208+uQKgTxHd0G0uqZO8UjK2R0DDb4fDmERtARjSHWxqMTye4Erz4zZafx7Di9Cv+lNHYuncAkiGFySoD+Mw==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "openbsd" + ], + "engines": { + "node": ">=18" } }, "node_modules/@esbuild/openbsd-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.20.2.tgz", - "integrity": "sha512-eMpKlV0SThJmmJgiVyN9jTPJ2VBPquf6Kt/nAoo6DgHAoN57K15ZghiHaMvqjCye/uU4X5u3YSMgVBI1h3vKrQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.5.tgz", + "integrity": "sha512-G4hE405ErTWraiZ8UiSoesH8DaCsMm0Cay4fsFWOOUcz8b8rC6uCvnagr+gnioEjWn0wC+o1/TAHt+It+MpIMg==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "openbsd" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/sunos-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.20.2.tgz", - "integrity": "sha512-2UyFtRC6cXLyejf/YEld4Hajo7UHILetzE1vsRcGL3earZEW77JxrFjH4Ez2qaTiEfMgAXxfAZCm1fvM/G/o8w==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.5.tgz", + "integrity": "sha512-l+azKShMy7FxzY0Rj4RCt5VD/q8mG/e+mDivgspo+yL8zW7qEwctQ6YqKX34DTEleFAvCIUviCFX1SDZRSyMQA==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "sunos" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/win32-arm64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.20.2.tgz", - "integrity": "sha512-GRibxoawM9ZCnDxnP3usoUDO9vUkpAxIIZ6GQI+IlVmr5kP3zUq+l17xELTHMWTWzjxa2guPNyrpq1GWmPvcGQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.5.tgz", + "integrity": "sha512-O2S7SNZzdcFG7eFKgvwUEZ2VG9D/sn/eIiz8XRZ1Q/DO5a3s76Xv0mdBzVM5j5R639lXQmPmSo0iRpHqUUrsxw==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/win32-ia32": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.20.2.tgz", - "integrity": "sha512-HfLOfn9YWmkSKRQqovpnITazdtquEW8/SoHW7pWpuEeguaZI4QnCRW6b+oZTztdBnZOS2hqJ6im/D5cPzBTTlQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.5.tgz", + "integrity": "sha512-onOJ02pqs9h1iMJ1PQphR+VZv8qBMQ77Klcsqv9CNW2w6yLqoURLcgERAIurY6QE63bbLuqgP9ATqajFLK5AMQ==", "cpu": [ "ia32" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@esbuild/win32-x64": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.20.2.tgz", - "integrity": "sha512-N49X4lJX27+l9jbLKSqZ6bKNjzQvHaT8IIFUy+YIqmXQdjYCToGWwOItDrfby14c78aDd5NHQl29xingXfCdLQ==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.5.tgz", + "integrity": "sha512-TXv6YnJ8ZMVdX+SXWVBo/0p8LTcrUYngpWjvm91TMjjBQii7Oz11Lw5lbDV5Y0TzuhSJHwiH4hEtC1I42mMS0g==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ], "engines": { - "node": ">=12" + "node": ">=18" } }, "node_modules/@eslint-community/eslint-utils": { @@ -845,10 +848,11 @@ "dev": true }, "node_modules/@jridgewell/gen-mapping": { - "version": "0.3.5", - "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz", - "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==", + "version": "0.3.8", + "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.8.tgz", + "integrity": "sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==", "dev": true, + "license": "MIT", "dependencies": { "@jridgewell/set-array": "^1.2.1", "@jridgewell/sourcemap-codec": "^1.4.10", @@ -863,6 +867,7 @@ "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz", "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.0.0" } @@ -872,21 +877,24 @@ "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.0.0" } }, "node_modules/@jridgewell/sourcemap-codec": { - "version": "1.4.15", - "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz", - "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==", - "dev": true + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz", + "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==", + "dev": true, + "license": "MIT" }, "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==", "dev": true, + "license": "MIT", "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", "@jridgewell/sourcemap-codec": "^1.4.14" @@ -927,196 +935,288 @@ "node": ">= 8" } }, + "node_modules/@rolldown/pluginutils": { + "version": "1.0.0-beta.11", + "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.11.tgz", + "integrity": "sha512-L/gAA/hyCSuzTF1ftlzUSI/IKr2POHsv1Dd78GfqkR83KMNuswWD61JxGV2L7nRwBBBSDr6R1gCkdTmoN7W4ag==", + "dev": true, + "license": "MIT" + }, "node_modules/@rollup/rollup-android-arm-eabi": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.13.2.tgz", - "integrity": "sha512-3XFIDKWMFZrMnao1mJhnOT1h2g0169Os848NhhmGweEcfJ4rCi+3yMCOLG4zA61rbJdkcrM/DjVZm9Hg5p5w7g==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.42.0.tgz", + "integrity": "sha512-gldmAyS9hpj+H6LpRNlcjQWbuKUtb94lodB9uCz71Jm+7BxK1VIOo7y62tZZwxhA7j1ylv/yQz080L5WkS+LoQ==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ] }, "node_modules/@rollup/rollup-android-arm64": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.13.2.tgz", - "integrity": "sha512-GdxxXbAuM7Y/YQM9/TwwP+L0omeE/lJAR1J+olu36c3LqqZEBdsIWeQ91KBe6nxwOnb06Xh7JS2U5ooWU5/LgQ==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.42.0.tgz", + "integrity": "sha512-bpRipfTgmGFdCZDFLRvIkSNO1/3RGS74aWkJJTFJBH7h3MRV4UijkaEUeOMbi9wxtxYmtAbVcnMtHTPBhLEkaw==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "android" ] }, "node_modules/@rollup/rollup-darwin-arm64": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.13.2.tgz", - "integrity": "sha512-mCMlpzlBgOTdaFs83I4XRr8wNPveJiJX1RLfv4hggyIVhfB5mJfN4P8Z6yKh+oE4Luz+qq1P3kVdWrCKcMYrrA==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.42.0.tgz", + "integrity": "sha512-JxHtA081izPBVCHLKnl6GEA0w3920mlJPLh89NojpU2GsBSB6ypu4erFg/Wx1qbpUbepn0jY4dVWMGZM8gplgA==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "darwin" ] }, "node_modules/@rollup/rollup-darwin-x64": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.13.2.tgz", - "integrity": "sha512-yUoEvnH0FBef/NbB1u6d3HNGyruAKnN74LrPAfDQL3O32e3k3OSfLrPgSJmgb3PJrBZWfPyt6m4ZhAFa2nZp2A==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.42.0.tgz", + "integrity": "sha512-rv5UZaWVIJTDMyQ3dCEK+m0SAn6G7H3PRc2AZmExvbDvtaDc+qXkei0knQWcI3+c9tEs7iL/4I4pTQoPbNL2SA==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "darwin" ] }, + "node_modules/@rollup/rollup-freebsd-arm64": { + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.42.0.tgz", + "integrity": "sha512-fJcN4uSGPWdpVmvLuMtALUFwCHgb2XiQjuECkHT3lWLZhSQ3MBQ9pq+WoWeJq2PrNxr9rPM1Qx+IjyGj8/c6zQ==", + "cpu": [ + "arm64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "freebsd" + ] + }, + "node_modules/@rollup/rollup-freebsd-x64": { + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.42.0.tgz", + "integrity": "sha512-CziHfyzpp8hJpCVE/ZdTizw58gr+m7Y2Xq5VOuCSrZR++th2xWAz4Nqk52MoIIrV3JHtVBhbBsJcAxs6NammOQ==", + "cpu": [ + "x64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "freebsd" + ] + }, "node_modules/@rollup/rollup-linux-arm-gnueabihf": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.13.2.tgz", - "integrity": "sha512-GYbLs5ErswU/Xs7aGXqzc3RrdEjKdmoCrgzhJWyFL0r5fL3qd1NPcDKDowDnmcoSiGJeU68/Vy+OMUluRxPiLQ==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.42.0.tgz", + "integrity": "sha512-UsQD5fyLWm2Fe5CDM7VPYAo+UC7+2Px4Y+N3AcPh/LdZu23YcuGPegQly++XEVaC8XUTFVPscl5y5Cl1twEI4A==", "cpu": [ "arm" ], "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-arm-musleabihf": { + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.42.0.tgz", + "integrity": "sha512-/i8NIrlgc/+4n1lnoWl1zgH7Uo0XK5xK3EDqVTf38KvyYgCU/Rm04+o1VvvzJZnVS5/cWSd07owkzcVasgfIkQ==", + "cpu": [ + "arm" + ], + "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-arm64-gnu": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.13.2.tgz", - "integrity": "sha512-L1+D8/wqGnKQIlh4Zre9i4R4b4noxzH5DDciyahX4oOz62CphY7WDWqJoQ66zNR4oScLNOqQJfNSIAe/6TPUmQ==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.42.0.tgz", + "integrity": "sha512-eoujJFOvoIBjZEi9hJnXAbWg+Vo1Ov8n/0IKZZcPZ7JhBzxh2A+2NFyeMZIRkY9iwBvSjloKgcvnjTbGKHE44Q==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-arm64-musl": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.13.2.tgz", - "integrity": "sha512-tK5eoKFkXdz6vjfkSTCupUzCo40xueTOiOO6PeEIadlNBkadH1wNOH8ILCPIl8by/Gmb5AGAeQOFeLev7iZDOA==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.42.0.tgz", + "integrity": "sha512-/3NrcOWFSR7RQUQIuZQChLND36aTU9IYE4j+TB40VU78S+RA0IiqHR30oSh6P1S9f9/wVOenHQnacs/Byb824g==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-loongarch64-gnu": { + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loongarch64-gnu/-/rollup-linux-loongarch64-gnu-4.42.0.tgz", + "integrity": "sha512-O8AplvIeavK5ABmZlKBq9/STdZlnQo7Sle0LLhVA7QT+CiGpNVe197/t8Aph9bhJqbDVGCHpY2i7QyfEDDStDg==", + "cpu": [ + "loong64" + ], + "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-powerpc64le-gnu": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.13.2.tgz", - "integrity": "sha512-zvXvAUGGEYi6tYhcDmb9wlOckVbuD+7z3mzInCSTACJ4DQrdSLPNUeDIcAQW39M3q6PDquqLWu7pnO39uSMRzQ==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-powerpc64le-gnu/-/rollup-linux-powerpc64le-gnu-4.42.0.tgz", + "integrity": "sha512-6Qb66tbKVN7VyQrekhEzbHRxXXFFD8QKiFAwX5v9Xt6FiJ3BnCVBuyBxa2fkFGqxOCSGGYNejxd8ht+q5SnmtA==", "cpu": [ - "ppc64le" + "ppc64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-riscv64-gnu": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.13.2.tgz", - "integrity": "sha512-C3GSKvMtdudHCN5HdmAMSRYR2kkhgdOfye4w0xzyii7lebVr4riCgmM6lRiSCnJn2w1Xz7ZZzHKuLrjx5620kw==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.42.0.tgz", + "integrity": "sha512-KQETDSEBamQFvg/d8jajtRwLNBlGc3aKpaGiP/LvEbnmVUKlFta1vqJqTrvPtsYsfbE/DLg5CC9zyXRX3fnBiA==", + "cpu": [ + "riscv64" + ], + "dev": true, + "license": "MIT", + "optional": true, + "os": [ + "linux" + ] + }, + "node_modules/@rollup/rollup-linux-riscv64-musl": { + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.42.0.tgz", + "integrity": "sha512-qMvnyjcU37sCo/tuC+JqeDKSuukGAd+pVlRl/oyDbkvPJ3awk6G6ua7tyum02O3lI+fio+eM5wsVd66X0jQtxw==", "cpu": [ "riscv64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-s390x-gnu": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.13.2.tgz", - "integrity": "sha512-l4U0KDFwzD36j7HdfJ5/TveEQ1fUTjFFQP5qIt9gBqBgu1G8/kCaq5Ok05kd5TG9F8Lltf3MoYsUMw3rNlJ0Yg==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.42.0.tgz", + "integrity": "sha512-I2Y1ZUgTgU2RLddUHXTIgyrdOwljjkmcZ/VilvaEumtS3Fkuhbw4p4hgHc39Ypwvo2o7sBFNl2MquNvGCa55Iw==", "cpu": [ "s390x" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-x64-gnu": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.13.2.tgz", - "integrity": "sha512-xXMLUAMzrtsvh3cZ448vbXqlUa7ZL8z0MwHp63K2IIID2+DeP5iWIT6g1SN7hg1VxPzqx0xZdiDM9l4n9LRU1A==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.42.0.tgz", + "integrity": "sha512-Gfm6cV6mj3hCUY8TqWa63DB8Mx3NADoFwiJrMpoZ1uESbK8FQV3LXkhfry+8bOniq9pqY1OdsjFWNsSbfjPugw==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-linux-x64-musl": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.13.2.tgz", - "integrity": "sha512-M/JYAWickafUijWPai4ehrjzVPKRCyDb1SLuO+ZyPfoXgeCEAlgPkNXewFZx0zcnoIe3ay4UjXIMdXQXOZXWqA==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.42.0.tgz", + "integrity": "sha512-g86PF8YZ9GRqkdi0VoGlcDUb4rYtQKyTD1IVtxxN4Hpe7YqLBShA7oHMKU6oKTCi3uxwW4VkIGnOaH/El8de3w==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "linux" ] }, "node_modules/@rollup/rollup-win32-arm64-msvc": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.13.2.tgz", - "integrity": "sha512-2YWwoVg9KRkIKaXSh0mz3NmfurpmYoBBTAXA9qt7VXk0Xy12PoOP40EFuau+ajgALbbhi4uTj3tSG3tVseCjuA==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.42.0.tgz", + "integrity": "sha512-+axkdyDGSp6hjyzQ5m1pgcvQScfHnMCcsXkx8pTgy/6qBmWVhtRVlgxjWwDp67wEXXUr0x+vD6tp5W4x6V7u1A==", "cpu": [ "arm64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ] }, "node_modules/@rollup/rollup-win32-ia32-msvc": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.13.2.tgz", - "integrity": "sha512-2FSsE9aQ6OWD20E498NYKEQLneShWes0NGMPQwxWOdws35qQXH+FplabOSP5zEe1pVjurSDOGEVCE2agFwSEsw==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.42.0.tgz", + "integrity": "sha512-F+5J9pelstXKwRSDq92J0TEBXn2nfUrQGg+HK1+Tk7VOL09e0gBqUHugZv7SW4MGrYj41oNCUe3IKCDGVlis2g==", "cpu": [ "ia32" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" ] }, "node_modules/@rollup/rollup-win32-x64-msvc": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.13.2.tgz", - "integrity": "sha512-7h7J2nokcdPePdKykd8wtc8QqqkqxIrUz7MHj6aNr8waBRU//NLDVnNjQnqQO6fqtjrtCdftpbTuOKAyrAQETQ==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.42.0.tgz", + "integrity": "sha512-LpHiJRwkaVz/LqjHjK8LCi8osq7elmpwujwbXKNW88bM8eeGxavJIKKjkjpMHAh/2xfnrt1ZSnhTv41WYUHYmA==", "cpu": [ "x64" ], "dev": true, + "license": "MIT", "optional": true, "os": [ "win32" @@ -1164,10 +1264,11 @@ } }, "node_modules/@types/estree": { - "version": "1.0.5", - "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz", - "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==", - "dev": true + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.7.tgz", + "integrity": "sha512-w28IoSUCJpidD/TGviZwwMJckNESJZXFu7NBZ5YJ4mEUnNraUn9Pm8HSZm/jDF1pDWYKspWE7oVphigUPRakIQ==", + "dev": true, + "license": "MIT" }, "node_modules/@types/prop-types": { "version": "15.7.12", @@ -1201,22 +1302,24 @@ "dev": true }, "node_modules/@vitejs/plugin-react": { - "version": "4.2.1", - "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.2.1.tgz", - "integrity": "sha512-oojO9IDc4nCUUi8qIR11KoQm0XFFLIwsRBwHRR4d/88IWghn1y6ckz/bJ8GHDCsYEJee8mDzqtJxh15/cisJNQ==", + "version": "4.5.2", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.5.2.tgz", + "integrity": "sha512-QNVT3/Lxx99nMQWJWF7K4N6apUEuT0KlZA3mx/mVaoGj3smm/8rc8ezz15J1pcbcjDK0V15rpHetVfya08r76Q==", "dev": true, + "license": "MIT", "dependencies": { - "@babel/core": "^7.23.5", - "@babel/plugin-transform-react-jsx-self": "^7.23.3", - "@babel/plugin-transform-react-jsx-source": "^7.23.3", + "@babel/core": "^7.27.4", + "@babel/plugin-transform-react-jsx-self": "^7.27.1", + "@babel/plugin-transform-react-jsx-source": "^7.27.1", + "@rolldown/pluginutils": "1.0.0-beta.11", "@types/babel__core": "^7.20.5", - "react-refresh": "^0.14.0" + "react-refresh": "^0.17.0" }, "engines": { "node": "^14.18.0 || >=16.0.0" }, "peerDependencies": { - "vite": "^4.2.0 || ^5.0.0" + "vite": "^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0-beta.0" } }, "node_modules/acorn": { @@ -1265,18 +1368,6 @@ "node": ">=8" } }, - "node_modules/ansi-styles": { - "version": "3.2.1", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", - "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", - "dev": true, - "dependencies": { - "color-convert": "^1.9.0" - }, - "engines": { - "node": ">=4" - } - }, "node_modules/argparse": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", @@ -1454,9 +1545,9 @@ } }, "node_modules/browserslist": { - "version": "4.23.0", - "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.0.tgz", - "integrity": "sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==", + "version": "4.25.0", + "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.25.0.tgz", + "integrity": "sha512-PJ8gYKeS5e/whHBh8xrwYK+dAvEj7JXtz6uTucnMRB8OiGTsKccFekoRrjajPBHV8oOY+2tI4uxeceSimKwMFA==", "dev": true, "funding": [ { @@ -1472,11 +1563,12 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "dependencies": { - "caniuse-lite": "^1.0.30001587", - "electron-to-chromium": "^1.4.668", - "node-releases": "^2.0.14", - "update-browserslist-db": "^1.0.13" + "caniuse-lite": "^1.0.30001718", + "electron-to-chromium": "^1.5.160", + "node-releases": "^2.0.19", + "update-browserslist-db": "^1.1.3" }, "bin": { "browserslist": "cli.js" @@ -1514,9 +1606,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001605", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001605.tgz", - "integrity": "sha512-nXwGlFWo34uliI9z3n6Qc0wZaf7zaZWA1CPZ169La5mV3I/gem7bst0vr5XQH5TJXZIMfDeZyOrZnSlVzKxxHQ==", + "version": "1.0.30001721", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001721.tgz", + "integrity": "sha512-cOuvmUVtKrtEaoKiO0rSc29jcjwMwX5tOHDy4MgVFEWiUXj4uBMJkwI8MDySkgXidpMiHUcviogAvFi4pA2hDQ==", "dev": true, "funding": [ { @@ -1531,36 +1623,8 @@ "type": "github", "url": "https://github.com/sponsors/ai" } - ] - }, - "node_modules/chalk": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz", - "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==", - "dev": true, - "dependencies": { - "ansi-styles": "^3.2.1", - "escape-string-regexp": "^1.0.5", - "supports-color": "^5.3.0" - }, - "engines": { - "node": ">=4" - } - }, - "node_modules/color-convert": { - "version": "1.9.3", - "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", - "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", - "dev": true, - "dependencies": { - "color-name": "1.1.3" - } - }, - "node_modules/color-name": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", - "integrity": "sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==", - "dev": true + ], + "license": "CC-BY-4.0" }, "node_modules/concat-map": { "version": "0.0.1", @@ -1572,13 +1636,15 @@ "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==", - "dev": true + "dev": true, + "license": "MIT" }, "node_modules/cross-spawn": { - "version": "7.0.3", - "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", - "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==", + "version": "7.0.6", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", + "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==", "dev": true, + "license": "MIT", "dependencies": { "path-key": "^3.1.0", "shebang-command": "^2.0.0", @@ -1715,10 +1781,11 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.4.724", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.724.tgz", - "integrity": "sha512-RTRvkmRkGhNBPPpdrgtDKvmOEYTrPlXDfc0J/Nfq5s29tEahAwhiX4mmhNzj6febWMleulxVYPh7QwCSL/EldA==", - "dev": true + "version": "1.5.166", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.166.tgz", + "integrity": "sha512-QPWqHL0BglzPYyJJ1zSSmwFFL6MFXhbACOCcsCdUMCkzPdS9/OIBVxg516X/Ado2qwAq8k0nJJ7phQPCqiaFAw==", + "dev": true, + "license": "ISC" }, "node_modules/es-abstract": { "version": "1.23.3", @@ -1879,61 +1946,56 @@ } }, "node_modules/esbuild": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.20.2.tgz", - "integrity": "sha512-WdOOppmUNU+IbZ0PaDiTst80zjnrOkyJNHoKupIcVyU8Lvla3Ugx94VzkQ32Ijqd7UhHJy75gNWDMUekcrSJ6g==", + "version": "0.25.5", + "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.5.tgz", + "integrity": "sha512-P8OtKZRv/5J5hhz0cUAdu/cLuPIKXpQl1R9pZtvmHWQvrAUVd0UNIPT4IB4W3rNOqVO0rlqHmCIbSwxh/c9yUQ==", "dev": true, "hasInstallScript": true, + "license": "MIT", "bin": { "esbuild": "bin/esbuild" }, "engines": { - "node": ">=12" + "node": ">=18" }, "optionalDependencies": { - "@esbuild/aix-ppc64": "0.20.2", - "@esbuild/android-arm": "0.20.2", - "@esbuild/android-arm64": "0.20.2", - "@esbuild/android-x64": "0.20.2", - "@esbuild/darwin-arm64": "0.20.2", - "@esbuild/darwin-x64": "0.20.2", - "@esbuild/freebsd-arm64": "0.20.2", - "@esbuild/freebsd-x64": "0.20.2", - "@esbuild/linux-arm": "0.20.2", - "@esbuild/linux-arm64": "0.20.2", - "@esbuild/linux-ia32": "0.20.2", - "@esbuild/linux-loong64": "0.20.2", - "@esbuild/linux-mips64el": "0.20.2", - "@esbuild/linux-ppc64": "0.20.2", - "@esbuild/linux-riscv64": "0.20.2", - "@esbuild/linux-s390x": "0.20.2", - "@esbuild/linux-x64": "0.20.2", - "@esbuild/netbsd-x64": "0.20.2", - "@esbuild/openbsd-x64": "0.20.2", - "@esbuild/sunos-x64": "0.20.2", - "@esbuild/win32-arm64": "0.20.2", - "@esbuild/win32-ia32": "0.20.2", - "@esbuild/win32-x64": "0.20.2" + "@esbuild/aix-ppc64": "0.25.5", + "@esbuild/android-arm": "0.25.5", + "@esbuild/android-arm64": "0.25.5", + "@esbuild/android-x64": "0.25.5", + "@esbuild/darwin-arm64": "0.25.5", + "@esbuild/darwin-x64": "0.25.5", + "@esbuild/freebsd-arm64": "0.25.5", + "@esbuild/freebsd-x64": "0.25.5", + "@esbuild/linux-arm": "0.25.5", + "@esbuild/linux-arm64": "0.25.5", + "@esbuild/linux-ia32": "0.25.5", + "@esbuild/linux-loong64": "0.25.5", + "@esbuild/linux-mips64el": "0.25.5", + "@esbuild/linux-ppc64": "0.25.5", + "@esbuild/linux-riscv64": "0.25.5", + "@esbuild/linux-s390x": "0.25.5", + "@esbuild/linux-x64": "0.25.5", + "@esbuild/netbsd-arm64": "0.25.5", + "@esbuild/netbsd-x64": "0.25.5", + "@esbuild/openbsd-arm64": "0.25.5", + "@esbuild/openbsd-x64": "0.25.5", + "@esbuild/sunos-x64": "0.25.5", + "@esbuild/win32-arm64": "0.25.5", + "@esbuild/win32-ia32": "0.25.5", + "@esbuild/win32-x64": "0.25.5" } }, "node_modules/escalade": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz", - "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==", + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz", + "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==", "dev": true, + "license": "MIT", "engines": { "node": ">=6" } }, - "node_modules/escape-string-regexp": { - "version": "1.0.5", - "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", - "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==", - "dev": true, - "engines": { - "node": ">=0.8.0" - } - }, "node_modules/eslint": { "version": "8.57.0", "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz", @@ -2265,6 +2327,21 @@ "reusify": "^1.0.4" } }, + "node_modules/fdir": { + "version": "6.4.6", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.6.tgz", + "integrity": "sha512-hiFoqpyZcfNm1yc4u8oWCf9A2c4D3QjCrks3zmoVKVxpQRzmPNar1hUJcBG2RQHvEVGDN+Jm81ZheVLAQMK6+w==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "picomatch": "^3 || ^4" + }, + "peerDependenciesMeta": { + "picomatch": { + "optional": true + } + } + }, "node_modules/file-entry-cache": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz", @@ -2334,6 +2411,7 @@ "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", "dev": true, "hasInstallScript": true, + "license": "MIT", "optional": true, "os": [ "darwin" @@ -2383,6 +2461,7 @@ "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz", "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==", "dev": true, + "license": "MIT", "engines": { "node": ">=6.9.0" } @@ -2460,6 +2539,7 @@ "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", "dev": true, + "license": "MIT", "engines": { "node": ">=4" } @@ -2506,15 +2586,6 @@ "url": "https://github.com/sponsors/ljharb" } }, - "node_modules/has-flag": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", - "integrity": "sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==", - "dev": true, - "engines": { - "node": ">=4" - } - }, "node_modules/has-property-descriptors": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz", @@ -3022,15 +3093,16 @@ } }, "node_modules/jsesc": { - "version": "2.5.2", - "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz", - "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==", + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz", + "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==", "dev": true, + "license": "MIT", "bin": { "jsesc": "bin/jsesc" }, "engines": { - "node": ">=4" + "node": ">=6" } }, "node_modules/json-buffer": { @@ -3056,6 +3128,7 @@ "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz", "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==", "dev": true, + "license": "MIT", "bin": { "json5": "lib/cli.js" }, @@ -3137,6 +3210,7 @@ "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==", "dev": true, + "license": "ISC", "dependencies": { "yallist": "^3.0.2" } @@ -3160,9 +3234,9 @@ "dev": true }, "node_modules/nanoid": { - "version": "3.3.7", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz", - "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==", + "version": "3.3.11", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz", + "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==", "dev": true, "funding": [ { @@ -3170,6 +3244,7 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "bin": { "nanoid": "bin/nanoid.cjs" }, @@ -3184,16 +3259,16 @@ "dev": true }, "node_modules/node-releases": { - "version": "2.0.14", - "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz", - "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==", - "dev": true + "version": "2.0.19", + "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.19.tgz", + "integrity": "sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==", + "dev": true, + "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" } @@ -3402,10 +3477,24 @@ "dev": true }, "node_modules/picocolors": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", - "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", - "dev": true + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", + "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==", + "dev": true, + "license": "ISC" + }, + "node_modules/picomatch": { + "version": "4.0.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.2.tgz", + "integrity": "sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } }, "node_modules/possible-typed-array-names": { "version": "1.0.0", @@ -3417,9 +3506,9 @@ } }, "node_modules/postcss": { - "version": "8.4.38", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz", - "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==", + "version": "8.5.4", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.4.tgz", + "integrity": "sha512-QSa9EBe+uwlGTFmHsPKokv3B/oEMQZxfqW0QqNCyhpa6mB1afzulwn8hihglqAb2pOw+BJgNlmXQ8la2VeHB7w==", "dev": true, "funding": [ { @@ -3435,10 +3524,11 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "dependencies": { - "nanoid": "^3.3.7", - "picocolors": "^1.0.0", - "source-map-js": "^1.2.0" + "nanoid": "^3.3.11", + "picocolors": "^1.1.1", + "source-map-js": "^1.2.1" }, "engines": { "node": "^10 || ^12 || >=14" @@ -3457,7 +3547,7 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", - "dev": true, + "license": "MIT", "dependencies": { "loose-envify": "^1.4.0", "object-assign": "^4.1.1", @@ -3519,14 +3609,14 @@ "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.0", - "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.14.0.tgz", - "integrity": "sha512-wViHqhAd8OHeLS/IRMJjTSDHF3U9eWi62F/MledQGPdJGDhodXJ9PBLNGr6WWL7qlH12Mt3TyTpbS+hGXMjCzQ==", + "version": "0.17.0", + "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz", + "integrity": "sha512-z6F7K9bV85EfseRCp2bzrpyQ0Gkw1uLoCel9XBVWPg/TjRj94SkJzUTGfOa4bs7iJvBWtQG0Wq7wnI0syw3EBQ==", "dev": true, + "license": "MIT", "engines": { "node": ">=0.10.0" } @@ -3622,12 +3712,13 @@ } }, "node_modules/rollup": { - "version": "4.13.2", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.13.2.tgz", - "integrity": "sha512-MIlLgsdMprDBXC+4hsPgzWUasLO9CE4zOkj/u6j+Z6j5A4zRY+CtiXAdJyPtgCsc42g658Aeh1DlrdVEJhsL2g==", + "version": "4.42.0", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.42.0.tgz", + "integrity": "sha512-LW+Vse3BJPyGJGAJt1j8pWDKPd73QM8cRXYK1IxOBgL2AGLu7Xd2YOW0M2sLUBCkF5MshXXtMApyEAEzMVMsnw==", "dev": true, + "license": "MIT", "dependencies": { - "@types/estree": "1.0.5" + "@types/estree": "1.0.7" }, "bin": { "rollup": "dist/bin/rollup" @@ -3637,21 +3728,26 @@ "npm": ">=8.0.0" }, "optionalDependencies": { - "@rollup/rollup-android-arm-eabi": "4.13.2", - "@rollup/rollup-android-arm64": "4.13.2", - "@rollup/rollup-darwin-arm64": "4.13.2", - "@rollup/rollup-darwin-x64": "4.13.2", - "@rollup/rollup-linux-arm-gnueabihf": "4.13.2", - "@rollup/rollup-linux-arm64-gnu": "4.13.2", - "@rollup/rollup-linux-arm64-musl": "4.13.2", - "@rollup/rollup-linux-powerpc64le-gnu": "4.13.2", - "@rollup/rollup-linux-riscv64-gnu": "4.13.2", - "@rollup/rollup-linux-s390x-gnu": "4.13.2", - "@rollup/rollup-linux-x64-gnu": "4.13.2", - "@rollup/rollup-linux-x64-musl": "4.13.2", - "@rollup/rollup-win32-arm64-msvc": "4.13.2", - "@rollup/rollup-win32-ia32-msvc": "4.13.2", - "@rollup/rollup-win32-x64-msvc": "4.13.2", + "@rollup/rollup-android-arm-eabi": "4.42.0", + "@rollup/rollup-android-arm64": "4.42.0", + "@rollup/rollup-darwin-arm64": "4.42.0", + "@rollup/rollup-darwin-x64": "4.42.0", + "@rollup/rollup-freebsd-arm64": "4.42.0", + "@rollup/rollup-freebsd-x64": "4.42.0", + "@rollup/rollup-linux-arm-gnueabihf": "4.42.0", + "@rollup/rollup-linux-arm-musleabihf": "4.42.0", + "@rollup/rollup-linux-arm64-gnu": "4.42.0", + "@rollup/rollup-linux-arm64-musl": "4.42.0", + "@rollup/rollup-linux-loongarch64-gnu": "4.42.0", + "@rollup/rollup-linux-powerpc64le-gnu": "4.42.0", + "@rollup/rollup-linux-riscv64-gnu": "4.42.0", + "@rollup/rollup-linux-riscv64-musl": "4.42.0", + "@rollup/rollup-linux-s390x-gnu": "4.42.0", + "@rollup/rollup-linux-x64-gnu": "4.42.0", + "@rollup/rollup-linux-x64-musl": "4.42.0", + "@rollup/rollup-win32-arm64-msvc": "4.42.0", + "@rollup/rollup-win32-ia32-msvc": "4.42.0", + "@rollup/rollup-win32-x64-msvc": "4.42.0", "fsevents": "~2.3.2" } }, @@ -3802,10 +3898,11 @@ } }, "node_modules/source-map-js": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz", - "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==", + "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, + "license": "BSD-3-Clause", "engines": { "node": ">=0.10.0" } @@ -3909,18 +4006,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/supports-color": { - "version": "5.5.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", - "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", - "dev": true, - "dependencies": { - "has-flag": "^3.0.0" - }, - "engines": { - "node": ">=4" - } - }, "node_modules/supports-preserve-symlinks-flag": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", @@ -3939,13 +4024,21 @@ "integrity": "sha512-N+8UisAXDGk8PFXP4HAzVR9nbfmVJ3zYLAWiTIoqC5v5isinhr+r5uaO8+7r3BMfuNIufIsA7RdpVgacC2cSpw==", "dev": true }, - "node_modules/to-fast-properties": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", - "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==", + "node_modules/tinyglobby": { + "version": "0.2.14", + "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz", + "integrity": "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==", "dev": true, + "license": "MIT", + "dependencies": { + "fdir": "^6.4.4", + "picomatch": "^4.0.2" + }, "engines": { - "node": ">=4" + "node": ">=12.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/SuperchupuDev" } }, "node_modules/type-check": { @@ -4061,9 +4154,9 @@ } }, "node_modules/update-browserslist-db": { - "version": "1.0.13", - "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz", - "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==", + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.3.tgz", + "integrity": "sha512-UxhIZQ+QInVdunkDAaiazvvT/+fXL5Osr0JZlJulepYu6Jd7qJtDZjlur0emRlT71EN3ScPoE7gvsuIKKNavKw==", "dev": true, "funding": [ { @@ -4079,9 +4172,10 @@ "url": "https://github.com/sponsors/ai" } ], + "license": "MIT", "dependencies": { - "escalade": "^3.1.1", - "picocolors": "^1.0.0" + "escalade": "^3.2.0", + "picocolors": "^1.1.1" }, "bin": { "update-browserslist-db": "cli.js" @@ -4100,20 +4194,24 @@ } }, "node_modules/vite": { - "version": "5.2.7", - "resolved": "https://registry.npmjs.org/vite/-/vite-5.2.7.tgz", - "integrity": "sha512-k14PWOKLI6pMaSzAuGtT+Cf0YmIx12z9YGon39onaJNy8DLBfBJrzg9FQEmkAM5lpHBZs9wksWAsyF/HkpEwJA==", + "version": "6.3.5", + "resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz", + "integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==", "dev": true, + "license": "MIT", "dependencies": { - "esbuild": "^0.20.1", - "postcss": "^8.4.38", - "rollup": "^4.13.0" + "esbuild": "^0.25.0", + "fdir": "^6.4.4", + "picomatch": "^4.0.2", + "postcss": "^8.5.3", + "rollup": "^4.34.9", + "tinyglobby": "^0.2.13" }, "bin": { "vite": "bin/vite.js" }, "engines": { - "node": "^18.0.0 || >=20.0.0" + "node": "^18.0.0 || ^20.0.0 || >=22.0.0" }, "funding": { "url": "https://github.com/vitejs/vite?sponsor=1" @@ -4122,18 +4220,25 @@ "fsevents": "~2.3.3" }, "peerDependencies": { - "@types/node": "^18.0.0 || >=20.0.0", + "@types/node": "^18.0.0 || ^20.0.0 || >=22.0.0", + "jiti": ">=1.21.0", "less": "*", "lightningcss": "^1.21.0", "sass": "*", + "sass-embedded": "*", "stylus": "*", "sugarss": "*", - "terser": "^5.4.0" + "terser": "^5.16.0", + "tsx": "^4.8.1", + "yaml": "^2.4.2" }, "peerDependenciesMeta": { "@types/node": { "optional": true }, + "jiti": { + "optional": true + }, "less": { "optional": true }, @@ -4143,6 +4248,9 @@ "sass": { "optional": true }, + "sass-embedded": { + "optional": true + }, "stylus": { "optional": true }, @@ -4151,6 +4259,12 @@ }, "terser": { "optional": true + }, + "tsx": { + "optional": true + }, + "yaml": { + "optional": true } } }, @@ -4258,7 +4372,8 @@ "version": "3.1.1", "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz", "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==", - "dev": true + "dev": true, + "license": "ISC" }, "node_modules/yocto-queue": { "version": "0.1.0", diff --git a/package.json b/package.json index eded5715..78486322 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "preview": "vite preview" }, "dependencies": { + "prop-types": "^15.8.1", "react": "^18.2.0", "react-dom": "^18.2.0" }, @@ -21,6 +22,6 @@ "eslint-plugin-react": "^7.34.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.6", - "vite": "^5.2.0" + "vite": "^6.3.5" } } diff --git a/rendermovie/RenderMovie.js b/rendermovie/RenderMovie.js new file mode 100644 index 00000000..3b4700b5 --- /dev/null +++ b/rendermovie/RenderMovie.js @@ -0,0 +1,29 @@ +export function RenderMovie(dataObject){ + const arr = [] + for(let i = 0; i < dataObject.length; i++){ + let movies = dataObject[i] + let items = { + "image": movies.poster_path, + "title": movies.original_title, + "rating": movies.vote_average + } + arr.push(items) + } + return( + arr + ) + +} +const url = 'https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=1'; +const options = { + method: 'GET', + headers: { + accept: 'application/json', + Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' + } +}; + +// fetch(url, options) +// .then(res => res.json()) +// .then(json => console.log(json)) +// .catch(err => console.error(err)); diff --git a/src/App.css b/src/App.css index 0bf65669..66165243 100644 --- a/src/App.css +++ b/src/App.css @@ -1,7 +1,7 @@ .App { text-align: center; + margin: 0; } - .App-header { background-color: #282c34; display: flex; diff --git a/src/App.jsx b/src/App.jsx index dfa91584..6679fb65 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,10 +1,55 @@ -import { useState } from 'react' +import { useEffect, useState } from 'react' import './App.css' - -const App = () => { +import MovieList from './MovieList' +import SearchComponents from './SearchComponents'; +import Sort from "./Sort" +import "./Header.css" +const url = 'https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=1'; +const options = { + method: 'GET', + headers: { + accept: 'application/json', + Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' +} +} +function App(){ + const[movie, setMovie] = useState("Mission Impossible") + const[results, setResults] = useState({}) + useEffect(() => { + async function fetchMovies(movie){ + try{ + const apiKey = import.meta.env.VITE_APP_API_KEY + const response = await fetch(url,options) + if(!response.ok){ + throw new Error("Can't load movies") + } + const data = await response.json() + console.log(data) + setResults(data) + } catch(error){ + console.log(error) + } + }; + if(movie){ + fetchMovies(movie) + } + },[movie]) + function movieChange(newMovie){ + setMovie(newMovie) + } + function resultChange(newResult){ + setResults(newResult) + } + console.log(results) return (
- +
+

🎥 Flixster 🎬

+ + +
+ +
) } diff --git a/src/CardContent.css b/src/CardContent.css new file mode 100644 index 00000000..a7dab317 --- /dev/null +++ b/src/CardContent.css @@ -0,0 +1,26 @@ +.CardContent{ + border: 2px solid black; + border-radius: 10px; + width: 15em; + height: 18em; + display: flex; + flex-direction: column; + justify-content: space-between; + overflow: hidden; +} +.img{ + height: 12em; +} +.CardContent:hover{ + transform: scale(1.1); + transition: 1s ease-in-out; +} +.titleRating{ + background-color: grey; + display: flex; + flex-direction: column; + justify-content: space-between; +} +.titleRating p:first-child{ + font-weight: 700; +} \ No newline at end of file diff --git a/src/CardContent.jsx b/src/CardContent.jsx new file mode 100644 index 00000000..65c1e413 --- /dev/null +++ b/src/CardContent.jsx @@ -0,0 +1,20 @@ +import PropTypes from "prop-types" +import "./CardContent.css" +function CardContent({image, title, rating}){ + const imgURL = `https://image.tmdb.org/t/p/w500/${image}` + return( +
+ {title}/ +
+

{title}

+

Rating: {rating}

+
+
+ ) +} +CardContent.propTypes = { + image: PropTypes.string.isRequired, + title: PropTypes.string.isRequired, + rating: PropTypes.number.isRequired +} +export default CardContent \ No newline at end of file diff --git a/src/Header.css b/src/Header.css new file mode 100644 index 00000000..2695c00b --- /dev/null +++ b/src/Header.css @@ -0,0 +1,19 @@ +.Header{ + background-color: grey; + height: 10em; + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; +} +.Header h1{ + margin-top: 0; +} +/* .headerComponents{ + display: flex; + margin-bottom: 5em; + justify-content: space-around; +} */ +.headerComponents input{ + height: 1.5em; +} \ No newline at end of file diff --git a/src/MovieList.css b/src/MovieList.css new file mode 100644 index 00000000..07f8d867 --- /dev/null +++ b/src/MovieList.css @@ -0,0 +1,11 @@ +.MovieCard{ + display: flex; + flex-wrap: wrap; + gap: 10px; + margin: 50px; +} +.loadBtn{ + background-color: black; + padding: 10px; + +} diff --git a/src/MovieList.jsx b/src/MovieList.jsx new file mode 100644 index 00000000..965e8038 --- /dev/null +++ b/src/MovieList.jsx @@ -0,0 +1,30 @@ +import "./MovieList.css" +import { RenderMovie } from "../rendermovie/RenderMovie" +import CardContent from "./CardContent" +import PropTypes from "prop-types" +// import { useImperativeHandle } from "react" +function MovieList({movie,results}){ + if ('results' in results) { + const movieList = RenderMovie(results.results) + console.log(movieList) + console.log(results) + return( +
+ { + movieList.map((obj,index) => { + return( + + ) + }) + } +
+ ) + } + else { + return ( +
Loading...
+ ) + } +} + +export default MovieList \ No newline at end of file diff --git a/src/SearchComponents.jsx b/src/SearchComponents.jsx new file mode 100644 index 00000000..85af8620 --- /dev/null +++ b/src/SearchComponents.jsx @@ -0,0 +1,15 @@ + function SearchComponents({DataSubmit}){ + function submitFunc(event){ + event.preventDefault(); + const submittedData = event.target.element.inputForm.value + DataSubmit(submittedData) + } + return( +
+ + + +
+ ) +} +export default SearchComponents \ No newline at end of file diff --git a/src/Sort.jsx b/src/Sort.jsx new file mode 100644 index 00000000..f12c2fae --- /dev/null +++ b/src/Sort.jsx @@ -0,0 +1,11 @@ +function Sort(){ + return( + + ) +} +export default Sort \ No newline at end of file diff --git a/src/index.css b/src/index.css index e1faed1a..4ddb619b 100644 --- a/src/index.css +++ b/src/index.css @@ -1,5 +1,6 @@ body { margin: 0; + padding: 0; font-family: Arial, sans-serif; background-color: #f4f4f4; } From 48203f479c1e5c90fc04cc32877bc6bfc98d5d00 Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Wed, 11 Jun 2025 18:17:12 -0700 Subject: [PATCH 02/13] worksofar --- src/App.jsx | 21 +++++++++++----- src/{CardContent.css => MovieCard.css} | 0 src/{CardContent.jsx => MovieCard.jsx} | 10 ++++---- src/MovieList.jsx | 8 +++---- src/SearchComponents.jsx | 33 +++++++++++++++++++------- src/Sort.jsx | 33 ++++++++++++++++++++------ 6 files changed, 76 insertions(+), 29 deletions(-) rename src/{CardContent.css => MovieCard.css} (100%) rename src/{CardContent.jsx => MovieCard.jsx} (74%) diff --git a/src/App.jsx b/src/App.jsx index 6679fb65..706c0d42 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -2,9 +2,10 @@ import { useEffect, useState } from 'react' import './App.css' import MovieList from './MovieList' import SearchComponents from './SearchComponents'; -import Sort from "./Sort" import "./Header.css" -const url = 'https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=1'; +import Sort from "./Sort" +// let pageNumber = 1 +//const url = `https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`; const options = { method: 'GET', headers: { @@ -15,11 +16,16 @@ const options = { function App(){ const[movie, setMovie] = useState("Mission Impossible") const[results, setResults] = useState({}) + const[pageNumber, setPageNumber] = useState(1) + function toNextPage(){ + setPageNumber(pageNumber+1) + } + useEffect(() => { async function fetchMovies(movie){ try{ const apiKey = import.meta.env.VITE_APP_API_KEY - const response = await fetch(url,options) + const response = await fetch(`https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`,options) if(!response.ok){ throw new Error("Can't load movies") } @@ -33,7 +39,7 @@ function App(){ if(movie){ fetchMovies(movie) } - },[movie]) + },[pageNumber,movie]) function movieChange(newMovie){ setMovie(newMovie) } @@ -45,11 +51,14 @@ function App(){

🎥 Flixster 🎬

- +
- + +
+

© joseph akintunde 2024

+
) } diff --git a/src/CardContent.css b/src/MovieCard.css similarity index 100% rename from src/CardContent.css rename to src/MovieCard.css diff --git a/src/CardContent.jsx b/src/MovieCard.jsx similarity index 74% rename from src/CardContent.jsx rename to src/MovieCard.jsx index 65c1e413..288b4781 100644 --- a/src/CardContent.jsx +++ b/src/MovieCard.jsx @@ -1,6 +1,6 @@ import PropTypes from "prop-types" -import "./CardContent.css" -function CardContent({image, title, rating}){ +import "./MovieCard.css" +function MovieCard({image, title, rating}){ const imgURL = `https://image.tmdb.org/t/p/w500/${image}` return(
@@ -9,12 +9,14 @@ function CardContent({image, title, rating}){

{title}

Rating: {rating}

+

🤍

+

👁️

) } -CardContent.propTypes = { +MovieCard.propTypes = { image: PropTypes.string.isRequired, title: PropTypes.string.isRequired, rating: PropTypes.number.isRequired } -export default CardContent \ No newline at end of file +export default MovieCard \ No newline at end of file diff --git a/src/MovieList.jsx b/src/MovieList.jsx index 965e8038..4be678c0 100644 --- a/src/MovieList.jsx +++ b/src/MovieList.jsx @@ -1,19 +1,19 @@ import "./MovieList.css" import { RenderMovie } from "../rendermovie/RenderMovie" -import CardContent from "./CardContent" +import MovieCard from "./MovieCard" import PropTypes from "prop-types" // import { useImperativeHandle } from "react" function MovieList({movie,results}){ if ('results' in results) { const movieList = RenderMovie(results.results) - console.log(movieList) - console.log(results) + //console.log(movieList) + //console.log(results) return(
{ movieList.map((obj,index) => { return( - + ) }) } diff --git a/src/SearchComponents.jsx b/src/SearchComponents.jsx index 85af8620..f54ca110 100644 --- a/src/SearchComponents.jsx +++ b/src/SearchComponents.jsx @@ -1,13 +1,30 @@ - function SearchComponents({DataSubmit}){ - function submitFunc(event){ - event.preventDefault(); - const submittedData = event.target.element.inputForm.value - DataSubmit(submittedData) +import { use, useEffect, useState } from 'react' +import MovieCard from './MovieCard' +const options = { + method: 'GET', + headers: { + accept: 'application/json', + Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' +}} +function SearchComponents({setResults}){ + const [searchMovie, setSearchMovie] = useState('') + function handleSearchChange(text){ + setSearchMovie(text) + + } + async function handleSearch(e){ + e.preventDefault() + const apiKey = import.meta.env.VITE_APP_API_KEY + const response = await fetch(`https://api.themoviedb.org/3/search/movie?query=${searchMovie}`,options) + const data = await response.json() + console.log(data) + + setResults(data) } return( -
- - + + handleSearchChange(e.target.value)}/> +
) diff --git a/src/Sort.jsx b/src/Sort.jsx index f12c2fae..8b1beac4 100644 --- a/src/Sort.jsx +++ b/src/Sort.jsx @@ -1,11 +1,30 @@ -function Sort(){ +import MovieCard from "./MovieCard" +import { useState } from "react" +const options = { + method: 'GET', + headers: { + accept: 'application/json', + Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' +}} +function Sort({setResults}){ + const[sortMovie, setSortMovie] = useState({}) + async function handleSearch(e){ + e.preventDefault() + + // const apiKey = import.meta.env.VITE_APP_API_KEY + // const response = await fetch(`https://api.themoviedb.org/3/search/movie?query=${sort}`,options) + // const data = await response.json() + // console.log(data) + + // setResults(data) + } return( - + ) } export default Sort \ No newline at end of file From c2f42f65ae66cbea92c7e8a9ff75600fa959193b Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Thu, 12 Jun 2025 08:05:59 -0700 Subject: [PATCH 03/13] thursday-commit --- src/App.jsx | 22 ++++++++++------- src/MovieCard.css | 4 +-- src/MovieCard.jsx | 53 ++++++++++++++++++++++++++++++++++++---- src/MovieList.css | 10 +++++--- src/MovieList.jsx | 4 +-- src/MovieModal.css | 19 ++++++++++++++ src/MovieModal.jsx | 20 +++++++++++++++ src/SearchComponents.jsx | 2 +- src/Sort.jsx | 15 ++++++------ 9 files changed, 119 insertions(+), 30 deletions(-) create mode 100644 src/MovieModal.css create mode 100644 src/MovieModal.jsx diff --git a/src/App.jsx b/src/App.jsx index 706c0d42..2e7b5a6e 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -4,6 +4,7 @@ import MovieList from './MovieList' import SearchComponents from './SearchComponents'; import "./Header.css" import Sort from "./Sort" +import { MovieModal } from './MovieModal'; // let pageNumber = 1 //const url = `https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`; const options = { @@ -14,6 +15,8 @@ const options = { } } function App(){ + const [openModal, setOpenModal] = useState(false) + const [selectedMovie, setSelectedMovie] = useState(null) const[movie, setMovie] = useState("Mission Impossible") const[results, setResults] = useState({}) const[pageNumber, setPageNumber] = useState(1) @@ -30,7 +33,7 @@ function App(){ throw new Error("Can't load movies") } const data = await response.json() - console.log(data) + console.log(data) setResults(data) } catch(error){ console.log(error) @@ -40,21 +43,22 @@ function App(){ fetchMovies(movie) } },[pageNumber,movie]) - function movieChange(newMovie){ - setMovie(newMovie) - } - function resultChange(newResult){ - setResults(newResult) - } + // function movieChange(newMovie){ + // setMovie(newMovie) + // } + // function resultChange(newResult){ + // setResults(newResult) + // } console.log(results) return (

🎥 Flixster 🎬

- + {/* */}
- + {setSelectedMovie(movie); setOpenModal(true)}} results={results} movie = {movie}/> + {openModal && }

© joseph akintunde 2024

diff --git a/src/MovieCard.css b/src/MovieCard.css index a7dab317..70557173 100644 --- a/src/MovieCard.css +++ b/src/MovieCard.css @@ -2,14 +2,14 @@ border: 2px solid black; border-radius: 10px; width: 15em; - height: 18em; + height: 25em; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; } .img{ - height: 12em; + height: 15.5em; } .CardContent:hover{ transform: scale(1.1); diff --git a/src/MovieCard.jsx b/src/MovieCard.jsx index 288b4781..27b9ab21 100644 --- a/src/MovieCard.jsx +++ b/src/MovieCard.jsx @@ -1,22 +1,65 @@ import PropTypes from "prop-types" import "./MovieCard.css" -function MovieCard({image, title, rating}){ +import { useEffect, useState } from "react" +function MovieCard({image, title, rating, onClick}){ + const likesKey = `likes: ${title}` + const likedKey = `liked: ${title}` + const[likes, setLikes] = useState(0) + const[liked,setLiked] = useState(true) + + const watchKey = `watches: ${title}` + const watchedKey = `watched: ${title}` + const[watch, setWatch] = useState(0) + const[watched,setWatched] = useState(true) + useEffect(() => { + const storedLikes = localStorage.getItem(likesKey) + const storedLiked = localStorage.getItem(likedKey) + if(storedLikes) setLikes(parseInt(storedLikes)) + if(storedLiked==='true') setLiked(true) + },[likedKey, likesKey]) + useEffect(() => { + const storedWatch = localStorage.getItem(watchKey) + const storedWatched = localStorage.getItem(watchedKey) + if(storedWatch) setWatch(parseInt(storedWatch)) + if(storedWatched==='true') setWatched(true) + },[watchedKey, watchKey]) + function liker(){ + const newLiked = !liked + const newLikes = newLiked? likes+1:likes-1 + setLikes(newLikes) + setLiked(newLiked) + + localStorage.setItem(likesKey,newLikes.toString()) + localStorage.setItem(likedKey,newLiked.toString()) + } + function watcher(){ + const newWatched = !watched + const newWatch = newWatched ? watched + 1: watched - 1 + setWatch(newWatch) + setWatched(newWatched) + + localStorage.setItem(watchKey,newWatch.toString()) + localStorage.setItem(watchedKey,newWatched.toString()) + + } const imgURL = `https://image.tmdb.org/t/p/w500/${image}` return( -
+
{title}/

{title}

Rating: {rating}

+ +
-

🤍

-

👁️

+
) } MovieCard.propTypes = { image: PropTypes.string.isRequired, title: PropTypes.string.isRequired, - rating: PropTypes.number.isRequired + rating: PropTypes.number.isRequired, + onClick: PropTypes.func.isRequired } export default MovieCard \ No newline at end of file diff --git a/src/MovieList.css b/src/MovieList.css index 07f8d867..644300b5 100644 --- a/src/MovieList.css +++ b/src/MovieList.css @@ -1,9 +1,11 @@ .MovieCard{ - display: flex; - flex-wrap: wrap; - gap: 10px; - margin: 50px; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); + gap: 2rem; + padding: .5rem; + justify-content: center; } + .loadBtn{ background-color: black; padding: 10px; diff --git a/src/MovieList.jsx b/src/MovieList.jsx index 4be678c0..40c793e7 100644 --- a/src/MovieList.jsx +++ b/src/MovieList.jsx @@ -3,7 +3,7 @@ import { RenderMovie } from "../rendermovie/RenderMovie" import MovieCard from "./MovieCard" import PropTypes from "prop-types" // import { useImperativeHandle } from "react" -function MovieList({movie,results}){ +function MovieList({onClick,results}){ if ('results' in results) { const movieList = RenderMovie(results.results) //console.log(movieList) @@ -13,7 +13,7 @@ function MovieList({movie,results}){ { movieList.map((obj,index) => { return( - + onClick(obj)}/> ) }) } diff --git a/src/MovieModal.css b/src/MovieModal.css new file mode 100644 index 00000000..a7b54d32 --- /dev/null +++ b/src/MovieModal.css @@ -0,0 +1,19 @@ +.ModalBackground{ + width: 100%; + height: 100%; + background-color: rgba(0,0,0,0.2); + display: flex; + justify-content: center; + align-items: center; +} +.ModalContent{ + background-color: lightgrey; + width: 70%; + margin: auto; + height: 50em; + position: fixed; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + +} diff --git a/src/MovieModal.jsx b/src/MovieModal.jsx new file mode 100644 index 00000000..74e753ed --- /dev/null +++ b/src/MovieModal.jsx @@ -0,0 +1,20 @@ +import { useState } from "react" +import "./MovieModal.css" +import PropTypes from "prop-types" +export function MovieModal({closeModal,movie}){ + return( +
+
+

{movie.title}

+ {movie.title} +

Release Date: {movie.release_date}

+ {/*

Genre: {movie.genre_ids.}

*/} +

Overview:

+ +
+
+ ) +} +MovieModal.propTypes = { + movie: PropTypes.object.isRequired +} \ No newline at end of file diff --git a/src/SearchComponents.jsx b/src/SearchComponents.jsx index f54ca110..c5b1cbad 100644 --- a/src/SearchComponents.jsx +++ b/src/SearchComponents.jsx @@ -25,7 +25,7 @@ function SearchComponents({setResults}){
handleSearchChange(e.target.value)}/> - +
) } diff --git a/src/Sort.jsx b/src/Sort.jsx index 8b1beac4..2e1d7fcc 100644 --- a/src/Sort.jsx +++ b/src/Sort.jsx @@ -1,5 +1,5 @@ import MovieCard from "./MovieCard" -import { useState } from "react" +import { useEffect, useState } from "react" const options = { method: 'GET', headers: { @@ -7,10 +7,11 @@ const options = { Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' }} function Sort({setResults}){ - const[sortMovie, setSortMovie] = useState({}) + const[sortMovie, setSortMovie] = useState('title') + const[sortedMovie, setSortedMovie] = useState('movies') async function handleSearch(e){ e.preventDefault() - + // const apiKey = import.meta.env.VITE_APP_API_KEY // const response = await fetch(`https://api.themoviedb.org/3/search/movie?query=${sort}`,options) // const data = await response.json() @@ -19,11 +20,11 @@ function Sort({setResults}){ // setResults(data) } return( - setSortMovie(e.target.value)}> - - - + + + ) } From 543e53371c3c34f23aeeef0f1e84d599dac76e90 Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Thu, 12 Jun 2025 12:46:32 -0700 Subject: [PATCH 04/13] yes --- .gitignore | 2 ++ rendermovie/RenderMovie.js | 24 ++++++++++++-------- src/App.jsx | 18 +++++++++------ src/MovieCard.css | 2 +- src/MovieCard.jsx | 43 ++++++++++++++++++++++-------------- src/MovieList.jsx | 1 + src/MovieModal.css | 18 +++++++++++---- src/MovieModal.jsx | 45 +++++++++++++++++++++++++++++--------- src/Sort.jsx | 37 ++++++++++++++++++++----------- 9 files changed, 129 insertions(+), 61 deletions(-) diff --git a/.gitignore b/.gitignore index a547bf36..3b0b4037 100644 --- a/.gitignore +++ b/.gitignore @@ -22,3 +22,5 @@ dist-ssr *.njsproj *.sln *.sw? + +.env \ No newline at end of file diff --git a/rendermovie/RenderMovie.js b/rendermovie/RenderMovie.js index 3b4700b5..c5ef855c 100644 --- a/rendermovie/RenderMovie.js +++ b/rendermovie/RenderMovie.js @@ -2,10 +2,16 @@ export function RenderMovie(dataObject){ const arr = [] for(let i = 0; i < dataObject.length; i++){ let movies = dataObject[i] + console.log(movies) let items = { "image": movies.poster_path, "title": movies.original_title, - "rating": movies.vote_average + "rating": movies.vote_average, + "overview": movies.overview, + "runtime": movies.runtime, + "release_date": movies.release_date, + "genres": movies.genres, + "id": movies.id } arr.push(items) } @@ -14,14 +20,14 @@ export function RenderMovie(dataObject){ ) } -const url = 'https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=1'; -const options = { - method: 'GET', - headers: { - accept: 'application/json', - Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' - } -}; +// const url = 'https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=1'; +// const options = { +// method: 'GET', +// headers: { +// accept: 'application/json', +// Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' +// } +// }; // fetch(url, options) // .then(res => res.json()) diff --git a/src/App.jsx b/src/App.jsx index 2e7b5a6e..94abddb4 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -16,7 +16,7 @@ const options = { } function App(){ const [openModal, setOpenModal] = useState(false) - const [selectedMovie, setSelectedMovie] = useState(null) + //const [selectedMovie, setSelectedMovie] = useState(null) const[movie, setMovie] = useState("Mission Impossible") const[results, setResults] = useState({}) const[pageNumber, setPageNumber] = useState(1) @@ -26,6 +26,7 @@ function App(){ useEffect(() => { async function fetchMovies(movie){ + console.log("any") try{ const apiKey = import.meta.env.VITE_APP_API_KEY const response = await fetch(`https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`,options) @@ -43,22 +44,25 @@ function App(){ fetchMovies(movie) } },[pageNumber,movie]) - // function movieChange(newMovie){ - // setMovie(newMovie) + useEffect(() => { + console.log(movie) + },[movie]) + //function movieChange(newMovie){ + // setMovie(newMovie) // } // function resultChange(newResult){ // setResults(newResult) // } - console.log(results) + console.log(movie) return (

🎥 Flixster 🎬

- {/* */} +
- {setSelectedMovie(movie); setOpenModal(true)}} results={results} movie = {movie}/> - {openModal && } + {setMovie(movie); setOpenModal(true)}} results={results} movie = {movie}/> + {openModal && }

© joseph akintunde 2024

diff --git a/src/MovieCard.css b/src/MovieCard.css index 70557173..991d7c06 100644 --- a/src/MovieCard.css +++ b/src/MovieCard.css @@ -9,7 +9,7 @@ overflow: hidden; } .img{ - height: 15.5em; + height: 14em; } .CardContent:hover{ transform: scale(1.1); diff --git a/src/MovieCard.jsx b/src/MovieCard.jsx index 27b9ab21..4416e456 100644 --- a/src/MovieCard.jsx +++ b/src/MovieCard.jsx @@ -1,40 +1,45 @@ import PropTypes from "prop-types" import "./MovieCard.css" import { useEffect, useState } from "react" +import { MovieModal } from "./MovieModal" function MovieCard({image, title, rating, onClick}){ + const [openModal, setOpenModal] = useState(false) + const likesKey = `likes: ${title}` const likedKey = `liked: ${title}` const[likes, setLikes] = useState(0) const[liked,setLiked] = useState(true) - - const watchKey = `watches: ${title}` - const watchedKey = `watched: ${title}` - const[watch, setWatch] = useState(0) - const[watched,setWatched] = useState(true) useEffect(() => { const storedLikes = localStorage.getItem(likesKey) const storedLiked = localStorage.getItem(likedKey) if(storedLikes) setLikes(parseInt(storedLikes)) if(storedLiked==='true') setLiked(true) },[likedKey, likesKey]) + function liker(){ + const newLiked = !liked + console.log(newLiked) + const newLikes = newLiked? likes-1:likes+1 + setLikes(newLikes) + setLiked(newLiked) + localStorage.setItem(likesKey,newLikes.toString()) + localStorage.setItem(likedKey,newLiked.toString()) + } + + const watchKey = `watches: ${title}` + const watchedKey = `watched: ${title}` + const[watch, setWatch] = useState(0) + const[watched,setWatched] = useState(true) + useEffect(() => { const storedWatch = localStorage.getItem(watchKey) const storedWatched = localStorage.getItem(watchedKey) if(storedWatch) setWatch(parseInt(storedWatch)) if(storedWatched==='true') setWatched(true) - },[watchedKey, watchKey]) - function liker(){ - const newLiked = !liked - const newLikes = newLiked? likes+1:likes-1 - setLikes(newLikes) - setLiked(newLiked) + },[watchedKey, watchKey]) - localStorage.setItem(likesKey,newLikes.toString()) - localStorage.setItem(likedKey,newLiked.toString()) - } function watcher(){ const newWatched = !watched - const newWatch = newWatched ? watched + 1: watched - 1 + const newWatch = newWatched ? watch - 1: watch + 1 setWatch(newWatch) setWatched(newWatched) @@ -49,8 +54,12 @@ function MovieCard({image, title, rating, onClick}){

{title}

Rating: {rating}

- - + +
diff --git a/src/MovieList.jsx b/src/MovieList.jsx index 40c793e7..a1e77ee4 100644 --- a/src/MovieList.jsx +++ b/src/MovieList.jsx @@ -12,6 +12,7 @@ function MovieList({onClick,results}){
{ movieList.map((obj,index) => { + console.log(obj) return( onClick(obj)}/> ) diff --git a/src/MovieModal.css b/src/MovieModal.css index a7b54d32..adcbc659 100644 --- a/src/MovieModal.css +++ b/src/MovieModal.css @@ -1,13 +1,19 @@ .ModalBackground{ - width: 100%; - height: 100%; - background-color: rgba(0,0,0,0.2); + /* width: 100%; + height: 100%; */ + background-color: rgba(0, 0, 0, 0.7); + position: fixed; + top: 0; + bottom: 0; + right: 0; + left: 0; display: flex; justify-content: center; align-items: center; } .ModalContent{ background-color: lightgrey; + overflow: scroll; width: 70%; margin: auto; height: 50em; @@ -15,5 +21,9 @@ left: 50%; top: 50%; transform: translate(-50%, -50%); - +} +.ModalContent img{ + height: 60%; + display: flex; + justify-content: center; } diff --git a/src/MovieModal.jsx b/src/MovieModal.jsx index 74e753ed..4bb0a81b 100644 --- a/src/MovieModal.jsx +++ b/src/MovieModal.jsx @@ -1,20 +1,45 @@ -import { useState } from "react" +import { useEffect, useState } from "react" import "./MovieModal.css" import PropTypes from "prop-types" -export function MovieModal({closeModal,movie}){ +export function MovieModal({closeModal,keyId,title,image,release_date,overview}){ + const[runtime, setRuntime] = useState(null) + const[genres, setGenres] = useState([]) + const url = `https://api.themoviedb.org/3/movie/${keyId}?language=en-US`; + const options = { + method: 'GET', + headers: { + accept: 'application/json', + Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' + } +}; +useEffect(() => { + if(!keyId) return; + fetch(url, options) + .then(res => res.json()) + .then(data => { + setRuntime(data.runtime) + setGenres(data.genres || []) + }) + .catch(err => console.error(err)) + +},[keyId]) +function runtimeInHours(minutes){ + if(!minutes) return; + return `${Math.floor(minutes/60)}h ${minutes%60}m` +} + return(
-

{movie.title}

- {movie.title} -

Release Date: {movie.release_date}

- {/*

Genre: {movie.genre_ids.}

*/} -

Overview:

+

{title}

+ {title} +

Release Date: {release_date}

+

Runtime: {runtimeInHours(runtime)}

+

Genre: {genres.map((genre) => genre.name).join(", ")}

+

Overview: {overview}

+
) } -MovieModal.propTypes = { - movie: PropTypes.object.isRequired -} \ No newline at end of file diff --git a/src/Sort.jsx b/src/Sort.jsx index 2e1d7fcc..9dbf6545 100644 --- a/src/Sort.jsx +++ b/src/Sort.jsx @@ -6,21 +6,32 @@ const options = { accept: 'application/json', Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' }} -function Sort({setResults}){ - const[sortMovie, setSortMovie] = useState('title') - const[sortedMovie, setSortedMovie] = useState('movies') - async function handleSearch(e){ - e.preventDefault() - - // const apiKey = import.meta.env.VITE_APP_API_KEY - // const response = await fetch(`https://api.themoviedb.org/3/search/movie?query=${sort}`,options) - // const data = await response.json() - // console.log(data) - - // setResults(data) +function Sort({setResults,movies}){ + console.log(movies) + let Sorted = null; + const [sortType, setSortType] = useState('') + const newMovies = [...movies] + if(sortType === "title"){ + Sorted = newMovies.sort((a,b) => a.title.localeCompare(b.title)) + } else if(sortType === "rating"){ + Sorted = newMovies.sort((a,b) => { + return b.rating - a.rating + }); + } else if(sortType === "releaseDate"){ + Sorted = newMovies.sort((a,b) => { + const date1 = new Date(a.release_date) + const date2 = new Date(b.release_date) + return date2 - date1 + }) + }else{ + Sorted = movies } + useEffect(()=>{ + const newSortedItems = Sort(movies) + setResults(newSortedItems) + },[sortType]) return( - setSortType(e.target.value)}> From f02ca67678d9ff0ad6b8f46d5575111a062c9e08 Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Thu, 12 Jun 2025 14:47:11 -0700 Subject: [PATCH 05/13] commit --- src/MovieList.jsx | 1 + src/SearchComponents.jsx | 1 - src/Sort.jsx | 16 ++++++++++------ 3 files changed, 11 insertions(+), 7 deletions(-) diff --git a/src/MovieList.jsx b/src/MovieList.jsx index a1e77ee4..ed2d3a09 100644 --- a/src/MovieList.jsx +++ b/src/MovieList.jsx @@ -5,6 +5,7 @@ import PropTypes from "prop-types" // import { useImperativeHandle } from "react" function MovieList({onClick,results}){ if ('results' in results) { + console.log(results) const movieList = RenderMovie(results.results) //console.log(movieList) //console.log(results) diff --git a/src/SearchComponents.jsx b/src/SearchComponents.jsx index c5b1cbad..4ec3b21d 100644 --- a/src/SearchComponents.jsx +++ b/src/SearchComponents.jsx @@ -10,7 +10,6 @@ function SearchComponents({setResults}){ const [searchMovie, setSearchMovie] = useState('') function handleSearchChange(text){ setSearchMovie(text) - } async function handleSearch(e){ e.preventDefault() diff --git a/src/Sort.jsx b/src/Sort.jsx index 9dbf6545..579e1338 100644 --- a/src/Sort.jsx +++ b/src/Sort.jsx @@ -8,10 +8,11 @@ const options = { }} function Sort({setResults,movies}){ console.log(movies) - let Sorted = null; const [sortType, setSortType] = useState('') - const newMovies = [...movies] - if(sortType === "title"){ + function SortMovies(movies, sortType){ + let Sorted = null; + const newMovies = movies ?[...movies]:[] + if(sortType === "title"){ Sorted = newMovies.sort((a,b) => a.title.localeCompare(b.title)) } else if(sortType === "rating"){ Sorted = newMovies.sort((a,b) => { @@ -24,11 +25,14 @@ function Sort({setResults,movies}){ return date2 - date1 }) }else{ - Sorted = movies + Sorted = newMovies } + } + useEffect(()=>{ - const newSortedItems = Sort(movies) - setResults(newSortedItems) + const newSortedItems = SortMovies(movies.results,sortType) + let mov = {results: newSortedItems} + setResults(mov) },[sortType]) return( setSortType(e.target.value)}> + setSortType(e.target.value)}> - - - - - - ) + return Sorted; + } + + useEffect(() => { + const newSortedItems = SortMovies(movies, sortType); + let mov = { results: newSortedItems }; + setResults(newSortedItems); + }, [sortType]); + return ( + + ); } -export default Sort \ No newline at end of file +export default Sort; From 5e302ac00f9e600190a88cd26b721fa46783d8f8 Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Fri, 13 Jun 2025 15:56:16 -0700 Subject: [PATCH 10/13] final commit. everything working --- src/Sort.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Sort.jsx b/src/Sort.jsx index 368fa5a7..9b1efc3a 100644 --- a/src/Sort.jsx +++ b/src/Sort.jsx @@ -20,7 +20,7 @@ function Sort({ setResults, movies }) { Sorted = newMovies.sort((a, b) => a.title.localeCompare(b.title)); } else if (sortType === "rating") { Sorted = newMovies.sort((a, b) => { - return b.rating - a.rating; + return b.vote_average - a.vote_average; }); } else if (sortType === "releaseDate") { Sorted = newMovies.sort((a, b) => { From cc079180142ddf44070c621a824162ffd559169a Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Fri, 13 Jun 2025 16:11:21 -0700 Subject: [PATCH 11/13] submission --- README.md | 131 +++++++++++++++++- src/App.jsx | 26 +--- src/MovieList.jsx | 16 +-- src/{img => assets}/imagesgit.png | Bin .../instagram.png} | Bin .../linkedin.png} | Bin 6 files changed, 131 insertions(+), 42 deletions(-) rename src/{img => assets}/imagesgit.png (100%) rename src/{img/instagram-logo-black-transparent.png => assets/instagram.png} (100%) rename src/{img/linkedin-icon-1-logo-png-transparent.png => assets/linkedin.png} (100%) diff --git a/README.md b/README.md index f768e33f..129b1b2c 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,129 @@ -# React + Vite +📝 `NOTE` Use this template to initialize the contents of a README.md file for your application. As you work on your assignment over the course of the week, update the required or stretch features lists to indicate which features you have completed by changing `[ ]` to `[x]`. (🚫 Remove this paragraph before submitting your assignment.) -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. +## Unit Assignment: Flixster -Currently, two official plugins are available: +Submitted by: JOSEPH AKINTUNDE -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh +Estimated time spent: 20 HOURS + +Deployed Application (**required**): [Flixster Deployed Site](ADD_LINK_HERE) + +### Application Features + +#### REQUIRED FEATURES + +- [ ] **Display Movies** + - [ ] Users can view a list of current movies from The Movie Database API in a grid view. + - [ ] Movie tiles should be reasonably sized (at least 6 playlists on your laptop when full screen; large enough that the playlist components detailed in the next feature are legible). + - [ ] For each movie displayed, users can see the movie's: + - [ ] Title + - [ ] Poster image + - [ ] Vote average + - [ ] Users can load more current movies by clicking a button which adds more movies to the grid without reloading the entire page. +- [ ] **Search Functionality** + - [ ] Users can use a search bar to search for movies by title. + - [ ] The search bar should include: + - [ ] Text input field + - [ ] Submit/Search button + - [ ] Clear button + - [ ] Movies with a title containing the search query in the text input field are displayed in a grid view when the user either: + - [ ] Presses the Enter key + - [ ] Clicks the Submit/Search button + - [ ] Users can click the Clear button. When clicked: + - [ ] Most recent search results are cleared from the text input field and the grid view and all current movies are displayed in a grid view +- [ ] **Design Features** + - [ ] Website implements all of the following accessibility features: + - [ ] Semantic HTML + - [ ] [Color contrast](https://webaim.org/resources/contrastchecker/) + - [ ] Alt text for images + - [ ] Website implements responsive web design. + - [ ] Uses CSS Flexbox or CSS Grid + - [ ] Movie tiles and images shrink/grow in response to window size + - [ ] Users can click on a movie tile to view more details about a movie in a pop-up modal. + - [ ] The pop-up window is centered in the screen and does not occupy the entire screen. + - [ ] The pop-up window has a shadow to show that it is a pop-up and appears floating on the screen. + - [ ] The backdrop of the pop-up appears darker or in a different shade than before. including: + - [ ] The pop-up displays additional details about the moving including: + - [ ] Runtime in minutes + - [ ] Backdrop poster + - [ ] Release date + - [ ] Genres + - [ ] An overview + - [ ] Users can use a drop-down menu to sort movies. + - [ ] Drop-down allows movies to be sorted by: + - [ ] Title (alphabetic, A-Z) + - [ ] Release date (chronologically, most recent to oldest) + - [ ] Vote average (descending, highest to lowest) + - [ ] When a sort option is clicked, movies display in a grid according to selected criterion. + - [ ] Website displays: + - [ ] Header section + - [ ] Banner section + - [ ] Search bar + - [ ] Movie grid + - [ ] Footer section + - [ ] **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS**: To ease the grading process, please use the [color contrast checker](https://webaim.org/resources/contrastchecker/) to demonstrate to the grading team that text and background colors on your website have appropriate contrast. The Contrast Ratio should be above 4.5:1 and should have a green box surrounding it. + - [ ] **Deployment** + - [ ] Website is deployed via Render. + - [ ] **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS**: For ease of grading, please use the deployed version of your website when creating your walkthrough. + +#### STRETCH FEATURES + + +- [ ] **Embedded Movie Trailers** + - [ ] Within the pop-up modal displaying a movie's details, the movie trailer is viewable. + - [ ] When the trailer is clicked, users can play the movie trailer. +- [ ] **Favorite Button** + - [ ] For each movie displayed, users can favorite the movie. + - [ ] There should be visual element (such as a heart icon) on each movie's tile to show whether or not the movie has been favorited. + - [ ] If the movie is not favorited: + - [ ] Clicking on the visual element should mark the movie as favorited + - [ ] There should be visual feedback (such as the heart turning a different color) to show that the movie has been favorited by the user. + - [ ] If the movie is already favorited: + - [ ] Clicking on the visual element should mark the movie as *not* favorited. + - [ ] There should be visual feedback (such as the heart turning a different color) to show that the movie has been unfavorited. +- [ ] **Watched Checkbox** + - [ ] For each movie displayed, users can mark the movie as watched. + - [ ] There should be visual element (such as an eye icon) on each movie's tile to show whether or not the movie has been watched. + - [ ] If the movie has not been watched: + - [ ] Clicking on the visual element should mark the movie as watched + - [ ] There should be visual feedback (such as the eye turning a different color) to show that the movie has been watched by the user. + - [ ] If the movie is already watched: + - [ ] Clicking on the visual element should mark the movie as *not* watched. + - [ ] There should be visual feedback (such as the eye turning a different color) to show that the movie has not been watched. +- [ ] **Sidebar** + - [ ] The website includes a side navigation bar. + - [ ] The sidebar has three pages: + - [ ] Home + - [ ] Favorites + - [ ] Watched + - [ ] The Home page displays all current movies in a grid view, the search bar, and the sort movies drop-down. + - [ ] The Favorites page displays all favorited movies in a grid view. + - [ ] The Watched page displays all watched movies in a grid view. + +### Walkthrough Video + +`TODO://` Add the embedded URL code to your animated app walkthrough below, `ADD_EMBEDDED_CODE_HERE`. Make sure the video or gif actually renders and animates when viewing this README. Ensure your walkthrough showcases the presence and/or functionality of all features you implemented above (check them off as you film!). Pay attention to any **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS** checkboxes listed above to ensure graders see the full functionality of your website! (🚫 Remove this paragraph after adding walkthrough video) + +`ADD_EMBEDDED_CODE_HERE` + +### Reflection + +* Did the topics discussed in your labs prepare you to complete the assignment? Be specific, which features in your weekly assignment did you feel unprepared to complete? + +Add your response here + +* If you had more time, what would you have done differently? Would you have added additional features? Changed the way your project responded to a particular event, etc. + +Add your response here + +* Reflect on your project demo, what went well? Were there things that maybe didn't go as planned? Did you notice something that your peer did that you would like to try next time? + +Add your response here + +### Open-source libraries used + +- Add any links to open-source libraries used in your project. + +### Shout out + +Give a shout out to somebody from your cohort that especially helped you during your project. This can be a fellow peer, instructor, TA, mentor, etc. \ No newline at end of file diff --git a/src/App.jsx b/src/App.jsx index ddb136b1..dcff2239 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,12 +1,4 @@ import { useEffect, useState } from "react"; -import { - BrowserRouter as Router, - Routes, - Route, - Link, - useNavigate, - Outlet, -} from "react-router-dom"; import "./App.css"; import MovieList from "./MovieList"; import SearchComponents from "./SearchComponents"; @@ -14,10 +6,6 @@ import "./Header.css"; import Sort from "./Sort"; import { MovieModal } from "./MovieModal"; import "./footer.css"; -//import { Sidebar } from './sidebar'; - -// let pageNumber = 1 -//const url = `https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`; const options = { method: "GET", headers: { @@ -59,17 +47,9 @@ function App() { console.log("mess"); fetchMovies(); }, [pageNumber]); - - // useEffect(() => { - // console.log(movie); - // }, [movie]); - // console.log(movie); return (
- {/* NOW PLAYING - FAVOURITES - WATCHED */}

🎥 Flixster 🎬

@@ -106,19 +86,19 @@ function App() { - +
diff --git a/src/MovieList.jsx b/src/MovieList.jsx index a6c7752f..4c759385 100644 --- a/src/MovieList.jsx +++ b/src/MovieList.jsx @@ -2,15 +2,9 @@ import "./MovieList.css" import { RenderMovie } from "../rendermovie/RenderMovie" import MovieCard from "./MovieCard" import PropTypes from "prop-types" -// import { useImperativeHandle } from "react" + function MovieList({onClick,results}){ - // console.log(results) - // if ('results' in results) { - // console.log(results) - //console.log(movieList) - // if(results.results){ - // movieList = RenderMovie(results.results) - // } + console.log(results) const movieList = RenderMovie(results) return( @@ -25,11 +19,5 @@ function MovieList({onClick,results}){
) } -// // else { -// // return ( -// //
Loading...
-// // ) -// // } -// } export default MovieList \ No newline at end of file diff --git a/src/img/imagesgit.png b/src/assets/imagesgit.png similarity index 100% rename from src/img/imagesgit.png rename to src/assets/imagesgit.png diff --git a/src/img/instagram-logo-black-transparent.png b/src/assets/instagram.png similarity index 100% rename from src/img/instagram-logo-black-transparent.png rename to src/assets/instagram.png diff --git a/src/img/linkedin-icon-1-logo-png-transparent.png b/src/assets/linkedin.png similarity index 100% rename from src/img/linkedin-icon-1-logo-png-transparent.png rename to src/assets/linkedin.png From 608ddfd87086427e3d9a001dd715b4fb77d653f2 Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Fri, 13 Jun 2025 16:43:42 -0700 Subject: [PATCH 12/13] final. --- README.md | 164 ++++++++++++++++++++++++++---------------------------- 1 file changed, 80 insertions(+), 84 deletions(-) diff --git a/README.md b/README.md index 129b1b2c..ac2c10ac 100644 --- a/README.md +++ b/README.md @@ -1,95 +1,93 @@ -📝 `NOTE` Use this template to initialize the contents of a README.md file for your application. As you work on your assignment over the course of the week, update the required or stretch features lists to indicate which features you have completed by changing `[ ]` to `[x]`. (🚫 Remove this paragraph before submitting your assignment.) - ## Unit Assignment: Flixster Submitted by: JOSEPH AKINTUNDE Estimated time spent: 20 HOURS -Deployed Application (**required**): [Flixster Deployed Site](ADD_LINK_HERE) +Deployed Application (**required**): [Flixster Deployed Site](https://flixster-starter-w6kv.onrender.com) ### Application Features #### REQUIRED FEATURES -- [ ] **Display Movies** - - [ ] Users can view a list of current movies from The Movie Database API in a grid view. - - [ ] Movie tiles should be reasonably sized (at least 6 playlists on your laptop when full screen; large enough that the playlist components detailed in the next feature are legible). - - [ ] For each movie displayed, users can see the movie's: - - [ ] Title - - [ ] Poster image - - [ ] Vote average - - [ ] Users can load more current movies by clicking a button which adds more movies to the grid without reloading the entire page. -- [ ] **Search Functionality** - - [ ] Users can use a search bar to search for movies by title. - - [ ] The search bar should include: - - [ ] Text input field - - [ ] Submit/Search button - - [ ] Clear button - - [ ] Movies with a title containing the search query in the text input field are displayed in a grid view when the user either: - - [ ] Presses the Enter key - - [ ] Clicks the Submit/Search button - - [ ] Users can click the Clear button. When clicked: - - [ ] Most recent search results are cleared from the text input field and the grid view and all current movies are displayed in a grid view -- [ ] **Design Features** - - [ ] Website implements all of the following accessibility features: - - [ ] Semantic HTML - - [ ] [Color contrast](https://webaim.org/resources/contrastchecker/) - - [ ] Alt text for images - - [ ] Website implements responsive web design. - - [ ] Uses CSS Flexbox or CSS Grid - - [ ] Movie tiles and images shrink/grow in response to window size - - [ ] Users can click on a movie tile to view more details about a movie in a pop-up modal. - - [ ] The pop-up window is centered in the screen and does not occupy the entire screen. - - [ ] The pop-up window has a shadow to show that it is a pop-up and appears floating on the screen. - - [ ] The backdrop of the pop-up appears darker or in a different shade than before. including: - - [ ] The pop-up displays additional details about the moving including: - - [ ] Runtime in minutes - - [ ] Backdrop poster - - [ ] Release date - - [ ] Genres - - [ ] An overview - - [ ] Users can use a drop-down menu to sort movies. - - [ ] Drop-down allows movies to be sorted by: - - [ ] Title (alphabetic, A-Z) - - [ ] Release date (chronologically, most recent to oldest) - - [ ] Vote average (descending, highest to lowest) - - [ ] When a sort option is clicked, movies display in a grid according to selected criterion. - - [ ] Website displays: - - [ ] Header section - - [ ] Banner section - - [ ] Search bar - - [ ] Movie grid - - [ ] Footer section - - [ ] **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS**: To ease the grading process, please use the [color contrast checker](https://webaim.org/resources/contrastchecker/) to demonstrate to the grading team that text and background colors on your website have appropriate contrast. The Contrast Ratio should be above 4.5:1 and should have a green box surrounding it. - - [ ] **Deployment** - - [ ] Website is deployed via Render. - - [ ] **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS**: For ease of grading, please use the deployed version of your website when creating your walkthrough. +- [X] **Display Movies** + - [X] Users can view a list of current movies from The Movie Database API in a grid view. + - [X] Movie tiles should be reasonably sized (at least 6 playlists on your laptop when full screen; large enough that the playlist components detailed in the next feature are legible). + - [X] For each movie displayed, users can see the movie's: + - [X] Title + - [X] Poster image + - [X] Vote average + - [X] Users can load more current movies by clicking a button which adds more movies to the grid without reloading the entire page. +- [X] **Search Functionality** + - [X] Users can use a search bar to search for movies by title. + - [X] The search bar should include: + - [X] Text input field + - [X] Submit/Search button + - [X] Clear button + - [X] Movies with a title containing the search query in the text input field are displayed in a grid view when the user either: + - [X] Presses the Enter key + - [X] Clicks the Submit/Search button + - [X] Users can click the Clear button. When clicked: + - [X] Most recent search results are cleared from the text input field and the grid view and all current movies are displayed in a grid view +- [X] **Design Features** + - [X] Website implements all of the following accessibility features: + - [X] Semantic HTML + - [X] [Color contrast](https://webaim.org/resources/contrastchecker/) + - [X] Alt text for images + - [X] Website implements responsive web design. + - [X] Uses CSS Flexbox or CSS Grid + - [X] Movie tiles and images shrink/grow in response to window size + - [X] Users can click on a movie tile to view more details about a movie in a pop-up modal. + - [X] The pop-up window is centered in the screen and does not occupy the entire screen. + - [X] The pop-up window has a shadow to show that it is a pop-up and appears floating on the screen. + - [X] The backdrop of the pop-up appears darker or in a different shade than before. including: + - [X] The pop-up displays additional details about the moving including: + - [X] Runtime in minutes + - [X] Backdrop poster + - [X] Release date + - [X] Genres + - [X] An overview + - [X] Users can use a drop-down menu to sort movies. + - [X] Drop-down allows movies to be sorted by: + - [X] Title (alphabetic, A-Z) + - [X] Release date (chronologically, most recent to oldest) + - [X] Vote average (descending, highest to lowest) + - [X] When a sort option is clicked, movies display in a grid according to selected criterion. + - [X] Website displays: + - [X] Header section + - [X] Banner section + - [X] Search bar + - [X] Movie grid + - [X] Footer section + - [X] **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS**: To ease the grading process, please use the [color contrast checker](https://webaim.org/resources/contrastchecker/) to demonstrate to the grading team that text and background colors on your website have appropriate contrast. The Contrast Ratio should be above 4.5:1 and should have a green box surrounding it. + - [X] **Deployment** + - [X] Website is deployed via Render. + - [X] **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS**: For ease of grading, please use the deployed version of your website when creating your walkthrough. #### STRETCH FEATURES -- [ ] **Embedded Movie Trailers** - - [ ] Within the pop-up modal displaying a movie's details, the movie trailer is viewable. - - [ ] When the trailer is clicked, users can play the movie trailer. -- [ ] **Favorite Button** - - [ ] For each movie displayed, users can favorite the movie. - - [ ] There should be visual element (such as a heart icon) on each movie's tile to show whether or not the movie has been favorited. - - [ ] If the movie is not favorited: - - [ ] Clicking on the visual element should mark the movie as favorited - - [ ] There should be visual feedback (such as the heart turning a different color) to show that the movie has been favorited by the user. - - [ ] If the movie is already favorited: - - [ ] Clicking on the visual element should mark the movie as *not* favorited. - - [ ] There should be visual feedback (such as the heart turning a different color) to show that the movie has been unfavorited. -- [ ] **Watched Checkbox** - - [ ] For each movie displayed, users can mark the movie as watched. - - [ ] There should be visual element (such as an eye icon) on each movie's tile to show whether or not the movie has been watched. - - [ ] If the movie has not been watched: - - [ ] Clicking on the visual element should mark the movie as watched - - [ ] There should be visual feedback (such as the eye turning a different color) to show that the movie has been watched by the user. - - [ ] If the movie is already watched: - - [ ] Clicking on the visual element should mark the movie as *not* watched. - - [ ] There should be visual feedback (such as the eye turning a different color) to show that the movie has not been watched. +- [X] **Embedded Movie Trailers** + - [X] Within the pop-up modal displaying a movie's details, the movie trailer is viewable. + - [X] When the trailer is clicked, users can play the movie trailer. +- [X] **Favorite Button** + - [X] For each movie displayed, users can favorite the movie. + - [X] There should be visual element (such as a heart icon) on each movie's tile to show whether or not the movie has been favorited. + - [X] If the movie is not favorited: + - [X] Clicking on the visual element should mark the movie as favorited + - [X] There should be visual feedback (such as the heart turning a different color) to show that the movie has been favorited by the user. + - [X] If the movie is already favorited: + - [X] Clicking on the visual element should mark the movie as *not* favorited. + - [X] There should be visual feedback (such as the heart turning a different color) to show that the movie has been unfavorited. +- [X] **Watched Checkbox** + - [X] For each movie displayed, users can mark the movie as watched. + - [X] There should be visual element (such as an eye icon) on each movie's tile to show whether or not the movie has been watched. + - [X] If the movie has not been watched: + - [X] Clicking on the visual element should mark the movie as watched + - [X] There should be visual feedback (such as the eye turning a different color) to show that the movie has been watched by the user. + - [X] If the movie is already watched: + - [X] Clicking on the visual element should mark the movie as *not* watched. + - [X] There should be visual feedback (such as the eye turning a different color) to show that the movie has not been watched. - [ ] **Sidebar** - [ ] The website includes a side navigation bar. - [ ] The sidebar has three pages: @@ -102,23 +100,21 @@ Deployed Application (**required**): [Flixster Deployed Site](ADD_LINK_HERE) ### Walkthrough Video -`TODO://` Add the embedded URL code to your animated app walkthrough below, `ADD_EMBEDDED_CODE_HERE`. Make sure the video or gif actually renders and animates when viewing this README. Ensure your walkthrough showcases the presence and/or functionality of all features you implemented above (check them off as you film!). Pay attention to any **VIDEO WALKTHROUGH SPECIAL INSTRUCTIONS** checkboxes listed above to ensure graders see the full functionality of your website! (🚫 Remove this paragraph after adding walkthrough video) - -`ADD_EMBEDDED_CODE_HERE` +
### Reflection * Did the topics discussed in your labs prepare you to complete the assignment? Be specific, which features in your weekly assignment did you feel unprepared to complete? -Add your response here +Abssolutely! I applied a lot of things i learned last week to this project. An example woud be the liked and watched feature * If you had more time, what would you have done differently? Would you have added additional features? Changed the way your project responded to a particular event, etc. -Add your response here +Completed the Sidebar stretch feature. * Reflect on your project demo, what went well? Were there things that maybe didn't go as planned? Did you notice something that your peer did that you would like to try next time? -Add your response here +Surprisingly, the sort was kind of complicated. I changed my code three times to get it to work ### Open-source libraries used @@ -126,4 +122,4 @@ Add your response here ### Shout out -Give a shout out to somebody from your cohort that especially helped you during your project. This can be a fellow peer, instructor, TA, mentor, etc. \ No newline at end of file +Shoutout to the always helpful, super nice instructors namely Virsaviya, Ebony, Tom, Matthew, Paulo, and Erika. Also to my buddies Noble Matthew, Braden Jones, Caleb Calderon, Charles McClasky, Chioma Ibe, and Yaw Boateng. Also, Joie Whitmon, Kayleen Ramirez, and Kingston Davies. \ No newline at end of file From 560c841a57d479213b782f90ee7401db5b6dab8b Mon Sep 17 00:00:00 2001 From: Joseph Akintunde Date: Sun, 15 Jun 2025 02:44:08 -0700 Subject: [PATCH 13/13] personal --- rendermovie/RenderMovie.js | 19 ++++-------------- src/App.jsx | 40 +++++++++++++++++++------------------- src/MovieList.jsx | 12 ++++++------ src/SearchComponents.jsx | 12 ++++++------ 4 files changed, 36 insertions(+), 47 deletions(-) diff --git a/rendermovie/RenderMovie.js b/rendermovie/RenderMovie.js index c5ef855c..5d191d97 100644 --- a/rendermovie/RenderMovie.js +++ b/rendermovie/RenderMovie.js @@ -1,9 +1,11 @@ +//utility function to iterate over the array that has the movie details. it's in an object that has the whole movie details in the API export function RenderMovie(dataObject){ const arr = [] for(let i = 0; i < dataObject.length; i++){ let movies = dataObject[i] console.log(movies) let items = { + //the items for these things are stored as that in the array i.e poster_path, runtime, overview "image": movies.poster_path, "title": movies.original_title, "rating": movies.vote_average, @@ -13,23 +15,10 @@ export function RenderMovie(dataObject){ "genres": movies.genres, "id": movies.id } - arr.push(items) + arr.push(items) //add it to an array named arr } return( - arr + arr // return the array ) } -// const url = 'https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=1'; -// const options = { -// method: 'GET', -// headers: { -// accept: 'application/json', -// Authorization: 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJhdWQiOiI2NGM4OGY3ZWI4ZDU2YThkNWYzYjY3MzI4ZjU2YTM2ZSIsIm5iZiI6MTc0OTUzMzI3OC4yMjcsInN1YiI6IjY4NDdjMjVlZWM3MzI5M2NkN2JiMzZhYiIsInNjb3BlcyI6WyJhcGlfcmVhZCJdLCJ2ZXJzaW9uIjoxfQ.Uhoqn3XL1sDXT-jJhsIbVMI2gzkhF5hzYOgdF9M8zA0' -// } -// }; - -// fetch(url, options) -// .then(res => res.json()) -// .then(json => console.log(json)) -// .catch(err => console.error(err)); diff --git a/src/App.jsx b/src/App.jsx index dcff2239..a61ad9f0 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -15,30 +15,27 @@ const options = { }, }; function App() { - const [openModal, setOpenModal] = useState(false); - //const [selectedMovie, setSelectedMovie] = useState(null) - const [movie, setMovie] = useState("Mission Impossible"); - const [results, setResults] = useState([]); - const [pageNumber, setPageNumber] = useState(1); + const [openModal, setOpenModal] = useState(false); //default state of modal + const [movie, setMovie] = useState("Mission Impossible"); //default state of movie + const [results, setResults] = useState([]); //default state of results array + const [pageNumber, setPageNumber] = useState(1); //default state of page number function toNextPage() { setPageNumber(pageNumber + 1); - } - async function fetchMovies(page = pageNumber) { - console.log("any"); + } //function to increase the page number. used for the load more functionality + async function fetchMovies(page = pageNumber) { //function to actually fetch the movies try { const apiKey = import.meta.env.VITE_APP_API_KEY; const response = await fetch( - `https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`, + `https://api.themoviedb.org/3/movie/now_playing?language=en-US&page=${pageNumber}`, // API call options ); - if (!response.ok) { - throw new Error("Can't load movies"); + if (!response.ok) { //if the call wasn't succesful, + throw new Error("Can't load movies"); //message this. } const data = await response.json(); - console.log(data); - setResults((prev) => page > 1 ? [...prev, ...data.results] : data.results); + //console.log(data); + setResults((prev) => page > 1 ? [...prev, ...data.results] : data.results);//set results to be prev and next page combined if page number is greater than 1, otherwise set it to be just prev page. // setResults(data.results); - console.log(data.results); } catch (error) { console.log(error); } @@ -46,22 +43,24 @@ function App() { useEffect(() => { console.log("mess"); fetchMovies(); - }, [pageNumber]); + }, [pageNumber]);//calling the function fetchMovies and making it change as pageNumber changes return (

🎥 Flixster 🎬

- - + +
- { setMovie(movie); setOpenModal(true); }} results={results} /> - {openModal && ( + {openModal && ( //modal content )} -