@arch-cadre/auth 1.0.7 → 1.0.8

package/src/actions/email.ts

@@ -0,0 +1,241 @@
+"use server";
+
+import type {
+  ForgotPasswordInput,
+  ResetPasswordInput,
+  VerifyEmailInput,
+} from "@arch-cadre/core";
+import {
+  forgotPasswordSchema,
+  resetPasswordSchema,
+  verifyEmailSchema,
+} from "@arch-cadre/core";
+import {
+  checkSecurity,
+  createEmailVerificationRequest,
+  createPasswordResetSession,
+  createSession,
+  deleteEmailVerificationRequestCookie,
+  deletePasswordResetSessionTokenCookie,
+  deleteUserEmailVerificationRequest,
+  eventBus,
+  generateSessionToken,
+  getCurrentPasswordResetSession,
+  getCurrentSession,
+  getUserEmailVerificationRequestFromRequest,
+  getUserFromEmail,
+  invalidateUserPasswordResetSessions,
+  invalidateUserSessions,
+  runEmailVerificationValidators,
+  runPasswordResetValidators,
+  sendPasswordResetEmail,
+  sendVerificationEmail,
+  setEmailVerificationRequestCookie,
+  setPasswordResetSessionAsEmailVerified,
+  setPasswordResetSessionTokenCookie,
+  setSessionTokenCookie,
+  updateUserEmailAndSetEmailAsVerified,
+  updateUserPassword,
+  verifyPasswordStrength,
+} from "@arch-cadre/core/server";
+import { redirect } from "next/navigation";
+import type { ActionResult } from "../types.js";
+
+export async function forgotPasswordAction(
+  data: ForgotPasswordInput,
+): Promise<ActionResult> {
+  const { email } = await forgotPasswordSchema.parseAsync(data);
+  const user = await getUserFromEmail(email);
+  if (!user) {
+    return { success: false, message: "Not found user with this email" };
+  }
+
+  await invalidateUserPasswordResetSessions(user.id);
+  const sessionToken = await generateSessionToken();
+  const session = await createPasswordResetSession(
+    sessionToken,
+    user.id,
+    user.email,
+  );
+
+  await sendPasswordResetEmail(session.email, session.code);
+  await setPasswordResetSessionTokenCookie(sessionToken, session.expiresAt);
+
+  await eventBus.publish("auth:password-reset:requested", {
+    userId: user.id,
+    email: user.email,
+  });
+
+  return redirect("/reset-password/verify-email");
+}
+
+export async function verifyPasswordResetEmailAction(
+  data: VerifyEmailInput,
+): Promise<ActionResult> {
+  const { session, user } = await getCurrentPasswordResetSession();
+  if (!session || !user) {
+    return { success: false, message: "Not authenticated" };
+  }
+
+  if (session.emailVerified) {
+    return { success: false, message: "Email already verified" };
+  }
+
+  const { code } = verifyEmailSchema.parse(data);
+
+  if (session.code !== code) {
+    return { success: false, message: "Incorrect code" };
+  }
+
+  await setPasswordResetSessionAsEmailVerified(session.id);
+
+  // Security requirements check (EXTENSIBLE - handles 2FA redirect automatically)
+  const security = await checkSecurity(session as any, user);
+  if (!security.satisfied && security.redirect) {
+    return redirect(security.redirect);
+  }
+
+  return redirect("/reset-password");
+}
+
+export async function verifyEmailAction(
+  data: VerifyEmailInput,
+): Promise<ActionResult> {
+  const { session, user } = await getCurrentSession();
+
+  if (!session || !user) {
+    return { success: false, message: "Not authenticated" };
+  }
+
+  let verificationRequest = await getUserEmailVerificationRequestFromRequest();
+  if (!verificationRequest) {
+    return { success: false, message: "Verification request not found" };
+  }
+
+  const { code } = verifyEmailSchema.parse(data);
+
+  if (Date.now() >= verificationRequest.expiresAt.getTime()) {
+    verificationRequest = await createEmailVerificationRequest(
+      user.id,
+      verificationRequest.email,
+    );
+    await sendVerificationEmail(
+      verificationRequest.email,
+      verificationRequest.code,
+    );
+    await setEmailVerificationRequestCookie(verificationRequest);
+    return {
+      success: false,
+      message:
+        "The verification code was expired. We sent another code to your inbox.",
+    };
+  }
+
+  if (verificationRequest.code !== code)
+    return { success: false, message: "Incorrect code" };
+
+  // Modular Interception Point
+  const interception = await runEmailVerificationValidators(user.id);
+  if (interception) {
+    if (interception.status === "CHALLENGE_REQUIRED") {
+      return redirect(interception.redirect || "/signin");
+    }
+    if (interception.status === "ERROR") {
+      return { success: false, message: interception.message };
+    }
+  }
+
+  await deleteUserEmailVerificationRequest(user.id);
+  await invalidateUserPasswordResetSessions(user.id);
+  await updateUserEmailAndSetEmailAsVerified(
+    user.id,
+    verificationRequest.email,
+  );
+  await deleteEmailVerificationRequestCookie();
+
+  await eventBus.publish("auth:email-verified", {
+    userId: user.id,
+    email: verificationRequest.email,
+  });
+
+  return redirect("/");
+}
+
+export async function resendEmailVerificationCodeAction(): Promise<ActionResult> {
+  const { session, user } = await getCurrentSession();
+  if (!session || !user) {
+    return { success: false, message: "Not authenticated" };
+  }
+
+  let verificationRequest = await getUserEmailVerificationRequestFromRequest();
+  if (!verificationRequest) {
+    if (user.emailVerifiedAt) {
+      return { success: false, message: "Email already verified" };
+    }
+    verificationRequest = await createEmailVerificationRequest(
+      user.id,
+      user.email,
+    );
+  } else {
+    verificationRequest = await createEmailVerificationRequest(
+      user.id,
+      verificationRequest.email,
+    );
+  }
+
+  await sendVerificationEmail(
+    verificationRequest.email,
+    verificationRequest.code,
+  );
+  await setEmailVerificationRequestCookie(verificationRequest);
+
+  await eventBus.publish("auth:verification-requested", {
+    userId: user.id,
+    email: verificationRequest.email,
+  });
+
+  return { success: true, message: "A new code was sent to your inbox." };
+}
+
+export async function resetPasswordAction(
+  data: ResetPasswordInput,
+): Promise<ActionResult> {
+  const { session: passwordResetSession, user } =
+    await getCurrentPasswordResetSession();
+  if (!passwordResetSession || !user) {
+    return { success: false, message: "Not authenticated" };
+  }
+  if (!passwordResetSession.emailVerified) {
+    return { success: false, message: "Forbidden" };
+  }
+
+  const { password } = resetPasswordSchema.parse(data);
+
+  if (!(await verifyPasswordStrength(password))) {
+    return { success: false, message: "Weak password" };
+  }
+
+  // Modular Interception Point
+  const interception = await runPasswordResetValidators(user.id);
+  if (interception) {
+    if (interception.status === "CHALLENGE_REQUIRED") {
+      return redirect(interception.redirect || "/signin");
+    }
+    if (interception.status === "ERROR") {
+      return { success: false, message: interception.message };
+    }
+  }
+
+  await invalidateUserPasswordResetSessions(user.id);
+  await invalidateUserSessions(user.id);
+  await updateUserPassword(user.id, password);
+
+  const sessionToken = await generateSessionToken();
+  const session = await createSession(sessionToken, user.id, {});
+  await setSessionTokenCookie(sessionToken, session.expiresAt);
+  await deletePasswordResetSessionTokenCookie();
+
+  await eventBus.publish("auth:password-reset:completed", { userId: user.id });
+
+  return redirect("/");
+}

