aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/pages/Maplist.tsx
diff options
context:
space:
mode:
authorFifthWit <fifthwitbusiness@gmail.com>2025-01-30 13:11:48 -0600
committerFifthWit <fifthwitbusiness@gmail.com>2025-01-30 13:11:48 -0600
commit81342e2579165ebfdb28c749dc5225141721a419 (patch)
tree8e5759c20b92408048fe5ac44f48e2df2a00ab9b /frontend/src/pages/Maplist.tsx
parentfixed issues with useCallback (diff)
downloadlphub-81342e2579165ebfdb28c749dc5225141721a419.tar.gz
lphub-81342e2579165ebfdb28c749dc5225141721a419.tar.bz2
lphub-81342e2579165ebfdb28c749dc5225141721a419.zip
switched to double quotes
Diffstat (limited to 'frontend/src/pages/Maplist.tsx')
-rw-r--r--frontend/src/pages/Maplist.tsx64
1 files changed, 32 insertions, 32 deletions
diff --git a/frontend/src/pages/Maplist.tsx b/frontend/src/pages/Maplist.tsx
index 372b800..a7242ef 100644
--- a/frontend/src/pages/Maplist.tsx
+++ b/frontend/src/pages/Maplist.tsx
@@ -1,11 +1,11 @@
1import React, { useEffect } from 'react'; 1import React, { useEffect } from "react";
2import { Link, useLocation, useNavigate, useParams } from 'react-router-dom'; 2import { Link, useLocation, useNavigate, useParams } from "react-router-dom";
3import { Helmet } from 'react-helmet'; 3import { Helmet } from "react-helmet";
4 4
5import '@css/Maplist.css'; 5import "@css/Maplist.css";
6import { API } from '@api/Api'; 6import { API } from "@api/Api";
7import { Game } from '@customTypes/Game'; 7import { Game } from "@customTypes/Game";
8import { GameChapter, GamesChapters } from '@customTypes/Chapters'; 8import { GameChapter, GamesChapters } from "@customTypes/Chapters";
9 9
10const Maplist: React.FC = () => { 10const Maplist: React.FC = () => {
11 const [game, setGame] = React.useState<Game | null>(null); 11 const [game, setGame] = React.useState<Game | null>(null);
@@ -18,7 +18,7 @@ const Maplist: React.FC = () => {
18 const [curChapter, setCurChapter] = React.useState<GameChapter>(); 18 const [curChapter, setCurChapter] = React.useState<GameChapter>();
19 const [numChapters, setNumChapters] = React.useState<number>(0); 19 const [numChapters, setNumChapters] = React.useState<number>(0);
20 20
21 const [dropdownActive, setDropdownActive] = React.useState('none'); 21 const [dropdownActive, setDropdownActive] = React.useState("none");
22 22
23 const params = useParams<{ id: string; chapter: string }>(); 23 const params = useParams<{ id: string; chapter: string }>();
24 const location = useLocation(); 24 const location = useLocation();
@@ -26,7 +26,7 @@ const Maplist: React.FC = () => {
26 26
27 function _update_currently_selected(catNum2: number) { 27 function _update_currently_selected(catNum2: number) {
28 setCurrentlySelected(catNum2); 28 setCurrentlySelected(catNum2);
29 navigate('/games/' + game?.id + '?cat=' + catNum2); 29 navigate("/games/" + game?.id + "?cat=" + catNum2);
30 setHasClicked(true); 30 setHasClicked(true);
31 } 31 }
32 32
@@ -36,23 +36,23 @@ const Maplist: React.FC = () => {
36 }; 36 };
37 37
38 const _handle_dropdown_click = () => { 38 const _handle_dropdown_click = () => {
39 if (dropdownActive === 'none') { 39 if (dropdownActive === "none") {
40 setDropdownActive('block'); 40 setDropdownActive("block");
41 } else { 41 } else {
42 setDropdownActive('none'); 42 setDropdownActive("none");
43 } 43 }
44 }; 44 };
45 45
46 // im sorry but im too lazy to fix this right now 46 // im sorry but im too lazy to fix this right now
47 useEffect(() => { 47 useEffect(() => {
48 // gameID 48 // gameID
49 const gameId = parseFloat(params.id || ''); 49 const gameId = parseFloat(params.id || "");
50 setId(gameId); 50 setId(gameId);
51 51
52 // location query params 52 // location query params
53 const queryParams = new URLSearchParams(location.search); 53 const queryParams = new URLSearchParams(location.search);
54 if (queryParams.get('chapter')) { 54 if (queryParams.get("chapter")) {
55 let cat = parseFloat(queryParams.get('chapter') || ''); 55 let cat = parseFloat(queryParams.get("chapter") || "");
56 if (gameId === 2) { 56 if (gameId === 2) {
57 cat += 10; 57 cat += 10;
58 } 58 }
@@ -82,7 +82,7 @@ const Maplist: React.FC = () => {
82 82
83 useEffect(() => { 83 useEffect(() => {
84 const queryParams = new URLSearchParams(location.search); 84 const queryParams = new URLSearchParams(location.search);
85 if (gameChapters !== undefined && !queryParams.get('chapter')) { 85 if (gameChapters !== undefined && !queryParams.get("chapter")) {
86 _fetch_chapters(gameChapters!.chapters[0].id.toString()); 86 _fetch_chapters(gameChapters!.chapters[0].id.toString());
87 } 87 }
88 }, [gameChapters, location.search]); 88 }, [gameChapters, location.search]);
@@ -92,9 +92,9 @@ const Maplist: React.FC = () => {
92 <Helmet> 92 <Helmet>
93 <title>LPHUB | Maplist</title> 93 <title>LPHUB | Maplist</title>
94 </Helmet> 94 </Helmet>
95 <section style={{ marginTop: '20px' }}> 95 <section style={{ marginTop: "20px" }}>
96 <Link to="/games"> 96 <Link to="/games">
97 <button className="nav-button" style={{ borderRadius: '20px' }}> 97 <button className="nav-button" style={{ borderRadius: "20px" }}>
98 <i className="triangle"></i> 98 <i className="triangle"></i>
99 <span>Games List</span> 99 <span>Games List</span>
100 </button> 100 </button>
@@ -127,8 +127,8 @@ const Maplist: React.FC = () => {
127 className={ 127 className={
128 currentlySelected === cat.category.id || 128 currentlySelected === cat.category.id ||
129 (cat.category.id - 1 === catNum && !hasClicked) 129 (cat.category.id - 1 === catNum && !hasClicked)
130 ? 'game-cat-button selected' 130 ? "game-cat-button selected"
131 : 'game-cat-button' 131 : "game-cat-button"
132 } 132 }
133 onClick={() => { 133 onClick={() => {
134 setCatNum(cat.category.id - 1); 134 setCatNum(cat.category.id - 1);
@@ -147,17 +147,17 @@ const Maplist: React.FC = () => {
147 <div> 147 <div>
148 <span 148 <span
149 style={{ 149 style={{
150 fontSize: '18px', 150 fontSize: "18px",
151 transform: 'translateY(5px)', 151 transform: "translateY(5px)",
152 display: 'block', 152 display: "block",
153 marginTop: '10px', 153 marginTop: "10px",
154 }} 154 }}
155 > 155 >
156 {curChapter?.chapter.name.split(' - ')[0]} 156 {curChapter?.chapter.name.split(" - ")[0]}
157 </span> 157 </span>
158 </div> 158 </div>
159 <div onClick={_handle_dropdown_click} className="dropdown"> 159 <div onClick={_handle_dropdown_click} className="dropdown">
160 <span>{curChapter?.chapter.name.split(' - ')[1]}</span> 160 <span>{curChapter?.chapter.name.split(" - ")[1]}</span>
161 <i className="triangle"></i> 161 <i className="triangle"></i>
162 </div> 162 </div>
163 <div 163 <div
@@ -205,16 +205,16 @@ const Maplist: React.FC = () => {
205 <div 205 <div
206 className={ 206 className={
207 map.difficulty === 0 207 map.difficulty === 0
208 ? 'one' 208 ? "one"
209 : map.difficulty === 1 209 : map.difficulty === 1
210 ? 'two' 210 ? "two"
211 : map.difficulty === 2 211 : map.difficulty === 2
212 ? 'three' 212 ? "three"
213 : map.difficulty === 3 213 : map.difficulty === 3
214 ? 'four' 214 ? "four"
215 : map.difficulty === 4 215 : map.difficulty === 4
216 ? 'five' 216 ? "five"
217 : 'one' 217 : "one"
218 } 218 }
219 > 219 >
220 <div className="difficulty-point"></div> 220 <div className="difficulty-point"></div>