Fix OAuth login flow for Claude Max

This commit is contained in:
Zac Gaetano 2026-04-04 23:47:54 -04:00
parent 39c18ac520
commit 05397ceffc

View file

@ -74,17 +74,24 @@ const App = () => {
} }
}; };
const [loginLoading, setLoginLoading] = useState(false);
const handleLogin = async () => { const handleLogin = async () => {
setLoginLoading(true);
try { try {
const response = await fetch('/api/auth/login', { method: 'POST' }); const response = await fetch('/api/auth/login', { method: 'POST' });
const data = await response.json(); const data = await response.json();
setAuthStatus(prev => ({ ...prev, ...data })); setAuthStatus(prev => ({ ...prev, ...data }));
if (data.auth_url) { if (data.auth_url) {
window.open(data.auth_url, '_blank'); window.open(data.auth_url, '_blank');
} else if (data.status === 'error') {
alert(data.message || 'Login failed. Check container logs.');
} }
} catch (error) { } catch (error) {
console.error('Error initiating login:', error); console.error('Error initiating login:', error);
alert('Failed to connect to auth endpoint');
} }
setLoginLoading(false);
}; };
const handleLogout = async () => { const handleLogout = async () => {
@ -178,7 +185,9 @@ const App = () => {
) : authStatus?.status === 'pending' ? ( ) : authStatus?.status === 'pending' ? (
<span className="auth-pending"> Awaiting login</span> <span className="auth-pending"> Awaiting login</span>
) : ( ) : (
<button className="auth-login-btn" onClick={handleLogin}>🔐 Login with Claude Max</button> <button className="auth-login-btn" onClick={handleLogin} disabled={loginLoading}>
{loginLoading ? '⏳ Connecting…' : '🔐 Login with Claude Max'}
</button>
)} )}
</div> </div>
{systemInfo && ( {systemInfo && (
@ -248,9 +257,10 @@ const App = () => {
<span className="auth-icon"></span> <span className="auth-icon"></span>
<div> <div>
<div className="auth-title">Waiting for browser login</div> <div className="auth-title">Waiting for browser login</div>
<div className="auth-sub">Complete the login in the browser tab that opened, then come back here.</div>
{authStatus.auth_url && ( {authStatus.auth_url && (
<a className="auth-url-link" href={authStatus.auth_url} target="_blank" rel="noreferrer"> <a className="auth-url-link" href={authStatus.auth_url} target="_blank" rel="noreferrer">
Open login page Click here if the browser tab didn't open
</a> </a>
)} )}
</div> </div>