mirror of
https://github.com/fosrl/pangolin.git
synced 2026-02-08 05:56:38 +00:00
add my-device and force login
This commit is contained in:
@@ -237,10 +237,11 @@ export type SecurityKeyVerifyResponse = {
|
||||
};
|
||||
|
||||
export async function loginProxy(
|
||||
request: LoginRequest
|
||||
request: LoginRequest,
|
||||
forceLogin?: boolean
|
||||
): Promise<ResponseT<LoginResponse>> {
|
||||
const serverPort = process.env.SERVER_EXTERNAL_PORT;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/login`;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/login${forceLogin ? "?forceLogin=true" : ""}`;
|
||||
|
||||
console.log("Making login request to:", url);
|
||||
|
||||
@@ -248,10 +249,11 @@ export async function loginProxy(
|
||||
}
|
||||
|
||||
export async function securityKeyStartProxy(
|
||||
request: SecurityKeyStartRequest
|
||||
request: SecurityKeyStartRequest,
|
||||
forceLogin?: boolean
|
||||
): Promise<ResponseT<SecurityKeyStartResponse>> {
|
||||
const serverPort = process.env.SERVER_EXTERNAL_PORT;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/security-key/authenticate/start`;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/security-key/authenticate/start${forceLogin ? "?forceLogin=true" : ""}`;
|
||||
|
||||
console.log("Making security key start request to:", url);
|
||||
|
||||
@@ -260,10 +262,11 @@ export async function securityKeyStartProxy(
|
||||
|
||||
export async function securityKeyVerifyProxy(
|
||||
request: SecurityKeyVerifyRequest,
|
||||
tempSessionId: string
|
||||
tempSessionId: string,
|
||||
forceLogin?: boolean
|
||||
): Promise<ResponseT<SecurityKeyVerifyResponse>> {
|
||||
const serverPort = process.env.SERVER_EXTERNAL_PORT;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/security-key/authenticate/verify`;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/security-key/authenticate/verify${forceLogin ? "?forceLogin=true" : ""}`;
|
||||
|
||||
console.log("Making security key verify request to:", url);
|
||||
|
||||
@@ -407,10 +410,19 @@ export async function validateOidcUrlCallbackProxy(
|
||||
export async function generateOidcUrlProxy(
|
||||
idpId: number,
|
||||
redirect: string,
|
||||
orgId?: string
|
||||
orgId?: string,
|
||||
forceLogin?: boolean
|
||||
): Promise<ResponseT<GenerateOidcUrlResponse>> {
|
||||
const serverPort = process.env.SERVER_EXTERNAL_PORT;
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/idp/${idpId}/oidc/generate-url${orgId ? `?orgId=${orgId}` : ""}`;
|
||||
const queryParams = new URLSearchParams();
|
||||
if (orgId) {
|
||||
queryParams.append("orgId", orgId);
|
||||
}
|
||||
if (forceLogin) {
|
||||
queryParams.append("forceLogin", "true");
|
||||
}
|
||||
const queryString = queryParams.toString();
|
||||
const url = `http://localhost:${serverPort}/api/v1/auth/idp/${idpId}/oidc/generate-url${queryString ? `?${queryString}` : ""}`;
|
||||
|
||||
console.log("Making OIDC URL generation request to:", url);
|
||||
|
||||
|
||||
@@ -5,13 +5,32 @@ import { cache } from "react";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
export default async function DeviceLoginPage() {
|
||||
const getUser = cache(verifySession);
|
||||
const user = await getUser();
|
||||
type Props = {
|
||||
searchParams: Promise<{ code?: string }>;
|
||||
};
|
||||
|
||||
export default async function DeviceLoginPage({ searchParams }: Props) {
|
||||
const user = await verifySession({ forceLogin: true });
|
||||
|
||||
const params = await searchParams;
|
||||
const code = params.code || "";
|
||||
|
||||
console.log("user", user);
|
||||
|
||||
if (!user) {
|
||||
redirect("/auth/login?redirect=/auth/login/device");
|
||||
const redirectDestination = code
|
||||
? `/auth/login/device?code=${encodeURIComponent(code)}`
|
||||
: "/auth/login/device";
|
||||
redirect(`/auth/login?forceLogin=true&redirect=${encodeURIComponent(redirectDestination)}`);
|
||||
}
|
||||
|
||||
return <DeviceLoginForm userEmail={user?.email || ""} />;
|
||||
const userName = user?.name || user?.username || "";
|
||||
|
||||
return (
|
||||
<DeviceLoginForm
|
||||
userEmail={user?.email || ""}
|
||||
userName={userName}
|
||||
initialCode={code}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -25,12 +25,14 @@ export default async function Page(props: {
|
||||
const user = await getUser({ skipCheckVerifyEmail: true });
|
||||
|
||||
const isInvite = searchParams?.redirect?.includes("/invite");
|
||||
const forceLoginParam = searchParams?.forceLogin;
|
||||
const forceLogin = forceLoginParam === "true";
|
||||
|
||||
const env = pullEnv();
|
||||
|
||||
const signUpDisabled = env.flags.disableSignupWithoutInvite;
|
||||
|
||||
if (user) {
|
||||
if (user && !forceLogin) {
|
||||
redirect("/");
|
||||
}
|
||||
|
||||
@@ -96,7 +98,7 @@ export default async function Page(props: {
|
||||
</div>
|
||||
)}
|
||||
|
||||
<DashboardLoginForm redirect={redirectUrl} idps={loginIdps} />
|
||||
<DashboardLoginForm redirect={redirectUrl} idps={loginIdps} forceLogin={forceLogin} />
|
||||
|
||||
{(!signUpDisabled || isInvite) && (
|
||||
<p className="text-center text-muted-foreground mt-4">
|
||||
|
||||
@@ -21,11 +21,13 @@ import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
|
||||
type DashboardLoginFormProps = {
|
||||
redirect?: string;
|
||||
idps?: LoginFormIDP[];
|
||||
forceLogin?: boolean;
|
||||
};
|
||||
|
||||
export default function DashboardLoginForm({
|
||||
redirect,
|
||||
idps
|
||||
idps,
|
||||
forceLogin
|
||||
}: DashboardLoginFormProps) {
|
||||
const router = useRouter();
|
||||
const { env } = useEnvContext();
|
||||
@@ -57,6 +59,7 @@ export default function DashboardLoginForm({
|
||||
<LoginForm
|
||||
redirect={redirect}
|
||||
idps={idps}
|
||||
forceLogin={forceLogin}
|
||||
onLogin={(redirectUrl) => {
|
||||
if (redirectUrl) {
|
||||
const safe = cleanRedirect(redirectUrl);
|
||||
|
||||
@@ -30,10 +30,12 @@ import { DeviceAuthConfirmation } from "@/components/DeviceAuthConfirmation";
|
||||
import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
|
||||
import BrandingLogo from "./BrandingLogo";
|
||||
import { useTranslations } from "next-intl";
|
||||
import { Avatar, AvatarFallback } from "@/components/ui/avatar";
|
||||
|
||||
const createFormSchema = (t: (key: string) => string) => z.object({
|
||||
code: z.string().length(8, t("deviceCodeInvalidFormat"))
|
||||
});
|
||||
const createFormSchema = (t: (key: string) => string) =>
|
||||
z.object({
|
||||
code: z.string().length(8, t("deviceCodeInvalidFormat"))
|
||||
});
|
||||
|
||||
type DeviceAuthMetadata = {
|
||||
ip: string | null;
|
||||
@@ -45,9 +47,15 @@ type DeviceAuthMetadata = {
|
||||
|
||||
type DeviceLoginFormProps = {
|
||||
userEmail: string;
|
||||
userName?: string;
|
||||
initialCode?: string;
|
||||
};
|
||||
|
||||
export default function DeviceLoginForm({ userEmail }: DeviceLoginFormProps) {
|
||||
export default function DeviceLoginForm({
|
||||
userEmail,
|
||||
userName,
|
||||
initialCode = ""
|
||||
}: DeviceLoginFormProps) {
|
||||
const router = useRouter();
|
||||
const { env } = useEnvContext();
|
||||
const api = createApiClient({ env });
|
||||
@@ -63,7 +71,7 @@ export default function DeviceLoginForm({ userEmail }: DeviceLoginFormProps) {
|
||||
const form = useForm<z.infer<typeof formSchema>>({
|
||||
resolver: zodResolver(formSchema),
|
||||
defaultValues: {
|
||||
code: ""
|
||||
code: initialCode.replace(/-/g, "").toUpperCase()
|
||||
}
|
||||
});
|
||||
|
||||
@@ -77,10 +85,15 @@ export default function DeviceLoginForm({ userEmail }: DeviceLoginFormProps) {
|
||||
data.code = data.code.slice(0, 4) + "-" + data.code.slice(4);
|
||||
}
|
||||
// First check - get metadata
|
||||
const res = await api.post("/device-web-auth/verify", {
|
||||
code: data.code.toUpperCase(),
|
||||
verify: false
|
||||
});
|
||||
const res = await api.post(
|
||||
"/device-web-auth/verify?forceLogin=true",
|
||||
{
|
||||
code: data.code.toUpperCase(),
|
||||
verify: false
|
||||
}
|
||||
);
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 500)); // artificial delay for better UX
|
||||
|
||||
if (res.data.success && res.data.data.metadata) {
|
||||
setMetadata(res.data.data.metadata);
|
||||
@@ -109,6 +122,8 @@ export default function DeviceLoginForm({ userEmail }: DeviceLoginFormProps) {
|
||||
verify: true
|
||||
});
|
||||
|
||||
await new Promise((resolve) => setTimeout(resolve, 500)); // artificial delay for better UX
|
||||
|
||||
// Redirect to success page
|
||||
router.push("/auth/login/device/success");
|
||||
} catch (e: any) {
|
||||
@@ -136,6 +151,30 @@ export default function DeviceLoginForm({ userEmail }: DeviceLoginFormProps) {
|
||||
setError(null);
|
||||
}
|
||||
|
||||
const profileLabel = (userName || userEmail || "").trim();
|
||||
const profileInitial = profileLabel
|
||||
? profileLabel.charAt(0).toUpperCase()
|
||||
: "?";
|
||||
|
||||
async function handleUseDifferentAccount() {
|
||||
try {
|
||||
await api.post("/auth/logout");
|
||||
} catch (logoutError) {
|
||||
console.error(
|
||||
"Failed to logout before switching account",
|
||||
logoutError
|
||||
);
|
||||
} finally {
|
||||
const currentSearch =
|
||||
typeof window !== "undefined" ? window.location.search : "";
|
||||
const redirectTarget = `/auth/login/device${currentSearch || ""}`;
|
||||
router.push(
|
||||
`/auth/login?forceLogin=true&redirect=${encodeURIComponent(redirectTarget)}`
|
||||
);
|
||||
router.refresh();
|
||||
}
|
||||
}
|
||||
|
||||
if (metadata) {
|
||||
return (
|
||||
<DeviceAuthConfirmation
|
||||
@@ -154,13 +193,36 @@ export default function DeviceLoginForm({ userEmail }: DeviceLoginFormProps) {
|
||||
<BrandingLogo height={logoHeight} width={logoWidth} />
|
||||
</div>
|
||||
<div className="text-center space-y-1 pt-3">
|
||||
<p className="text-muted-foreground">{t("deviceActivation")}</p>
|
||||
<p className="text-muted-foreground">
|
||||
{t("deviceActivation")}
|
||||
</p>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-6">
|
||||
<div className="text-center mb-3">
|
||||
<span>{t("signedInAs")} </span>
|
||||
<span className="font-medium">{userEmail}</span>
|
||||
<div className="flex items-center gap-3 p-3 mb-4 border rounded-md">
|
||||
<Avatar className="h-10 w-10">
|
||||
<AvatarFallback>{profileInitial}</AvatarFallback>
|
||||
</Avatar>
|
||||
<div className="flex-1 space-y-1">
|
||||
<div>
|
||||
<p className="text-sm font-medium">
|
||||
{profileLabel || userEmail}
|
||||
</p>
|
||||
<p className="text-xs text-muted-foreground break-all">
|
||||
{t(
|
||||
"deviceLoginDeviceRequestingAccessToAccount"
|
||||
)}
|
||||
</p>
|
||||
</div>
|
||||
<Button
|
||||
type="button"
|
||||
variant="link"
|
||||
className="h-auto px-0 text-xs"
|
||||
onClick={handleUseDifferentAccount}
|
||||
>
|
||||
{t("deviceLoginUseDifferentAccount")}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Form {...form}>
|
||||
|
||||
@@ -61,13 +61,15 @@ type LoginFormProps = {
|
||||
onLogin?: (redirectUrl?: string) => void | Promise<void>;
|
||||
idps?: LoginFormIDP[];
|
||||
orgId?: string;
|
||||
forceLogin?: boolean;
|
||||
};
|
||||
|
||||
export default function LoginForm({
|
||||
redirect,
|
||||
onLogin,
|
||||
idps,
|
||||
orgId
|
||||
orgId,
|
||||
forceLogin
|
||||
}: LoginFormProps) {
|
||||
const router = useRouter();
|
||||
|
||||
@@ -141,7 +143,7 @@ export default function LoginForm({
|
||||
|
||||
try {
|
||||
// Start WebAuthn authentication without email
|
||||
const startResponse = await securityKeyStartProxy({});
|
||||
const startResponse = await securityKeyStartProxy({}, forceLogin);
|
||||
|
||||
if (startResponse.error) {
|
||||
setError(startResponse.message);
|
||||
@@ -165,7 +167,8 @@ export default function LoginForm({
|
||||
// Verify authentication
|
||||
const verifyResponse = await securityKeyVerifyProxy(
|
||||
{ credential },
|
||||
tempSessionId
|
||||
tempSessionId,
|
||||
forceLogin
|
||||
);
|
||||
|
||||
if (verifyResponse.error) {
|
||||
@@ -234,12 +237,15 @@ export default function LoginForm({
|
||||
setShowSecurityKeyPrompt(false);
|
||||
|
||||
try {
|
||||
const response = await loginProxy({
|
||||
const response = await loginProxy(
|
||||
{
|
||||
email,
|
||||
password,
|
||||
code,
|
||||
resourceGuid: resourceGuid as string
|
||||
});
|
||||
},
|
||||
forceLogin
|
||||
);
|
||||
|
||||
try {
|
||||
const identity = {
|
||||
@@ -333,7 +339,8 @@ export default function LoginForm({
|
||||
const data = await generateOidcUrlProxy(
|
||||
idpId,
|
||||
redirect || "/",
|
||||
orgId
|
||||
orgId,
|
||||
forceLogin
|
||||
);
|
||||
const url = data.data?.redirectUrl;
|
||||
if (data.error) {
|
||||
|
||||
@@ -5,15 +5,17 @@ import { AxiosResponse } from "axios";
|
||||
import { pullEnv } from "../pullEnv";
|
||||
|
||||
export async function verifySession({
|
||||
skipCheckVerifyEmail
|
||||
skipCheckVerifyEmail,
|
||||
forceLogin
|
||||
}: {
|
||||
skipCheckVerifyEmail?: boolean;
|
||||
forceLogin?: boolean;
|
||||
} = {}): Promise<GetUserResponse | null> {
|
||||
const env = pullEnv();
|
||||
|
||||
try {
|
||||
const res = await internal.get<AxiosResponse<GetUserResponse>>(
|
||||
"/user",
|
||||
`/user${forceLogin ? "?forceLogin=true" : ""}`,
|
||||
await authCookieHeader()
|
||||
);
|
||||
|
||||
|
||||
@@ -7,7 +7,7 @@ const patterns: PatternConfig[] = [
|
||||
{ name: "Invite Token", regex: /^\/invite\?token=[a-zA-Z0-9-]+$/ },
|
||||
{ name: "Setup", regex: /^\/setup$/ },
|
||||
{ name: "Resource Auth Portal", regex: /^\/auth\/resource\/\d+$/ },
|
||||
{ name: "Device Login", regex: /^\/auth\/login\/device$/ }
|
||||
{ name: "Device Login", regex: /^\/auth\/login\/device(\?code=[a-zA-Z0-9-]+)?$/ }
|
||||
];
|
||||
|
||||
export function cleanRedirect(input: string, fallback?: string): string {
|
||||
|
||||
Reference in New Issue
Block a user