mirror of
https://github.com/Zproger/Aurum.git
synced 2026-10-12 18:46:40 +07:00
292ef1e410
Раньше предупреждение об отсутствии AURUM_BASIC_AUTH_USER/PASSWORD было видно только в логах docker-контейнера при старте и терялось, если пользователь забыл настроить .env. Теперь LoginGate различает 'авторизован' и 'auth вообще не настроен' и во втором случае показывает заметный баннер прямо в интерфейсе.
64 lines
2.5 KiB
TypeScript
64 lines
2.5 KiB
TypeScript
import { type ReactNode, useEffect, useState } from "react";
|
|
import { Logo } from "@/components/layout/Logo";
|
|
import { LoginScreen } from "@/components/auth/LoginScreen";
|
|
import { NoAuthBanner } from "@/components/auth/NoAuthBanner";
|
|
import { checkCredentials, useAuthHeader } from "@/lib/auth";
|
|
|
|
// "not-configured" and "authenticated" both render `children` the same way,
|
|
// but they must stay distinct: only "not-configured" means this instance has
|
|
// no AURUM_BASIC_AUTH_USER/PASSWORD at all (nginx never sent 401 to our
|
|
// deliberately-wrong probe header), which is what triggers NoAuthBanner.
|
|
// Collapsing them back into one "not-required" state would make an
|
|
// authenticated session with valid stored credentials show the "this
|
|
// instance has no password" warning too.
|
|
type Probe = "checking" | "required" | "not-configured" | "authenticated";
|
|
|
|
/** Wraps the whole app. Renders the login screen only when this instance
|
|
* actually has Basic Auth turned on (AURUM_BASIC_AUTH_USER/PASSWORD in
|
|
* .env, see frontend/docker-entrypoint.d/20-basic-auth.sh) — most installs
|
|
* don't, and this must never force a login screen on those. When stored
|
|
* credentials go stale (password changed, or auth was just turned on) the
|
|
* 401 handler in api/client.ts clears them, useAuthHeader() picks that up
|
|
* reactively, and this falls back to the login screen on its own. */
|
|
export function LoginGate({ children }: { children: ReactNode }) {
|
|
const authHeader = useAuthHeader();
|
|
const [probe, setProbe] = useState<Probe>(authHeader ? "authenticated" : "checking");
|
|
|
|
useEffect(() => {
|
|
if (authHeader) {
|
|
setProbe("authenticated");
|
|
return;
|
|
}
|
|
let cancelled = false;
|
|
checkCredentials(null).then((result) => {
|
|
if (cancelled) return;
|
|
// A network/backend error here isn't an auth problem — don't block
|
|
// the user behind a login screen for an unrelated outage, let the
|
|
// app's own per-page error states (e.g. dashboard.errorLoading) explain it.
|
|
setProbe(result === "unauthorized" ? "required" : "not-configured");
|
|
});
|
|
return () => {
|
|
cancelled = true;
|
|
};
|
|
}, [authHeader]);
|
|
|
|
if (probe === "checking") {
|
|
return (
|
|
<div className="flex min-h-screen items-center justify-center bg-surface-0">
|
|
<Logo size={40} className="animate-pulse" />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (probe === "required" && !authHeader) {
|
|
return <LoginScreen />;
|
|
}
|
|
|
|
return (
|
|
<>
|
|
{probe === "not-configured" && <NoAuthBanner />}
|
|
{children}
|
|
</>
|
|
);
|
|
}
|