40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
import React, { useState } from "react";
|
|
|
|
import { useCurrentUser } from "../../contexts";
|
|
import { AvatarEditor, Navigator, CurrentUserAvatar } from "../../components";
|
|
|
|
export const Profile = () => {
|
|
const [avatarEditorIsOpen, setAvatarEditorIsOpen] = useState(false);
|
|
const { user } = useCurrentUser();
|
|
|
|
return (
|
|
<>
|
|
<AvatarEditor
|
|
isOpen={avatarEditorIsOpen}
|
|
setIsOpen={setAvatarEditorIsOpen}
|
|
/>
|
|
<Navigator home />
|
|
<div className="bg-gray-100 w-full my-3">
|
|
<main>
|
|
<div className="flex items-center flex-col max-w-4xl m-auto">
|
|
<div className="bg-white shadow border border-gray-100 flex flex-col items-center rounded p-4 w-full mt-12 mb-4 relative">
|
|
<div
|
|
className="w-20 absolute cursor-pointer"
|
|
style={{ top: "-3.10rem" }}
|
|
onClick={() => setAvatarEditorIsOpen(true)}
|
|
>
|
|
<CurrentUserAvatar />
|
|
</div>
|
|
<div className="mt-8 text-center">
|
|
<h2 className="font-bold">{user?.name || user?.email}</h2>
|
|
<h2 className="py-4">Centro: CCT</h2>
|
|
<h2 className="">TODO: Cargo</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</>
|
|
);
|
|
};
|