Fix OAuth login flow for Claude Max
This commit is contained in:
parent
39c18ac520
commit
05397ceffc
1 changed files with 12 additions and 2 deletions
|
|
@ -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>
|
||||||
|
|
|
||||||
Reference in a new issue