package/src/actions/index.ts

@@ -0,0 +1,2 @@
+export * from "./basic.js";
+export * from "./email.js";

package/src/index.ts

@@ -0,0 +1,13 @@
+import type { IModule } from "@arch-cadre/modules";
+import manifest from "../manifest.json";
+import { publicRoutes } from "./routes.js";
+
+const authModule: IModule = {
+  manifest,
+
+  routes: {
+    public: publicRoutes,
+  },
+};
+
+export default authModule;

package/src/intl.d.ts

@@ -0,0 +1,13 @@
+import type messages from "../locales/en/global.json";
+
+type JsonDataType = typeof messages;
+
+// declare global {
+//   interface IntlMessages extends JsonDataType {}
+// }
+
+declare module "@arch-cadre/intl" {
+  export interface IntlMessages extends JsonDataType {}
+}
+
+export {};

package/src/routes.ts

@@ -0,0 +1,55 @@
+import type { PublicRouteDefinition } from "@arch-cadre/modules";
+import dynamic from "next/dynamic";
+import React from "react";
+
+// Layout
+const AuthLayout = dynamic(() => import("./ui/layout.js"));
+
+// Pages
+const SignInPage = dynamic(() => import("./ui/signin/page.js"));
+const SignUpPage = dynamic(() => import("./ui/signup/page.js"));
+const ForgotPasswordPage = dynamic(() => import("./ui/forgot-password/page.js"));
+const ResetPasswordPage = dynamic(() => import("./ui/reset-password/page.js"));
+const VerifyEmailPage = dynamic(() => import("./ui/verify-email/page.js"));
+const ResetPasswordVerifyEmailPage = dynamic(
+  () => import("./ui/reset-password/verify-email/page.js"),
+);
+
+export const publicRoutes: PublicRouteDefinition[] = [
+  {
+    path: "/signin",
+    component: SignInPage,
+    layout: AuthLayout,
+    auth: false,
+  },
+  {
+    path: "/signup",
+    component: SignUpPage,
+    layout: AuthLayout,
+    auth: false,
+  },
+  {
+    path: "/forgot-password",
+    component: ForgotPasswordPage,
+    layout: AuthLayout,
+    auth: false,
+  },
+  {
+    path: "/reset-password",
+    component: ResetPasswordPage,
+    layout: AuthLayout,
+    auth: false,
+  },
+  {
+    path: "/verify-email",
+    component: VerifyEmailPage,
+    layout: AuthLayout,
+    auth: false,
+  },
+  {
+    path: "/reset-password/verify-email",
+    component: ResetPasswordVerifyEmailPage,
+    layout: AuthLayout,
+    auth: false,
+  },
+];

