b119a52e08
* Adds a new route for logging in with mfa * New path for security page * Adds “Security” link to account side menu * Update the Switch component to allow label positions left and right * Optionally hide the Close button in the Dialog title bar * Installs `qrcode` react package for generating QR codes. * CopyButton component now takes children * New Security route for setting up MFA * Adds new OTP package for the chadcn InputOTP component * Adds new InputOTP chadcn component * Adds InputOTP chadcn component to the MFA login screen * InputOTP component supports variant styles * Improvements to form handling * Show a confirmation modal before you can disable MFA * Revert redirect back to the dashboard for now * Implement MFA enabling and disabling * Refactor and cleanup mfa management code * More cleanup * Handle errors in the management action * Implement mfa login flow * recovery code input should be password * Implement rate limiting on the mfa validation endpoint * Better error ux * Implement mfa emails and apply James' updates * Use latest @better-auth/utils * Improvements via CodeRabbit review --------- Co-authored-by: James Ritchie <james@trigger.dev>
217 lines
4.9 KiB
TypeScript
217 lines
4.9 KiB
TypeScript
import { json, Session } from "@remix-run/node";
|
|
import { createCookieSessionStorage } from "@remix-run/node";
|
|
import { redirect, typedjson } from "remix-typedjson";
|
|
import { env } from "~/env.server";
|
|
|
|
export type ToastMessage = {
|
|
message: string;
|
|
type: "success" | "error";
|
|
options: Required<ToastMessageOptions>;
|
|
};
|
|
|
|
export type ToastMessageOptions = {
|
|
/** Ephemeral means it disappears after a delay, defaults to true */
|
|
ephemeral?: boolean;
|
|
};
|
|
|
|
const ONE_YEAR = 1000 * 60 * 60 * 24 * 365;
|
|
|
|
export const { commitSession, getSession } = createCookieSessionStorage({
|
|
cookie: {
|
|
name: "__message",
|
|
path: "/",
|
|
httpOnly: true,
|
|
sameSite: "lax",
|
|
secrets: [env.SESSION_SECRET],
|
|
secure: env.NODE_ENV === "production",
|
|
},
|
|
});
|
|
|
|
export function setSuccessMessage(
|
|
session: Session,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
session.flash("toastMessage", {
|
|
message,
|
|
type: "success",
|
|
options: {
|
|
ephemeral: options?.ephemeral ?? true,
|
|
},
|
|
} as ToastMessage);
|
|
}
|
|
|
|
export function setErrorMessage(session: Session, message: string, options?: ToastMessageOptions) {
|
|
session.flash("toastMessage", {
|
|
message,
|
|
type: "error",
|
|
options: {
|
|
ephemeral: options?.ephemeral ?? true,
|
|
},
|
|
} as ToastMessage);
|
|
}
|
|
|
|
export async function setRequestErrorMessage(
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setErrorMessage(session, message, options);
|
|
|
|
return session;
|
|
}
|
|
|
|
export async function setRequestSuccessMessage(
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setSuccessMessage(session, message, options);
|
|
|
|
return session;
|
|
}
|
|
|
|
export async function setToastMessageCookie(session: Session) {
|
|
return {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
};
|
|
}
|
|
|
|
export async function jsonWithSuccessMessage(
|
|
data: any,
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setSuccessMessage(session, message, options);
|
|
|
|
return json(data, {
|
|
headers: {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
},
|
|
});
|
|
}
|
|
|
|
export async function jsonWithErrorMessage(
|
|
data: any,
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setErrorMessage(session, message, options);
|
|
|
|
return json(data, {
|
|
headers: {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
},
|
|
});
|
|
}
|
|
|
|
export async function typedJsonWithSuccessMessage<T>(
|
|
data: T,
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setSuccessMessage(session, message, options);
|
|
|
|
return typedjson(data, {
|
|
headers: {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
},
|
|
});
|
|
}
|
|
|
|
export async function typedJsonWithErrorMessage<T>(
|
|
data: T,
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setErrorMessage(session, message, options);
|
|
|
|
return typedjson(data, {
|
|
headers: {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
},
|
|
});
|
|
}
|
|
|
|
export async function redirectWithSuccessMessage(
|
|
path: string,
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setSuccessMessage(session, message, options);
|
|
|
|
return redirect(path, {
|
|
headers: {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
},
|
|
});
|
|
}
|
|
|
|
export async function redirectWithErrorMessage(
|
|
path: string,
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
|
|
setErrorMessage(session, message, options);
|
|
|
|
return redirect(path, {
|
|
headers: {
|
|
"Set-Cookie": await commitSession(session, {
|
|
expires: new Date(Date.now() + ONE_YEAR),
|
|
}),
|
|
},
|
|
});
|
|
}
|
|
|
|
export async function redirectBackWithErrorMessage(
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const url = new URL(request.url);
|
|
return redirectWithErrorMessage(url.pathname, request, message, options);
|
|
}
|
|
|
|
export async function redirectBackWithSuccessMessage(
|
|
request: Request,
|
|
message: string,
|
|
options?: ToastMessageOptions
|
|
) {
|
|
const url = new URL(request.url);
|
|
return redirectWithSuccessMessage(url.pathname, request, message, options);
|
|
}
|