[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8},"actionData","errors","root",{"_26":27,"_28":29,"_30":12,"_31":12,"_32":12,"_33":12,"_34":12,"_35":12,"_36":37},"routes/canvas.shared.$sharedTextdocId",{"_9":10,"_11":12},"sharedTextdoc",{"_13":14,"_15":-7,"_16":17,"_18":19,"_20":21,"_22":23,"_24":12,"_25":12},"isAuthenticated",false,"sharedTextdocId","67bccb282d8c8191a2bbdefb5829dcdc","versionInt","title","Capitals Comarques","type","code/react","content","import React, { useState, useEffect } from \"react\";\nimport { Card, CardContent } from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Alert } from \"@/components/ui/alert\";\n\nconst comarques = [\n { comarca: \"Alt Camp\", capital: \"Valls\" },\n { comarca: \"Alt Empordà\", capital: \"Figueres\" },\n { comarca: \"Alt Penedès\", capital: \"Vilafranca del Penedès\" },\n { comarca: \"Alt Urgell\", capital: \"La Seu d'Urgell\" },\n { comarca: \"Alta Ribagorça\", capital: \"El Pont de Suert\" },\n { comarca: \"Anoia\", capital: \"Igualada\" },\n { comarca: \"Bages\", capital: \"Manresa\" },\n { comarca: \"Baix Camp\", capital: \"Reus\" },\n { comarca: \"Baix Ebre\", capital: \"Tortosa\" },\n { comarca: \"Baix Empordà\", capital: \"La Bisbal d'Empordà\" },\n { comarca: \"Baix Llobregat\", capital: \"Sant Feliu de Llobregat\" },\n { comarca: \"Baix Penedès\", capital: \"El Vendrell\" },\n { comarca: \"Barcelonès\", capital: \"Barcelona\" },\n { comarca: \"Berguedà\", capital: \"Berga\" },\n { comarca: \"Cerdanya\", capital: \"Puigcerdà\" },\n { comarca: \"Conca de Barberà\", capital: \"Montblanc\" },\n { comarca: \"Garraf\", capital: \"Vilanova i la Geltrú\" },\n { comarca: \"Garrigues\", capital: \"Les Borges Blanques\" },\n { comarca: \"Garrotxa\", capital: \"Olot\" },\n { comarca: \"Gironès\", capital: \"Girona\" },\n { comarca: \"Maresme\", capital: \"Mataró\" },\n { comarca: \"Montsià\", capital: \"Amposta\" },\n { comarca: \"Noguera\", capital: \"Balaguer\" },\n { comarca: \"Osona\", capital: \"Vic\" },\n { comarca: \"Pallars Jussà\", capital: \"Tremp\" },\n { comarca: \"Pallars Sobirà\", capital: \"Sort\" },\n { comarca: \"Pla d'Urgell\", capital: \"Mollerussa\" },\n { comarca: \"Pla de l'Estany\", capital: \"Banyoles\" },\n { comarca: \"Priorat\", capital: \"Falset\" },\n { comarca: \"Ribera d'Ebre\", capital: \"Móra d'Ebre\" },\n { comarca: \"Ripollès\", capital: \"Ripoll\" },\n { comarca: \"Segarra\", capital: \"Cervera\" },\n { comarca: \"Segrià\", capital: \"Lleida\" },\n { comarca: \"Selva\", capital: \"Santa Coloma de Farners\" },\n { comarca: \"Solsonès\", capital: \"Solsona\" },\n { comarca: \"Tarragonès\", capital: \"Tarragona\" },\n { comarca: \"Terra Alta\", capital: \"Gandesa\" },\n { comarca: \"Urgell\", capital: \"Tàrrega\" },\n { comarca: \"Vallès Occidental\", capital: \"Sabadell i Terrassa\" },\n { comarca: \"Vallès Oriental\", capital: \"Granollers\" }\n];\n\nexport default function CapitalsComarques() {\n const [remaining, setRemaining] = useState([...comarques]);\n const [current, setCurrent] = useState(null);\n const [input, setInput] = useState(\"\");\n const [feedback, setFeedback] = useState(null);\n const [correct, setCorrect] = useState(0);\n const [incorrect, setIncorrect] = useState(0);\n\n useEffect(() => {\n if (remaining.length > 0) {\n setCurrent(remaining[Math.floor(Math.random() * remaining.length)]);\n }\n }, [remaining]);\n\n const checkAnswer = () => {\n if (input.trim().toLowerCase() === current.capital.toLowerCase()) {\n setCorrect(correct + 1);\n setFeedback(\"Correcte! ✅\");\n } else {\n setIncorrect(incorrect + 1);\n setFeedback(`Incorrecte ❌ La resposta correcta és: ${current.capital}`);\n }\n setTimeout(() => {\n setRemaining(remaining.filter((c) => c !== current));\n setFeedback(null);\n setInput(\"\");\n }, 1000);\n };\n\n return (\n

Practica les capitals de comarca

\n {remaining.length > 0 ? (\n \n \n

\n Capital de {current?.comarca}?\n

\n setInput(e.target.value)}\n placeholder=\"Escriu la capital\"\n className=\"mb-2\"\n />\n \n {feedback && {feedback}}\n

Encerts: {correct}

Errors: {incorrect}

Percentatge: {((correct + incorrect) > 0 ? (correct / (correct + incorrect) * 100).toFixed(2) : 0)}%

\n \n \n ) : (\n

\n Has acabat! ✅\n

Encerts: {correct}

Errors: {incorrect}

Percentatge: {((correct / (correct + incorrect)) * 100).toFixed(2)}%

\n )}\n

\n );\n}\n","access","public","isModerationBlocked","isAnonifyApiKeyDetected","dd",{"_38":39,"_40":41},"disablePrefetch",true,"shouldPrefetchAccount","shouldPrefetchUser","shouldPrefetchSystemHints","promoteCss","disableSSR","stripModulepreloadImports","statsigGateEvaluationsPromise",["P",37],"traceId","17555087889473160237","traceTime",1778047932525]