openreplay/frontend/app/components/Client/ManageUsers/UserItem.js
Shekar Siri 2ed5cac986
Webpack upgrade and dependency cleanup (#523)
* change(ui) - webpack update
* change(ui) - api optimize and other fixes
2022-06-03 16:47:38 +02:00

49 lines
1.7 KiB
JavaScript

import React from 'react';
import { Icon, CopyButton, Popup } from 'UI';
import styles from './userItem.module.css';
const UserItem = ({ user, adminLabel, deleteHandler, editHandler, generateInviteLink }) => (
<div className={ styles.wrapper } id="user-row">
<Icon name="user-alt" size="16" marginRight="10" />
<div id="user-name">{ user.name || user.email }</div>
<div className="px-2"/>
{ adminLabel && <div className={ styles.adminLabel }>{ adminLabel }</div>}
{ user.roleName && <div className={ styles.adminLabel }>{ user.roleName }</div>}
<div className={ styles.actions }>
{ user.expiredInvitation && !user.joined &&
<Popup
content={ `Generate Invitation Link` }
>
<div className={ styles.button } onClick={ () => generateInviteLink(user) } id="trash">
<Icon name="link-45deg" size="16" color="red"/>
</div>
</Popup>
}
{ !user.expiredInvitation && !user.joined && user.invitationLink &&
<Popup
content={ `Copy Invitation Link` }
>
<div className={ styles.button }>
<CopyButton
content={user.invitationLink}
className="link"
btnText={<Icon name="link-45deg" size="16" color="teal"/>}
/>
</div>
</Popup>
}
{ !!deleteHandler &&
<div className={ styles.button } onClick={ () => deleteHandler(user) } id="trash">
<Icon name="trash" size="16" color="teal"/>
</div>
}
{ !!editHandler &&
<div className={ styles.button } onClick={ () => editHandler(user) }>
<Icon name="edit" size="16" color="teal"/>
</div>
}
</div>
</div>
);
export default UserItem;