stackkit 0.3.4 → 0.3.6

package/modules/auth/better-auth/files/nextjs/pages/forgot-password/page.tsx

@@ -0,0 +1,5 @@
+import ForgotPasswordForm from "@/features/auth/components/forgot-password-form";
+
+export default function ForgotPassword() {
+  return <ForgotPasswordForm />;
+}

package/modules/auth/better-auth/files/nextjs/pages/layout.tsx

@@ -0,0 +1,11 @@
+export default function AuthLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <main className="flex min-h-screen w-full items-center justify-center">
+      {children}
+    </main>
+  );
+}

package/modules/auth/better-auth/files/nextjs/pages/login/page.tsx

@@ -0,0 +1,9 @@
+import LoginForm from "@/features/auth/components/login-form";
+
+export default function Login({
+  searchParams,
+}: {
+  searchParams?: { redirect?: string };
+}) {
+  return <LoginForm searchParams={searchParams} />;
+}

package/modules/auth/better-auth/files/nextjs/pages/register/page.tsx

@@ -0,0 +1,5 @@
+import RegisterForm from "@/features/auth/components/register-form";
+
+export default function Register() {
+  return <RegisterForm />;
+}

package/modules/auth/better-auth/files/nextjs/pages/reset-password/page.tsx

@@ -0,0 +1,10 @@
+import ResetPasswordForm from "@/features/auth/components/reset-password-form";
+import { Suspense } from "react";
+
+export default function ResetPassword() {
+  return (
+    <Suspense>
+      <ResetPasswordForm />
+    </Suspense>
+  );
+}

package/modules/auth/better-auth/files/nextjs/pages/verify-email/page.tsx

@@ -0,0 +1,10 @@
+import VerifyEmailForm from "@/features/auth/components/verify-email-form";
+import { Suspense } from "react";
+
+export default function VerifyEmail() {
+  return (
+    <Suspense>
+      <VerifyEmailForm />
+    </Suspense>
+  );
+}

package/modules/auth/better-auth/files/nextjs/proxy.ts

@@ -1,34 +1,169 @@
-import { NextResponse, type NextRequest } from "next/server";
+import {
+  getNewTokensWithRefreshToken,
+  getSession,
+} from "@/features/auth/services/auth.service";
+import { envVars } from "@/lib/env";
+import {
+  getDefaultDashboardRoute,
+  getRouteOwner,
+  isAuthRoute,
+  UserRole,
+} from "@/lib/utils/auth";
+import { jwtUtils } from "@/lib/utils/jwt";
+import { isTokenExpiringSoon } from "@/lib/utils/token";
+import { NextRequest, NextResponse } from "next/server";
 
