1 files changed, 11 insertions, 6 deletions
diff --git a/src/components/moments/trimmer.tsx b/src/components/moments/trimmer.tsx
index 3c5c4980..2dae23f7 100644
--- a/src/components/moments/trimmer.tsx
+++ b/src/components/moments/trimmer.tsx
@@ -2,13 +2,15 @@ import React, {useEffect, useState} from 'react';
 import Video from 'react-native-video';
 import {Trimmer} from 'react-native-video-processing';
 import {useRef} from 'react';
+import {SCREEN_WIDTH} from '../../utils';
 
 export const TrimmerPlayer: React.FC<{
   source: string;
   videoStyles: Object;
   hideTrimmer: boolean;
   handleLoad: Function;
-}> = ({source, videoStyles, hideTrimmer, handleLoad}) => {
+  onChangedEndpoints: Function;
+}> = ({source, videoStyles, hideTrimmer, handleLoad, onChangedEndpoints}) => {
   const playerRef = useRef<Video>();
 
   const [seekTime, setSeekTime] = useState<number>(0);
@@ -29,13 +31,15 @@ export const TrimmerPlayer: React.FC<{
   const [start, setStart] = useState<number>(0);
   useEffect(() => {
     setSeekTime(start);
-    setTrackerTime(start);
+    setTrackerTime(start - 0.05);
   }, [start]);
   useEffect(() => {
     setSeekTime(end);
-    setTrackerTime(end - 0.1);
+    setTrackerTime(end - 0.125);
   }, [end]);
 
+  useEffect(() => onChangedEndpoints({end, start}), [end, start]);
+
   return (
     <>
       <Video
@@ -69,8 +73,9 @@ export const TrimmerPlayer: React.FC<{
       <Trimmer
         source={source}
         height={hideTrimmer ? 0 : 75}
-        width={hideTrimmer ? 0 : 350} // replace w screen width
-        onTrackerMove={(e) => {
+        width={hideTrimmer ? 0 : SCREEN_WIDTH}
+        borderWidth={hideTrimmer ? 0 : 100}
+        onTrackerMove={(e: {currentTime: number}) => {
           setPaused(true);
           setSeekTime(e.currentTime);
         }} // iOS only
@@ -79,7 +84,7 @@ export const TrimmerPlayer: React.FC<{
         // showTrackerHandle={true}
         thumbWidth={10} // iOS only
         trackerColor={'white'} // iOS only
-        onChange={(e: Object) => {
+        onChange={(e: {endTime: number; startTime: number}) => {
           setPaused(true);
           setEnd(e.endTime);
           setStart(e.startTime);