From b21b69e09f68b9f94e98183dff0b33f7ecd3f1b2 Mon Sep 17 00:00:00 2001
From: nick-delirium <nikita@openreplay.com>
Date: Thu, 8 Jun 2023 16:44:47 +0200
Subject: [PATCH] fix(ui): fix ontabclick

---
 .../components/Session_/EventsBlock/EventGroupWrapper.js | 9 ++++++---
 .../app/components/Session_/EventsBlock/EventsBlock.tsx  | 2 +-
 frontend/app/player/web/MessageManager.ts                | 2 +-
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js b/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js
index d913d3271..b75c9bcd7 100644
--- a/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js
+++ b/frontend/app/components/Session_/EventsBlock/EventGroupWrapper.js
@@ -108,7 +108,7 @@ class EventGroupWrapper extends React.Component {
               isLastInGroup={isLastInGroup}
               whiteBg={true}
             />
-          ) : isTabChange ? (<TabChange from={event.fromTab} to={event.toTab} activeUrl={event.activeUrl} />) : (
+          ) : isTabChange ? (<TabChange onClick={this.onEventClick} from={event.fromTab} to={event.toTab} activeUrl={event.activeUrl} />) : (
             <Event
               key={event.key}
               event={event}
@@ -130,12 +130,15 @@ class EventGroupWrapper extends React.Component {
   }
 }
 
-function TabChange({ from, to, activeUrl }) {
+function TabChange({ from, to, activeUrl, onClick }) {
     if (!from) {
         return null;
     }
     return (
-        <div className={'p-2 bg-gray-lightest w-full my-2 border-gray-light border-t border-b !border-l-0 !border-r-0'}>
+        <div
+            onClick={onClick}
+            className={'p-2 cursor-pointer bg-gray-lightest w-full border-gray-light border-t border-b !border-l-0 !border-r-0'}
+        >
             <div className={'flex items-center gap-2 px-4'}>
               <span style={{ fontWeight: 500 }}>
                 {from}
diff --git a/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx b/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx
index ea316c1f9..aab91fbe3 100644
--- a/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx
+++ b/frontend/app/components/Session_/EventsBlock/EventsBlock.tsx
@@ -61,7 +61,7 @@ function EventsBlock(props: IProps) {
       let i = urlsList.length - 1;
       while (!found && i >= 0) {
         const item = urlsList[i]
-        if (item.url && item.time <= ev.mTime) {
+        if (item.url && item.time <= ev.time) {
           found = true;
           ev.activeUrl = item.url.replace(/.*\/\/[^\/]*/, '');
         }
diff --git a/frontend/app/player/web/MessageManager.ts b/frontend/app/player/web/MessageManager.ts
index b2bd4ae1f..d17c0e8d2 100644
--- a/frontend/app/player/web/MessageManager.ts
+++ b/frontend/app/player/web/MessageManager.ts
@@ -258,7 +258,7 @@ export default class MessageManager {
         if (!prevChange || prevChange.tabId !== msg.tabId) {
           this.tabChangeEvents.push({
             tabId: msg.tabId,
-            mTime: msg.time,
+            time: msg.time,
             timestamp: this.sessionStart + msg.time,
             toTab: mapTabs(this.tabs)[msg.tabId],
             fromTab: prevChange?.tabId ? mapTabs(this.tabs)[prevChange.tabId] : '',