From d566663343d0b45fd6851bf6bf3aef9b03bfb11c Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Fri, 15 Apr 2022 15:11:50 +0200
Subject: [PATCH] change(ui) - jump on drag

---
 .../app/components/Session_/Player/Controls/Circle.tsx |  2 --
 .../components/Session_/Player/Controls/Timeline.js    | 10 +++-------
 2 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/frontend/app/components/Session_/Player/Controls/Circle.tsx b/frontend/app/components/Session_/Player/Controls/Circle.tsx
index b49d23216..76740c73e 100644
--- a/frontend/app/components/Session_/Player/Controls/Circle.tsx
+++ b/frontend/app/components/Session_/Player/Controls/Circle.tsx
@@ -5,11 +5,9 @@ interface Props {
     preview?: boolean;
 }
 export const Circle: FC<Props> = memo(function Box({ preview }) {
-    // const backgroundColor = yellow ? 'yellow' : 'white'
     return (
         <div
             className={ styles.positionTracker }
-            // style={ { left: `${ time * scale }%` } }
             role={preview ? 'BoxPreview' : 'Box'}
         />
     )
diff --git a/frontend/app/components/Session_/Player/Controls/Timeline.js b/frontend/app/components/Session_/Player/Controls/Timeline.js
index c22f5463e..69b228d7d 100644
--- a/frontend/app/components/Session_/Player/Controls/Timeline.js
+++ b/frontend/app/components/Session_/Player/Controls/Timeline.js
@@ -77,8 +77,6 @@ const getPointerIcon = (type) => {
 }), { setTimelinePointer })
 export default class Timeline extends React.PureComponent {
   progressRef = React.createRef()
-  progressWidth = 0
-  seekTime = 0
   wasPlaying = false
 
   seekProgress = (e) => {
@@ -95,9 +93,8 @@ export default class Timeline extends React.PureComponent {
   }
 
   componentDidMount() {
-    const { issues, events, fetchList, skipToIssue } = this.props;
+    const { issues, skipToIssue } = this.props;
     const firstIssue = issues.get(0);
-    this.progressWidth = this.progressRef.current.offsetWidth;
 
     if (firstIssue && skipToIssue) {
       this.props.jump(firstIssue.time);
@@ -105,7 +102,6 @@ export default class Timeline extends React.PureComponent {
   }
 
   onDragEnd = (item, monitor) => {
-    this.props.jump(this.seekTime);
     if (this.wasPlaying) {
       this.props.togglePlay();
     }
@@ -116,7 +112,7 @@ export default class Timeline extends React.PureComponent {
 
     const p = (offset.x - 60) / this.progressRef.current.offsetWidth;
     const time = Math.max(Math.round(p * endTime), 0);
-    this.seekTime = time;
+    this.props.jump(time);
     if (this.props.playing) {
       this.wasPlaying = true;
       this.props.pause();
@@ -137,7 +133,7 @@ export default class Timeline extends React.PureComponent {
       clickRageTime,
       stackList,
       fetchList,
-      issues
+      issues,
     } = this.props;
 
     const scale = 100 / endTime;