Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-13 21:05:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: use explicit memo import (#1596)

Browse Source 
Co-authored-by: Himself65 <himself65@outlook.com>
This commit is contained in:
VictorNanka
2023-03-17 11:27:37 +09:00
committed by GitHub
parent 5a9498fe9b
commit d1722bc235
3 changed files with 66 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
apps/web/src/components/pure/workspace-avatar/index.tsx
View File

@@ -1,5 +1,6 @@
import { UNTITLED_WORKSPACE_NAME } from '@affine/env';
import React from 'react';
import type React from 'react';
import { memo } from 'react';
import { useBlockSuiteWorkspaceAvatarUrl } from '../../../hooks/use-blocksuite-workspace-avatar-url';
import type { BlockSuiteWorkspace, RemWorkspace } from '../../../shared';
@@ -12,61 +13,65 @@ interface AvatarProps {
style?: React.CSSProperties;
}
export const Avatar: React.FC<AvatarProps> = React.memo<AvatarProps>(
function Avatar({ size: _size, avatar_url, style, name, ...props }) {
const size = _size || 20;
const sizeStr = size + 'px';
export const Avatar: React.FC<AvatarProps> = memo<AvatarProps>(function Avatar({
size: _size,
avatar_url,
style,
name,
...props
}) {
const size = _size || 20;
const sizeStr = size + 'px';
return (
<>
{avatar_url ? (
<div
{...props}
style={{
...style,
width: sizeStr,
height: sizeStr,
color: '#fff',
borderRadius: '50%',
overflow: 'hidden',
display: 'inline-block',
verticalAlign: 'middle',
}}
>
<picture>
<img
style={{ width: sizeStr, height: sizeStr }}
src={avatar_url}
alt=""
referrerPolicy="no-referrer"
/>
</picture>
</div>
) : (
<div
{...props}
style={{
...style,
width: sizeStr,
height: sizeStr,
border: '1px solid #fff',
color: '#fff',
fontSize: Math.ceil(0.5 * size) + 'px',
background: stringToColour(name || 'AFFiNE'),
borderRadius: '50%',
display: 'inline-flex',
lineHeight: '1',
justifyContent: 'center',
alignItems: 'center',
}}
>
{(name || 'AFFiNE').substring(0, 1)}
</div>
)}
</>
);
}
);
return (
<>
{avatar_url ? (
<div
{...props}
style={{
...style,
width: sizeStr,
height: sizeStr,
color: '#fff',
borderRadius: '50%',
overflow: 'hidden',
display: 'inline-block',
verticalAlign: 'middle',
}}
>
<picture>
<img
style={{ width: sizeStr, height: sizeStr }}
src={avatar_url}
alt=""
referrerPolicy="no-referrer"
/>
</picture>
</div>
) : (
<div
{...props}
style={{
...style,
width: sizeStr,
height: sizeStr,
border: '1px solid #fff',
color: '#fff',
fontSize: Math.ceil(0.5 * size) + 'px',
background: stringToColour(name || 'AFFiNE'),
borderRadius: '50%',
display: 'inline-flex',
lineHeight: '1',
justifyContent: 'center',
alignItems: 'center',
}}
>
{(name || 'AFFiNE').substring(0, 1)}
</div>
)}
</>
);
});
export type WorkspaceUnitAvatarProps = {
size?: number;