PatientProTokenRepository/src/app/pages/missed/page.js
2025-04-24 10:32:46 +05:30

40 lines
1.2 KiB
JavaScript

"use client";
import TokenTable from "../../components/TokenTable";
import { useTheme } from "../../context/ThemeContext";
export default function MissedTokensPage() {
const { darkMode } = useTheme();
// Handle theme loading state (consistent with dashboard)
if (darkMode === undefined) {
return (
<div className="flex items-center justify-center min-h-screen bg-white dark:bg-gray-900">
<div className="text-center">
<div className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto ${
darkMode === true ? 'border-gray-100' : 'border-gray-900'
}`}></div>
<p className={`mt-4 text-lg font-semibold ${
darkMode === true ? 'text-gray-100' : 'text-gray-900'
}`}>
Loading...
</p>
</div>
</div>
);
}
return (
<div className={`min-h-screen p-6 transition-colors duration-300 ${
darkMode ? 'dark bg-gray-900' : 'bg-white'
}`}>
<div className="max-w-7xl mx-auto">
<h1 className={`text-2xl font-bold mb-4 ${
darkMode ? 'text-gray-100' : 'text-gray-800'
}`}>
Missed Tokens
</h1>
<TokenTable statusFilter="missed" />
</div>
</div>
);
}