feat: add edit profile modal template

This commit is contained in:
Kentai Radiquum 2024-09-18 16:01:01 +05:00
parent 3211c260a0
commit 384bd09a27
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
3 changed files with 85 additions and 1 deletions

View file

@ -21,6 +21,8 @@ export const ProfileActions = (props: {
token: string;
is_me_blocked: boolean;
is_blocked: boolean;
edit_isOpen: boolean;
edit_setIsOpen: any;
}) => {
const router = useRouter();
const profileIdIsSmaller = props.my_profile_id < props.profile_id;
@ -107,7 +109,7 @@ export const ProfileActions = (props: {
<p>Отправил(-а) вам заявку в друзья</p>
)}
<div className="flex gap-2">
{props.isMyProfile && <Button color={"blue"}>Редактировать</Button>}
{props.isMyProfile && <Button color={"blue"} onClick={() => props.edit_setIsOpen(!props.edit_isOpen)}>Редактировать</Button>}
{!props.isMyProfile && (
<>
{(!props.isFriendRequestsDisallowed ||

View file

@ -0,0 +1,76 @@
import { Modal } from "flowbite-react";
export const ProfileEditModal = (props: {isOpen: boolean, setIsOpen: (isOpen: boolean) => void}) => {
return (
<Modal
dismissible
show={props.isOpen}
onClose={() => props.setIsOpen(false)}
size={"7xl"}
>
<Modal.Header>Редактирование профиля</Modal.Header>
<Modal.Body>
<div className="flex flex-col gap-4">
<div className="flex flex-col gap-4 pb-4 border-b-2 border-gray-300 border-solid">
<div className="flex items-center gap-2">
<span className="w-8 h-8 iconify mdi--user"></span>
<p className="text-xl font-semibold">Профиль</p>
</div>
<div>
<p className="text-lg">Изменить аватар</p>
</div>
<div>
<p className="text-lg">Изменить статус</p>
<p className="text-lg text-gray-500">статус</p>
</div>
<div>
<p className="text-lg">Изменить никнейм</p>
<p className="text-lg text-gray-500">никнейм</p>
</div>
</div>
<div className="flex flex-col gap-4 pb-4 border-b-2 border-gray-300 border-solid">
<div className="flex items-center gap-2">
<span className="w-8 h-8 iconify mdi--anonymous "></span>
<p className="text-xl font-semibold">Приватность</p>
</div>
<div>
<p className="text-lg">Кто видит мою статистику, оценки и историю просмотра</p>
<p className="text-lg text-gray-500">Все пользователи</p>
</div>
<div>
<p className="text-lg">Кто видит в профиле мои комментарии, коллекции, видео и друзей</p>
<p className="text-lg text-gray-500">Все пользователи</p>
</div>
<div>
<p className="text-lg">Кто видит в профиле мои социальные сети</p>
<p className="text-lg text-gray-500">Все пользователи</p>
</div>
<div>
<p className="text-lg">Кто может отправлять мне заявки в друзья</p>
<p className="text-lg text-gray-500">Все пользователи</p>
</div>
<div>
<p className="text-lg">Блоклист</p>
<p className="text-lg text-gray-500">Список пользователей, которым запрещён доступ к вашей странице</p>
</div>
</div>
<div className="flex flex-col gap-4">
<div className="flex items-center gap-2">
<span className="w-8 h-8 iconify mdi--shield"></span>
<p className="text-xl font-semibold">Безопасность и привязка к сервисам</p>
</div>
<div>
<p className="text-lg">Изменить Email или Пароль</p>
<p className="text-lg text-gray-500">Изменить возможно только в мобильном приложении</p>
</div>
<div>
<p className="text-lg">Привязка к сервисам</p>
<p className="text-lg text-gray-500">Изменить возможно только в мобильном приложении</p>
<p className="text-lg text-gray-500">Аккаунт привязан к: сер1, сер2</p>
</div>
</div>
</div>
</Modal.Body>
</Modal>
);
};