[Video] Captions and alt text (#5009)

* video settings modal in composer

* show done button on web

* rm download options

* fix logic for showing settings button

* add language picker (wip)

* subtitle list with language select

* send captions & alt text with video when posting

* style "ensure you have selected a language" text

* include aspect ratio with video

* filter out captions where the lang is not set

* rm log

* fix label and add hint

* minor scrubber fix

1 files changed, 11 insertions, 2 deletions

diff --git a/src/view/com/composer/videos/VideoPreview.tsx b/src/view/com/composer/videos/VideoPreview.tsx
index 6956c8c4f..7e43dcd65 100644
--- a/src/view/com/composer/videos/VideoPreview.tsx
+++ b/src/view/com/composer/videos/VideoPreview.tsx
@@ -1,32 +1,41 @@
 /* eslint-disable @typescript-eslint/no-shadow */
 import React from 'react'
 import {View} from 'react-native'
+import {ImagePickerAsset} from 'expo-image-picker'
 import {useVideoPlayer, VideoView} from 'expo-video'
 
 import {CompressedVideo} from '#/lib/media/video/compress'
 import {ExternalEmbedRemoveBtn} from 'view/com/composer/ExternalEmbedRemoveBtn'
-import {atoms as a} from '#/alf'
+import {atoms as a, useTheme} from '#/alf'
 
 export function VideoPreview({
+  asset,
   video,
   clear,
 }: {
+  asset: ImagePickerAsset
   video: CompressedVideo
+  setDimensions: (width: number, height: number) => void
   clear: () => void
 }) {
+  const t = useTheme()
   const player = useVideoPlayer(video.uri, player => {
     player.loop = true
     player.muted = true
     player.play()
   })
 
+  const aspectRatio = asset.width / asset.height
+
   return (
     <View
       style={[
         a.w_full,
         a.rounded_sm,
-        {aspectRatio: 16 / 9},
+        {aspectRatio: isNaN(aspectRatio) ? 16 / 9 : aspectRatio},
         a.overflow_hidden,
+        a.border,
+        t.atoms.border_contrast_low,
       ]}>
       <VideoView
         player={player}