ReactJS

1
import React from 'react';
2
import styles from './userblock.css';
3
import {EIcons, Icon} from "../../../Icon";
4
import {Break} from "../../../Break";
5
import {EColors, Text} from "../../../Text";
6

7
interface IUserBlockProps {
8
  avatarSrc?: string;
9
  username?: string;
10
}
11

12
export function UserBlock({avatarSrc, username}: IUserBlockProps) {
13
  return (
14
    <a
15
      href="https://www.reddit.com/api/v1/authorize?client_id=yVAbOXZ_u7BWRuwt2WnixQ&response_type=code&state=rrasfdsd&redirect_uri=http://localhost:3000/auth&duration=permanent&scope=identity read submit"
16

17
      className={styles.userBox}>
18
      <div className={styles.avatarBox}>
19
        {avatarSrc
20
          ? <img src={avatarSrc} alt="user avatar" className={styles.avatarImage}/>
21
          : <Icon name={EIcons.iconAnon} size={50}/>
22
        }
23
      </div>
24
      <div className={styles.username}>
25
        <Break size={12}/>
26
        <Text size={20} color={username ? EColors.black : EColors.grey99}>{username || 'Аноним'}</Text>
27
      </div>
28
    </a>
29
  );
30
}
31