forked from github/plane
52 lines
2.0 KiB
TypeScript
52 lines
2.0 KiB
TypeScript
|
import Image from "next/image";
|
||
|
|
|
||
|
|
// mobx
|
||
|
|
import { useMobxStore } from "lib/mobx/store-provider";
|
||
|
|
// assets
|
||
|
|
import UserLoggedInImage from "public/user-logged-in.svg";
|
||
|
|
import PlaneLogo from "public/plane-logos/black-horizontal-with-blue-logo.svg";
|
||
|
|
|
||
|
|
export const UserLoggedIn = () => {
|
||
|
|
const { user: userStore } = useMobxStore();
|
||
|
|
const user = userStore.currentUser;
|
||
|
|
|
||
|
|
if (!user) return null;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="h-screen w-screen flex flex-col">
|
||
|
|
<div className="px-6 py-5 relative w-full flex items-center justify-between gap-4 border-b border-custom-border-200">
|
||
|
|
<div>
|
||
|
|
<Image src={PlaneLogo} alt="User already logged in" />
|
||
|
|
</div>
|
||
|
|
<div className="border border-custom-border-200 rounded flex items-center gap-2 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="bg-custom-background-80 h-5 w-5 rounded-full grid place-items-center text-[10px] capitalize">
|
||
|
|
{(user.display_name ?? "U")[0]}
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
<h6 className="text-xs font-medium">{user.display_name}</h6>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="h-full w-full grid place-items-center p-6">
|
||
|
|
<div className="text-center">
|
||
|
|
<div className="h-52 w-52 bg-custom-background-80 rounded-full grid place-items-center mx-auto">
|
||
|
|
<div className="h-32 w-32">
|
||
|
|
<Image src={UserLoggedInImage} alt="User already logged in" />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<h1 className="text-3xl font-semibold mt-12">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>
|
||
|
|
);
|
||
|
|
};
|