Something went wrong. Try again.
AtAuth
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687import { useState } from 'react';import { useNavigate } from 'react-router-dom';import { useAuthStore } from '../stores/auth';import { api } from '../api/client';
export function LoginPage() { const [token, setToken] = useState(''); const [error, setError] = useState(''); const [loading, setLoading] = useState(false); const navigate = useNavigate(); const setAuthToken = useAuthStore((s) => s.setToken);
const handleSubmit = async (e: React.FormEvent) => { e.preventDefault(); setError(''); setLoading(true);
try { // Test the token by fetching stats api.setToken(token); await api.getStats(); setAuthToken(token); navigate('/dashboard'); } catch (err) { setError(err instanceof Error ? err.message : 'Invalid admin token'); api.setToken(null); } finally { setLoading(false); } };
return ( <div className="min-h-screen flex items-center justify-center bg-gray-100 dark:bg-gray-900 p-4"> <div className="w-full max-w-md"> <div className="bg-white dark:bg-gray-800 rounded-lg shadow-lg p-8"> <div className="text-center mb-8"> <h1 className="text-2xl font-bold text-gray-900 dark:text-white"> ATAuth Admin </h1> <p className="text-gray-600 dark:text-gray-400 mt-2"> Enter your admin token to continue </p> </div>
<form onSubmit={handleSubmit} className="space-y-6"> <div> <label htmlFor="token" className="block text-sm font-medium text-gray-700 dark:text-gray-300" > Admin Token </label> <input type="password" id="token" value={token} onChange={(e) => setToken(e.target.value)} className="mt-1 block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" placeholder="Enter your ADMIN_TOKEN" required /> </div>
{error && ( <div className="p-3 bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-md"> <p className="text-sm text-red-600 dark:text-red-400">{error}</p> </div> )}
<button type="submit" disabled={loading || !token} className="w-full py-2 px-4 bg-blue-600 hover:bg-blue-700 disabled:bg-blue-400 text-white font-medium rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2" > {loading ? 'Verifying...' : 'Sign In'} </button> </form>
<p className="mt-6 text-center text-xs text-gray-500 dark:text-gray-400"> The admin token is set via the ADMIN_TOKEN environment variable on the gateway server. </p> </div> </div> </div> );}