Skip to content

S
sweepstake
Commit 60f68308 by Arjun Jhukal
Options

updated the sidebar layout for admin and user

parent 6899078b
Showing with 330 additions and 191 deletions
package-lock.json
...@@ -1092,12 +1092,6 @@ ...@@ -1092,12 +1092,6 @@
} }
} }
}, },
"node_modules/@mui/material/node_modules/react-is": {
"version": "19.1.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-19.1.1.tgz",
"integrity": "sha512-tr41fA15Vn8p4X9ntI+yCyeGSf1TlYaY5vlTZfQmeLBrFo3psOPX6HhTDnFNL9uj3EhP0KAQ80cugCl4b4BERA==",
"license": "MIT"
},
"node_modules/@mui/private-theming": { "node_modules/@mui/private-theming": {
"version": "7.3.2", "version": "7.3.2",
"resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-7.3.2.tgz", "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-7.3.2.tgz",
...@@ -1246,12 +1240,6 @@ ...@@ -1246,12 +1240,6 @@
} }
} }
}, },
"node_modules/@mui/utils/node_modules/react-is": {
"version": "19.1.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-19.1.1.tgz",
"integrity": "sha512-tr41fA15Vn8p4X9ntI+yCyeGSf1TlYaY5vlTZfQmeLBrFo3psOPX6HhTDnFNL9uj3EhP0KAQ80cugCl4b4BERA==",
"license": "MIT"
},
"node_modules/@napi-rs/wasm-runtime": { "node_modules/@napi-rs/wasm-runtime": {
"version": "0.2.12", "version": "0.2.12",
"resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-0.2.12.tgz", "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-0.2.12.tgz",
...@@ -1849,9 +1837,9 @@ ...@@ -1849,9 +1837,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "20.19.13", "version": "20.19.14",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.13.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.14.tgz",
"integrity": "sha512-yCAeZl7a0DxgNVteXFHt9+uyFbqXGy/ShC4BlcHkoE0AfGXYv/BUiplV72DjMYXHDBXFjhvr6DD1NiRVfB4j8g==", "integrity": "sha512-gqiKWld3YIkmtrrg9zDvg9jfksZCcPywXVN7IauUGhilwGV/yOyeUsvpR796m/Jye0zUzMXPKe8Ct1B79A7N5Q==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
...@@ -1871,9 +1859,9 @@ ...@@ -1871,9 +1859,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/@types/react": { "node_modules/@types/react": {
"version": "19.1.12", "version": "19.1.13",
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.1.12.tgz", "resolved": "https://registry.npmjs.org/@types/react/-/react-19.1.13.tgz",
"integrity": "sha512-cMoR+FoAf/Jyq6+Df2/Z41jISvGZZ2eTlnsaJRptmZ76Caldwy1odD4xTr/gNV9VLj0AWgg/nmkevIyUfIIq5w==", "integrity": "sha512-hHkbU/eoO3EG5/MZkuFSKmYqPbSVk5byPFa3e7y/8TybHiLMACgI8seVYlicwk7H5K/rI2px9xrQp/C+AUDTiQ==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"csstype": "^3.0.2" "csstype": "^3.0.2"
...@@ -3083,9 +3071,9 @@ ...@@ -3083,9 +3071,9 @@
} }
}, },
"node_modules/debug": { "node_modules/debug": {
"version": "4.4.1", "version": "4.4.3",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
"integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==", "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"ms": "^2.1.3" "ms": "^2.1.3"
...@@ -3229,12 +3217,6 @@ ...@@ -3229,12 +3217,6 @@
"is-arrayish": "^0.2.1" "is-arrayish": "^0.2.1"
} }
}, },
"node_modules/error-ex/node_modules/is-arrayish": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
"integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
"license": "MIT"
},
"node_modules/es-abstract": { "node_modules/es-abstract": {
"version": "1.24.0", "version": "1.24.0",
"resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.0.tgz", "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.0.tgz",
...@@ -4304,6 +4286,12 @@ ...@@ -4304,6 +4286,12 @@
"react-is": "^16.7.0" "react-is": "^16.7.0"
} }
}, },
"node_modules/hoist-non-react-statics/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==",
"license": "MIT"
},
"node_modules/ignore": { "node_modules/ignore": {
"version": "5.3.2", "version": "5.3.2",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
...@@ -4384,11 +4372,10 @@ ...@@ -4384,11 +4372,10 @@
} }
}, },
"node_modules/is-arrayish": { "node_modules/is-arrayish": {
"version": "0.3.2", "version": "0.2.1",
"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz", "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
"integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==", "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
"license": "MIT", "license": "MIT"
"optional": true
}, },
"node_modules/is-async-function": { "node_modules/is-async-function": {
"version": "2.1.1", "version": "2.1.1",
...@@ -5804,6 +5791,12 @@ ...@@ -5804,6 +5791,12 @@
"react-is": "^16.13.1" "react-is": "^16.13.1"
} }
}, },
"node_modules/prop-types/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==",
"license": "MIT"
},
"node_modules/property-expr": { "node_modules/property-expr": {
"version": "2.0.6", "version": "2.0.6",
"resolved": "https://registry.npmjs.org/property-expr/-/property-expr-2.0.6.tgz", "resolved": "https://registry.npmjs.org/property-expr/-/property-expr-2.0.6.tgz",
...@@ -5869,9 +5862,9 @@ ...@@ -5869,9 +5862,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/react-is": { "node_modules/react-is": {
"version": "16.13.1", "version": "19.1.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.1.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", "integrity": "sha512-tr41fA15Vn8p4X9ntI+yCyeGSf1TlYaY5vlTZfQmeLBrFo3psOPX6HhTDnFNL9uj3EhP0KAQ80cugCl4b4BERA==",
"license": "MIT" "license": "MIT"
}, },
"node_modules/react-redux": { "node_modules/react-redux": {
...@@ -6318,15 +6311,22 @@ ...@@ -6318,15 +6311,22 @@
} }
}, },
"node_modules/simple-swizzle": { "node_modules/simple-swizzle": {
"version": "0.2.2", "version": "0.2.4",
"resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz", "resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.4.tgz",
"integrity": "sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==", "integrity": "sha512-nAu1WFPQSMNr2Zn9PGSZK9AGn4t/y97lEm+MXTtUDwfP0ksAIX4nO+6ruD9Jwut4C49SB1Ws+fbXsm/yScWOHw==",
"license": "MIT", "license": "MIT",
"optional": true, "optional": true,
"dependencies": { "dependencies": {
"is-arrayish": "^0.3.1" "is-arrayish": "^0.3.1"
} }
}, },
"node_modules/simple-swizzle/node_modules/is-arrayish": {
"version": "0.3.4",
"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.4.tgz",
"integrity": "sha512-m6UrgzFVUYawGBh1dUsWR5M2Clqic9RVXC/9f8ceNlv2IcO9j9J/z8UoCLPqtsPBFNzEpfR3xftohbfqDx8EQA==",
"license": "MIT",
"optional": true
},
"node_modules/source-map": { "node_modules/source-map": {
"version": "0.5.7", "version": "0.5.7",
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
......
src/app/(dashboard)/admin/games/[slug]/page.tsx 0 → 100644
import React from 'react'
export default function AdminGamePage() {
return (
<div>AdminGamePage</div>
)
}
src/app/(dashboard)/admin/games/add-game/page.tsx 0 → 100644
import React from 'react'
export default function AddGame() {
return (
<div>AddGame</div>
)
}
src/app/(dashboard)/admin/games/page.tsx 0 → 100644
import React from 'react'
export default function AdminGames() {
return (
<div>AdminGames</div>
)
}
src/app/customIcons/SupportIcon.tsx 0 → 100644
import React from 'react'
export default function SupportIcon() {
return (
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<g clipPath="url(#clip0_4682_8805)">
<path d="M20.6926 1.50919L19.1634 2.30798C17.118 0.812016 14.6507 0 12.0871 0C8.88183 0 5.86838 1.24823 3.60183 3.51469C1.33533 5.78123 0.0871429 8.79469 0.0871429 12C0.0871429 15.2053 1.33538 18.2188 3.60183 20.4853C5.86838 22.7518 8.88183 24 12.0871 24C12.9016 24 13.5619 23.3397 13.5619 22.5252C13.5619 21.7107 12.9016 21.0504 12.0871 21.0504C7.09674 21.0504 3.03671 16.9904 3.03671 12C3.03671 7.00959 7.09674 2.94956 12.0871 2.94956C13.5032 2.94956 14.8802 3.27797 16.1218 3.89681L15.0989 4.43114C14.0245 4.99233 13.9606 6.50602 14.9838 7.15575L20.3107 10.5383C21.3337 11.188 22.6764 10.4866 22.7277 9.27581L22.9946 2.97127C23.0459 1.76034 21.767 0.948 20.6926 1.50919Z" fill="#B3E59F" />
<path d="M19.8162 2.75253L22.1732 1.52136C21.7389 1.2846 21.1935 1.24747 20.6926 1.50913L19.1634 2.30793C19.3853 2.44878 19.6032 2.59672 19.8162 2.75253Z" fill="#95D6A4" />
<path d="M5.10581 20.4853C2.83931 18.2188 1.59113 15.2053 1.59113 12C1.59113 8.79469 2.83936 5.78123 5.10581 3.51469C7.19466 1.42589 9.9181 0.202875 12.8413 0.0237656C12.591 0.00820313 12.3396 0 12.0871 0C8.88183 0 5.86838 1.24823 3.60183 3.51469C1.33533 5.78123 0.0871429 8.79469 0.0871429 12C0.0871429 15.2053 1.33538 18.2188 3.60183 20.4853C5.86838 22.7518 8.88183 24 12.0871 24C12.2211 24 12.3507 23.9818 12.4741 23.9483C9.69047 23.6931 7.10696 22.4864 5.10581 20.4853Z" fill="#95D6A4" />
<path d="M21.8146 10.5385L16.4878 7.15589C15.4646 6.50616 15.5285 4.99247 16.6028 4.43129L16.8759 4.28864C17.1848 4.12735 17.1622 3.67472 16.8369 3.54985C15.8115 3.15605 14.7136 2.94971 13.5911 2.94971C13.3379 2.94971 13.0871 2.96072 12.8391 2.98121C13.9891 3.07632 15.1013 3.38827 16.1219 3.89696L15.0989 4.43129C14.0246 4.99247 13.9607 6.50616 14.9839 7.15589L20.3107 10.5385C20.8305 10.8686 21.4326 10.8494 21.9061 10.5923C21.8753 10.5755 21.8448 10.5577 21.8146 10.5385Z" fill="#95D6A4" />
<path d="M14.9736 16.9978C14.9714 16.9978 14.9693 16.9978 14.9671 16.9978C14.5598 16.9943 14.2325 16.6613 14.2361 16.254C14.2393 15.8768 14.2426 15.4585 14.2458 15.0224H11.6413C11.3804 15.0224 11.1389 14.8845 11.0063 14.6599C10.8736 14.4353 10.8696 14.1573 10.9957 13.9289C11.5252 12.969 13.2825 9.80091 13.6622 9.33507C14.008 8.91075 14.4781 8.73928 14.9198 8.87588C15.3651 9.01378 15.6812 9.44325 15.7251 9.97008C15.745 10.209 15.7401 11.9379 15.7307 13.5476H15.8443C16.2515 13.5476 16.5817 13.8778 16.5817 14.285C16.5817 14.6923 16.2515 15.0224 15.8443 15.0224H15.7208C15.7167 15.5828 15.7129 16.0349 15.7109 16.2668C15.7073 16.6718 15.3778 16.9978 14.9736 16.9978ZM12.8942 13.5476H14.2556C14.2608 12.6501 14.2643 11.7848 14.2643 11.1416C13.9004 11.7625 13.4035 12.6366 12.8942 13.5476Z" fill="#E27A66" />
<path d="M7.9733 17.2274C6.68916 17.2274 6.59316 17.1953 6.49298 17.162C6.24938 17.0808 6.06727 16.8963 5.99334 16.6559C5.8672 16.2458 6.05648 15.9979 6.47119 15.4549C6.81117 15.0098 7.44394 14.1812 8.50434 12.6661C8.81156 12.2271 9.0097 11.8358 9.09375 11.5023L9.11494 11.3366C9.09366 10.8175 8.6647 10.4018 8.14055 10.4018C7.6755 10.4018 7.27308 10.7321 7.18369 11.1871C7.10522 11.5867 6.71752 11.847 6.318 11.7686C5.91834 11.6901 5.65805 11.3026 5.73652 10.9029C5.96138 9.758 6.97242 8.927 8.14055 8.927C9.49148 8.927 10.5906 10.0261 10.5906 11.377C10.5871 11.4853 10.5579 11.6956 10.5384 11.8025C10.4167 12.3277 10.1388 12.9028 9.71269 13.5117C8.99597 14.5357 8.47069 15.2522 8.09728 15.7508C8.69911 15.7499 9.43481 15.7442 10.1276 15.7355C10.5332 15.7316 10.8691 16.0564 10.8742 16.4636C10.8794 16.8708 10.5534 17.205 10.1462 17.2102C9.18366 17.2223 8.48433 17.2274 7.9733 17.2274Z" fill="#E27A66" />
<path d="M11.7691 14.6599C11.6364 14.4353 11.6324 14.1573 11.7585 13.9289C12.288 12.969 14.0453 9.80093 14.425 9.33508C14.5924 9.12973 14.789 8.98423 14.9972 8.90355C14.9718 8.89338 14.946 8.88405 14.9197 8.8759C14.478 8.73926 14.0079 8.91077 13.6621 9.33508C13.2825 9.80093 11.5252 12.969 10.9956 13.9289C10.8696 14.1573 10.8736 14.4353 11.0062 14.6599C11.1389 14.8846 11.3803 15.0224 11.6412 15.0224H12.4041C12.1432 15.0224 11.9017 14.8846 11.7691 14.6599Z" fill="#DD636E" />
<path d="M14.9989 16.2541C15.0022 15.8769 15.0055 15.4586 15.0087 15.0225H14.2458C14.2426 15.4586 14.2393 15.8769 14.236 16.2541C14.2325 16.6614 14.5598 16.9943 14.967 16.9978H14.9735C15.1131 16.9978 15.2433 16.9583 15.3547 16.8907C15.1398 16.7602 14.9966 16.5238 14.9989 16.2541Z" fill="#DD636E" />
<path d="M6.84131 11.6752C6.58411 11.5194 6.43805 11.2152 6.49936 10.9029C6.69942 9.88424 7.52203 9.11464 8.5237 8.95719C8.39878 8.9375 8.27086 8.927 8.1405 8.927C6.97238 8.927 5.96138 9.758 5.73647 10.9029C5.658 11.3025 5.9183 11.6901 6.31795 11.7686C6.50541 11.8055 6.68981 11.767 6.84131 11.6752Z" fill="#DD636E" />
<path d="M7.25588 17.162C7.01227 17.0808 6.83016 16.8964 6.75623 16.656C6.63009 16.2459 6.81937 15.998 7.23408 15.455C7.57406 15.0099 8.20683 14.1812 9.26723 12.6662C9.57445 12.2272 9.77259 11.8359 9.85664 11.5024L9.87783 11.3366C9.85655 10.8176 9.42759 10.4019 8.90344 10.4019C8.76909 10.4019 8.64033 10.4302 8.52248 10.4803C8.85909 10.6242 9.09914 10.9518 9.11494 11.3366L9.09375 11.5023C9.00975 11.8359 8.81161 12.2271 8.50434 12.6661C7.44394 14.1812 6.81117 15.0098 6.47119 15.4549C6.05644 15.998 5.86716 16.2458 5.99334 16.6559C6.06727 16.8963 6.24942 17.0808 6.49298 17.162C6.59316 17.1954 6.68916 17.2274 7.9733 17.2274C8.09873 17.2274 8.2357 17.2271 8.385 17.2264C7.43325 17.221 7.34597 17.1921 7.25588 17.162Z" fill="#DD636E" />
<path d="M20.2899 23.9611C20.1923 23.9611 20.0932 23.9413 19.9981 23.8995C19.6311 23.7382 19.4643 23.3098 19.6257 22.9428L22.0747 17.3714H19.5619C19.1609 17.3714 18.8359 17.0464 18.8359 16.6454C18.8359 16.2445 19.1609 15.9194 19.5619 15.9194H23.1869C23.4321 15.9194 23.6608 16.0432 23.7948 16.2486C23.9289 16.4539 23.9502 16.7131 23.8515 16.9376L20.9549 23.527C20.8353 23.799 20.5691 23.961 20.2899 23.9611Z" fill="#90D8F9" />
<path d="M20.2375 17.3714H19.5619C19.1607 17.3714 18.8359 17.0467 18.8359 16.6454C18.8359 16.2447 19.1606 15.9194 19.5619 15.9194H20.2375C19.8368 15.9194 19.5115 16.2447 19.5115 16.6454C19.5115 17.0467 19.8368 17.3714 20.2375 17.3714Z" fill="#80B4FB" />
<path d="M20.6281 23.8772C20.5245 23.9319 20.4079 23.9614 20.2898 23.9614C20.192 23.9614 20.0928 23.9416 19.998 23.8994C19.6311 23.7383 19.4641 23.3099 19.6253 22.9431L22.0743 17.3713H22.7505L20.3014 22.9431C20.147 23.2945 20.2932 23.702 20.6281 23.8772Z" fill="#80B4FB" />
<path d="M15.3248 21.056C15.2715 21.056 15.2173 21.0441 15.1661 21.0191C14.9864 20.9313 14.9119 20.7144 14.9998 20.5347L19.1844 11.9723C19.2723 11.7925 19.4892 11.7181 19.6688 11.8059C19.8486 11.8938 19.923 12.1106 19.8352 12.2904L15.6505 20.8528C15.5877 20.9813 15.4589 21.056 15.3248 21.056Z" fill="#868086" />
</g>
<defs>
<clipPath id="clip0_4682_8805">
<rect width="24" height="24" fill="white" />
</clipPath>
</defs>
</svg>
)
}
src/app/globals.css
...@@ -131,4 +131,14 @@ ...@@ -131,4 +131,14 @@
background: var(--secondary-grad); background: var(--secondary-grad);
} }
.menu__wrapper li {
border-radius: 6px;
overflow: hidden;
}
.support__btn {
border-radius: 6px;
border-top: 1px solid rgba(255, 255, 255, 0.30);
background: linear-gradient(90deg, rgba(105, 162, 157, 0.20) 0%, rgba(147, 224, 217, 0.20) 100%);
}
} }
\ No newline at end of file
src/app/layout.tsx
...@@ -15,7 +15,8 @@ export default function RootLayout({ ...@@ -15,7 +15,8 @@ export default function RootLayout({
}>) { }>) {
return ( return (
<html lang="en"> <html lang="en">
<body className="dark"> {/* className="dark" */}
<body >
<ProviderWrapper> <ProviderWrapper>
{children} {children}
</ProviderWrapper> </ProviderWrapper>
......
src/components/layouts/DashboardLayout.tsx
...@@ -9,7 +9,7 @@ export default function DashboardLayout({ children }: { children: React.ReactNod ...@@ -9,7 +9,7 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
const [open, setOpen] = React.useState(false); const [open, setOpen] = React.useState(false);
const handleDrawerOpen = () => { const handleDrawerOpen = () => {
setOpen(true); setOpen((prev) => !prev);
}; };
const handleDrawerClose = () => { const handleDrawerClose = () => {
...@@ -19,9 +19,9 @@ export default function DashboardLayout({ children }: { children: React.ReactNod ...@@ -19,9 +19,9 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
<Box sx={{ display: 'flex' }}> <Box sx={{ display: 'flex' }}>
<Header open={open} handleDrawerOpen={handleDrawerOpen} /> <Header open={open} handleDrawerOpen={handleDrawerOpen} />
<Sidebar open={open} handleDrawerOpen={handleDrawerOpen} /> <Sidebar open={open} handleDrawerOpen={handleDrawerOpen} />
<div className="root_container"> {/* <div className="root_container">
<div className="content_box p-4 lg:pl-11 lg:pr-12 lg:py-8">{children}</div> <div className="content_box p-4 lg:pl-11 lg:pr-12 lg:py-8">{children}</div>
</div> </div> */}
</Box> </Box>
) )
} }
src/components/organism/Header/AdminHeader/index.tsx 0 → 100644
import React from 'react'
export default function AdminHeader() {
return (
<div>AdminHeader</div>
)
}
src/components/organism/Header/UserHeader/index.tsx 0 → 100644
import React from 'react'
export default function UserHeader() {
return (
<div>UserHeader</div>
)
}
src/components/organism/Header/index.tsx
...@@ -5,6 +5,7 @@ import Typography from '@mui/material/Typography'; ...@@ -5,6 +5,7 @@ import Typography from '@mui/material/Typography';
import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar'; import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar';
import { styled, useTheme, Theme, CSSObject } from '@mui/material/styles'; import { styled, useTheme, Theme, CSSObject } from '@mui/material/styles';
import React from 'react' import React from 'react'
import { HambergerMenu } from '@wandersonalwes/iconsax-react';
interface AppBarProps extends MuiAppBarProps { interface AppBarProps extends MuiAppBarProps {
open?: boolean; open?: boolean;
...@@ -46,11 +47,13 @@ export default function Header({ open, handleDrawerOpen }: { ...@@ -46,11 +47,13 @@ export default function Header({ open, handleDrawerOpen }: {
sx={[ sx={[
{ {
marginRight: 5, marginRight: 5,
maxWidth: "fit-content"
}, },
open && { display: 'none' }, // open && { display: 'none' },
]} ]}
> >
{/* <MenuIcon /> */} {/* <MenuIcon /> */}
<HambergerMenu />
</IconButton> </IconButton>
<Typography variant="h6" noWrap component="div"> <Typography variant="h6" noWrap component="div">
Mini variant drawer Mini variant drawer
......
src/components/organism/Sidebar/AdminSidebar/index.tsx 0 → 100644
import { PATH } from '@/routes/PATH';
import { List, ListItem, ListItemButton, ListItemIcon, ListItemText } from '@mui/material'
import { StatusUp } from '@wandersonalwes/iconsax-react'
import { usePathname, useRouter } from 'next/navigation'
import React from 'react'
export default function AdminMenu({ open }: { open: boolean }) {
const router = useRouter();
const pathname = usePathname();
return (
<List>
<ListItem>
<ListItemButton
className={[
open ? "expanded" : "collapsed",
pathname.startsWith(PATH.DASHBOARD.ROOT) ? "active" : ""
].join(" ")}
onClick={() => { router.push(PATH.DASHBOARD.ROOT) }}
>
<ListItemIcon className={open ? "expanded" : "collapsed"}>
<StatusUp />
</ListItemIcon>
<ListItemText
primary="Dashboard"
className={open ? "expanded" : "collapsed"}
/>
</ListItemButton>
</ListItem>
<ListItem>
<ListItemButton
className={[
open ? "expanded" : "collapsed",
[
PATH.ADMIN.GAMES.ROOT,
PATH.ADMIN.GAMES.ADD_GAME.ROOT,
"/edit-game"
].some(path => pathname.startsWith(path)) ? "active" : ""
].join(" ")}
onClick={() => { router.push(PATH.ADMIN.GAMES.ROOT) }}
>
<ListItemIcon className={open ? "expanded" : "collapsed"}>
<StatusUp />
</ListItemIcon>
<ListItemText
primary="Games"
className={open ? "expanded" : "collapsed"}
/>
</ListItemButton>
</ListItem>
</List>
)
}
src/components/organism/Sidebar/index.tsx
"use client";
import * as React from 'react'; import * as React from 'react';
import { styled, useTheme, Theme, CSSObject } from '@mui/material/styles'; import { styled, useTheme, Theme, CSSObject } from '@mui/material/styles';
import Box from '@mui/material/Box'; import Box from '@mui/material/Box';
...@@ -9,17 +11,18 @@ import CssBaseline from '@mui/material/CssBaseline'; ...@@ -9,17 +11,18 @@ import CssBaseline from '@mui/material/CssBaseline';
import Typography from '@mui/material/Typography'; import Typography from '@mui/material/Typography';
import Divider from '@mui/material/Divider'; import Divider from '@mui/material/Divider';
import IconButton from '@mui/material/IconButton'; import IconButton from '@mui/material/IconButton';
// import MenuIcon from '@mui/icons-material/Menu'; import { HambergerMenu } from "@wandersonalwes/iconsax-react";
// import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
// import ChevronRightIcon from '@mui/icons-material/ChevronRight';
import ListItem from '@mui/material/ListItem'; import ListItem from '@mui/material/ListItem';
import ListItemButton from '@mui/material/ListItemButton'; import ListItemButton from '@mui/material/ListItemButton';
import ListItemIcon from '@mui/material/ListItemIcon'; import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText'; import ListItemText from '@mui/material/ListItemText';
// import InboxIcon from '@mui/icons-material/MoveToInbox'; import { DRAWER_WIDTH } from '@/config';
// import MailIcon from '@mui/icons-material/Mail'; import Image from 'next/image';
import { useAppSelector } from '@/hooks/hook';
import AdminMenu from './AdminSidebar';
import UserMenu from './UserSidebar';
const drawerWidth = 240; const drawerWidth = DRAWER_WIDTH;
const openedMixin = (theme: Theme): CSSObject => ({ const openedMixin = (theme: Theme): CSSObject => ({
width: drawerWidth, width: drawerWidth,
...@@ -51,32 +54,6 @@ const DrawerHeader = styled('div')(({ theme }) => ({ ...@@ -51,32 +54,6 @@ const DrawerHeader = styled('div')(({ theme }) => ({
...theme.mixins.toolbar, ...theme.mixins.toolbar,
})); }));
interface AppBarProps extends MuiAppBarProps {
open?: boolean;
}
const AppBar = styled(MuiAppBar, {
shouldForwardProp: (prop) => prop !== 'open',
})<AppBarProps>(({ theme }) => ({
zIndex: theme.zIndex.drawer + 1,
transition: theme.transitions.create(['width', 'margin'], {
easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.leavingScreen,
}),
variants: [
{
props: ({ open }) => open,
style: {
marginLeft: drawerWidth,
width: `calc(100% - ${drawerWidth}px)`,
transition: theme.transitions.create(['width', 'margin'], {
easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.enteringScreen,
}),
},
},
],
}));
const Drawer = styled(MuiDrawer, { shouldForwardProp: (prop) => prop !== 'open' })( const Drawer = styled(MuiDrawer, { shouldForwardProp: (prop) => prop !== 'open' })(
({ theme }) => ({ ({ theme }) => ({
...@@ -108,119 +85,24 @@ export default function Sidebar({ open, handleDrawerOpen }: { ...@@ -108,119 +85,24 @@ export default function Sidebar({ open, handleDrawerOpen }: {
handleDrawerOpen: () => void; handleDrawerOpen: () => void;
}) { }) {
// const user = useAppSelector((state) => state.auth.user);
const user = { role: "USER" }
return ( return (
<Drawer variant="permanent" open={open}> <Drawer variant="permanent" open={open}>
<DrawerHeader> <DrawerHeader sx={{ justifyContent: "center" }}>
{/* <IconButton onClick={handleDrawerClose}> {/* <HambergerMenu /> */}
{theme.direction === 'rtl' ? <ChevronRightIcon /> : <ChevronLeftIcon />} <Image src="/assets/images/logo.png" alt="Logo" width={102} height={56} />
</IconButton> */}
</DrawerHeader> </DrawerHeader>
<Divider />
<List> <Box className={`mt-8 menu__wrapper ${open ? "px-3" : ""}`} >
{['Inbox', 'Starred', 'Send email', 'Drafts'].map((text, index) => ( {
<ListItem key={text} disablePadding sx={{ display: 'block' }}> user?.role.toUpperCase() === 'ADMIN' ? (
<ListItemButton <AdminMenu open={open} />
sx={[ ) : (
{ <UserMenu open={open} />
minHeight: 48, )
px: 2.5, }
}, </Box>
open
? {
justifyContent: 'initial',
}
: {
justifyContent: 'center',
},
]}
>
<ListItemIcon
sx={[
{
minWidth: 0,
justifyContent: 'center',
},
open
? {
mr: 3,
}
: {
mr: 'auto',
},
]}
>
{/* {index % 2 === 0 ? <InboxIcon /> : <MailIcon />} */}
</ListItemIcon>
<ListItemText
primary={text}
sx={[
open
? {
opacity: 1,
}
: {
opacity: 0,
},
]}
/>
</ListItemButton>
</ListItem>
))}
</List>
<Divider />
<List>
{['All mail', 'Trash', 'Spam'].map((text, index) => (
<ListItem key={text} disablePadding sx={{ display: 'block' }}>
<ListItemButton
sx={[
{
minHeight: 48,
px: 2.5,
},
open
? {
justifyContent: 'initial',
}
: {
justifyContent: 'center',
},
]}
>
<ListItemIcon
sx={[
{
minWidth: 0,
justifyContent: 'center',
},
open
? {
mr: 3,
}
: {
mr: 'auto',
},
]}
>
{/* {index % 2 === 0 ? <InboxIcon /> : <MailIcon />} */}
</ListItemIcon>
<ListItemText
primary={text}
sx={[
open
? {
opacity: 1,
}
: {
opacity: 0,
},
]}
/>
</ListItemButton>
</ListItem>
))}
</List>
</Drawer> </Drawer>
); );
} }
src/routes/PATH.ts
...@@ -17,6 +17,19 @@ export const PATH = { ...@@ -17,6 +17,19 @@ export const PATH = {
} }
}, },
ADMIN: { ADMIN: {
GAMES: {
ROOT: "admin/games",
ADD_GAME: {
ROOT: "admin/games/add-game"
},
EDIT_GAME: {
ROOT: "admin/games/edit-game/:id"
}
}
},
USER: {
GAMES: {
ROOT: "user/games",
}
} }
} }
\ No newline at end of file
src/theme/index.tsx
...@@ -41,7 +41,7 @@ export default function ThemeCustomization({ children }: { children: React.React ...@@ -41,7 +41,7 @@ export default function ThemeCustomization({ children }: { children: React.React
'--gray-scale': '#7E7181', '--gray-scale': '#7E7181',
}, },
}; };
const theme = Palette(ThemeMode.DARK); const theme = Palette(ThemeMode.LIGHT);
return ( return (
<StyledEngineProvider injectFirst> <StyledEngineProvider injectFirst>
......
src/theme/palette.ts
...@@ -57,12 +57,12 @@ export default function Palette(mode: ThemeMode) { ...@@ -57,12 +57,12 @@ export default function Palette(mode: ThemeMode) {
}, },
...paletteColor, ...paletteColor,
background: { background: {
default: mode === ThemeMode.DARK ? grayColors[1] : "#fff", // Fixed: use gray instead of secondary default: mode === ThemeMode.LIGHT ? grayColors[1] : "#fff", // Fixed: use gray instead of secondary
paper: mode === ThemeMode.DARK ? grayColors[0] : "#fff" // Fixed: use gray instead of secondary paper: mode === ThemeMode.LIGHT ? grayColors[0] : "#fff" // Fixed: use gray instead of secondary
}, },
text: { text: {
primary: mode === ThemeMode.DARK ? titleColors[0] : titleColors[0], // Fixed: use title colors primary: mode === ThemeMode.LIGHT ? titleColors[0] : titleColors[0], // Fixed: use title colors
secondary: mode === ThemeMode.DARK ? grayColors[0] : grayColors[1] // Fixed: use gray colors secondary: mode === ThemeMode.LIGHT ? grayColors[0] : grayColors[1] // Fixed: use gray colors
} }
}, },
components: { components: {
...@@ -118,7 +118,105 @@ export default function Palette(mode: ThemeMode) { ...@@ -118,7 +118,105 @@ export default function Palette(mode: ThemeMode) {
}, },
}, },
}, },
variants: [
{
props: { variant: "contained", color: "primary" },
style: {
background: primaryGradColors[0],
color: "#fff",
"&:hover": {
opacity: 0.9,
},
},
},
{
props: { variant: "contained", color: "secondary" },
style: {
background: secondaryGradColors[0],
color: "#fff",
"&:hover": {
opacity: 0.9,
},
},
},
],
},
MuiList: {
styleOverrides: {
root: {
padding: 0
}
}
}, },
MuiListItem: {
styleOverrides: {
root: {
display: "block",
padding: 0
}
}
},
MuiListItemButton: {
styleOverrides: {
root: {
// minHeight: 48,
// paddingLeft: "20px",
// paddingRight: "20px",
padding: "12px 12px 12px 16px",
transition: "justify-content 0.2s ease",
"&.collapsed": {
justifyContent: "center"
},
"&.expanded": {
justifyContent: "flex-start"
},
"&.active": {
backgroundColor: "#FEEFFF",
color: primaryColors[1],
"& .MuiListItemIcon-root": {
color: primaryColors[1],
}
}
},
}
},
MuiListItemIcon: {
styleOverrides: {
root: {
minWidth: 0,
justifyContent: "center",
transition: "margin 0.2s ease",
"&.collapsed": {
marginRight: "auto"
},
"&.expanded": {
marginRight: "12px"
}
}
}
},
MuiListItemText: {
styleOverrides: {
root: {
transition: "opacity 0.2s ease",
"&.collapsed": {
opacity: 0
},
"&.expanded": {
opacity: 1
}
}
}
}
}, },
typography: {
fontFamily: "Inter, sans-serif",
subtitle1: {
fontSize: "14px",
fontWeight: 500,
lineHeight: "120%",
color: "var(--Title, #0E0E11)"
}
}
}); });
} }
\ No newline at end of file
src/utils/setActiveMenu.ts 0 → 100644
export function setActiveMenu(pathname: string, paths: string | string[]): boolean {
if (!pathname) return false;
const list = Array.isArray(paths) ? paths : [paths];
return list.some((path) => {
const normalized = path.startsWith("/") ? path : `/${path}`;
return pathname.startsWith(normalized);
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment