From 6ac1e0c5bdbafbdbe156a7d0abcaa3ee3bc06c06 Mon Sep 17 00:00:00 2001
From: nick-delirium <nikita@openreplay.com>
Date: Mon, 30 Jan 2023 12:36:15 +0100
Subject: [PATCH] fix(ui): remove depecated code(screen sharing, long tasks)

---
 .../Assist/ScreenSharing/ScreenSharing.tsx    |  45 -------
 .../components/Assist/ScreenSharing/index.js  |   1 -
 .../LongTasks/LongTasks.DEPRECATED.js         | 122 ------------------
 .../components/Session_/LongTasks/index.js    |   1 -
 frontend/app/duck/components/player.js        |   1 -
 5 files changed, 170 deletions(-)
 delete mode 100644 frontend/app/components/Assist/ScreenSharing/ScreenSharing.tsx
 delete mode 100644 frontend/app/components/Assist/ScreenSharing/index.js
 delete mode 100644 frontend/app/components/Session_/LongTasks/LongTasks.DEPRECATED.js
 delete mode 100644 frontend/app/components/Session_/LongTasks/index.js

diff --git a/frontend/app/components/Assist/ScreenSharing/ScreenSharing.tsx b/frontend/app/components/Assist/ScreenSharing/ScreenSharing.tsx
deleted file mode 100644
index 35d67f91b..000000000
--- a/frontend/app/components/Assist/ScreenSharing/ScreenSharing.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import React from 'react'
-import { Button } from 'UI'
-
-function ScreenSharing() {
-  const videoRef = React.createRef<HTMLVideoElement>()
-
-  function handleSuccess(stream) {
-    // startButton.disabled = true;    
-    //videoRef.current?.srcObject = stream;
-    // @ts-ignore
-    window.stream = stream; // make variable available to browser console    
-
-    stream.getVideoTracks()[0].addEventListener('ended', () => {
-      console.log('The user has ended sharing the screen');      
-    });
-  }
-  
-  function handleError(error) {
-    console.log(`getDisplayMedia error: ${error.name}`, error);
-  }
-
-  const startScreenSharing = () => {
-    // @ts-ignore
-    navigator.mediaDevices.getDisplayMedia({video: true})
-    .then(handleSuccess, handleError);
-  }
-
-  const stopScreenSharing = () => {   
-    // @ts-ignore 
-    window.stream.stop()
-    console.log('Stop screen sharing')
-  }
-
-  return (
-    <div className="fixed inset-0 z-50 bg-red">      
-      <video ref={ videoRef } id="screen-share" autoPlay loop muted></video>
-      <div className="absolute left-0 right-0 bottom-0">
-        <Button onClick={startScreenSharing}>Start</Button>
-        <Button onClick={stopScreenSharing}>Stop</Button>
-      </div>
-    </div>
-  )
-}
-
-export default ScreenSharing
diff --git a/frontend/app/components/Assist/ScreenSharing/index.js b/frontend/app/components/Assist/ScreenSharing/index.js
deleted file mode 100644
index f2bc82ab6..000000000
--- a/frontend/app/components/Assist/ScreenSharing/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './ScreenSharing'
\ No newline at end of file
diff --git a/frontend/app/components/Session_/LongTasks/LongTasks.DEPRECATED.js b/frontend/app/components/Session_/LongTasks/LongTasks.DEPRECATED.js
deleted file mode 100644
index 2fa80fd01..000000000
--- a/frontend/app/components/Session_/LongTasks/LongTasks.DEPRECATED.js
+++ /dev/null
@@ -1,122 +0,0 @@
-import React from 'react';
-import { NoContent, Input, QuestionMarkHint } from 'UI'
-import { getRE } from 'App/utils';
-import { connectPlayer, jump } from 'Player';
-import BottomBlock from '../BottomBlock';
-import TimeTable from '../TimeTable';
-
-
-const CONTEXTS = [ "unknown", "self", "same-origin-ancestor", "same-origin-descendant", "same-origin", "cross-origin-ancestor", "cross-origin-descendant", "cross-origin-unreachable", "multiple-contexts" ];
-const CONTAINER_TYPES = [ "window", "iframe", "embed", "object" ];
-
-function renderContext({ context }) {
-  return CONTEXTS[ context ];
-}
-
-function renderDuration({ duration }) {
-  return `${ duration }ms`;
-}
-
-function renderContainerType({ containerType }) {
-  return CONTAINER_TYPES[ containerType ]
-}
-
-@connectPlayer(state => ({
-  list: state.longtasksList,
-  time: state.time,
-}))
-export default class GraphQL extends React.PureComponent {
-  state = {
-    filter: "",
-  }
-  onFilterChange = ({ target: { value } }) => this.setState({ filter: value })
-
-  jump = ({ time }) => {
-    jump(time);
-  }
-
-  render() {
-    const { list, time} = this.props;
-    const { filter, current } = this.state;
-    const filterRE = getRE(filter, 'i');
-    const filtered = list
-      .filter(({ containerType, context, containerName = "", containerId = "", containerSrc="" }) =>
-          filterRE.test(containerName) ||
-          filterRE.test(containerId) ||
-          filterRE.test(containerSrc) ||
-          filterRE.test(CONTEXTS[ context ]) ||
-          filterRE.test(CONTAINER_TYPES[ containerType ]));
-    const lastIndex = filtered.filter(item => item.time <= time).length - 1;
-    return (
-      <BottomBlock>
-        <BottomBlock.Header>
-          <span className="font-semibold color-gray-medium mr-4">Long Tasks</span>
-          <div className="flex items-center">
-            <Input
-              className="input-small mr-3"
-              style={{ width: "350px" }}
-              placeholder="Filter by Context or Container Type/Id/Src"
-              icon="search"
-              iconPosition="left"
-              name="filter"
-              onChange={ this.onFilterChange }
-            />
-            <QuestionMarkHint
-              content={
-                <>
-                  <a className="color-teal underline mr-2" target="_blank" href="https://developer.mozilla.org/en-US/docs/Web/API/Long_Tasks_API">Learn more </a>
-                  about Long Tasks API
-                </>
-              }
-              // className="mr-4"
-            />
-          </div>
-        </BottomBlock.Header>
-        <BottomBlock.Content>
-          <NoContent
-            size="small"
-            title="No recordings found"
-            show={ filtered.length === 0}
-          >
-            <TimeTable
-              rows={ filtered }
-              onRowClick={ this.jump }
-              hoverable
-              activeIndex={lastIndex}
-            >
-              {[
-                {
-                  label: "Context",
-                  render: renderContext,
-                  width: 140,
-                }, {
-                  label: "Container Type",
-                  width: 110,
-                  render: renderContainerType,
-                },
-                // {
-                //   label: "ID",
-                //   width: 70,
-                //   dataKey: "containerId"
-                // }, {
-                //   label: "Name",
-                //   width: 70,
-                //   dataKey: "containerName"
-                // }, {
-                //   label: "SRC",
-                //   width: 70,
-                //   dataKey: "containerSrc"
-                // },
-                {
-                  label: "Duration",
-                  width: 100,
-                  render: renderDuration,
-                }
-              ]}
-            </TimeTable>
-          </NoContent>
-        </BottomBlock.Content>
-      </BottomBlock>
-    );
-  }
-}
diff --git a/frontend/app/components/Session_/LongTasks/index.js b/frontend/app/components/Session_/LongTasks/index.js
deleted file mode 100644
index ace8262a0..000000000
--- a/frontend/app/components/Session_/LongTasks/index.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from './LongTasks.DEPRECATED';
diff --git a/frontend/app/duck/components/player.js b/frontend/app/duck/components/player.js
index 550f6e4df..e3b39bf52 100644
--- a/frontend/app/duck/components/player.js
+++ b/frontend/app/duck/components/player.js
@@ -10,7 +10,6 @@ export const PERFORMANCE = 6;
 export const GRAPHQL = 7;
 export const FETCH = 8;
 export const EXCEPTIONS = 9;
-export const LONGTASKS = 10;
 export const INSPECTOR = 11;
 export const OVERVIEW = 12;