pguzman/QuizMaster
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Use type for type imports and literal types

Browse Source 
Refactor `types.ts` to use `as const` for `GamePhase` and explicitly define the `GamePhase` type. This improves type safety and clarity. Additionally, update imports in other files to use `type` for type-only imports, further enhancing type safety and preventing potential runtime issues.
This commit is contained in:
Philip
2026-01-28 18:07:31 -08:00
parent ee4f3766cd
commit 77cc74a7c3
6 changed files with 30 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/HostView.tsx
+3 -2
View File
@@ -1,8 +1,9 @@
import React, { useState } from 'react';
import { useGame } from '../context/GameContext';
import { GamePhase, Game, Question } from '../types';
import { GamePhase } from '../types';
import type { Question } from '../types';
import { Soundboard } from './Soundboard';
import { Play, SkipForward, CheckCircle, XCircle, Users, Library, Sparkles, Plus, Trash2, Edit, Save, ArrowLeft, Upload, RefreshCw, Image as ImageIcon, List, Trophy, RotateCcw } from 'lucide-react';
import { Play, SkipForward, CheckCircle, XCircle, Users, Library, Sparkles, Plus, Trash2, Edit, ArrowLeft, Upload, RefreshCw, Image as ImageIcon, List, Trophy, RotateCcw } from 'lucide-react';
import { generateQuestions } from '../services/geminiService';
export const HostView: React.FC = () => {
components/PlayerView.tsx
+7 -4
View File
@@ -1,7 +1,8 @@
import React, { useState, useEffect } from 'react';
import { useGame } from '../context/GameContext';
import { GamePhase } from '../types';
import { Trophy, Zap, Target, LogOut, Image as ImageIcon } from 'lucide-react';
import type { Player } from '../types';
import { Trophy, Zap, LogOut } from 'lucide-react';
export const PlayerView: React.FC = () => {
const { gameState, players, teams, currentPlayerId, addPlayer, removePlayer, buzzQueue, handleBuzz, questions } = useGame();
@@ -149,7 +150,7 @@ export const PlayerView: React.FC = () => {
if (gameState.phase === GamePhase.FINAL_STATS) {
const winningTeam = sortedTeams[0];
let fastestPlayer = null;
let fastestPlayer: Player | null = null;
let fastestTime = Infinity;
players.forEach(p => {
if (p.stats.bestReactionTime && p.stats.bestReactionTime < fastestTime) {
@@ -188,7 +189,7 @@ export const PlayerView: React.FC = () => {
</div>
<div>
<div className="text-slate-400 text-xs font-bold uppercase">Fastest Buzzer</div>
<div className="text-white font-bold text-lg">{fastestPlayer.name}</div>
<div className="text-white font-bold text-lg">{(fastestPlayer as Player).name}</div>
<div className="text-blue-400 font-mono text-sm">{(fastestTime / 1000).toFixed(2)}s reaction</div>
</div>
</div>
@@ -227,6 +228,8 @@ export const PlayerView: React.FC = () => {
);
}
const isGameActive = gameState.phase !== GamePhase.LOBBY && gameState.phase !== GamePhase.LEADERBOARD;
// --- REGULAR GAMEPLAY UI ---
return (
<div className="h-full bg-slate-800 flex flex-col overflow-y-auto">
@@ -259,7 +262,7 @@ export const PlayerView: React.FC = () => {
<div className="flex-1 flex flex-col items-center justify-center p-6 relative">
{/* Dynamic Question Text & Media on Mobile */}
{gameState.phase !== GamePhase.LOBBY && gameState.phase !== GamePhase.LEADERBOARD && gameState.phase !== GamePhase.FINAL_STATS && currentQ && (
{isGameActive && currentQ && (
<div className="absolute top-4 left-4 right-4 text-center">
<p className="text-slate-300 text-sm uppercase tracking-widest mb-2">Current Question</p>
components/SpectatorView.tsx
+4 -3
View File
@@ -1,6 +1,7 @@
import React from 'react';
import { useGame } from '../context/GameContext';
import { GamePhase } from '../types';
import type { Player } from '../types';
import { BarChart, Bar, XAxis, YAxis, Tooltip, ResponsiveContainer, Cell } from 'recharts';
import { Trophy, Zap, Users } from 'lucide-react';
@@ -126,7 +127,7 @@ export const SpectatorView: React.FC = () => {
<YAxis dataKey="name" type="category" width={150} tick={{fill: 'white', fontSize: 20}} />
<Tooltip cursor={{fill: 'transparent'}} contentStyle={{backgroundColor: '#1e293b', color: '#fff', border: 'none'}} />
<Bar dataKey="score" radius={[0, 10, 10, 0]}>
{leaderboardData.map((entry, index) => (
{leaderboardData.map((_entry, index) => (
<Cell key={`cell-${index}`} fill={COLORS[index % COLORS.length]} />
))}
</Bar>
@@ -145,7 +146,7 @@ export const SpectatorView: React.FC = () => {
const topPlayers = [...players].sort((a,b) => b.score - a.score).slice(0, 5);
// Fastest Buzzer Calculation
let fastestPlayer = null;
let fastestPlayer: Player | null = null;
let fastestTime = Infinity;
players.forEach(p => {
if (p.stats.bestReactionTime && p.stats.bestReactionTime < fastestTime) {
@@ -202,7 +203,7 @@ export const SpectatorView: React.FC = () => {
</div>
<div className="text-left">
<div className="text-blue-300 font-bold uppercase tracking-wider text-sm">Fastest Finger</div>
<div className="text-2xl font-bold text-white">{fastestPlayer?.name || '-'}</div>
<div className="text-2xl font-bold text-white">{(fastestPlayer as Player)?.name || '-'}</div>
</div>
</div>
<div className="text-4xl font-mono font-bold text-blue-400">