-function isAuthenticated(req: NextRequest) {
-  const token = req.cookies.get("better-auth.session_token")?.value;
-
-  return Boolean(token);
+async function refreshTokenMiddleware(refreshToken: string): Promise<boolean> {
+  try {
+    const refresh = await getNewTokensWithRefreshToken(refreshToken);
+    if (!refresh) {
+      return false;
+    }
+    return true;
+  } catch (error) {
+    console.error("Error refreshing token in middleware:", error);
+    return false;
+  }
 }
 
-export function proxy(req: NextRequest) {
-  const { pathname, search } = req.nextUrl;
-  const authed = isAuthenticated(req);
+export async function proxy(request: NextRequest) {
+  try {
+    const { pathname } = request.nextUrl;
+    const accessToken = request.cookies.get("accessToken")?.value;
+    const refreshToken = request.cookies.get("refreshToken")?.value;
 
-  if (pathname === "/login" || pathname === "/signup") {
-    if (authed) return NextResponse.redirect(new URL("/dashboard", req.url));
-    return NextResponse.next();
-  }
+    const decodedAccessToken =
+      accessToken &&
+      jwtUtils.verifyToken(accessToken, envVars.JWT_ACCESS_SECRET as string)
+        .data;
 
-  if (pathname.startsWith("/dashboard") && !authed) {
-    const next = encodeURIComponent(pathname + (search || ""));
-    return NextResponse.redirect(new URL(`/login?next=${next}`, req.url));
-  }
+    const isValidAccessToken =
+      accessToken &&
+      jwtUtils.verifyToken(accessToken, envVars.JWT_ACCESS_SECRET as string)
+        .success;
+
+    let userRole: UserRole | null = null;
+
+    if (decodedAccessToken) {
+      userRole = (decodedAccessToken.role as UserRole) || null;
+    }
+
+    const normalizedUserRole = userRole === "ADMIN" ? "ADMIN" : "USER";
+    const routerOwner = getRouteOwner(pathname);
+    const isAuth = isAuthRoute(pathname);
+
+    if (
+      isValidAccessToken &&
+      refreshToken &&
+      (await isTokenExpiringSoon(accessToken))
+    ) {
+      const requestHeaders = new Headers(request.headers);
+
+      const response = NextResponse.next({
+        request: {
+          headers: requestHeaders,
+        },
+      });
+
+      try {
+        const refreshed = await refreshTokenMiddleware(refreshToken);
+
+        if (refreshed) {
+          requestHeaders.set("x-token-refreshed", "1");
+        }
+
+        return NextResponse.next({
+          request: {
+            headers: requestHeaders,
+          },
+          headers: response.headers,
+        });
+      } catch (error) {
+        console.error("Error refreshing token:", error);
+      }
+
+      return response;
+    }
 
-  return NextResponse.next();
+    if (isAuth && isValidAccessToken) {
+      return NextResponse.redirect(
+        new URL(getDefaultDashboardRoute(userRole as UserRole), request.url),
+      );
+    }
+
+    if (pathname === "/reset-password") {
+      const email = request.nextUrl.searchParams.get("email");
+
+      if (accessToken && email) {
+        const userInfo = await getSession();
+
+        if (userInfo.needPasswordChange) {
+          return NextResponse.next();
+        } else {
+          return NextResponse.redirect(
+            new URL(
+              getDefaultDashboardRoute(userRole as UserRole),
+              request.url,
+            ),
+          );
+        }
+      }
+
+      if (email) {
+        return NextResponse.next();
+      }
+
+      const loginUrl = new URL("/login", request.url);
+      loginUrl.searchParams.set("redirect", pathname);
+      return NextResponse.redirect(loginUrl);
+    }
+
+    if (routerOwner === null || routerOwner === "COMMON") {
+      return NextResponse.next();
+    }
+
+    if (!accessToken || !isValidAccessToken) {
+      const loginUrl = new URL("/login", request.url);
+      loginUrl.searchParams.set("redirect", pathname);
+      return NextResponse.redirect(loginUrl);
+    }
+
+    if (accessToken) {
+      const userInfo = await getSession();
+      if (userInfo) {
+        if (userInfo.emailVerified === false && pathname !== "/verify-email") {
+          const verifyEmailUrl = new URL("/verify-email", request.url);
+          verifyEmailUrl.searchParams.set("email", userInfo.email);
+          return NextResponse.redirect(verifyEmailUrl);
+        }
+
+        if (userInfo.needPasswordChange && pathname !== "/reset-password") {
+          const resetPasswordUrl = new URL("/reset-password", request.url);
+          resetPasswordUrl.searchParams.set("email", userInfo.email);
+          return NextResponse.redirect(resetPasswordUrl);
+        }
+      }
+    }
+
+    const routeOwnerNormalized = routerOwner === "ADMIN" ? "ADMIN" : "USER";
+
+    if (routeOwnerNormalized === "ADMIN" && normalizedUserRole !== "ADMIN") {
+      return NextResponse.redirect(
+        new URL(
+          getDefaultDashboardRoute(normalizedUserRole as UserRole),
+          request.url,
+        ),
+      );
+    }
+
+    return NextResponse.next();
+  } catch (error) {
+    console.error("Error in proxy middleware:", error);
+  }
 }
 
 export const config = {
   matcher: [
-    "/((?!_next|[^?]*\\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).*)",
-    "/(api|trpc)(.*)",
-    "/login",
-    "/signup",
-    "/dashboard/:path*",
+    "/((?!api|_next/static|_next/image|favicon.ico|sitemap.xml|robots.txt|.well-known).*)",
   ],
 };

package/modules/auth/better-auth/files/nextjs/theme/providers/theme-provider.tsx

@@ -0,0 +1,11 @@
+"use client"
+
+import { ThemeProvider as NextThemesProvider } from "next-themes"
+import * as React from "react"
+
+export function ThemeProvider({
+  children,
+  ...props
+}: React.ComponentProps<typeof NextThemesProvider>) {
+  return <NextThemesProvider {...props}>{children}</NextThemesProvider>
+}

package/modules/auth/better-auth/files/nextjs/types/api.types.ts

@@ -0,0 +1,18 @@
+export interface ApiResponse<TData = unknown> {
+  success: true;
+  message: string;
+  data: TData;
+  meta?: PaginationMeta;
+}
+
+export interface PaginationMeta {
+  page: number;
+  limit: number;
+  total: number;
+  totalPages: number;
+}
+
+export interface ApiErrorResponse {
+  success: false;
+  message: string;
+}

package/modules/auth/better-auth/files/react/components/protected-route.tsx

@@ -0,0 +1,39 @@
+import { useMeQuery } from "@/features/auth/queries/auth.querie";
+import { Navigate, Outlet, useLocation } from "react-router";
+
+interface ProtectedRouteProps {
+  requiredRole?: string;
+  redirectTo?: string;
+  redirectRoleTo?: { role: string; to: string };
+}
+
+export default function ProtectedRoute({
+  requiredRole,
+  redirectTo = "/dashboard",
+  redirectRoleTo,
+}: ProtectedRouteProps) {
+  const { data: user, isLoading } = useMeQuery();
+  const location = useLocation();
+
+  if (isLoading) {
+    return (
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="size-8 animate-spin rounded-full border-4 border-primary border-t-transparent" />
+      </div>
+    );
+  }
+
+  if (!user) {
+    return <Navigate to={`/login?redirect=${encodeURIComponent(location.pathname)}`} replace />;
+  }
+
+  if (redirectRoleTo && user.role === redirectRoleTo.role) {
+    return <Navigate to={redirectRoleTo.to} replace />;
+  }
+
+  if (requiredRole && user.role !== requiredRole) {
+    return <Navigate to={redirectTo} replace />;
+  }
+
+  return <Outlet />;
+}

package/modules/auth/better-auth/files/react/components/route-guards.tsx

@@ -0,0 +1,13 @@
+import ProtectedRoute from "./protected-route";
+
+export function AuthenticatedRoute() {
+  return <ProtectedRoute />;
+}
+
+export function UserRoute() {
+  return <ProtectedRoute redirectRoleTo={{ role: "ADMIN", to: "/dashboard/admin" }} />;
+}
+
+export function AdminRoute() {
+  return <ProtectedRoute requiredRole="ADMIN" redirectTo="/dashboard" />;
+}

package/modules/auth/better-auth/files/react/dashboard/admin/pages/overview.tsx

@@ -0,0 +1,3 @@
+export default function Overview() {
+  return <div>This is the admin overview page.</div>;
+}

package/modules/auth/better-auth/files/react/dashboard/pages/overview.tsx

@@ -0,0 +1,3 @@
+export default function Overview() {
+  return <div>This is the user overview page.</div>;
+}

package/modules/auth/better-auth/files/react/features/pages/forgot-password.tsx

@@ -0,0 +1,5 @@
+import ForgotPasswordForm from "../components/forgot-password-form";
+
+export default function ForgotPasswordPage() {
+  return <ForgotPasswordForm />;
+}

package/modules/auth/better-auth/files/react/features/pages/login.tsx

@@ -0,0 +1,5 @@
+import LoginForm from "../components/login-form";
+
+export default function LoginPage() {
+  return <LoginForm />;
+}

package/modules/auth/better-auth/files/react/features/pages/my-profile.tsx

@@ -0,0 +1,5 @@
+import MyProfile from "../components/my-profile";
+
+export default function MyProfilePage() {
+  return <MyProfile />;
+}

package/modules/auth/better-auth/files/react/features/pages/oauth-callback.tsx

@@ -0,0 +1,59 @@
+import { AUTH_QUERY_KEYS } from "@/features/auth/queries/auth.querie";
+import { useQueryClient } from "@tanstack/react-query";
+import { useEffect } from "react";
+import { useNavigate, useSearchParams } from "react-router";
+
+interface JwtPayload {
+  role?: string;
+  exp?: number;
+}
+
+function decodeJwt(token: string): JwtPayload | null {
+  try {
+    return JSON.parse(atob(token.split(".")[1])) as JwtPayload;
+  } catch {
+    return null;
+  }
+}
+
+function setCookie(name: string, value: string, exp?: number) {
+  const expires = exp ? new Date(exp * 1000).toUTCString() : "";
+  document.cookie = `${name}=${value}; path=/; SameSite=Lax${expires ? `; expires=${expires}` : ""}`;
+}
+
+export default function OAuthCallbackPage() {
+  const navigate = useNavigate();
+  const queryClient = useQueryClient();
+  const [searchParams] = useSearchParams();
+
+  useEffect(() => {
+    const accessToken = searchParams.get("accessToken");
+    const refreshToken = searchParams.get("refreshToken");
+    const redirectPath = searchParams.get("redirect");
+
+    if (accessToken) {
+      const payload = decodeJwt(accessToken);
+      setCookie("accessToken", accessToken, payload?.exp);
+
+      if (refreshToken) {
+        const refreshPayload = decodeJwt(refreshToken);
+        setCookie("refreshToken", refreshToken, refreshPayload?.exp);
+      }
+
+      const defaultRoute = payload?.role === "ADMIN" ? "/dashboard/admin" : "/dashboard";
+      const destination = redirectPath || defaultRoute;
+
+      queryClient.invalidateQueries({ queryKey: AUTH_QUERY_KEYS.me }).then(() => {
+        navigate(destination, { replace: true });
+      });
+    } else {
+      navigate("/login", { replace: true });
+    }
+  }, [navigate, queryClient, searchParams]);
+
+  return (
+    <div className="min-h-screen flex items-center justify-center">
+      <div className="size-8 animate-spin rounded-full border-4 border-primary border-t-transparent" />
+    </div>
+  );
+}

package/modules/auth/better-auth/files/react/features/pages/register.tsx

@@ -0,0 +1,5 @@
+import RegisterForm from "../components/register-form";
+
+export default function RegisterPage() {
+  return <RegisterForm />;
+}

package/modules/auth/better-auth/files/react/features/pages/reset-password.tsx

@@ -0,0 +1,10 @@
+import { Suspense } from "react";
+import ResetPasswordForm from "../components/reset-password-form";
+
+export default function ResetPasswordPage() {
+  return (
+    <Suspense>
+      <ResetPasswordForm />
+    </Suspense>
+  );
+}

package/modules/auth/better-auth/files/react/features/pages/verify-email.tsx

@@ -0,0 +1,10 @@
+import { Suspense } from "react";
+import VerifyEmailForm from "../components/verify-email-form";
+
+export default function VerifyEmailPage() {
+  return (
+    <Suspense>
+      <VerifyEmailForm />
+    </Suspense>
+  );
+}

package/modules/auth/better-auth/files/react/layout/dashboard-layout.tsx

@@ -0,0 +1,54 @@
+import DashboardHeader from "@/components/dashboard/dashboard-header";
+import DashboardSidebar from "@/components/dashboard/dashboard-sidebar";
+import { SidebarProvider } from "@/components/ui/sidebar";
+import { useMeQuery } from "@/features/auth/queries/auth.querie";
+import { sidebar } from "@/lib/constant/dashboard";
+import { Navigate, Outlet, useLocation } from "react-router";
+
+const AUTH_PATHS = ["/login", "/register", "/forgot-password", "/reset-password", "/verify-email"];
+
+export default function DashboardLayout() {
+  const { data: user, isLoading } = useMeQuery();
+  const { pathname } = useLocation();
+
+  if (isLoading) {
+    return (
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="size-8 animate-spin rounded-full border-4 border-primary border-t-transparent" />
+      </div>
+    );
+  }
+
+  if (user && AUTH_PATHS.includes(pathname)) {
+    const dest = user.role === "ADMIN" ? "/dashboard/admin" : "/dashboard";
+    return <Navigate to={dest} replace />;
+  }
+
+  if (!user) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-background p-4">
+        <Outlet />
+      </div>
+    );
+  }
+
+  const role = user.role in sidebar ? (user.role as keyof typeof sidebar) : "USER";
+
+  return (
+    <SidebarProvider>
+      <div className="flex min-h-screen w-full">
+        <DashboardSidebar menu={sidebar[role]} user={user} />
+
+        <div className="flex flex-col flex-1">
+          <DashboardHeader role={role as "USER" | "ADMIN"} />
+
+          <main className="flex-1">
+            <div className="@container/main min-h-screen w-full px-4 py-4 lg:px-6">
+              <Outlet />
+            </div>
+          </main>
+        </div>
+      </div>
+    </SidebarProvider>
+  );
+}

