rn-videofeed 0.1.0

package/ios/VideoFeedCell.swift

@@ -0,0 +1,117 @@
+//
+//  VideoFeedCell.swift
+//  App
+//
+//  Created by Venkatesh Mandapati on 15/05/2025.
+//
+
+import UIKit
+import SDWebImage
+
+class VideoFeedCell: UICollectionViewCell {
+
+  let feedPlayer = FeedPlayer()
+
+  private let thumbnailImageView: UIImageView = {
+    let iv = UIImageView()
+    iv.contentMode = .scaleAspectFit
+    iv.clipsToBounds = true
+    return iv
+  }()
+  
+  override init(frame: CGRect) {
+    super.init(frame: frame)
+    contentView.backgroundColor = .black
+
+    contentView.addSubview(thumbnailImageView)
+    thumbnailImageView.translatesAutoresizingMaskIntoConstraints = false
+    NSLayoutConstraint.activate([
+      thumbnailImageView.topAnchor.constraint(equalTo: contentView.topAnchor),
+      thumbnailImageView.bottomAnchor.constraint(
+        equalTo: contentView.bottomAnchor),
+      thumbnailImageView.leadingAnchor.constraint(
+        equalTo: contentView.leadingAnchor),
+      thumbnailImageView.trailingAnchor.constraint(
+        equalTo: contentView.trailingAnchor),
+    ])
+
+    contentView.addSubview(feedPlayer)
+    feedPlayer.translatesAutoresizingMaskIntoConstraints = false
+    NSLayoutConstraint.activate([
+      feedPlayer.topAnchor.constraint(equalTo: contentView.topAnchor),
+      feedPlayer.bottomAnchor.constraint(equalTo: contentView.bottomAnchor),
+      feedPlayer.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
+      feedPlayer.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
+    ])
+  }
+
+  required init?(coder: NSCoder) {
+    fatalError("init(coder:) has not been implemented")
+  }
+
+  func configure(with video: VideoData) {
+    // Show and start animation while loading
+
+    thumbnailImageView.sd_setImage(
+      with: URL(string: video.thumbnailUrl ?? ""),
+      placeholderImage: nil,
+      options: [],
+      completed: nil
+    )
+
+    feedPlayer.videoUrl = video.videoUrl as NSString
+    feedPlayer.id = video.id as NSString
+    feedPlayer.isVisible = false
+    
+    // Set callback to hide thumbnail when video actually starts playing
+    feedPlayer.onVideoStartedPlaying = { [weak self] in
+      self?.showVideoPlaying()
+    }
+
+    thumbnailImageView.isHidden = false
+  }
+
+  func showVideoPlaying() {
+    // Hide thumbnail when video is visible
+    thumbnailImageView.isHidden = true
+  }
+
+  override func prepareForReuse() {
+    super.prepareForReuse()
+
+    feedPlayer.reset()
+    feedPlayer.isVisible = false
+    feedPlayer.onVideoStartedPlaying = nil // Clear callback
+
+    thumbnailImageView.image = nil
+    thumbnailImageView.isHidden = false
+
+  }
+  
+  
+  // Implement delegate methods to handle taps and communicate with RN side or native controller
+//  func didTapOptions() {
+//    // Show action sheet for delete/save video here
+//  }
+//
+//  func didTapMuteToggle() {
+//    // Mute/unmute toggle logic here
+//  }
+//
+//  func didTapFlag() {
+//    // Show report bottom sheet logic here
+//  }
+//
+//  func didTapViewCount() {
+//    // Show view count bottom sheet
+//  }
+//
+//  func didTapTradingVolume() {
+//    // Show trading volume bottom sheet
+//  }
+//
+//  func didTapShare() {
+//    // Trigger share logic
+//  }
+
+}

package/ios/VideoFeedEventEmitter.swift

@@ -0,0 +1,24 @@
+//
+//  VideoFeedEventEmitter.swift
+//  App
+//
+//  Created by Venkatesh Mandapati on 15/05/2025.
+//
+
+import Foundation
+import React
+
+@objc(VideoFeedEventEmitter)
+class VideoFeedEventEmitter: RCTEventEmitter {
+    override func supportedEvents() -> [String]! {
+        return ["onEndReached", "onVideoChange", "onVideoTapped", "onPlayStateChanged"]
+    }
+    
+    override static func requiresMainQueueSetup() -> Bool {
+        return true
+    }
+    
+    @objc func sendEvent(_ event: String, body: Any?) {
+        sendEvent(withName: event, body: body)
+    }
+}

