refactor(player-ui): remove isClickmap from ReplayerRePlayer

frontend/app/components/Session/Player/ReplayPlayer/PlayerBlock.tsx

@@ -13,7 +13,6 @@ interface IProps {
   activeTab: string;
   jiraConfig: Record<string, any>
   fullView?: boolean
-  isClickmap?: boolean
 }
 
 function PlayerBlock(props: IProps) {
@@ -24,14 +23,12 @@ function PlayerBlock(props: IProps) {
     activeTab,
     jiraConfig,
     fullView = false,
-    isClickmap
   } = props;
 
-  const shouldShowSubHeader = !fullscreen && !fullView && !isClickmap
+  const shouldShowSubHeader = !fullscreen && !fullView 
   return (
     <div
-      className={cn(styles.playerBlock, 'flex flex-col', !isClickmap ? 'overflow-x-hidden' : 'overflow-visible')}
-      style={{ zIndex: isClickmap ? 1 : undefined, minWidth: isClickmap ? '100%' : undefined }}
+      className={cn(styles.playerBlock, 'flex flex-col', 'overflow-x-hidden')}
     >
       {shouldShowSubHeader ? (
         <SubHeader sessionId={sessionId} disabled={disabled} jiraConfig={jiraConfig} />
@@ -39,7 +36,6 @@ function PlayerBlock(props: IProps) {
       <Player
         activeTab={activeTab}
         fullView={fullView}
-        isClickmap={isClickmap}
       />
     </div>
   );

frontend/app/components/Session/Player/ReplayPlayer/PlayerContent.tsx

@@ -17,11 +17,10 @@ interface IProps {
   fullscreen: boolean;
   activeTab: string;
   setActiveTab: (tab: string) => void;
-  isClickmap: boolean;
   session: Session
 }
 
-function PlayerContent({ session, fullscreen, activeTab, setActiveTab, isClickmap }: IProps) {
+function PlayerContent({ session, fullscreen, activeTab, setActiveTab }: IProps) {
   const { store } = React.useContext(PlayerContext)
 
   const {
@@ -60,7 +59,7 @@ function PlayerContent({ session, fullscreen, activeTab, setActiveTab, isClickma
             style={activeTab && !fullscreen ? { maxWidth: 'calc(100% - 270px)' } : undefined}
           >
             <div className={cn(styles.session, 'relative')} data-fullscreen={fullscreen}>
-              <PlayerBlock activeTab={activeTab} isClickmap={isClickmap} />
+              <PlayerBlock activeTab={activeTab} />
             </div>
           </div>
           {activeTab !== '' && (

frontend/app/components/Session/Player/ReplayPlayer/PlayerInst.tsx

@@ -43,7 +43,6 @@ interface IProps {
   nextId: string;
   sessionId: string;
   activeTab: string;
-  isClickmap?: boolean;
   updateLastPlayedSession: (id: string) => void
 }
 

frontend/app/components/Session/WebPlayer.tsx

@@ -28,7 +28,6 @@ function WebPlayer(props: any) {
     fullscreen,
     fetchList,
     customSession,
-    isClickmap,
     insights,
     jumpTimestamp,
     onMarkerClick,
@@ -41,30 +40,24 @@ function WebPlayer(props: any) {
   const [contextValue, setContextValue] = useState<IPlayerContext>(defaultContextValue);
 
   useEffect(() => {
-    if (!isClickmap) {
-      fetchList('issues');
-    }
-    const usedSession = isClickmap && customSession ? customSession : session;
+    fetchList('issues');
 
-    const [WebPlayerInst, PlayerStore] = createWebPlayer(usedSession, (state) =>
+    const [WebPlayerInst, PlayerStore] = createWebPlayer(session, (state) =>
       makeAutoObservable(state)
     );
     setContextValue({ player: WebPlayerInst, store: PlayerStore });
 
     props.fetchMembers();
 
-    if (!isClickmap) {
-      notesStore.fetchSessionNotes(session.sessionId).then((r) => {
-        const note = props.query.get('note');
-        if (note) {
-          WebPlayerInst.pause();
-          setNoteItem(notesStore.getNoteById(parseInt(note, 10), r));
-          setShowNote(true);
-        }
-      });
-    } else {
-      WebPlayerInst.setMarkerClick(onMarkerClick)
-    }
+    notesStore.fetchSessionNotes(session.sessionId).then((r) => {
+      const note = props.query.get('note');
+      if (note) {
+        WebPlayerInst.pause();
+        setNoteItem(notesStore.getNoteById(parseInt(note, 10), r));
+        setShowNote(true);
+      }
+    })
+
 
     const jumpToTime = props.query.get('jumpto');
     const freeze = props.query.get('freeze')
@@ -102,38 +95,33 @@ function WebPlayer(props: any) {
 
   return (
     <PlayerContext.Provider value={contextValue}>
-      <>
-        {!isClickmap ? (
-          <PlayerBlockHeader
-            // @ts-ignore TODO?
-            activeTab={activeTab}
-            setActiveTab={setActiveTab}
-            tabs={TABS}
-            fullscreen={fullscreen}
+      <PlayerBlockHeader
+        // @ts-ignore TODO?
+        activeTab={activeTab}
+        setActiveTab={setActiveTab}
+        tabs={TABS}
+        fullscreen={fullscreen}
+      />
+      {/* @ts-ignore  */}
+      <PlayerContent
+        activeTab={activeTab}
+        fullscreen={fullscreen}
+        setActiveTab={setActiveTab}
+        session={session}
+      />
+      <Modal open={showNoteModal} onClose={onNoteClose}>
+        {showNoteModal ? (
+          <ReadNote
+            userEmail={
+              props.members.find((m: Record<string, any>) => m.id === noteItem?.userId)?.email
+              || ''
+            }
+            note={noteItem}
+            onClose={onNoteClose}
+            notFound={!noteItem}
           />
         ) : null}
-        {/* @ts-ignore  */}
-        <PlayerContent
-          activeTab={activeTab}
-          fullscreen={fullscreen}
-          setActiveTab={setActiveTab}
-          session={session}
-          isClickmap={isClickmap}
-        />
-        <Modal open={showNoteModal} onClose={onNoteClose}>
-          {showNoteModal ? (
-            <ReadNote
-              userEmail={
-                props.members.find((m: Record<string, any>) => m.id === noteItem?.userId)?.email
-                || ''
-              }
-              note={noteItem}
-              onClose={onNoteClose}
-              notFound={!noteItem}
-            />
-          ) : null}
-        </Modal>
-      </>
+      </Modal>
     </PlayerContext.Provider>
   );
 }