package/modules/auth/better-auth/files/react/lib/axios/http.ts

@@ -0,0 +1,68 @@
+import { envVars } from "@/lib/env";
+import axios, { type AxiosError, type AxiosResponse, type InternalAxiosRequestConfig } from "axios";
+
+const axiosInstance = axios.create({
+  baseURL: envVars.API_URL,
+  withCredentials: true,
+  timeout: 30000,
+  headers: { "Content-Type": "application/json" },
+});
+
+let isRefreshing = false;
+let refreshQueue: Array<{
+  resolve: (value: unknown) => void;
+  reject: (reason?: unknown) => void;
+}> = [];
+
+function processRefreshQueue(error: unknown) {
+  refreshQueue.forEach(({ resolve, reject }) => {
+    if (error) reject(error);
+    else resolve(null);
+  });
+  refreshQueue = [];
+}
+
+axiosInstance.interceptors.response.use(
+  (response: AxiosResponse) => response,
+  async (error: AxiosError) => {
+    const originalRequest = error.config as InternalAxiosRequestConfig & {
+      _retry?: boolean;
+    };
+
+    if (error.response?.status === 401 && !originalRequest._retry &&
+        !originalRequest.url?.includes("/v1/auth/refresh-token")) {
+      if (isRefreshing) {
+        return new Promise((resolve, reject) => {
+          refreshQueue.push({ resolve, reject });
+        }).then(() => axiosInstance(originalRequest));
+      }
+
+      originalRequest._retry = true;
+      isRefreshing = true;
+
+      try {
+        await axiosInstance.post("/v1/auth/refresh-token", {});
+        processRefreshQueue(null);
+        return axiosInstance(originalRequest);
+      } catch (refreshError) {
+        processRefreshQueue(refreshError);
+        if (typeof window !== "undefined" && !window.location.pathname.startsWith("/login")) {
+          window.location.href = "/login";
+        }
+        return Promise.reject(refreshError);
+      } finally {
+        isRefreshing = false;
+      }
+    }
+
+    const data = error.response?.data as {
+      message?: string;
+      error?: string;
+    } | null;
+    const message = data?.message ?? data?.error ?? error.message ?? "An error occurred";
+    return Promise.reject(new Error(message));
+  },
+);
+
+export { axiosInstance as api };
+export default axiosInstance;

package/modules/auth/better-auth/files/react/lib/env.ts

@@ -0,0 +1,25 @@
+interface EnvVars {
+  APP_NAME: string;
+  APP_URL: string;
+  API_URL: string;
+  BETTER_AUTH_URL: string;
+}
+
+const loadEnvVars = (): EnvVars => {
+  const requiredVars: (keyof EnvVars)[] = ["APP_NAME", "APP_URL", "API_URL", "BETTER_AUTH_URL"];
+
+  for (const varName of requiredVars) {
+    if (!import.meta.env[`VITE_${varName}`]) {
+      console.warn(`Environment variable VITE_${varName} is not set. Using default value.`);
+    }
+  }
+
+  return {
+    APP_NAME: import.meta.env.VITE_APP_NAME || "StackKit",
+    APP_URL: import.meta.env.VITE_APP_URL || "http://localhost:3000",
+    API_URL: import.meta.env.VITE_API_URL || "http://localhost:5000/api",
+    BETTER_AUTH_URL: import.meta.env.VITE_BETTER_AUTH_URL || "http://localhost:5000",
+  };
+};
+
+export const envVars = loadEnvVars();