package/ios/VideoFeedManagerBridge.h

@@ -0,0 +1,17 @@
+//
+//  VideoFeedManagerBridge.h
+//  App
+//
+//  Created by Venkatesh Mandapati on 24/07/2025.
+//
+
+#ifndef VideoFeedManagerBridge_h
+#define VideoFeedManagerBridge_h
+
+#import <React/RCTViewManager.h>
+#import <React/RCTBridgeModule.h>
+
+@interface VideoFeedViewManager : RCTViewManager
+@end
+
+#endif /* VideoFeedManagerBridge_h */

package/ios/VideoFeedManagerBridge.m

@@ -0,0 +1,31 @@
+//
+//  VideoFeedManagerBridge.m
+//  App
+//
+//  Created by Venkatesh Mandapati on 16/05/2025.
+//
+
+#import <React/RCTViewManager.h>
+#import <React/RCTBridgeModule.h>
+#import <React/RCTUIManager.h>
+#import <React/RCTEventEmitter.h>
+
+@interface RCT_EXTERN_MODULE(VideoFeedViewManager, RCTViewManager)
+
+RCT_EXTERN_METHOD(setVideos:(nonnull NSNumber *)reactTag videos:(NSArray *)videos)
+RCT_EXTERN_METHOD(appendVideos:(nonnull NSNumber *)reactTag videos:(NSArray *)videos)
+RCT_EXTERN_METHOD(setFeedActive:(nonnull NSNumber *)reactTag isActive:(BOOL)active)
+
+RCT_EXTERN_METHOD(pauseVideo:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(playVideo:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(togglePlayPause:(nonnull NSNumber *)reactTag)
+RCT_EXTERN_METHOD(isVideoPlaying:(nonnull NSNumber *)reactTag)
+
+RCT_EXTERN_METHOD(addEventListener:(NSString *)eventName)
+RCT_EXTERN_METHOD(removeEventListener:(NSString *)eventName)
+
+@end
+
+// Event Emitter for video feed events
+@interface RCT_EXTERN_MODULE(VideoFeedEventEmitter, RCTEventEmitter)
+@end

package/ios/VideoFeedView.swift

@@ -0,0 +1,432 @@
+//
+//  VideoFeedView.swift
+//  App
+//
+//  Created by Venkatesh Mandapati on 15/05/2025.
+//
+
+import AVFoundation
+import UIKit
+
+class VideoFeedView: UIView {
+  private var collectionView: UICollectionView!
+  private var videos: [VideoData] = []
+  private var currentPlayer: AVPlayer?
+  private var preloadTasks: [String: AVAsset] = [:]
+  private var feedIsActive = true
+  private var shouldPlayFirstVideo = false
+  private var isManuallyPaused = false // Track if user manually paused
+  weak var eventEmitter: VideoFeedEventEmitter?
+
+  var onEndReached: (() -> Void)?
+  var onVideoChange: ((String) -> Void)?
+
+  override init(frame: CGRect) {
+    super.init(frame: frame)
+    setupAppLifecycleObservers()
+    setupCollectionView()
+    setupTapGesture()
+  }
+
+  //Not required, only for storyboard or xib included
+  required init?(coder: NSCoder) {
+    fatalError("init(coder:) has not been implemented")
+  }
+
+  private func setupAppLifecycleObservers() {
+    NotificationCenter.default.addObserver(
+      self,
+      selector: #selector(appDidEnterBackground),
+      name: UIApplication.didEnterBackgroundNotification,
+      object: nil
+    )
+
+    NotificationCenter.default.addObserver(
+      self,
+      selector: #selector(appDidBecomeActive),
+      name: UIApplication.didBecomeActiveNotification,
+      object: nil
+    )
+  }
+
+  @objc private func appDidEnterBackground() {
+    currentPlayer?.pause()
+  }
+
+  @objc private func appDidBecomeActive() {
+    if feedIsActive && !isManuallyPaused {
+      currentPlayer?.play()
+    } else if isManuallyPaused {
+      print("App became active but video was manually paused — staying paused")
+    }
+  }
+
+  private func setupCollectionView() {
+    let layout = UICollectionViewFlowLayout()
+    layout.scrollDirection = .vertical
+    layout.minimumLineSpacing = 0
+    layout.minimumInteritemSpacing = 0
+    // Initial size - will be updated in layoutSubviews with correct bounds
+    layout.itemSize = CGSize(
+      width: UIScreen.main.bounds.width, height: UIScreen.main.bounds.height)
+
+    collectionView = UICollectionView(
+      frame: .zero, collectionViewLayout: layout)
+    collectionView.isPagingEnabled = true
+    collectionView.showsVerticalScrollIndicator = false
+    collectionView.backgroundColor = .black
+    collectionView.contentInsetAdjustmentBehavior = .never // Prevent safe area adjustments
+    collectionView.register(
+      VideoFeedCell.self, forCellWithReuseIdentifier: "VideoFeedCell")
+    collectionView.dataSource = self
+    collectionView.delegate = self
+    collectionView.prefetchDataSource = self
+
+    addSubview(collectionView)
+    collectionView.translatesAutoresizingMaskIntoConstraints = false
+    NSLayoutConstraint.activate([
+      collectionView.topAnchor.constraint(equalTo: topAnchor),
+      collectionView.bottomAnchor.constraint(equalTo: bottomAnchor),
+      collectionView.leadingAnchor.constraint(equalTo: leadingAnchor),
+      collectionView.trailingAnchor.constraint(equalTo: trailingAnchor),
+    ])
+
+  }
+
+  override func layoutSubviews() {
+    super.layoutSubviews()
+
+    // Update layout - use full screen bounds, not collectionView bounds which might include safe area
+    if let layout = collectionView.collectionViewLayout
+        as? UICollectionViewFlowLayout
+    {
+      // Use bounds.size to ensure full screen, accounting for any parent container constraints
+      let fullScreenSize = CGSize(
+        width: bounds.width,
+        height: bounds.height
+      )
+      layout.itemSize = fullScreenSize
+    }
+  }
+
+  func setVideos(_ videos: [[String: Any]]) {
+    self.videos = videos.compactMap { dict -> VideoData? in
+      guard let id = dict["id"] as? String,
+            let url = dict["videoUrl"] as? String
+      else {
+        print("Failed to map video data - missing id or url")
+        return nil
+      }
+      let thumbnail = dict["thumbnailUrl"] as? String
+      let viewCount: Int? = {
+        if let count = dict["viewCount"] as? Int {
+          return count
+        }
+        return nil
+      }()
+      return VideoData(
+        id: id, videoUrl: url, thumbnailUrl: thumbnail, viewCount: viewCount)
+    }
+    collectionView.reloadData()
+    preloadNextVideos()
+
+    // Set flag to play first video when cell becomes available
+    if !videos.isEmpty {
+      shouldPlayFirstVideo = true
+      print("Set shouldPlayFirstVideo flag to true")
+    }
+  }
+
+  func appendVideos(_ videos: [[String: Any]]) {
+    let newVideos = videos.compactMap { dict -> VideoData? in
+      guard let id = dict["id"] as? String,
+            let url = dict["videoUrl"] as? String
+      else { return nil }
+      let thumbnail = dict["thumbnailUrl"] as? String
+      let duration: Int? = {
+        if let duration = dict["viewCount"] as? Int {
+          return duration
+        }
+        return nil
+      }()
+      return VideoData(
+        id: id, videoUrl: url, thumbnailUrl: thumbnail, viewCount: duration)
+    }
+
+    let startIndex = self.videos.count
+    self.videos.append(contentsOf: newVideos)
+
+    // Insert new cells instead of reloading all
+    let indexPaths = (startIndex..<self.videos.count).map {
+      IndexPath(item: $0, section: 0)
+    }
+    collectionView.insertItems(at: indexPaths)
+    preloadNextVideos()
+  }
+
+  func setFeedActive(_ isActive: Bool) {
+    self.feedIsActive = isActive
+    
+    if isActive {
+      // When becoming active, try to play the current video
+      if !isManuallyPaused {
+        if let player = currentPlayer {
+          player.play()
+          eventEmitter?.sendEvent(withName: "onPlayStateChanged", body: ["isPlaying": true])
+        } else {
+          let currentIndex = getCurrentIndex()
+          if currentIndex >= 0 && currentIndex < videos.count {
+            playVideo(at: currentIndex)
+          }
+        }
+      } else {
+        print("setFeedActive: Video was manually paused, not resuming")
+      }
+    } else {
+      if let player = currentPlayer {
+        player.pause()
+      } else {
+        print("setFeedActive: No current player to pause")
+      }
+    }
+  }
+
+  private func preloadNextVideos() {
+    let visibleIndex = getCurrentIndex()
+    let start = visibleIndex + 1
+    let end = min(visibleIndex + 2, videos.count - 1)
+
+    guard start <= end else { return }  // avoid invalid range
+
+    let preloadRange = start...end
+    for index in preloadRange {
+      let video = videos[index]
+      guard preloadTasks[video.videoUrl] == nil,
+            let url = URL(string: video.videoUrl)
+      else { continue }
+
+      let asset = AVAsset(url: url)
+      preloadTasks[video.videoUrl] = asset
+
+      asset.loadValuesAsynchronously(forKeys: ["playable"]) { [weak self] in
+        DispatchQueue.main.async {
+          self?.preloadTasks[video.videoUrl] = nil
+        }
+      }
+    }
+  }
+
+  private func getCurrentIndex() -> Int {
+    let offset = collectionView.contentOffset.y
+    let height = collectionView.bounds.height
+
+    guard height > 0 else {
+      print("Warning: CollectionView height is 0")
+      return 0  // or some default/fallback index
+    }
+
+    return max(0, Int(round(offset / height)))
+  }
+
+  private func playVideo(at index: Int) {
+    print("Attempting to play video at index:", index)
+
+    guard feedIsActive else {
+      print("Feed inactive, skipping playVideo at index:", index)
+      return
+    }
+
+    guard index < videos.count else {
+      print("Index out of bounds:", index)
+      return
+    }
+    currentPlayer?.pause()
+    if let cell = collectionView.cellForItem(
+      at: IndexPath(item: index, section: 0)) as? VideoFeedCell
+    {
+      print("Found cell for index:", index)
+      currentPlayer = cell.feedPlayer.player
+      currentPlayer?.isMuted = false
+      
+      // Only play if not manually paused
+      if !isManuallyPaused {
+        currentPlayer?.play()
+        cell.feedPlayer.isVisible = true
+        // Don't hide thumbnail here - it will be hidden when video actually starts playing via callback
+        print("▶️ Auto-playing new video at index: \(index)")
+      } else {
+        cell.feedPlayer.isVisible = false
+        print("⏸️ New video at index: \(index) but staying paused (manually paused)")
+      }
+      
+      onVideoChange?(videos[index].id)
+    } else {
+      print("No cell found for index:", index)
+    }
+  }
+
+  // MARK: - Tap Gesture Setup
+  
+  private func setupTapGesture() {
+    let tapGesture = UITapGestureRecognizer(target: self, action: #selector(handleTap(_:)))
+    tapGesture.numberOfTapsRequired = 1
+    // Allow tap gesture to work alongside collection view gestures
+    tapGesture.cancelsTouchesInView = false
+    addGestureRecognizer(tapGesture)
+    print("🔥 Tap gesture recognizer added to VideoFeedView")
+  }
+  
+  @objc private func handleTap(_ gesture: UITapGestureRecognizer) {
+    print("🔥 Tap detected in native VideoFeedView")
+    
+    // Toggle play/pause and get the new state
+    let isNowPlaying = togglePlayPause()
+    
+    // Emit event to React Native for UI feedback
+    eventEmitter?.sendEvent("onVideoTapped", body: ["isPlaying": isNowPlaying])
+  }
+
+  // MARK: - Play/Pause Control Methods
+  
+  /// Gets the current visible index based on scroll position
+  private func getCurrentVisibleIndex() -> Int? {
+    let visibleIndexPaths = collectionView.indexPathsForVisibleItems
+    guard let firstVisibleIndexPath = visibleIndexPaths.first else { return nil }
+    return firstVisibleIndexPath.item
+  }
+  
+  /// Gets the current visible cell
+  private func getCurrentCell(at index: Int) -> VideoFeedCell? {
+    let indexPath = IndexPath(item: index, section: 0)
+    return collectionView.cellForItem(at: indexPath) as? VideoFeedCell
+  }
+  
+  /// Pauses the currently playing video
+  func pauseCurrentVideo() {
+    guard let currentIndex = getCurrentVisibleIndex(),
+          let cell = getCurrentCell(at: currentIndex) else {
+      print("Failed to get current video for pause")
+      return
+    }
+    
+    isManuallyPaused = true
+    cell.feedPlayer.isVisible = false
+  }
+  
+  /// Plays the currently visible video
+  func playCurrentVideo() {
+    guard let currentIndex = getCurrentVisibleIndex(),
+          let cell = getCurrentCell(at: currentIndex) else {
+      print("Failed to get current video for play")
+      return
+    }
+    
+    isManuallyPaused = false
+    cell.feedPlayer.isVisible = true
+  }
+  
+  /// Toggles play/pause state of current video
+  /// Returns the new playing state (true = playing, false = paused)
+  func togglePlayPause() -> Bool {
+    guard let currentIndex = getCurrentVisibleIndex(),
+          let cell = getCurrentCell(at: currentIndex) else {
+      print("Failed to get current video for toggle")
+      return false
+    }
+    
+    let wasPlaying = cell.feedPlayer.isVisible
+    let newPlayingState = !wasPlaying
+    isManuallyPaused = !newPlayingState // Update manual pause state
+    
+    cell.feedPlayer.isVisible = newPlayingState
+    
+    return newPlayingState
+  }
+  
+  /// Gets the current playing state
+  func isCurrentVideoPlaying() -> Bool {
+    guard let currentIndex = getCurrentVisibleIndex(),
+          let cell = getCurrentCell(at: currentIndex) else {
+      return false
+    }
+    
+    return cell.feedPlayer.isVisible
+  }
+  
+  // Handle removing notificationcenter listners for app states
+  deinit {
+    NotificationCenter.default.removeObserver(self)
+  }
+}
+
+extension VideoFeedView: UICollectionViewDataSource {
+  func collectionView(
+    _ collectionView: UICollectionView, numberOfItemsInSection section: Int
+  ) -> Int {
+    return videos.count
+  }
+  
+  func collectionView(
+    _ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath
+  ) -> UICollectionViewCell {
+    let cell =
+    collectionView.dequeueReusableCell(
+      withReuseIdentifier: "VideoFeedCell", for: indexPath) as! VideoFeedCell
+    let video = videos[indexPath.item]
+    cell.configure(with: video)
+    return cell
+  }
+}
+
+extension VideoFeedView: UICollectionViewDelegate {
+  func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
+    let index = getCurrentIndex()
+    for cell in collectionView.visibleCells as! [VideoFeedCell] {
+      cell.feedPlayer.isVisible = false
+    }
+    
+    // Reset manual pause state for new video
+    isManuallyPaused = false
+    
+    playVideo(at: index)
+    
+    // Emit video change event to React Native
+    if index < videos.count {
+      let videoId = videos[index].id
+      eventEmitter?.sendEvent("onVideoChange", body: ["videoId": videoId])
+    }
+  }
+  
+  func collectionView(
+    _ collectionView: UICollectionView, willDisplay cell: UICollectionViewCell,
+    forItemAt indexPath: IndexPath
+  ) {
+    // Play first video when it becomes available
+    if shouldPlayFirstVideo && indexPath.item == 0 {
+      shouldPlayFirstVideo = false
+      // Use a small delay to ensure the cell is fully configured
+      DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) { [weak self] in
+        self?.playVideo(at: 0)
+      }
+    }
+    
+    if indexPath.item >= videos.count - 3 {
+      onEndReached?()
+    }
+  }
+}
+
+extension VideoFeedView: UICollectionViewDataSourcePrefetching {
+  func collectionView(
+    _ collectionView: UICollectionView, prefetchItemsAt indexPaths: [IndexPath]
+  ) {
+    preloadNextVideos()
+  }
+}
+
+struct VideoData {
+  let id: String
+  let videoUrl: String
+  let thumbnailUrl: String?
+  let viewCount: Int?
+}