mirror of
https://github.com/muerwre/vault-frontend.git
synced 2025-04-24 20:36:40 +07:00
made sample profile page
This commit is contained in:
parent
b43fb35b47
commit
a808045a7d
17 changed files with 118 additions and 179 deletions
|
@ -9,6 +9,9 @@ import classNames from 'classnames';
|
|||
|
||||
import styles from './styles.module.scss';
|
||||
import markdown from '~/styles/common/markdown.module.scss';
|
||||
import { ProfileAvatar } from '~/containers/profile/ProfileAvatar';
|
||||
import { Avatar } from '~/components/common/Avatar';
|
||||
import { Markdown } from '~/components/containers/Markdown';
|
||||
|
||||
interface IProps {
|
||||
profile: IAuthState['profile'];
|
||||
|
@ -16,49 +19,30 @@ interface IProps {
|
|||
}
|
||||
|
||||
const ProfilePageLeft: FC<IProps> = ({ username, profile }) => {
|
||||
const thumb = useMemo(() => {
|
||||
if (!profile || !profile.user || !profile.user.photo) return '';
|
||||
|
||||
return getURL(profile.user.photo, PRESETS.small_hero);
|
||||
}, [profile]);
|
||||
|
||||
return (
|
||||
<div className={styles.wrap}>
|
||||
<div className={styles.avatar} style={{ backgroundImage: `url('${thumb}')` }} />
|
||||
<Avatar
|
||||
username={username}
|
||||
url={profile.user?.photo?.url}
|
||||
className={styles.avatar}
|
||||
preset={PRESETS['600']}
|
||||
/>
|
||||
|
||||
<div className={styles.region_wrap}>
|
||||
<div className={styles.region}>
|
||||
<div className={styles.name}>
|
||||
{profile.is_loading ? <Placeholder /> : profile?.user?.fullname}
|
||||
</div>
|
||||
<div className={styles.region}>
|
||||
<div className={styles.name}>
|
||||
{profile.is_loading ? <Placeholder /> : profile?.user?.fullname}
|
||||
</div>
|
||||
|
||||
<div className={styles.username}>
|
||||
{profile.is_loading ? <Placeholder /> : `~${profile?.user?.username}`}
|
||||
</div>
|
||||
|
||||
<div className={styles.menu}>
|
||||
<Link to={`${URLS.PROFILE_PAGE(username)}/`}>
|
||||
<Icon icon="profile" size={20} />
|
||||
Профиль
|
||||
</Link>
|
||||
|
||||
<Link to={`${URLS.PROFILE_PAGE(username)}/settings`}>
|
||||
<Icon icon="settings" size={20} />
|
||||
Настройки
|
||||
</Link>
|
||||
|
||||
<Link to={`${URLS.PROFILE_PAGE(username)}/messages`}>
|
||||
<Icon icon="messages" size={20} />
|
||||
Сообщения
|
||||
</Link>
|
||||
</div>
|
||||
<div className={styles.username}>
|
||||
{profile.is_loading ? <Placeholder /> : `~${profile?.user?.username}`}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{profile && profile.user && profile.user.description && false && (
|
||||
<div className={classNames(styles.description, markdown.wrapper)}>
|
||||
{formatText(profile?.user?.description || '')}
|
||||
</div>
|
||||
{profile && profile.user && profile.user.description && (
|
||||
<Markdown
|
||||
className={styles.description}
|
||||
dangerouslySetInnerHTML={{ __html: formatText(profile.user.description) }}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue