import { UserProfile } from "@clerk/react-router";
import { getAuth } from "@clerk/react-router/server";
import { redirect } from "react-router";
import type { Route } from "./+types/user-profile";

export async function loader(args: Route.LoaderArgs) {
  const { userId } = await getAuth(args);
  
  if (!userId) {
    return redirect("/");
  }
  
  return {};
}

export default function UserProfilePage() {
  return (
    <div className="container mx-auto py-8 px-4 flex justify-center">
      <UserProfile />
    </div>
  );
}
