Hugyouu/Letterboxd-Diary-Posters-Picker
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Fix poster selection and cart

Browse Source
This commit is contained in:
Pierret Hugo
2024-12-22 01:38:31 +01:00
parent d127beed48
commit 0d08d06aba
10 changed files with 334 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

221
package-lock.json generated
View File

@@ -8,13 +8,13 @@
"name": "frontend",
"version": "0.1.0",
"dependencies": {
"@emotion/react": "^11.13.3",
"@emotion/styled": "^11.13.0",
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.0",
"@material-ui/core": "^4.12.4",
"@material-ui/icons": "^4.11.3",
"@mui/icons-material": "^6.0.1",
"@mui/lab": "^6.0.0-beta.9",
"@mui/material": "^6.0.1",
"@mui/material": "^6.2.0",
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
@@ -29,6 +29,7 @@
"react-scripts": "5.0.1",
"redux": "^5.0.1",
"redux-persist": "^6.0.0",
"reselect": "^5.1.1",
"sass": "^1.80.3",
"web-vitals": "^2.1.4"
},
@@ -2127,10 +2128,9 @@
"license": "MIT"
},
"node_modules/@babel/runtime": {
"version": "7.25.6",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.6.tgz",
"integrity": "sha512-VBj9MYyDb9tuLq7yzqjgzt6Q+IBQLrGZfdjOekyEirZPHxXWoTSGUTMrpsfi58Up73d13NfYLv8HT9vmznjzhQ==",
"license": "MIT",
"version": "7.26.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.26.0.tgz",
"integrity": "sha512-FDSOghenHTiToteC/QRlv2q3DhPZ/oOXTBoirfWNx1Cx3TMVcGWQtMMmQcSvb/JjpNeGzx8Pq/b4fKEJuWm1sw==",
"dependencies": {
"regenerator-runtime": "^0.14.0"
},
@@ -2477,16 +2477,15 @@
}
},
"node_modules/@emotion/babel-plugin": {
"version": "11.12.0",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz",
"integrity": "sha512-y2WQb+oP8Jqvvclh8Q55gLUyb7UFvgv7eJfsj7td5TToBrIUtPay2kMrZi4xjq9qw2vD0ZR5fSho0yqoFgX7Rw==",
"license": "MIT",
"version": "11.13.5",
"resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.13.5.tgz",
"integrity": "sha512-pxHCpT2ex+0q+HH91/zsdHkw/lXd468DIN2zvfvLtPKLLMo6gQj7oLObq8PhkrxOZb/gGCq03S3Z7PDhS8pduQ==",
"dependencies": {
"@babel/helper-module-imports": "^7.16.7",
"@babel/runtime": "^7.18.3",
"@emotion/hash": "^0.9.2",
"@emotion/memoize": "^0.9.0",
"@emotion/serialize": "^1.2.0",
"@emotion/serialize": "^1.3.3",
"babel-plugin-macros": "^3.1.0",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^4.0.0",
@@ -2498,20 +2497,17 @@
"node_modules/@emotion/babel-plugin/node_modules/@emotion/hash": {
"version": "0.9.2",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz",
"integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==",
"license": "MIT"
"integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g=="
},
"node_modules/@emotion/babel-plugin/node_modules/convert-source-map": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
"integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==",
"license": "MIT"
"integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A=="
},
"node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
"integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
"license": "MIT",
"engines": {
"node": ">=10"
},
@@ -2523,20 +2519,18 @@
"version": "0.5.7",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
"integrity": "sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==",
"license": "BSD-3-Clause",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/@emotion/cache": {
"version": "11.13.1",
"resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.1.tgz",
"integrity": "sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==",
"license": "MIT",
"version": "11.14.0",
"resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.14.0.tgz",
"integrity": "sha512-L/B1lc/TViYk4DcpGxtAVbx0ZyiKM5ktoIyafGkH6zg/tj+mA+NE//aPYKG0k8kCHSHVJrpLpcAlOBEXQ3SavA==",
"dependencies": {
"@emotion/memoize": "^0.9.0",
"@emotion/sheet": "^1.4.0",
"@emotion/utils": "^1.4.0",
"@emotion/utils": "^1.4.2",
"@emotion/weak-memoize": "^0.4.0",
"stylis": "4.2.0"
}
@@ -2563,17 +2557,16 @@
"license": "MIT"
},
"node_modules/@emotion/react": {
"version": "11.13.3",
"resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.3.tgz",
"integrity": "sha512-lIsdU6JNrmYfJ5EbUCf4xW1ovy5wKQ2CkPRM4xogziOxH1nXxBSjpC9YqbFAP7circxMfYp+6x676BqWcEiixg==",
"license": "MIT",
"version": "11.14.0",
"resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.14.0.tgz",
"integrity": "sha512-O000MLDBDdk/EohJPFUqvnp4qnHeYkVP5B0xEG0D/L7cOKP9kefu2DXn8dj74cQfsEzUqh+sr1RzFqiL1o+PpA==",
"dependencies": {
"@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.12.0",
"@emotion/cache": "^11.13.0",
"@emotion/serialize": "^1.3.1",
"@emotion/use-insertion-effect-with-fallbacks": "^1.1.0",
"@emotion/utils": "^1.4.0",
"@emotion/babel-plugin": "^11.13.5",
"@emotion/cache": "^11.14.0",
"@emotion/serialize": "^1.3.3",
"@emotion/use-insertion-effect-with-fallbacks": "^1.2.0",
"@emotion/utils": "^1.4.2",
"@emotion/weak-memoize": "^0.4.0",
"hoist-non-react-statics": "^3.3.1"
},
@@ -2587,23 +2580,21 @@
}
},
"node_modules/@emotion/serialize": {
"version": "1.3.1",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.1.tgz",
"integrity": "sha512-dEPNKzBPU+vFPGa+z3axPRn8XVDetYORmDC0wAiej+TNcOZE70ZMJa0X7JdeoM6q/nWTMZeLpN/fTnD9o8MQBA==",
"license": "MIT",
"version": "1.3.3",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.3.tgz",
"integrity": "sha512-EISGqt7sSNWHGI76hC7x1CksiXPahbxEOrC5RjmFRJTqLyEK9/9hZvBbiYn70dw4wuwMKiEMCUlR6ZXTSWQqxA==",
"dependencies": {
"@emotion/hash": "^0.9.2",
"@emotion/memoize": "^0.9.0",
"@emotion/unitless": "^0.10.0",
"@emotion/utils": "^1.4.0",
"@emotion/utils": "^1.4.2",
"csstype": "^3.0.2"
}
},
"node_modules/@emotion/serialize/node_modules/@emotion/hash": {
"version": "0.9.2",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz",
"integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==",
"license": "MIT"
"integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g=="
},
"node_modules/@emotion/sheet": {
"version": "1.4.0",
@@ -2612,17 +2603,16 @@
"license": "MIT"
},
"node_modules/@emotion/styled": {
"version": "11.13.0",
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz",
"integrity": "sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==",
"license": "MIT",
"version": "11.14.0",
"resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.14.0.tgz",
"integrity": "sha512-XxfOnXFffatap2IyCeJyNov3kiDQWoR08gPUQxvbL7fxKryGBKUZUkG6Hz48DZwVrJSVh9sJboyV1Ds4OW6SgA==",
"dependencies": {
"@babel/runtime": "^7.18.3",
"@emotion/babel-plugin": "^11.12.0",
"@emotion/babel-plugin": "^11.13.5",
"@emotion/is-prop-valid": "^1.3.0",
"@emotion/serialize": "^1.3.0",
"@emotion/use-insertion-effect-with-fallbacks": "^1.1.0",
"@emotion/utils": "^1.4.0"
"@emotion/serialize": "^1.3.3",
"@emotion/use-insertion-effect-with-fallbacks": "^1.2.0",
"@emotion/utils": "^1.4.2"
},
"peerDependencies": {
"@emotion/react": "^11.0.0-rc.0",
@@ -2637,23 +2627,20 @@
"node_modules/@emotion/unitless": {
"version": "0.10.0",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.10.0.tgz",
"integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg==",
"license": "MIT"
"integrity": "sha512-dFoMUuQA20zvtVTuxZww6OHoJYgrzfKM1t52mVySDJnMSEa08ruEvdYQbhvyu6soU+NeLVd3yKfTfT0NeV6qGg=="
},
"node_modules/@emotion/use-insertion-effect-with-fallbacks": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz",
"integrity": "sha512-+wBOcIV5snwGgI2ya3u99D7/FJquOIniQT1IKyDsBmEgwvpxMNeS65Oib7OnE2d2aY+3BU4OiH+0Wchf8yk3Hw==",
"license": "MIT",
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.2.0.tgz",
"integrity": "sha512-yJMtVdH59sxi/aVJBpk9FQq+OR8ll5GT8oWd57UpeaKEVGab41JWaCFA7FRLoMLloOZF/c/wsPoe+bfGmRKgDg==",
"peerDependencies": {
"react": ">=16.8.0"
}
},
"node_modules/@emotion/utils": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.0.tgz",
"integrity": "sha512-spEnrA1b6hDR/C68lC2M7m6ALPUHZC0lIY7jAS/B/9DuuO1ZP04eov8SMv/6fwRd8pzmsn2AuJEznRREWlQrlQ==",
"license": "MIT"
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.2.tgz",
"integrity": "sha512-3vLclRofFziIa3J2wDh9jjbkUz9qk5Vi3IZ/FSTKViB0k+ef0fPV7dYrUIugbgupYDx7v9ud/SjrtEP8Y4xLoA=="
},
"node_modules/@emotion/weak-memoize": {
"version": "0.4.0",
@@ -3933,10 +3920,9 @@
"license": "MIT"
},
"node_modules/@mui/core-downloads-tracker": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.0.1.tgz",
"integrity": "sha512-TmKkCTwgtwvlFTF1tZzG4lYbi7v6NGweEJwFBZoIWZrkF1OLa0xu4umifmIyd+bVIScsEj//E2AD6bOJbPMOOQ==",
"license": "MIT",
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-6.2.0.tgz",
"integrity": "sha512-Nn5PSkUqbDrvezpiiiYZiAbX4SFEiy3CbikUL6pWOXEUsq+L1j50OOyyUIHpaX2Hr+5V5UxTh+fPeC4nsGNhdw==",
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/mui-org"
@@ -4023,22 +4009,21 @@
}
},
"node_modules/@mui/material": {
"version": "6.0.1",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-6.0.1.tgz",
"integrity": "sha512-gOJS0RKYs9lRACaTluXPNopxFpIBhWVmhf09lHpqpPlR6bujXhuiTE2Q8puensdz3Qm2JGzl1VjccYHieV1g8A==",
"license": "MIT",
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@mui/material/-/material-6.2.0.tgz",
"integrity": "sha512-7FXXUPIyYzP02a7GvqwJ7ocmdP+FkvLvmy/uxG1TDmTlsr8nEClQp75uxiVznJqAY/jJy4d+Rj/fNWNxwidrYQ==",
"dependencies": {
"@babel/runtime": "^7.25.0",
"@mui/core-downloads-tracker": "^6.0.1",
"@mui/system": "^6.0.1",
"@mui/types": "^7.2.16",
"@mui/utils": "^6.0.1",
"@babel/runtime": "^7.26.0",
"@mui/core-downloads-tracker": "^6.2.0",
"@mui/system": "^6.2.0",
"@mui/types": "^7.2.19",
"@mui/utils": "^6.2.0",
"@popperjs/core": "^2.11.8",
"@types/react-transition-group": "^4.4.11",
"clsx": "^2.1.1",
"csstype": "^3.1.3",
"prop-types": "^15.8.1",
"react-is": "^18.3.1",
"react-is": "^19.0.0",
"react-transition-group": "^4.4.5"
},
"engines": {
@@ -4051,7 +4036,7 @@
"peerDependencies": {
"@emotion/react": "^11.5.0",
"@emotion/styled": "^11.3.0",
"@mui/material-pigment-css": "^6.0.1",
"@mui/material-pigment-css": "^6.2.0",
"@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
@@ -4081,19 +4066,17 @@
}
},
"node_modules/@mui/material/node_modules/react-is": {
"version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
"integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
"license": "MIT"
"version": "19.0.0",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-19.0.0.tgz",
"integrity": "sha512-H91OHcwjZsbq3ClIDHMzBShc1rotbfACdWENsmEf0IFvZ3FgGPtdHMcsv45bQ1hAbgdfiA8SnxTKfDS+x/8m2g=="
},
"node_modules/@mui/private-theming": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-6.0.2.tgz",
"integrity": "sha512-emddFcRhA0hPGVIwIbW5g0V8vtCgw2g/H/A7jTdGe7dpCWEPpp6jPIXRRKcEUWgmg91R6rBNfV+LFHxBxmZXOQ==",
"license": "MIT",
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-6.2.0.tgz",
"integrity": "sha512-lYd2MrVddhentF1d/cMXKnwlDjr/shbO3A2eGq22PCYUoZaqtAGZMc0U86KnJ/Sh5YzNYePqTOaaowAN8Qea8A==",
"dependencies": {
"@babel/runtime": "^7.25.0",
"@mui/utils": "^6.0.2",
"@babel/runtime": "^7.26.0",
"@mui/utils": "^6.2.0",
"prop-types": "^15.8.1"
},
"engines": {
@@ -4114,13 +4097,14 @@
}
},
"node_modules/@mui/styled-engine": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-6.0.2.tgz",
"integrity": "sha512-qd3Vlhted0SYVGotnCfVNcxff7vW2WN0fclbAexff60NeNS1qs/H/CImHEHUBiUGeNWMPRochbN6VF1arQ7/jA==",
"license": "MIT",
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-6.2.0.tgz",
"integrity": "sha512-rV4YCu6kcCjMnHFXU/tQcL6XfYVfFVR8n3ZVNGnk2rpXnt/ctOPJsF+eUQuhkHciueLVKpI06+umr1FxWWhVmQ==",
"dependencies": {
"@babel/runtime": "^7.25.0",
"@emotion/cache": "^11.13.1",
"@babel/runtime": "^7.26.0",
"@emotion/cache": "^11.13.5",
"@emotion/serialize": "^1.3.3",
"@emotion/sheet": "^1.4.0",
"csstype": "^3.1.3",
"prop-types": "^15.8.1"
},
@@ -4146,16 +4130,15 @@
}
},
"node_modules/@mui/system": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/@mui/system/-/system-6.0.2.tgz",
"integrity": "sha512-AZv1/C4PuHgWFTA8YraIzl3FTVLdRz0RIMRwEADWZBdIhnuTHS/4+r8qE9+3CcpTHg1WsEu8btaO3AhQahSM9A==",
"license": "MIT",
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@mui/system/-/system-6.2.0.tgz",
"integrity": "sha512-DCeqev9Cd4f4pm3O1lqSGW/DIHHBG6ZpqMX9iIAvN4asYv+pPWv2/lKov9kWk5XThhxFnGSv93SRNE1kNRRg5Q==",
"dependencies": {
"@babel/runtime": "^7.25.0",
"@mui/private-theming": "^6.0.2",
"@mui/styled-engine": "^6.0.2",
"@mui/types": "^7.2.16",
"@mui/utils": "^6.0.2",
"@babel/runtime": "^7.26.0",
"@mui/private-theming": "^6.2.0",
"@mui/styled-engine": "^6.2.0",
"@mui/types": "^7.2.19",
"@mui/utils": "^6.2.0",
"clsx": "^2.1.1",
"csstype": "^3.1.3",
"prop-types": "^15.8.1"
@@ -4195,10 +4178,9 @@
}
},
"node_modules/@mui/types": {
"version": "7.2.16",
"resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.16.tgz",
"integrity": "sha512-qI8TV3M7ShITEEc8Ih15A2vLzZGLhD+/UPNwck/hcls2gwg7dyRjNGXcQYHKLB5Q7PuTRfrTkAoPa2VV1s67Ag==",
"license": "MIT",
"version": "7.2.19",
"resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.19.tgz",
"integrity": "sha512-6XpZEM/Q3epK9RN8ENoXuygnqUQxE+siN/6rGRi2iwJPgBUR25mphYQ9ZI87plGh58YoZ5pp40bFvKYOCDJ3tA==",
"peerDependencies": {
"@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0"
},
@@ -4209,17 +4191,16 @@
}
},
"node_modules/@mui/utils": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.0.2.tgz",
"integrity": "sha512-TeFrYsxcmeoDSlkoPhX+LjIuuqC5Pyj+xz2kRceKCkUpwMNTEeVOfowXDPe+mboZwmpJ5ZxP4eiAgQMdeEasjg==",
"license": "MIT",
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@mui/utils/-/utils-6.2.0.tgz",
"integrity": "sha512-77CaFJi+OIi2SjbPwCis8z5DXvE0dfx9hBz5FguZHt1VYFlWEPCWTHcMsQCahSErnfik5ebLsYK8+D+nsjGVfw==",
"dependencies": {
"@babel/runtime": "^7.25.0",
"@mui/types": "^7.2.16",
"@types/prop-types": "^15.7.12",
"@babel/runtime": "^7.26.0",
"@mui/types": "^7.2.19",
"@types/prop-types": "^15.7.14",
"clsx": "^2.1.1",
"prop-types": "^15.8.1",
"react-is": "^18.3.1"
"react-is": "^19.0.0"
},
"engines": {
"node": ">=14.0.0"
@@ -4248,10 +4229,9 @@
}
},
"node_modules/@mui/utils/node_modules/react-is": {
"version": "18.3.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
"integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
"license": "MIT"
"version": "19.0.0",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-19.0.0.tgz",
"integrity": "sha512-H91OHcwjZsbq3ClIDHMzBShc1rotbfACdWENsmEf0IFvZ3FgGPtdHMcsv45bQ1hAbgdfiA8SnxTKfDS+x/8m2g=="
},
"node_modules/@nicolo-ribaudo/eslint-scope-5-internals": {
"version": "5.1.1-v1",
@@ -5726,10 +5706,9 @@
"license": "MIT"
},
"node_modules/@types/prop-types": {
"version": "15.7.12",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.12.tgz",
"integrity": "sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==",
"license": "MIT"
"version": "15.7.14",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.14.tgz",
"integrity": "sha512-gNMvNH49DJ7OJYv+KAKn0Xp45p8PLl6zo2YnvDIbTd4J6MER2BmWN49TG7n9LvkyihINxeKW8+3bfS2yDC9dzQ=="
},
"node_modules/@types/q": {
"version": "1.5.8",
@@ -10311,8 +10290,7 @@
"node_modules/find-root": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==",
"license": "MIT"
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
},
"node_modules/find-up": {
"version": "4.1.0",
@@ -18016,6 +17994,11 @@
"integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
"license": "MIT"
},
"node_modules/reselect": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/reselect/-/reselect-5.1.1.tgz",
"integrity": "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w=="
},
"node_modules/resolve": {
"version": "1.22.8",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz",

7
package.json
View File

@@ -3,13 +3,13 @@
"version": "0.1.0",
"homepage": "https://hugyouu.github.io/Letterboxd-Diary-Posters-Picker",
"dependencies": {
"@emotion/react": "^11.13.3",
"@emotion/styled": "^11.13.0",
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.0",
"@material-ui/core": "^4.12.4",
"@material-ui/icons": "^4.11.3",
"@mui/icons-material": "^6.0.1",
"@mui/lab": "^6.0.0-beta.9",
"@mui/material": "^6.0.1",
"@mui/material": "^6.2.0",
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
@@ -24,6 +24,7 @@
"react-scripts": "5.0.1",
"redux": "^5.0.1",
"redux-persist": "^6.0.0",
"reselect": "^5.1.1",
"sass": "^1.80.3",
"web-vitals": "^2.1.4"
},

55
src/components/Cart.js
View File

@@ -1,8 +1,7 @@
import React, { useState } from "react";
import { useSelector, useDispatch } from "react-redux";
import { removePoster } from "../services/action";
import {removeAllPosters, removePoster} from "../services/action";
import DeleteIcon from "@material-ui/icons/Delete";
import { Camera } from "lucide-react";
const apiUrl = process.env.REACT_APP_API_URL;
@@ -11,16 +10,24 @@ const Cart = () => {
const selectedPosters = useSelector((state) => {
const selections = state.posterSelections;
return Object.entries(selections).flatMap(([movieId, posters]) =>
posters.map((posterId) => ({ movieId, posterId }))
posters.map((poster) => ({
movieId,
posterId: typeof poster === "string" ? poster : poster.posterId,
}))
);
});
const [downloadFormat, setDownloadFormat] = useState("zip");
const handleRemovePoster = (movieId, posterId) => {
dispatch(removePoster(movieId, posterId));
if (movieId && posterId) dispatch(removePoster(movieId, posterId));
};
const handleRemoveAllPosters = () => {
dispatch(removeAllPosters());
};
const handleDownload = async () => {
try {
const response = await fetch(`${apiUrl}/api/download-posters`, {
@@ -55,51 +62,34 @@ const Cart = () => {
}
};
const totalSlots = 4;
const posterSlots = [...Array(totalSlots)].map((_, index) => {
if (index < selectedPosters.length) {
return selectedPosters[index];
}
return null;
});
return (
<div className="cart-container">
<div className="poster-grid">
{posterSlots.map((poster, index) => (
{selectedPosters.length === 0 ? (
<p>No posters selected</p>
) : (
selectedPosters.map((poster) => (
<div
key={
poster ? `${poster.movieId}-${poster.posterId}` : `empty-${index}`
}
key={`${poster.movieId}-${poster.posterId}`}
className="poster-card"
>
{poster ? (
<>
<img
src={`https://image.tmdb.org/t/p/w500${poster.posterId}`}
src={`https://image.tmdb.org/t/p/original${poster.posterId}`}
alt="Movie poster"
className="poster-image"
/>
<div className="delete-overlay">
<button
className="delete-button"
onClick={() =>
handleRemovePoster(poster.movieId, poster.posterId)
}
onClick={() => handleRemovePoster(poster.movieId, poster.posterId)}
>
<DeleteIcon/>
</button>
</div>
</>
) : (
<div className="empty-poster">
<Camera size={48} />
<p>Emplacement disponible</p>
</div>
))
)}
</div>
))}
</div>
<div className="action-panel">
<h2>Download Options</h2>
@@ -119,6 +109,13 @@ const Cart = () => {
>
Download Selected
</button>
<button
className="clear-button"
onClick={handleRemoveAllPosters}
disabled={selectedPosters.length === 0}
>
Clear All Posters
</button>
</div>
</div>
);

44
src/components/NavBar.js
View File

@@ -1,17 +1,20 @@
import React from "react";
import React, { useMemo } from "react";
import { useSelector } from "react-redux";
import { AppBar, Toolbar, IconButton, Badge, Button } from '@material-ui/core';
import ShoppingCartIcon from '@material-ui/icons/ShoppingCart';
import ArrowBackIcon from '@material-ui/icons/ArrowBack';
import { useNavigate, useLocation } from 'react-router-dom';
const selectPosterSelections = (state) => state.posterSelections;
const NavBar = ({ onRefreshFiles }) => {
const navigate = useNavigate();
const location = useLocation();
const selectedPosters = useSelector((state) => {
const selections = state.posterSelections;
return Object.values(selections).flat();
});
const posterSelections = useSelector(selectPosterSelections);
const selectedPosters = useMemo(() => {
return Object.values(posterSelections).flat();
}, [posterSelections]);
const totalSelected = selectedPosters.length;
@@ -29,20 +32,39 @@ const NavBar = ({ onRefreshFiles }) => {
<AppBar position="fixed" className="navbar">
<Toolbar className="toolbar">
{isPosterSelectorPage ? (
<IconButton edge="start" className="back-button" onClick={handleBack}>
<IconButton
edge="start"
className="back-button"
onClick={handleBack}
>
<ArrowBackIcon />
</IconButton>
) : (
<IconButton edge="start" className="back-button" disabled>
{/* Un IconButton vide et désactivé */}
<IconButton
edge="start"
className="back-button"
disabled
>
{/* Disabled IconButton */}
</IconButton>
)}
<div>
<Button className="refresh-button" onClick={onRefreshFiles}>
<Button
className="refresh-button"
onClick={onRefreshFiles}
>
Refresh Files
</Button>
<IconButton edge="end" className="cart-button" onClick={handleCart}>
<Badge badgeContent={totalSelected} color="secondary">
<IconButton
edge="end"
className="cart-button"
onClick={handleCart}
>
<Badge
badgeContent={totalSelected}
color="secondary"
overlap="rectangular"
>
<ShoppingCartIcon />
</Badge>
</IconButton>

80
src/components/PosterGallery.js
View File

@@ -11,18 +11,24 @@ import {
CardMedia,
CircularProgress,
Box,
Paper,
Paper, DialogContent, DialogTitle, DialogActions, Button,
} from "@material-ui/core";
import CheckIcon from "@material-ui/icons/Check";
import NavBar from "./NavBar";
import {Dialog} from "@mui/material";
const apiUrl = process.env.REACT_APP_API_URL;
const PosterGallery = ({ movieId }) => {
const PosterGallery = () => {
const { movieName, movieYear } = useParams();
const [posters, setPosters] = useState([]);
const [loading, setLoading] = useState(true);
const { movieName, movieYear } = useParams();
const [error, setError] = useState(null);
const [dialogOpen, setDialogOpen] = useState(false);
const dispatch = useDispatch();
const movieId = `${movieName}-${movieYear}`;
const selectedPosters = useSelector(
(state) => state.posterSelections[movieId] || []
);
@@ -31,10 +37,20 @@ const PosterGallery = ({ movieId }) => {
const fetchPosters = async () => {
try {
setLoading(true);
setError(null);
const encodedName = encodeURIComponent(movieName);
const encodedYear = encodeURIComponent(movieYear);
const response = await axios.get(
`${apiUrl}/api/posters/${movieName}/${movieYear}`
`${apiUrl}/api/posters/${encodedName}/${encodedYear}`
);
if (response.data && response.data.posters) {
setPosters(response.data.posters);
} else {
throw new Error("No posters data in response");
}
} catch (error) {
console.error("Error fetching posters:", error);
} finally {
@@ -42,17 +58,46 @@ const PosterGallery = ({ movieId }) => {
}
};
if (movieName && movieYear) {
fetchPosters();
}
}, [movieName, movieYear]);
const handlePosterSelect = (posterId) => {
if (selectedPosters.includes(posterId)) {
dispatch(deselectPoster(movieId, posterId));
const postersForCurrentMovie = selectedPosters.filter(
(poster) => poster.movieId !== movieId
);
const isPosterSelected = postersForCurrentMovie.some((poster) => poster.posterId === posterId)
if (postersForCurrentMovie.length > 0 && !isPosterSelected) {
setDialogOpen(true);
return;
}
if (isPosterSelected) {
dispatch(deselectPoster(movieName, movieYear, posterId));
} else {
dispatch(selectPoster(movieId, posterId));
dispatch(selectPoster(movieName, movieYear, posterId));
}
};
const handleDialogClose = () => {
setDialogOpen(false);
}
if (error) {
return (
<Container>
<Paper elevation={3} className="content-paper">
<Typography color="error" align="center">
{error}
</Typography>
</Paper>
<NavBar />
</Container>
);
}
return (
<>
<Container className="poster-gallery">
@@ -64,7 +109,7 @@ const PosterGallery = ({ movieId }) => {
<Box className="loading-container">
<CircularProgress />
</Box>
) : (
) : posters.length > 0 ? (
<Grid container spacing={3}>
{posters.map((poster, index) => (
<Grid item xs={12} sm={6} md={4} lg={3} key={index}>
@@ -78,7 +123,7 @@ const PosterGallery = ({ movieId }) => {
>
<CardMedia
className="poster-image"
image={`https://image.tmdb.org/t/p/w500${poster.file_path}`}
image={`https://image.tmdb.org/t/p/original${poster.file_path}`}
title={`${movieName} poster ${index + 1}`}
/>
{selectedPosters.includes(poster.file_path) && (
@@ -88,10 +133,27 @@ const PosterGallery = ({ movieId }) => {
</Grid>
))}
</Grid>
) : (
<Typography align="center">
No posters found for this movie.
</Typography>
)}
</Paper>
</Container>
<NavBar />
<Dialog open={dialogOpen} onClose={handleDialogClose}>
<DialogTitle>Poster already selected</DialogTitle>
<DialogContent>
<Typography>
You can only select one poster per movie. Please deselect the current poster first.
</Typography>
</DialogContent>
<DialogActions>
<Button onClick={handleDialogClose} color="primary">
OK
</Button>
</DialogActions>
</Dialog>
</>
);
};

4
src/components/PosterSelector.js
View File

@@ -109,9 +109,7 @@ const PosterSelector = () => {
const handleMovieClick = (movieName, movieYear) => {
navigate(
`/posters/${encodeURIComponent(movieName)}/${encodeURIComponent(
movieYear
)}`
`/posters/${encodeURIComponent(movieName)}/${encodeURIComponent(movieYear)}`
);
};

35
src/services/action.js
View File

@@ -1,17 +1,32 @@
export const selectPoster = (movieId, posterId) => ({
type: "SELECT_POSTER",
movieId,
posterId,
});
export const SELECT_POSTER = "SELECT_POSTER";
export const DESELECT_POSTER = "DESELECT_POSTER";
export const REMOVE_POSTER = "REMOVE_POSTER";
export const REMOVE_ALL_POSTERS = "REMOVE_ALL_POSTERS";
export const selectPoster = (movieName, movieYear, posterId) => {
const movieId = `${movieName}-${movieYear}`;
return {
type: SELECT_POSTER,
payload: { movieId, posterId },
};
};
export const deselectPoster = (movieName, movieYear, posterId) => {
const movieId = `${movieName}-${movieYear}`;
return {
type: DESELECT_POSTER,
payload: { movieId, posterId },
};
};
export const deselectPoster = (movieId, posterId) => ({
type: "DESELECT_POSTER",
movieId,
posterId,
});
export const removePoster = (movieId, posterId) => ({
type: "REMOVE_POSTER",
movieId,
posterId,
});
export const removeAllPosters = () => ({
type: REMOVE_ALL_POSTERS,
});

26
src/services/store.js
View File

@@ -1,28 +1,38 @@
import { legacy_createStore as createStore, combineReducers } from "redux";
import { persistStore, persistReducer } from "redux-persist";
import storage from "redux-persist/lib/storage";
import {DESELECT_POSTER, REMOVE_ALL_POSTERS, REMOVE_POSTER, SELECT_POSTER} from "./action";
const posterSelectionReducer = (state = {}, action) => {
switch (action.type) {
case "SELECT_POSTER":
case SELECT_POSTER: {
const { movieId, posterId } = action.payload;
return {
...state,
[action.movieId]: [...(state[action.movieId] || []), action.posterId],
[movieId]: [...(state[movieId] || []), posterId],
};
case "DESELECT_POSTER":
}
case DESELECT_POSTER: {
const { movieId, posterId } = action.payload;
return {
...state,
[action.movieId]: state[action.movieId].filter(
(id) => id !== action.posterId
[movieId]: state[movieId]?.filter(
(id) => id !== posterId
),
};
case "REMOVE_POSTER":
}
case REMOVE_POSTER: {
const { movieId, posterId } = action;
return {
...state,
[action.movieId]: state[action.movieId].filter(
(id) => id !== action.posterId
[movieId]: state[movieId]?.filter(
(id) => id !== posterId
),
};
}
case REMOVE_ALL_POSTERS: {
return {};
}
default:
return state;
}

4
src/styles/scss/_cart.scss
View File

@@ -10,14 +10,11 @@
grid-template-columns: repeat(4, 1fr);
gap: 1rem;
max-height: calc(100vh - 4rem);
overflow-y: auto;
padding-right: 1rem;
.poster-card {
position: relative;
aspect-ratio: 2/3;
border-radius: 8px;
overflow: hidden;
&:hover .delete-overlay {
opacity: 1;
@@ -26,7 +23,6 @@
.poster-image {
width: 100%;
height: 100%;
object-fit: cover;
}
.delete-overlay {

1
src/styles/scss/_posterSelector.scss
View File

@@ -35,6 +35,7 @@ $hover-color: rgba(102, 119, 136, 0.2);
}
.movie-item {
padding: 0 2rem;
margin-bottom: 1rem;
transition: background-color 0.3s ease;
display: flex;