40 lines
1.1 KiB
JavaScript
40 lines
1.1 KiB
JavaScript
import { BrowserIcon, OsIcon, Icon, CountryFlag, Link } from 'UI';
|
|
import { deviceTypeIcon } from 'App/iconNames';
|
|
import { session as sessionRoute } from 'App/routes';
|
|
import { formatTimeOrDate } from 'App/date';
|
|
|
|
|
|
const SessionLine = ({ session: {
|
|
userBrowser,
|
|
userOs,
|
|
userCountry,
|
|
siteId,
|
|
sessionId,
|
|
viewed,
|
|
userDeviceType,
|
|
startedAt
|
|
} }) => (
|
|
<div className="flex justify-between items-center" style={{ padding: '5px 20px' }}>
|
|
<div className="color-gray-medium font-size-10" >
|
|
<CountryFlag country={ userCountry } className="mr-4" />
|
|
{ formatTimeOrDate(startedAt) }
|
|
</div>
|
|
<div className="flex">
|
|
<BrowserIcon browser={ userBrowser } className="mr-4" />
|
|
<OsIcon os={ userOs } size="20" className="mr-4" />
|
|
<Icon name={ deviceTypeIcon(userDeviceType) } size="20" className="mr-4" />
|
|
</div>
|
|
<Link to={ sessionRoute(sessionId) } siteId={ siteId } >
|
|
<Icon
|
|
name={ viewed ? 'play-fill' : 'play-circle-light' }
|
|
size="20"
|
|
color="teal"
|
|
/>
|
|
</Link>
|
|
</div>
|
|
);
|
|
|
|
|
|
SessionLine.displayName = "SessionLine";
|
|
|
|
export default SessionLine;
|