fd5c0c9747
* applied eslint * add locales and lint the project * removed error boundary * updated locales * fix min files * fix locales
48 lines
1.2 KiB
TypeScript
48 lines
1.2 KiB
TypeScript
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';
|
|
import React from 'react';
|
|
|
|
export default function SessionLine({
|
|
session: {
|
|
userBrowser,
|
|
userOs,
|
|
userCountry,
|
|
siteId,
|
|
sessionId,
|
|
viewed,
|
|
userDeviceType,
|
|
startedAt,
|
|
},
|
|
}) {
|
|
return (
|
|
<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';
|