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

related items without cover now has letters

Browse source
This commit is contained in:
Fedor Katurov 2020-04-08 15:36:27 +07:00
parent 0f3ac203f7
commit eade3efc7c
4 changed files with 34 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/node/NodeRelatedItem/index.tsx
View file

@ -10,6 +10,18 @@ type IProps = RouteComponentProps & {
item: Partial<INode>;
};
const getTitleLetters = (title: string): string => {
const words = title.split(' ');
return words.length > 1
? words
.slice(0, 2)
.map(word => word[0])
.join('')
.toUpperCase()
: words[0].substr(0, 2).toUpperCase();
};
const NodeRelatedItemUnconnected: FC<IProps> = memo(({ item, history }) => {
const [is_loaded, setIsLoaded] = useState(false);
const onClick = useCallback(() => history.push(URLS.NODE_URL(item.id)), [item, history]);
@ -25,6 +37,8 @@ const NodeRelatedItemUnconnected: FC<IProps> = memo(({ item, history }) => {
style={{ backgroundImage: `url("${getURL({ url: item.thumbnail }, PRESETS.avatar)}")` }}
/>
{!item.thumbnail && <div className={styles.letters}>{getTitleLetters(item.title)}</div>}
<img
src={getURL({ url: item.thumbnail }, PRESETS.avatar)}
alt="loader"