diff --git a/app/routes/$lang.$codeLanguage.play.tsx b/app/routes/$lang.$codeLanguage.play.tsx index f3a72cc..276591b 100644 --- a/app/routes/$lang.$codeLanguage.play.tsx +++ b/app/routes/$lang.$codeLanguage.play.tsx @@ -23,6 +23,39 @@ type GameState = { usedProblemIds: string[]; // IDs of problems that have been used }; +/** + * Get proper display name for code language + */ +function getCodeLanguageDisplay(codeLanguage: string): string { + const languageMap: Record = { + javascript: 'JavaScript', + python: 'Python', + php: 'PHP', + ruby: 'Ruby', + java: 'Java', + dart: 'Dart', + }; + return languageMap[codeLanguage] || codeLanguage; +} + +/** + * Meta function to set page title + */ +export function meta({ data }: Route.MetaArgs) { + if (!data) { + return [{ title: 'Bug Sniper' }]; + } + + const { codeLanguage } = data; + const codeLangDisplay = getCodeLanguageDisplay(codeLanguage); + + return [ + { + title: `${codeLangDisplay} | Bug Sniper`, + }, + ]; +} + /** * Validate route parameters and redirect if invalid */ @@ -145,6 +178,14 @@ export default function Play({ loaderData }: Route.ComponentProps) { } | null>(null); const [error, setError] = useState(null); + // Update page title with remaining seconds + useEffect(() => { + if (typeof document !== 'undefined' && !gameEnded) { + const codeLangDisplay = getCodeLanguageDisplay(codeLanguage); + document.title = `(${gameState.remainingSeconds}s) ${codeLangDisplay} | Bug Sniper`; + } + }, [gameState.remainingSeconds, codeLanguage, gameEnded]); + // Timer countdown useEffect(() => { if (gameEnded) return; diff --git a/app/routes/result.$id.tsx b/app/routes/result.$id.tsx index a12b330..120afe8 100644 --- a/app/routes/result.$id.tsx +++ b/app/routes/result.$id.tsx @@ -21,6 +21,39 @@ type ScoreRecord = { llm_feedback: string | null; }; +/** + * Get proper display name for code language + */ +function getCodeLanguageDisplay(codeLanguage: string): string { + const languageMap: Record = { + javascript: 'JavaScript', + python: 'Python', + php: 'PHP', + ruby: 'Ruby', + java: 'Java', + dart: 'Dart', + }; + return languageMap[codeLanguage] || codeLanguage; +} + +/** + * Meta function to set page title + */ +export function meta({ data }: Route.MetaArgs) { + if (!data || !data.score) { + return [{ title: 'Result Not Found | Bug Sniper' }]; + } + + const { score } = data; + const codeLangDisplay = getCodeLanguageDisplay(score.code_language); + + return [ + { + title: `${codeLangDisplay} ${score.score}pt | Bug Sniper`, + }, + ]; +} + /** * Loader to fetch score data from D1 */