hedgedoc/src/components/editor/document-bar/connection-indicator/user-line.tsx
Philip Molares f3bf7cd105
Added reuse information (#782)
Signed-off-by: Philip Molares <philip.molares@udo.edu>
2020-11-22 21:50:07 +01:00

27 lines
819 B
TypeScript

/*
SPDX-FileCopyrightText: 2020 The HedgeDoc developers (see AUTHORS file)
SPDX-License-Identifier: AGPL-3.0-only
*/
import React, { Fragment } from 'react'
import { UserAvatar } from '../../../common/user-avatar/user-avatar'
import { ActiveIndicator, ActiveIndicatorStatus } from './active-indicator'
import './user-line.scss'
export interface UserLineProps {
name: string;
photo: string;
color: string;
status: ActiveIndicatorStatus;
}
export const UserLine: React.FC<UserLineProps> = ({ name, photo, color, status }) => {
return (
<Fragment>
<div className='d-inline-flex align-items-bottom user-line-color-indicator' style={{ borderLeftColor: color }}/>
<UserAvatar photo={photo} name={name} additionalClasses={'mx-2'}/>
<ActiveIndicator status={status} />
</Fragment>
)
}