plane/space/components/account/user-logged-in.tsx
guru_sainath bab52a2672
[WEB-1319] chore: New authentication workflow (#4481)
* chore: New authentication workflow

* chore: resolved build erros and updated imports in auth

* chore: code optimisation for query param util

* chore: added client for auth forms
2024-05-16 17:17:04 +05:30

52 lines
1.9 KiB
TypeScript

"use client";
import Image from "next/image";
// hooks
import { useUser } from "@/hooks/store";
// assets
import PlaneLogo from "@/public/plane-logos/black-horizontal-with-blue-logo.svg";
import UserLoggedInImage from "@/public/user-logged-in.svg";
export const UserLoggedIn = () => {
const { data: user } = useUser();
if (!user) return null;
return (
<div className="flex h-screen w-screen flex-col">
<div className="relative flex w-full items-center justify-between gap-4 border-b border-custom-border-200 px-6 py-5">
<div>
<Image src={PlaneLogo} alt="User already logged in" />
</div>
<div className="flex items-center gap-2 rounded border border-custom-border-200 p-2">
{user.avatar && user.avatar !== "" ? (
<div className="h-5 w-5 rounded-full">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={user.avatar} alt={user.display_name ?? ""} className="rounded-full" />
</div>
) : (
<div className="grid h-5 w-5 place-items-center rounded-full bg-custom-background-80 text-[10px] capitalize">
{(user.display_name ?? "U")[0]}
</div>
)}
<h6 className="text-xs font-medium">{user.display_name}</h6>
</div>
</div>
<div className="grid h-full w-full place-items-center p-6">
<div className="text-center">
<div className="mx-auto grid h-52 w-52 place-items-center rounded-full bg-custom-background-80">
<div className="h-32 w-32">
<Image src={UserLoggedInImage} alt="User already logged in" />
</div>
</div>
<h1 className="mt-12 text-3xl font-semibold">Logged in Successfully!</h1>
<p className="mt-4">
You{"'"}ve successfully logged in. Please enter the appropriate project URL to view the issue board.
</p>
</div>
</div>
</div>
);
};