package/src/types.ts

@@ -0,0 +1,12 @@
+/**
+ *Action result.
+ */
+export interface ActionResult<T = any> {
+  success?: boolean;
+  error?: boolean;
+  message?: string;
+  errors?: {
+    [K in keyof T]?: string[];
+  };
+  inputs?: T;
+}

package/src/ui/forgot-password/components.tsx

@@ -0,0 +1,101 @@
+/** biome-ignore-all lint/correctness/noUnusedImports: <all> */
+"use client";
+
+import { useTranslation } from "@arch-cadre/intl";
+import { Button } from "@arch-cadre/ui/components/button";
+import { Field, FieldError, FieldGroup } from "@arch-cadre/ui/components/field";
+import { Input } from "@arch-cadre/ui/components/input";
+import { Label } from "@arch-cadre/ui/components/label";
+import { cn } from "@arch-cadre/ui/lib/utils";
+import { Loader } from "@arch-cadre/ui/shared/loader";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { AlertCircle } from "lucide-react";
+import * as React from "react";
+import { useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { forgotPasswordAction } from "../../actions/index.js";
+import {
+  type ForgotPasswordInput,
+  forgotPasswordSchema,
+} from "../../validation.js";
+
+export function ForgotPasswordForm() {
+  const [generalError, setGeneralError] = useState("");
+  const { t } = useTranslation();
+
+  const form = useForm<ForgotPasswordInput>({
+    resolver: zodResolver(forgotPasswordSchema),
+  });
+
+  async function onSubmit(data: ForgotPasswordInput) {
+    setGeneralError("");
+
+    try {
+      const response = await forgotPasswordAction(data);
+
+      if (response.error) {
+        setGeneralError(response.message || t("error_occurred"));
+        return;
+      }
+
+      toast(response.message);
+    } catch (_error) {
+      setGeneralError(t("error_occurred"));
+    }
+  }
+
+  return (
+    <div className={cn("flex flex-col space-y-6")}>
+      <div className="space-y-2 text-center">
+        <h1 className="text-3xl font-semibold">{t("Forgot Password")}</h1>
+        <p className="text-muted-foreground">
+          {t(
+            "Enter your email address and we'll send you a link to reset your password.",
+          )}
+        </p>
+      </div>
+
+      <div className="grid gap-5">
+        {generalError && (
+          <div className="flex gap-2 p-3 bg-red-50 border border-red-200 rounded-lg">
+            <AlertCircle className="w-4 h-4 text-red-600 flex-shrink-0 mt-0.5" />
+            <p className="text-sm text-red-600">{generalError}</p>
+          </div>
+        )}
+
+        <form
+          onSubmit={form.handleSubmit(onSubmit)}
+          className="flex flex-col gap-4"
+        >
+          <FieldGroup className="w-full mx-auto">
+            <Controller
+              name="email"
+              control={form.control}
+              render={({ field, fieldState }) => (
+                <Field className="w-full" data-invalid={fieldState.invalid}>
+                  <Label htmlFor="email">{t("Email address")}</Label>
+                  <Input
+                    {...field}
+                    placeholder="m@example.com"
+                    autoFocus={true}
+                  />
+                  {fieldState.invalid && (
+                    <FieldError errors={[fieldState.error]} />
+                  )}
+                </Field>
+              )}
+            />
+          </FieldGroup>
+
+          <Button disabled={form.formState.isSubmitting} className="w-full">
+            {form.formState.isSubmitting
+              ? t("Please wait...")
+              : t("Send reset link")}
+            {form.formState.isSubmitting && <Loader variant="dark" />}
+          </Button>
+        </form>
+      </div>
+    </div>
+  );
+}

package/src/ui/forgot-password/page.tsx

@@ -0,0 +1,6 @@
+import * as React from "react";
+import { ForgotPasswordForm } from "./components.js";
+
+export default async function Page() {
+  return <ForgotPasswordForm />;
+}

package/src/ui/layout.tsx

@@ -0,0 +1,42 @@
+// import type { Metadata } from "next";import * as React from "react"
+
+import { Logo } from "@arch-cadre/ui/brand/logo";
+
+import Image from "next/image";
+import Link from "next/link";
+import * as React from "react";
+
+// export const metadata: Metadata = {
+//   title: "Auth App",
+//   description: "Generated by create next app",
+// };
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <div className="grid min-h-svh grid-cols-1 lg:grid-cols-2">
+      <div className="flex flex-col gap-4 p-6 md:p-10">
+        <div className="flex justify-center gap-2">
+          <Link href="/" className="flex items-center gap-2 font-medium">
+            <Logo />
+          </Link>
+        </div>
+        <div className="flex flex-1 items-center justify-center">
+          <div className="w-full max-w-xs">{children}</div>
+        </div>
+      </div>
+      <div className="bg-muted relative hidden lg:block">
+        <Image
+          width={100}
+          height={100}
+          src="/placeholder.svg"
+          alt="Image"
+          className="absolute inset-0 h-full w-full object-cover dark:brightness-[0.2] dark:grayscale"
+        />
+      </div>
+    </div>
+  );
+}

