muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

fixed node related item profile popout

Browse source
This commit is contained in:
Fedor Katurov 2022-01-09 21:24:20 +07:00
parent 8311d3d43d
commit c0ece70f89
13 changed files with 106 additions and 186 deletions
Download patch file Download diff file Expand all files Collapse all files

40
src/components/common/Avatar/index.tsx
View file

@ -1,40 +1,34 @@
import React, { FC, useCallback } from 'react';
import React, { FC, forwardRef, useCallback } from 'react';
import { getURLFromString } from '~/utils/dom';
import { PRESETS } from '~/constants/urls';
import styles from './styles.module.scss';
import classNames from 'classnames';
import { openUserProfile } from '~/utils/user';
import { DivProps } from '~/utils/types';
import { Square } from '~/components/common/Square';
interface Props extends DivProps {
url?: string;
username?: string;
size?: number;
preset?: typeof PRESETS[keyof typeof PRESETS];
innerRef?: React.Ref<any>;
}
const Avatar: FC<Props> = ({
url,
username,
size,
className,
innerRef,
preset = PRESETS.avatar,
...rest
}) => {
const backgroundImage = !!url ? `url('${getURLFromString(url, preset)}')` : undefined;
const onOpenProfile = useCallback(() => openUserProfile(username), [username]);
const Avatar = forwardRef<HTMLDivElement, Props>(
({ url, username, size, className, preset = PRESETS.avatar, ...rest }, ref) => {
const onOpenProfile = useCallback(() => openUserProfile(username), [username]);
return (
<div
{...rest}
className={classNames(styles.avatar, className)}
style={{ backgroundImage }}
onClick={onOpenProfile}
ref={innerRef}
/>
);
};
return (
<Square
{...rest}
image={getURLFromString(url, preset)}
className={classNames(styles.avatar, className)}
onClick={onOpenProfile}
size={size}
ref={ref}
/>
);
}
);
export { Avatar };