import {Avatar, AvatarFallback, AvatarImage} from "@/components/ui/avatar"
import {Button} from "@/components/ui/button";
import {
    DropdownMenu,
    DropdownMenuContent,
    DropdownMenuGroup,
    DropdownMenuItem,
    DropdownMenuLabel,
    DropdownMenuSeparator,
    DropdownMenuShortcut,
    DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import Link from "next/link";
import {ADMIN_DASHBOARD_URL, CLIENTS_DASHBOARD_URL, PATIENT_DASHBOARD_URL} from "@/lib/constants";
import {signOut} from "@/lib/backend/authentication";
import {UserType} from "@/lib/backend/appwrite_types";
import {useAuth} from "@/lib/hooks/useAuth";

export default async function UserNavBar() {
    const {user, userProfile} = await useAuth();
    const isLoggedIn = user !== null;

    return (
        <div className={"ml-4"}>
            {
                isLoggedIn ? (
                        <DropdownMenu>
                            <DropdownMenuTrigger asChild>
                                <Avatar className={"cursor-pointer"}>
                                    <AvatarImage src="https://githuba.com/shadcn.png"/>
                                    <AvatarFallback>
                                        {userProfile?.fullName?.substring(0, 2)?.toUpperCase() || "U"}
                                    </AvatarFallback>
                                </Avatar>
                            </DropdownMenuTrigger>

                            <DropdownMenuContent className="w-56">
                                <DropdownMenuLabel className={"text-green-900"}>My Account</DropdownMenuLabel>
                                <DropdownMenuSeparator/>
                                <DropdownMenuGroup>
                                    {
                                        userProfile?.userType === UserType.PATIENT &&
                                        <Link href={PATIENT_DASHBOARD_URL}>
                                            <DropdownMenuItem className={"cursor-pointer"}>
                                                Patient Dashboard
                                            </DropdownMenuItem>
                                        </Link>
                                    }

                                    {
                                        userProfile?.userType === UserType.CLIENT &&
                                        <Link href={CLIENTS_DASHBOARD_URL}>
                                            <DropdownMenuItem className={"cursor-pointer"}>
                                                Client Dashboard
                                            </DropdownMenuItem>
                                        </Link>
                                    }

                                    {
                                        userProfile?.userType === UserType.ADMIN &&
                                        <Link href={ADMIN_DASHBOARD_URL}>
                                            <DropdownMenuItem className={"cursor-pointer"}>
                                                Admin Dashboard
                                            </DropdownMenuItem>
                                        </Link>
                                    }
                                    <DropdownMenuItem>
                                        Settings
                                    </DropdownMenuItem>
                                </DropdownMenuGroup>
                                <DropdownMenuSeparator/>
                                <DropdownMenuItem>
                                    <form action={signOut}>
                                        <button type={"submit"}>
                                            Log out
                                        </button>
                                    </form>
                                    <DropdownMenuShortcut>⇧⌘Q</DropdownMenuShortcut>
                                </DropdownMenuItem>
                            </DropdownMenuContent>
                        </DropdownMenu>
                    )
                    : (
                        <Link href={"/login"}>
                            <Button variant={"default"} size={"sm"} className={"py-1"}>
                                Login
                            </Button>
                        </Link>
                    )
            }
        </div>
    )
}