jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): fix revId position, fix issue icons on timeline

Browse source
This commit is contained in:
sylenien 2022-07-08 10:14:23 +02:00 • committed by Shekar Siri
parent 6530ab1fd3
commit 21713dfe53
2 changed files with 20 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
frontend/app/components/Session_/EventsBlock/UserCard/UserCard.js
View file

@ -87,7 +87,8 @@ function UserCard({
<SessionInfoItem comp={<CountryFlag country={ userCountry } />} label={countries[userCountry]} value={<span style={{ whiteSpace: 'nowrap' }}>{formatTimeOrDate(startedAt)}</span> } />
<SessionInfoItem icon={browserIcon(userBrowser)} label={userBrowser} value={ `v${ userBrowserVersion }` } />
<SessionInfoItem icon={osIcon(userOs)} label={userOs} value={ userOsVersion } />
<SessionInfoItem icon={deviceTypeIcon(userDeviceType)} label={userDeviceType} value={ getDimension(width, height) } isLast />
<SessionInfoItem icon={deviceTypeIcon(userDeviceType)} label={userDeviceType} value={ getDimension(width, height) } isLast={!revId} />
{revId && <SessionInfoItem icon="info" label="Rev ID:" value={revId} isLast />}
</div>
)}
position="bottom center"
@ -104,11 +105,6 @@ function UserCard({
</div>
</div>
</div>
{revId && (
<div className="border-l py-2 px-3">
<span className="font-medium">Rev ID:</span> {revId}
</div>
)}
<SlideModal
title={ <div>User Sessions</div> }

30
frontend/app/components/Session_/Player/Controls/Timeline.js
View file

@ -310,19 +310,22 @@ export default class Timeline extends React.PureComponent {
<div
key={ e.key }
className={ cn(stl.markup, stl.error) }
style={ { left: `${ e.time * scale }%`, top: '-5px' } }
style={ { left: `${ e.time * scale }%`, top: '0px' } }
onClick={ this.createEventClickHandler(e) }
>
<TimelinePointer
icon={getPointerIcon('fetch')}
content={
<Tooltip
delay={0}
position="top"
html={
<div className={ stl.popup }>
<b>{ "Failed Fetch" }</b>
<b>Failed Fetch</b>
<br/>
{ e.name }
</div>
}
/>
>
<Icon className=" rounded-full bg-white" name={getPointerIcon('fetch')} size="16" />
</Tooltip>
</div>
))
}
@ -332,19 +335,22 @@ export default class Timeline extends React.PureComponent {
<div
key={ e.key }
className={ cn(stl.markup, stl.error) }
style={ { left: `${ e.time * scale }%`, top: '-5px' } }
style={ { left: `${ e.time * scale }%`, top: '0px' } }
onClick={ this.createEventClickHandler(e) }
>
<TimelinePointer
icon={getPointerIcon('stack')}
content={
<Tooltip
delay={0}
position="top"
html={
<div className={ stl.popup }>
<b> { "Stack Event" }</b>
<b>Stack Event</b>
<br/>
{ e.name }
</div>
}
/>
>
<Icon className=" rounded-full bg-white" name={getPointerIcon('stack')} size="16" />
</Tooltip>
</div>
))
}