package/src/ui/reset-password/components.tsx

@@ -0,0 +1,128 @@
+/** biome-ignore-all lint/correctness/noUnusedImports: <all> */
+"use client";
+
+import { useTranslation } from "@arch-cadre/intl";
+import { Button } from "@arch-cadre/ui/components/button";
+import {
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@arch-cadre/ui/components/card";
+import { Checkbox } from "@arch-cadre/ui/components/checkbox";
+import {
+  Field,
+  FieldError,
+  FieldGroup,
+  FieldLabel,
+} from "@arch-cadre/ui/components/field";
+import { Input } from "@arch-cadre/ui/components/input";
+import { Label } from "@arch-cadre/ui/components/label";
+import { Separator } from "@arch-cadre/ui/components/separator";
+import { cn } from "@arch-cadre/ui/lib/utils";
+import { Loader } from "@arch-cadre/ui/shared/loader";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { AlertCircle } from "lucide-react";
+import * as React from "react";
+import { useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { toast } from "sonner";
+import { resetPasswordAction } from "../../actions/index.js";
+import { type ResetPasswordInput, resetPasswordSchema } from "../../validation.js";
+
+export function ResetPasswordForm() {
+  const [generalError, setGeneralError] = useState("");
+  const { t } = useTranslation();
+
+  const form = useForm<ResetPasswordInput>({
+    resolver: zodResolver(resetPasswordSchema),
+  });
+
+  async function onSubmit(data: ResetPasswordInput) {
+    setGeneralError("");
+
+    try {
+      const response = await resetPasswordAction(data);
+
+      if (response.error) {
+        setGeneralError(response.message || t("error_occurred"));
+        return;
+      }
+
+      toast(response.message);
+    } catch (_error) {
+      // setGeneralError(t("error_occurred"));
+    }
+  }
+
+  return (
+    <div className={cn("flex flex-col space-y-3")}>
+      <CardHeader className="text-center">
+        <CardTitle className="text-xl">{t("Reset password")}</CardTitle>
+        <CardDescription>{t("Enter your new password below.")}</CardDescription>
+      </CardHeader>
+
+      <div className="flex flex-col gap-6">
+        {generalError && (
+          <div className="flex gap-2 p-3 bg-red-50 border border-red-200 rounded-lg">
+            <AlertCircle className="w-4 h-4 text-red-600 flex-shrink-0 mt-0.5" />
+            <p className="text-sm text-red-600">{generalError}</p>
+          </div>
+        )}
+
+        <form
+          onSubmit={form.handleSubmit(onSubmit)}
+          className="flex flex-col gap-4"
+        >
+          <FieldGroup className="w-full mx-auto">
+            <Controller
+              name="password"
+              control={form.control}
+              render={({ field, fieldState }) => (
+                <Field className="w-full" data-invalid={fieldState.invalid}>
+                  <Label htmlFor="password">{t("New Password")}</Label>
+                  <Input
+                    {...field}
+                    id="password"
+                    type="password"
+                    placeholder="********"
+                    autoFocus={true}
+                  />
+
+                  {fieldState.invalid && (
+                    <FieldError errors={[fieldState.error]} />
+                  )}
+                </Field>
+              )}
+            />
+            <Controller
+              name="confirm"
+              control={form.control}
+              render={({ field, fieldState }) => (
+                <Field className="w-full" data-invalid={fieldState.invalid}>
+                  <Label htmlFor="confirm">{t("Confirm Password")}</Label>
+                  <Input
+                    {...field}
+                    id="confirm"
+                    type="password"
+                    placeholder="********"
+                  />
+
+                  {fieldState.invalid && (
+                    <FieldError errors={[fieldState.error]} />
+                  )}
+                </Field>
+              )}
+            />
+          </FieldGroup>
+
+          <Button disabled={form.formState.isSubmitting} className="w-full">
+            {form.formState.isSubmitting
+              ? t("Please wait...")
+              : t("Reset password")}
+            {form.formState.isSubmitting && <Loader variant="dark" />}{" "}
+          </Button>
+        </form>
+      </div>
+    </div>
+  );
+}

package/src/ui/reset-password/page.tsx

@@ -0,0 +1,25 @@
+import {
+  checkSecurity,
+  getCurrentPasswordResetSession,
+} from "@arch-cadre/core/server";
+import { redirect } from "next/navigation";
+import * as React from "react";
+import { ResetPasswordForm } from "./components.js";
+
+export default async function Page() {
+  const { session, user } = await getCurrentPasswordResetSession();
+  if (session === null || user === null) {
+    return redirect("/forgot-password");
+  }
+  if (!session.emailVerified) {
+    return redirect("/reset-password/verify-email");
+  }
+
+  // Security requirements check (for 2FA during reset)
+  const security = await checkSecurity(session as any, user);
+  if (!security.satisfied && security.redirect) {
+    return redirect(security.redirect);
+  }
+
+  return <ResetPasswordForm />;
+}