redo of entire app

app/(main)/admin/page.js

@@ -0,0 +1,26 @@
+'use client'; // Mark as a Client Component
+import { useState } from 'react';
+import { useSession } from 'next-auth/react';
+
+export default function Admin() {
+    const { data: session } = useSession();
+    const [timerStarted, setTimerStarted] = useState(false);
+
+    if (session?.user?.role !== 'admin') {
+        return <p>Access denied</p>;
+    }
+
+    const startTimer = async () => {
+        // Implement timer logic (e.g., update database or state)
+        setTimerStarted(true);
+    };
+
+    return (
+        <div>
+            <h1>Admin Console</h1>
+            <button onClick={startTimer} disabled={timerStarted}>
+                Start Timer
+            </button>
+        </div>
+    );
+}

app/(main)/progress/page.js

@@ -0,0 +1,21 @@
+import { query } from '../../../lib/db';
+import { useSession } from 'next-auth/react';
+
+export default async function Progress() {
+    const { data: session } = useSession();
+
+    // Fetch progress from the database
+    const progress = await query(
+        'SELECT COUNT(*) as found FROM clues WHERE found = TRUE AND team_id = ?',
+        [session.user.teamId]
+    );
+    const remaining = 20 - progress.found;
+
+    return (
+        <div>
+            <h1>Progress</h1>
+            <p>Clues Found: {progress.found}</p>
+            <p>Clues Remaining: {remaining}</p>
+        </div>
+    );
+}

app/(main)/scan/page.js

@@ -0,0 +1,33 @@
+'use client'; // Mark as a Client Component
+import { useState } from 'react';
+import QRScanner from '../../../components/QRScanner';
+import { useSession } from 'next-auth/react';
+
+export default function Scan() {
+    const { data: session } = useSession();
+    const [message, setMessage] = useState('');
+
+    const handleScan = async (clueId) => {
+        const response = await fetch('/api/mark-clue', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({ clueId, teamId: session.user.teamId }),
+        });
+
+        if (response.ok) {
+            setMessage('Clue marked as found!');
+        } else {
+            setMessage('Error marking clue.');
+        }
+    };
+
+    return (
+        <div>
+            <h1>Scan QR Code</h1>
+            <QRScanner onScan={handleScan} />
+            {message && <p>{message}</p>}
+        </div>
+    );
+}

app/(main)/stats/[teamId]/page.js

@@ -0,0 +1,24 @@
+import { query } from '../../../lib/db';
+
+export default async function Stats({ params }) {
+    const { teamId } = params;
+
+    // Fetch team and clues from the database
+    const team = await query('SELECT * FROM teams WHERE id = ?', [teamId]);
+    const clues = await query('SELECT * FROM clues WHERE team_id = ?', [teamId]);
+
+    return (
+        <div>
+            <h1>Stats for {team.name}</h1>
+            <p>Team Code: {team.code}</p>
+            <h2>Clues</h2>
+            <ul>
+                {clues.map((clue) => (
+                    <li key={clue.id}>
+                        {clue.description} - {clue.found ? 'Found' : 'Not Found'}
+                    </li>
+                ))}
+            </ul>
+        </div>
+    );
+}

app/(main)/team-selection/page.js

@@ -0,0 +1,40 @@
+'use client'; // Mark as a Client Component
+import { useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { query } from '../../../lib/db';
+
+export default function TeamSelection() {
+    const [teamCode, setTeamCode] = useState('');
+    const [error, setError] = useState('');
+    const router = useRouter();
+
+    const handleJoinTeam = async (e) => {
+        e.preventDefault();
+        const team = await query('SELECT * FROM teams WHERE code = ?', [teamCode]);
+        if (team) {
+            router.push(`/stats/${team.id}`);
+        } else {
+            setError('Team not found');
+        }
+    };
+
+    return (
+        <div>
+            <h1>Team Selection</h1>
+            <form onSubmit={handleJoinTeam}>
+                <input
+                    type="text"
+                    placeholder="Team Code"
+                    value={teamCode}
+                    onChange={(e) => setTeamCode(e.target.value)}
+                    required
+                />
+                <button type="submit">Join Team</button>
+            </form>
+            {error && <p style={{ color: 'red' }}>{error}</p>}
+            <p>
+                <a href="/create-team">Create a new team</a>
+            </p>
+        </div>
+    );
+}