shakebug-react-native 2.4.9 → 2.4.10

package/ios/TrimVideo/VideoTrimmerThumb.swift

@@ -0,0 +1,119 @@
+//
+//  VideoTrimmerThumb.swift
+//  Shakebug
+//
+//  Created by ideveloper2 on 26/04/24.
+//  Copyright © 2024 Facebook. All rights reserved.
+//
+
+import UIKit
+
+@available(iOS 13.0, *)
+class VideoTrimmerThumb: UIView {
+    var isActive = false
+
+    var leadingChevronImageView = UIImageView(image: UIImage(systemName: "chevron.compact.left"))
+    var trailingChevronView = UIImageView(image: UIImage(systemName: "chevron.compact.right"))
+
+    var wrapperView = UIView()
+    var leadingView = UIView()
+    var trailingView = UIView()
+    var topView = UIView()
+    var bottomView = UIView()
+
+    let leadingGrabber = UIControl()
+    let trailingGrabber = UIControl()
+
+    let chevronWidth = CGFloat(16)
+    let edgeHeight = CGFloat(4)
+
+    // MARK: - Input
+    @objc private func x(_ sender: Any) {
+
+    }
+
+    // MARK: - Private
+    private func updateColor() {
+        let color = UIColor.systemYellow
+        leadingView.backgroundColor = color
+        trailingView.backgroundColor = color
+        topView.backgroundColor = color
+        bottomView.backgroundColor = color
+    }
+
+    private func setup() {
+
+        leadingChevronImageView.contentMode = .scaleAspectFill
+        trailingChevronView.contentMode = .scaleAspectFill
+
+        leadingChevronImageView.tintColor = .white
+        trailingChevronView.tintColor = .white
+
+        leadingChevronImageView.tintAdjustmentMode = .normal
+        trailingChevronView.tintAdjustmentMode = .normal
+
+        leadingView.layer.cornerRadius = 6
+        leadingView.layer.cornerCurve = .continuous
+        leadingView.layer.maskedCorners = [.layerMinXMaxYCorner, .layerMinXMinYCorner]
+
+        trailingView.layer.cornerRadius = 6
+        trailingView.layer.cornerCurve = .continuous
+        trailingView.layer.maskedCorners = [.layerMaxXMaxYCorner, .layerMaxXMinYCorner]
+
+        leadingView.addSubview(leadingChevronImageView)
+        trailingView.addSubview(trailingChevronView)
+
+        //        wrapperView.layer.shadowColor = UIColor.black.cgColor
+        //        wrapperView.layer.shadowOffset = .zero
+        //        wrapperView.layer.shadowRadius = 2
+        //        wrapperView.layer.shadowOpacity = 0.25
+
+        wrapperView.addSubview(leadingView)
+        wrapperView.addSubview(trailingView)
+        wrapperView.addSubview(topView)
+        wrapperView.addSubview(bottomView)
+        addSubview(wrapperView)
+
+        wrapperView.addSubview(leadingGrabber)
+        wrapperView.addSubview(trailingGrabber)
+
+        updateColor()
+    }
+
+
+
+    // MARK: - UIView
+
+    override func layoutSubviews() {
+        super.layoutSubviews()
+
+        let size = bounds.size
+
+        wrapperView.frame = CGRect(origin: .zero, size: size)
+
+        leadingView.frame = CGRect(x: 0, y: 0, width: chevronWidth, height: bounds.height)
+        trailingView.frame = CGRect(x: bounds.width - chevronWidth, y: 0, width: chevronWidth, height: bounds.height)
+        topView.frame = CGRect(x: chevronWidth, y: 0, width: bounds.width - chevronWidth * 2, height: edgeHeight)
+        bottomView.frame = CGRect(x: chevronWidth, y: bounds.height - edgeHeight, width: bounds.width - chevronWidth * 2, height: edgeHeight)
+
+        let chevronHorizontalInset = CGFloat(2)
+        let chevronVerticalInset = CGFloat(8)
+        let chevronFrame = CGRect(x: chevronHorizontalInset, y: chevronVerticalInset, width: chevronWidth - chevronHorizontalInset * 2, height: size.height - chevronVerticalInset * 2)
+
+        leadingChevronImageView.frame = chevronFrame
+        trailingChevronView.frame = chevronFrame
+
+        leadingGrabber.frame = leadingView.frame
+        trailingGrabber.frame = trailingView.frame
+    }
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        setup()
+    }
+
+    required init?(coder: NSCoder) {
+        super.init(coder: coder)
+        setup()
+    }
+}

