import { getContextData } from "waku/middleware/context";
import { useCookies } from "@/lib/server/cookiebridge";
import { Button } from "@/components/ui/button";
import { Card } from "@/components/ui/card";
import Navbar from "@/components/Navbar";

export default async function LogoutPage() {
  const { user } = getContextData() as any;
  const loggedIn = !!user;

  // If the user is logged in, delete the cookie
  if (loggedIn) {
    const { delCookie } = useCookies();
    delCookie("sorlang");
  }

  return (
    <div className="min-h-screen bg-gray-50">
      <Navbar user={null} />
      
      <div className="container mx-auto py-16 px-4">
        <Card className="max-w-md mx-auto p-6 text-center">
          <h1 className="text-2xl font-bold mb-4">
            {loggedIn ? "You've been logged out" : "Already logged out"}
          </h1>
          <p className="text-gray-600 mb-6">
            {loggedIn 
              ? "Your session has been ended successfully. Thank you for using Sorlang."
              : "You were not logged in."}
          </p>
          <div className="flex flex-col space-y-4">
            <Button asChild>
              <a href="/login">Log back in</a>
            </Button>
            <Button variant="outline" asChild>
              <a href="/">Return to home page</a>
            </Button>
          </div>
        </Card>
      </div>
    </div>
  );
}

export const getConfig = async () => {
  return {
    render: "dynamic",
  } as const;
};