koperasi/services/frontend/app/routes/auth/route.tsx
2025-08-08 14:12:40 +07:00

57 lines
1.7 KiB
TypeScript

import type { LoaderFunctionArgs } from "@remix-run/node";
import { Outlet, redirect, useLocation } from "@remix-run/react";
import {
isAdmin,
isMemberBasic,
isMemberHasOTP,
isMemberNotActive,
isMemberPlatinum,
} from "~/lib/middleware";
import RegisterCarousel from "./components/RegisterCarousel";
export async function loader({ request }: LoaderFunctionArgs) {
const isUserAdmin = await isAdmin(request);
const isPlatinum = await isMemberPlatinum(request);
const isMember = await isMemberBasic(request);
const isNotActive = await isMemberNotActive(request);
const isMemberOTP = await isMemberHasOTP(request);
if (isUserAdmin) {
return redirect("/dashboard");
}
if (isPlatinum || isMember) {
return redirect("/app");
}
if (isNotActive) {
return redirect("/member");
}
if (isMemberOTP) {
return redirect("/otp");
}
return null;
}
export default function AuthLayout() {
const location = useLocation();
return (
<main className="max-h-screen min-h-screen w-full lg:grid lg:grid-cols-2">
<div className={`hidden lg:block ${location.pathname === "/auth/regsiter" ? "xl:p-10" : ""}`}>
{location.pathname === "/auth/register" ? (
<div className="relative flex h-full items-center justify-center rounded-md bg-[#F1FFF9]">
<RegisterCarousel />
</div>
) : (
<img
src="/img/auth/hero.png"
alt="hero"
loading="lazy"
className="h-full w-full rounded-r-md object-cover xl:max-h-screen dark:brightness-[0.2] dark:grayscale"
/>
)}
</div>
<div className="flex max-h-screen items-center justify-center overflow-auto py-12">
<Outlet />
</div>
</main>
);
}