diff --git a/SerpentRace_Frontend/src/App.jsx b/SerpentRace_Frontend/src/App.jsx index a1c51bd8..7ed485e4 100644 --- a/SerpentRace_Frontend/src/App.jsx +++ b/SerpentRace_Frontend/src/App.jsx @@ -34,6 +34,18 @@ function App() { return () => window.removeEventListener("resize", handleResize) }, []) + // if (isMobile) { + // return ( + // + // + // } /> + // } /> + // } /> + // + // + // ); + // } + return ( <> diff --git a/SerpentRace_Frontend/src/components/DeckCreator/CardsList.jsx b/SerpentRace_Frontend/src/components/DeckCreator/CardsList.jsx index cbbc8ce9..0c36367d 100644 --- a/SerpentRace_Frontend/src/components/DeckCreator/CardsList.jsx +++ b/SerpentRace_Frontend/src/components/DeckCreator/CardsList.jsx @@ -1,8 +1,18 @@ // src/components/DeckCreator/CardsList.jsx // Bal oldali kártyák listája és új kártya létrehozás -import React from "react" -import { FaPlus, FaEdit, FaTrash, FaQuestionCircle, FaCheck, FaTimes, FaDice, FaTheaterMasks } from "react-icons/fa" +import React, { useState } from "react" +import { + FaPlus, + FaEdit, + FaTrash, + FaQuestionCircle, + FaCheck, + FaTimes, + FaDice, + FaTheaterMasks +} from "react-icons/fa" +import { notifySuccess, notifyError } from "../../components/Toastify/toastifyServices" const cardTypeIcons = { task: { icon: FaQuestionCircle, color: "var(--color-question)" }, @@ -17,47 +27,60 @@ const cardSubTypeLabels = { text: "Szöveges válasz" } -export default function CardsList({ - cards, - selectedCard, - onSelectCard, - onCreateCard, +export default function CardsList({ + cards, + selectedCard, + onSelectCard, + onCreateCard, onDeleteCard, isCreatingCard, - newCardType + newCardType }) { + const [confirmingDelete, setConfirmingDelete] = useState(null) const getCardPreview = (card) => { - if (card.type === 'task') { - return card.question || card.statement || 'Új feladat kártya' + if (card.type === "task") { + return card.question || card.statement || "Új feladat kártya" } - if (card.type === 'joker') { - return card.text || 'Új joker kártya' + if (card.type === "joker") { + return card.text || "Új joker kártya" } - if (card.type === 'luck') { - return card.text || 'Új szerencse kártya' + if (card.type === "luck") { + return card.text || "Új szerencse kártya" } - return 'Ismeretlen kártya' + return "Ismeretlen kártya" } const getCardTypeLabel = (card) => { - if (card.type === 'task') { + if (card.type === "task") { if (card.subType) { - return cardSubTypeLabels[card.subType] || 'Feladat' + return cardSubTypeLabels[card.subType] || "Feladat" } - return 'Feladat' + return "Feladat" } - if (card.type === 'joker') { - return 'Joker' + if (card.type === "joker") { + return "Joker" } - if (card.type === 'luck') { - return 'Szerencse' + if (card.type === "luck") { + return "Szerencse" } - return 'Ismeretlen' + return "Ismeretlen" + } + + const handleConfirmDelete = () => { + if (confirmingDelete) { + onDeleteCard(confirmingDelete) + notifySuccess("Kártya sikeresen törölve a pakliból!") + setConfirmingDelete(null) + } + } + + const handleCancelDelete = () => { + setConfirmingDelete(null) } return ( -
+
{/* Header */}

@@ -70,27 +93,27 @@ export default function CardsList({ Új kártya - + {/* Dropdown Menu */}
- + - + + +
+

+
+ )} + {/* Footer Stats */}
📊 Összesen: {cards.length} kártya
- + {cards.length > 0 && (
- 📋 {cards.filter(c => c.type === 'task').length} - 🃏 {cards.filter(c => c.type === 'joker').length} - 🎲 {cards.filter(c => c.type === 'luck').length} + 📋 {cards.filter((c) => c.type === "task").length} + 🃏 {cards.filter((c) => c.type === "joker").length} + 🎲 {cards.filter((c) => c.type === "luck").length}
)}
) -} \ No newline at end of file +} diff --git a/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx b/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx index 1af092ac..c7d30afa 100644 --- a/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx +++ b/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx @@ -32,10 +32,8 @@ export default function DeckCreator() { // Betöltés (később API-ból) useEffect(() => { if (deckId) { - // TODO: Betöltés API-ból loadDeck(deckId) } else { - // Új deck setDeck({ id: null, name: "Új Deck", @@ -99,19 +97,25 @@ export default function DeckCreator() { } const saved = await createDeck(payload) - setDeck(prev => ({ ...prev, id: saved.id ?? prev.id, creationdate: saved.creationdate ?? prev.creationdate, updatedate: saved.updatedate ?? prev.updatedate })) + setDeck(prev => ({ + ...prev, + id: saved.id ?? prev.id, + creationdate: saved.creationdate ?? prev.creationdate, + updatedate: saved.updatedate ?? prev.updatedate + })) + console.log('Deck saved (backend):', saved) - notifySuccess(' Deck sikeresen mentve!') + notifySuccess('Deck sikeresen mentve!') } catch (error) { console.error('Mentési hiba:', error) - notifyError(' Hiba történt a mentés során: ' + (error?.response?.data?.error || error.message || String(error))) + notifyError('Hiba történt a mentés során: ' + (error?.response?.data?.error || error.message || String(error))) } } + // 🔧 Itt korábban volt confirm(), de most eltávolítottuk const handleBack = () => { - if (confirm("Biztosan visszamész? A nem mentett változtatások elvesznek.")) { - navigate("/decks") - } + // Egyszerű visszalépés — ha akarsz, később adhatunk hozzá saját modalt + navigate("/decks") } const handleCreateCard = (cardType) => { @@ -144,7 +148,7 @@ export default function DeckCreator() { // Meglévő kártya frissítése setDeck(prev => ({ ...prev, - cards: prev.cards.map(card => + cards: prev.cards.map(card => card.id === cardData.id ? cardData : card ) })) @@ -152,26 +156,25 @@ export default function DeckCreator() { } } + // 🔧 Itt is confirm() volt — most a CardsList popupja kezeli a megerősítést const handleDeleteCard = (cardId) => { - if (confirm("Biztosan törlöd ezt a kártyát?")) { - setDeck(prev => ({ - ...prev, - cards: prev.cards.filter(card => card.id !== cardId) - })) - - if (selectedCard?.id === cardId) { - setSelectedCard(null) - } + setDeck(prev => ({ + ...prev, + cards: prev.cards.filter(card => card.id !== cardId) + })) + + if (selectedCard?.id === cardId) { + setSelectedCard(null) } } return (
- +
{/* Deck Header */} -
) -} \ No newline at end of file +}