How to modify the output meta data

[krisnapy]

I found after I trimmed the video, the video timestamp output was messed up.

• Version package: v1.0.17
• React Native Version: v0.72.12

[maitrungduc1410]

is it possible for you to provide your test video? and your code?

[krisnapy]

 const trimVideo = async (media: StoryItem) => {
    await showEditor(media.uri, {
      minDuration: MIN_DURATION_PER_VIDEO,
      maxDuration: MAX_DURATION_PER_VIDEO,
      cancelDialogTitle: t('Are you sure want to cancel?'),
      cancelDialogMessage: t('This video will not be added to your story.'),
      cancelDialogCancelText: t('Back'),
      cancelDialogConfirmText: t('Continue'),
      saveDialogTitle: t('Add Video to Story?'),
      saveDialogMessage: t('Happy with the video? If not head back and adjust it as needed.'),
      saveDialogCancelText: t('Back'),
      saveDialogConfirmText: t('Looks Good'),
    })
  }

  const validateAndUploadStories = async () => {
    const { stories } = snapshot(storyStore.state)
    const overDurationLimitVideos = getOverDurationLimitVideos()

    setTrimmingMedia(true)

    if (overDurationLimitVideos.length > 0) {
      await trimVideo(overDurationLimitVideos[0])
      return
    }

    if (stories.length === 0) return

    await getStoryState()

    const overCapacity = checkStoryCapacity()
    if (overCapacity) {
      navigate('StoryOverCapacityScreen', { groupId })
      return
    }

    const musicSet = checkIfMusicIsSet()
    if (!musicSet) {
      navigate('StoryAddMusicScreen', { groupId })
    }

    setTrimmingMedia(false)

    await startBackgroundTasks()
  }

  const onMediaLoaded = (response: ImagePickerResponse) => {
    console.log('Response', response)
    setLoadingMedia(false)

    if (response.didCancel) return

    saveStoriesToState(response)
    validateAndUploadStories()
  }

  const createStory = () => {
    const { uploadingStory } = snapshot(storyStore.state)

    if (uploadingStory) {
      showToast({
        type: 'error',
        message: t('Please wait for the current upload to finish.'),
      })
      return
    }

    resetStoryStore()
    launchImageLibrary(
      {
        mediaType: 'mixed',
        maxWidth: 1080,
        maxHeight: 1080,
        quality: 1,
        videoQuality: Platform.select({ ios: 'high', android: 'high' }),
        selectionLimit: 0,
        includeExtra: true,
      },
      onMediaLoaded
    )
    setLoadingMedia(true)
  }

  const updateVideoWithTrimmedVideo = async (id: number, path: string) => {
    const duration = Math.round(Number(await getVideoDuration(path)))

    updateStory(id, { uri: path, duration, trimmed: true })
  }

  const handleVideoTrimming = async (event: any) => {
    const overDurationLimitVideos = getOverDurationLimitVideos()
    const mediaId = overDurationLimitVideos[0]?.id

    switch (event.name) {
      case 'onCancelTrimming':
        removeStory(mediaId)
        break
      case 'onFinishTrimming':
        const outputPath = event.outputPath.startsWith('file://')
          ? event.outputPath
          : 'file://' + event.outputPath
        await updateVideoWithTrimmedVideo(mediaId, outputPath)
        break
      case 'onError':
        removeStory(mediaId)
        break
      case 'onHide':
        if (Platform.OS === 'android') await delay(300)

        validateAndUploadStories()
        break
    }
  }

  useEffect(() => {
    let subscription: EmitterSubscription = null

    const eventEmitter = new NativeEventEmitter(NativeModules.VideoTrim)

    if (eventEmitter.listenerCount('VideoTrim') < 1) {
      subscription = eventEmitter.addListener('VideoTrim', handleVideoTrimming)
    }

    return () => {
      if (subscription) subscription.remove()
    }
  }, [])

[krisnapy]

Scenario: trimmed video 1, got the output video (video 2), I tried to trim video 2, but the timestamp got on video 2 from launchImageLibrary is messed up.

[krisnapy]

https://github.com/maitrungduc1410/react-native-video-trim/assets/96037957/a2a1d734-5ac6-441b-8cf7-058a23461a9d

Here is the video log, I think it's because not saving the video with the timestamp data?

[maitrungduc1410]

Hi @krisnapy pls upgrade to 1.0.21 I fixed this issue