package/ios/TrimVideo/VideoTrimmerViewController.swift

@@ -0,0 +1,322 @@
+//
+//  VideoTrimmerViewController.swift
+//  Shakebug
+//
+//  Created by ideveloper2 on 26/04/24.
+//  Copyright © 2024 Facebook. All rights reserved.
+//
+
+import UIKit
+import AVKit
+
+extension CMTime {
+    var displayString: String {
+        let offset = TimeInterval(seconds)
+        let numberOfNanosecondsFloat = (offset - TimeInterval(Int(offset))) * 1000.0
+        let nanoseconds = Int(numberOfNanosecondsFloat)
+        let formatter = DateComponentsFormatter()
+        formatter.unitsStyle = .positional
+        formatter.zeroFormattingBehavior = .pad
+        formatter.allowedUnits = [.minute, .second]
+        return String(format: "%@.%03d", formatter.string(from: offset) ?? "00:00", nanoseconds)
+    }
+}
+
+extension AVAsset {
+    var fullRange: CMTimeRange {
+        return CMTimeRange(start: .zero, duration: duration)
+    }
+    func trimmedComposition(_ range: CMTimeRange) -> AVAsset {
+        guard CMTimeRangeEqual(fullRange, range) == false else {return self}
+        
+        let composition = AVMutableComposition()
+        try? composition.insertTimeRange(range, of: self, at: .zero)
+        
+        if let videoTrack = tracks(withMediaType: .video).first {
+            composition.tracks.forEach {$0.preferredTransform = videoTrack.preferredTransform}
+        }
+        return composition
+    }
+}
+
+@available(iOS 13.0, *)
+class VideoTrimmerViewController: UIViewController {
+    var asset: AVAsset!
+    var maximumDuration: Int?
+    var minimumDuration: Int?
+    var cancelBtnText = "Cancel"
+    var saveButtonText = "Save"
+    var cancelBtnClicked: (() -> Void)?
+    var saveBtnClicked: ((CMTimeRange) -> Void)?
+    
+    let playerController = AVPlayerViewController()
+    var trimmer: VideoTrimmer!
+    var timingStackView: UIStackView!
+    var leadingTrimLabel: UILabel!
+    var currentTimeLabel: UILabel!
+    var trailingTrimLabel: UILabel!
+    
+    private var btnStackView: UIStackView!
+    private var cancelBtn: UIButton!
+    private var playBtn: UIButton!
+    private var saveBtn: UIButton!
+    private let playIcon = UIImage(systemName: "play.fill")
+    private let pauseIcon = UIImage(systemName: "pause.fill")
+    
+    private var wasPlaying = false
+    private var player: AVPlayer! {playerController.player}
+    private var timeObserverToken: Any?
+    
+    
+    // MARK: - Input
+    @objc private func didBeginTrimming(_ sender: VideoTrimmer) {
+        updateLabels()
+        
+        wasPlaying = (player.timeControlStatus != .paused)
+        player.pause()
+        
+        updatePlayerAsset()
+    }
+    
+    @objc private func didEndTrimming(_ sender: VideoTrimmer) {
+        updateLabels()
+        
+        updatePlayerAsset()
+        
+        if wasPlaying == true {
+            player.play()
+        }
+    }
+    
+    @objc private func selectedRangeDidChanged(_ sender: VideoTrimmer) {
+        updateLabels()
+        if trimmer.trimmingState == .leading {
+            player.seek(to: trimmer.selectedRange.start, toleranceBefore: .zero, toleranceAfter: .zero)
+        } else if trimmer.trimmingState == .trailing {
+            player.seek(to: trimmer.selectedRange.end, toleranceBefore: .zero, toleranceAfter: .zero)
+        }
+    }
+    
+    @objc private func didBeginScrubbing(_ sender: VideoTrimmer) {
+        updateLabels()
+        
+        wasPlaying = (player.timeControlStatus != .paused)
+        player.pause()
+    }
+    
+    @objc private func didEndScrubbing(_ sender: VideoTrimmer) {
+        updateLabels()
+        
+        if wasPlaying == true {
+            player.play()
+        }
+    }
+    
+    @objc private func progressDidChanged(_ sender: VideoTrimmer) {
+        updateLabels()
+        
+        player.seek(to: trimmer.progress, toleranceBefore: .zero, toleranceAfter: .zero)
+    }
+    
+    // MARK: - Private
+    private func updateLabels() {
+        leadingTrimLabel.text = trimmer.selectedRange.start.displayString
+        currentTimeLabel.text = trimmer.progress.displayString
+        trailingTrimLabel.text = trimmer.selectedRange.end.displayString
+    }
+    
+    private func updatePlayerAsset() {
+        if player.currentItem == nil {
+            let item = AVPlayerItem(asset: asset)
+            player.replaceCurrentItem(with: item)
+        }
+        
+        if trimmer.trimmingState == .none {
+            player.currentItem?.forwardPlaybackEndTime = trimmer.selectedRange.end
+            
+            let currentTime = player.currentTime().seconds
+            let endTime = trimmer.selectedRange.end.seconds
+            let startTime = trimmer.selectedRange.start.seconds
+            
+            if currentTime < startTime || currentTime >= endTime - 0.05 {
+                player.seek(to: trimmer.selectedRange.start, toleranceBefore: .zero, toleranceAfter: .zero)
+            }
+        } else {
+            player.currentItem?.forwardPlaybackEndTime = .invalid
+        }
+    }
+    
+    // MARK: - UIViewController
+    override func viewDidLoad() {
+        super.viewDidLoad()
+        
+        view.backgroundColor = .black
+        
+        // bottom action buttons
+        cancelBtn = UIButton(type: .system)
+        cancelBtn.setTitle(cancelBtnText, for: .normal)
+        cancelBtn.titleLabel?.font = .systemFont(ofSize: 18)
+        cancelBtn.setTitleColor(.white, for: .normal)
+        cancelBtn.addTarget(self, action: #selector(onCancelBtnClicked), for: .touchUpInside)
+        
+        
+        playBtn = UIButton(type: .system)
+        playBtn.setImage(playIcon, for: .normal)
+        playBtn.tintColor = .systemBlue
+        playBtn.addTarget(self, action: #selector(togglePlay(sender:)), for: .touchUpInside)
+        
+        saveBtn = UIButton(type: .system)
+        saveBtn.setTitle(saveButtonText, for: .normal)
+        saveBtn.titleLabel?.font = .systemFont(ofSize: 18)
+        saveBtn.setTitleColor(.systemBlue, for: .normal)
+        saveBtn.addTarget(self, action: #selector(onSaveBtnClicked), for: .touchUpInside)
+        
+        btnStackView = UIStackView(arrangedSubviews: [cancelBtn, playBtn, saveBtn])
+        btnStackView.axis = .horizontal
+        btnStackView.alignment = .fill
+        btnStackView.distribution = .fillEqually
+        btnStackView.spacing = UIStackView.spacingUseSystem
+        view.addSubview(btnStackView)
+        btnStackView.translatesAutoresizingMaskIntoConstraints = false
+        NSLayoutConstraint.activate([
+            btnStackView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: 16),
+            btnStackView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: -16),
+            btnStackView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor, constant: -16),
+        ])
+        
+        // time labels
+        leadingTrimLabel = UILabel()
+        leadingTrimLabel.font = UIFont.preferredFont(forTextStyle: .caption1)
+        leadingTrimLabel.textAlignment = .left
+        leadingTrimLabel.textColor = .white
+        
+        currentTimeLabel = UILabel()
+        currentTimeLabel.font = UIFont.preferredFont(forTextStyle: .caption1)
+        currentTimeLabel.textAlignment = .center
+        currentTimeLabel.textColor = .white
+        
+        trailingTrimLabel = UILabel()
+        trailingTrimLabel.font = UIFont.preferredFont(forTextStyle: .caption1)
+        trailingTrimLabel.textAlignment = .right
+        trailingTrimLabel.textColor = .white
+        
+        timingStackView = UIStackView(arrangedSubviews: [leadingTrimLabel, currentTimeLabel, trailingTrimLabel])
+        timingStackView.axis = .horizontal
+        timingStackView.alignment = .fill
+        timingStackView.distribution = .fillEqually
+        timingStackView.spacing = UIStackView.spacingUseSystem
+        view.addSubview(timingStackView)
+        timingStackView.translatesAutoresizingMaskIntoConstraints = false
+        NSLayoutConstraint.activate([
+            timingStackView.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor, constant: 16),
+            timingStackView.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor, constant: -16),
+            timingStackView.bottomAnchor.constraint(equalTo: btnStackView.topAnchor, constant: -8),
+        ])
+        
+        // THIS IS WHERE WE SETUP THE VIDEOTRIMMER:
+        trimmer = VideoTrimmer()
+        trimmer.asset = asset // this should happen before trimmer.selectedRange below otherwise its didSet will override
+        trimmer.minimumDuration = CMTime(seconds: 1, preferredTimescale: 600)
+        
+        if maximumDuration != nil {
+            trimmer.maximumDuration = CMTime(seconds: max(1, Double(maximumDuration!)), preferredTimescale: 600) // minimum 1 second
+            
+            // guard check to make sure max duration can only <= asset.duration
+            if CMTimeCompare(trimmer.maximumDuration, asset.duration) == 1 {
+                trimmer.maximumDuration = asset.duration
+            }
+            
+            trimmer.selectedRange = CMTimeRange(start: .zero, end: trimmer.maximumDuration)
+        }
+
+        if minimumDuration != nil {
+            trimmer.minimumDuration = CMTime(seconds: max(1, Double(minimumDuration!)), preferredTimescale: 600) // minimum 1 second
+        }
+        
+        trimmer.addTarget(self, action: #selector(didBeginTrimming(_:)), for: VideoTrimmer.didBeginTrimming)
+        trimmer.addTarget(self, action: #selector(didEndTrimming(_:)), for: VideoTrimmer.didEndTrimming)
+        trimmer.addTarget(self, action: #selector(selectedRangeDidChanged(_:)), for: VideoTrimmer.selectedRangeChanged)
+        trimmer.addTarget(self, action: #selector(didBeginScrubbing(_:)), for: VideoTrimmer.didBeginScrubbing)
+        trimmer.addTarget(self, action: #selector(didEndScrubbing(_:)), for: VideoTrimmer.didEndScrubbing)
+        trimmer.addTarget(self, action: #selector(progressDidChanged(_:)), for: VideoTrimmer.progressChanged)
+        view.addSubview(trimmer)
+        trimmer.translatesAutoresizingMaskIntoConstraints = false
+        NSLayoutConstraint.activate([
+            trimmer.leadingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.leadingAnchor),
+            trimmer.trailingAnchor.constraint(equalTo: view.safeAreaLayoutGuide.trailingAnchor),
+            trimmer.bottomAnchor.constraint(equalTo: timingStackView.topAnchor, constant: -16),
+            trimmer.heightAnchor.constraint(equalToConstant: 50),
+        ])
+        
+        playerController.showsPlaybackControls = false // hide control buttons
+        if #available(iOS 16.0, *) {
+            playerController.allowsVideoFrameAnalysis = false // hide live text
+        }
+        playerController.player = AVPlayer()
+        try? AVAudioSession.sharedInstance().setCategory(.playback, mode: .default, options: []) // this is to play audio even when device is in silent mode
+        addChild(playerController)
+        view.addSubview(playerController.view)
+        playerController.view.translatesAutoresizingMaskIntoConstraints = false
+        NSLayoutConstraint.activate([
+            playerController.view.leadingAnchor.constraint(equalTo: view.leadingAnchor),
+            playerController.view.trailingAnchor.constraint(equalTo: view.trailingAnchor),
+            playerController.view.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
+            playerController.view.bottomAnchor.constraint(equalTo: trimmer.topAnchor, constant: -16)
+        ])
+        
+        updatePlayerAsset()
+        
+        timeObserverToken = player.addPeriodicTimeObserver(forInterval: CMTime(value: 1, timescale: 30), queue: .main) { [weak self] time in
+            guard let self = self else {return}
+
+            self.currentTimeLabel.text = time.displayString
+            self.trimmer.progress = time
+            
+            if self.player.timeControlStatus == .playing {
+                self.playBtn.setImage(self.pauseIcon, for: .normal)
+            } else {
+                self.playBtn.setImage(self.playIcon, for: .normal)
+            }
+        }
+        
+        updateLabels()
+    }
+    
+    override func viewWillDisappear(_ animated: Bool) {
+        super.viewWillDisappear(animated)
+        
+        player.pause()
+        if timeObserverToken != nil {
+            player.removeTimeObserver(timeObserverToken as Any)
+            timeObserverToken = nil
+        }
+        playerController.player  = nil
+        playerController.dismiss(animated: false, completion: nil)
+    }
+    
+    @objc private func togglePlay(sender: UIButton) {
+        if player.timeControlStatus == .playing {
+            player.pause()
+        } else {
+            let currentTime = player.currentTime().seconds
+            let endTime = trimmer.selectedRange.end.seconds
+            let startTime = trimmer.selectedRange.start.seconds
+            
+            if currentTime >= endTime - 0.05 || currentTime < startTime {
+                player.seek(to: trimmer.selectedRange.start, toleranceBefore: .zero, toleranceAfter: .zero) { _ in
+                    self.player.play()
+                }
+            } else {
+                player.play()
+            }
+        }
+    }
+    
+    @objc func onSaveBtnClicked() {
+        saveBtnClicked?(trimmer.selectedRange)
+    }
+    
+    @objc func onCancelBtnClicked() {
+        cancelBtnClicked?()
+    }
+}

package/ios/VideoPlayer/VideoPlayerModule.m

@@ -2,24 +2,40 @@
 //  VideoPlayerModule.m
 //  Shakebug
 //
-//  Created by ideveloper2 on 23/04/24.
-//  Copyright © 2024 Facebook. All rights reserved.
-//
 
 #import "VideoPlayerModule.h"
 #import <React/RCTLog.h>
+#import <React/RCTUtils.h>
 
 @implementation ShakebugSDKVideoPlayerModule
 
-RCT_EXPORT_MODULE();
+RCT_EXPORT_MODULE(ShakebugSDKVideoPlayerModule);
+
++ (BOOL)requiresMainQueueSetup {
+    return YES;
+}
 
 RCT_EXPORT_METHOD(playVideo:(NSString *)videoURLString) {
-    NSURL *videoURL = [NSURL URLWithString:videoURLString];
+    if (!videoURLString || videoURLString.length == 0) {
+        RCTLogError(@"Invalid video URL");
+        return;
+    }
+
+    NSURL *videoURL;
+    if ([videoURLString hasPrefix:@"http://"] || [videoURLString hasPrefix:@"https://"]) {
+        videoURL = [NSURL URLWithString:videoURLString];
+    } else {
+        NSString *cleanPath = [videoURLString stringByReplacingOccurrencesOfString:@"file://" withString:@""];
+        videoURL = [NSURL fileURLWithPath:cleanPath];
+    }
+
     if (videoURL) {
         dispatch_async(dispatch_get_main_queue(), ^{
             ShakebugSDKVideoPlayerViewController *videoPlayerVC = [[ShakebugSDKVideoPlayerViewController alloc] initWithVideoURL:videoURL];
-            UIViewController *rootViewController = [[[[UIApplication sharedApplication] delegate] window] rootViewController];
-            [rootViewController presentViewController:videoPlayerVC animated:YES completion:nil];
+            UIViewController *rootViewController = RCTPresentedViewController();
+            if (rootViewController) {
+                [rootViewController presentViewController:videoPlayerVC animated:YES completion:nil];
+            }
         });
     } else {
         RCTLogError(@"Invalid video URL");

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "shakebug-react-native",
   "title": "shakebug-react-native",
-  "version": "2.4.9",
+  "version": "2.4.10",
   "description": "Shakebug allows users to report the bug from your mobile phone for your application. Here users just need to shake their mobile and all the data regarding bugs & crashes can be seen by developers through their log in panel easily",
   "main": "src/index.tsx",
   "types": "src/index.tsx",

package/src/Componanats/LoadingModal.js

@@ -0,0 +1,59 @@
+import React from 'react';
+import { View, ActivityIndicator, StyleSheet, Text } from 'react-native';
+
+const LoadingModal = ({ visible, color = '#1dd3e3', text = '' }) => {
+  if (!visible) return null;
+
+  return (
+    <View style={styles.overlay} pointerEvents="auto">
+      <View style={styles.backdrop} />
+      <View style={styles.indicatorContainer}>
+        <ActivityIndicator size="large" color={color} />
+        {text ? <Text style={styles.text}>{text}</Text> : null}
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  overlay: {
+    position: 'absolute',
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+    zIndex: 99999,
+    elevation: 999,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  backdrop: {
+    position: 'absolute',
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+    backgroundColor: 'rgba(0, 0, 0, 0.65)',
+  },
+  indicatorContainer: {
+    padding: 24,
+    backgroundColor: '#ffffff',
+    borderRadius: 16,
+    alignItems: 'center',
+    justifyContent: 'center',
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 4 },
+    shadowOpacity: 0.35,
+    shadowRadius: 8,
+    elevation: 10,
+    zIndex: 100000,
+  },
+  text: {
+    marginTop: 12,
+    fontSize: 14,
+    color: '#333333',
+    fontWeight: '500',
+  },
+});
+
+export default LoadingModal;

package/src/Componanats/ShakeFunction.js

@@ -13,6 +13,7 @@ console.ignoredYellowBox = ["Warning: Each", "Warning: Failed", "Possible", "WAR
 import { logger, consoleTransport } from "react-native-logs";
 import { ActivityIndicator } from 'react-native';
 import { useGlobalState } from './GlobalStateContext';
+import LoadingModal from './LoadingModal';
 
 LogBox.ignoreAllLogs()
 
@@ -523,16 +524,7 @@ const ShakeFunction = ({ children, themeColor, showTutorialScreen, SDKScreenTitl
 
       </ShakebugCapture>
 
-      {isLoading &&
-        <View
-          style={{
-            ...StyleSheet.absoluteFillObject,
-            backgroundColor: 'rgba(0, 0, 0, 0.4)',
-          }}
-        />
-      }
-
-      {isLoading && <ActivityIndicator size={'large'} color={themeColor} collapsable={true} style={{ position: 'absolute', top: 0, bottom: 0, left: 0, right: 0, elevation: 2 }} />}
+      <LoadingModal visible={isLoading} color={themeColor} />
       {isShow ? (
         <Animated.View
           {...panResponder.panHandlers}