diff options
-rw-r--r-- | src/lib/api/index.ts | 2 | ||||
-rw-r--r-- | src/lib/media/video/compress.ts | 2 | ||||
-rw-r--r-- | src/lib/media/video/upload.shared.ts (renamed from src/state/queries/video/video-upload.shared.ts) | 0 | ||||
-rw-r--r-- | src/lib/media/video/upload.ts (renamed from src/state/queries/video/video-upload.ts) | 4 | ||||
-rw-r--r-- | src/lib/media/video/upload.web.ts (renamed from src/state/queries/video/video-upload.web.ts) | 4 | ||||
-rw-r--r-- | src/lib/media/video/util.ts (renamed from src/state/queries/video/util.ts) | 0 | ||||
-rw-r--r-- | src/view/com/composer/Composer.tsx | 120 | ||||
-rw-r--r-- | src/view/com/composer/photos/Gallery.tsx | 2 | ||||
-rw-r--r-- | src/view/com/composer/state/composer.ts (renamed from src/view/com/composer/state.ts) | 7 | ||||
-rw-r--r-- | src/view/com/composer/state/video.ts (renamed from src/state/queries/video/video.ts) | 4 |
10 files changed, 64 insertions, 81 deletions
diff --git a/src/lib/api/index.ts b/src/lib/api/index.ts index 51bf51fff..8b7925004 100644 --- a/src/lib/api/index.ts +++ b/src/lib/api/index.ts @@ -24,7 +24,7 @@ import { threadgateAllowUISettingToAllowRecordValue, writeThreadgateRecord, } from '#/state/queries/threadgate' -import {ComposerState} from '#/view/com/composer/state' +import {ComposerState} from '#/view/com/composer/state/composer' import {LinkMeta} from '../link-meta/link-meta' import {uploadBlob} from './upload-blob' diff --git a/src/lib/media/video/compress.ts b/src/lib/media/video/compress.ts index dec9032a3..c2d1470c6 100644 --- a/src/lib/media/video/compress.ts +++ b/src/lib/media/video/compress.ts @@ -2,8 +2,8 @@ import {getVideoMetaData, Video} from 'react-native-compressor' import {ImagePickerAsset} from 'expo-image-picker' import {SUPPORTED_MIME_TYPES, SupportedMimeTypes} from '#/lib/constants' -import {extToMime} from '#/state/queries/video/util' import {CompressedVideo} from './types' +import {extToMime} from './util' const MIN_SIZE_FOR_COMPRESSION = 25 // 25mb diff --git a/src/state/queries/video/video-upload.shared.ts b/src/lib/media/video/upload.shared.ts index 8c217eadc..8c217eadc 100644 --- a/src/state/queries/video/video-upload.shared.ts +++ b/src/lib/media/video/upload.shared.ts diff --git a/src/state/queries/video/video-upload.ts b/src/lib/media/video/upload.ts index 46f24a58b..3330370b3 100644 --- a/src/state/queries/video/video-upload.ts +++ b/src/lib/media/video/upload.ts @@ -7,8 +7,8 @@ import {nanoid} from 'nanoid/non-secure' import {AbortError} from '#/lib/async/cancelable' import {ServerError} from '#/lib/media/video/errors' import {CompressedVideo} from '#/lib/media/video/types' -import {createVideoEndpointUrl, mimeToExt} from '#/state/queries/video/util' -import {getServiceAuthToken, getVideoUploadLimits} from './video-upload.shared' +import {createVideoEndpointUrl, mimeToExt} from './util' +import {getServiceAuthToken, getVideoUploadLimits} from './upload.shared' export async function uploadVideo({ video, diff --git a/src/state/queries/video/video-upload.web.ts b/src/lib/media/video/upload.web.ts index bbae64199..ec65f96c9 100644 --- a/src/state/queries/video/video-upload.web.ts +++ b/src/lib/media/video/upload.web.ts @@ -7,8 +7,8 @@ import {nanoid} from 'nanoid/non-secure' import {AbortError} from '#/lib/async/cancelable' import {ServerError} from '#/lib/media/video/errors' import {CompressedVideo} from '#/lib/media/video/types' -import {createVideoEndpointUrl, mimeToExt} from '#/state/queries/video/util' -import {getServiceAuthToken, getVideoUploadLimits} from './video-upload.shared' +import {createVideoEndpointUrl, mimeToExt} from './util' +import {getServiceAuthToken, getVideoUploadLimits} from './upload.shared' export async function uploadVideo({ video, diff --git a/src/state/queries/video/util.ts b/src/lib/media/video/util.ts index 87b422c2c..87b422c2c 100644 --- a/src/state/queries/video/util.ts +++ b/src/lib/media/video/util.ts diff --git a/src/view/com/composer/Composer.tsx b/src/view/com/composer/Composer.tsx index 59aae2951..f4e290ca8 100644 --- a/src/view/com/composer/Composer.tsx +++ b/src/view/com/composer/Composer.tsx @@ -82,13 +82,6 @@ import {useProfileQuery} from '#/state/queries/profile' import {Gif} from '#/state/queries/tenor' import {ThreadgateAllowUISetting} from '#/state/queries/threadgate' import {threadgateViewToAllowUISetting} from '#/state/queries/threadgate/util' -import {NO_VIDEO, NoVideoState} from '#/state/queries/video/video' -import { - processVideo, - VideoAction, - VideoState, - VideoState as VideoUploadState, -} from '#/state/queries/video/video' import {useAgent, useSession} from '#/state/session' import {useComposerControls} from '#/state/shell/composer' import {ComposerOpts} from '#/state/shell/composer' @@ -123,7 +116,8 @@ import {EmojiArc_Stroke2_Corner0_Rounded as EmojiSmile} from '#/components/icons import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times' import * as Prompt from '#/components/Prompt' import {Text as NewText} from '#/components/Typography' -import {composerReducer, createComposerState} from './state' +import {composerReducer, createComposerState} from './state/composer' +import {NO_VIDEO, NoVideoState, processVideo, VideoState} from './state/video' const MAX_IMAGES = 4 @@ -200,16 +194,10 @@ export const ComposePost = ({ createComposerState, ) - let videoUploadState: VideoState | NoVideoState = NO_VIDEO + let videoState: VideoState | NoVideoState = NO_VIDEO if (composerState.embed.media?.type === 'video') { - videoUploadState = composerState.embed.media.video + videoState = composerState.embed.media.video } - const videoDispatch = useCallback( - (videoAction: VideoAction) => { - dispatch({type: 'embed_update_video', videoAction}) - }, - [dispatch], - ) const selectVideo = React.useCallback( (asset: ImagePickerAsset) => { @@ -217,14 +205,14 @@ export const ComposePost = ({ dispatch({type: 'embed_add_video', asset, abortController}) processVideo( asset, - videoDispatch, + videoAction => dispatch({type: 'embed_update_video', videoAction}), agent, currentDid, abortController.signal, _, ) }, - [_, videoDispatch, agent, currentDid], + [_, agent, currentDid], ) // Whenever we receive an initial video uri, we should immediately run compression if necessary @@ -235,23 +223,26 @@ export const ComposePost = ({ }, [initVideoUri, selectVideo]) const clearVideo = React.useCallback(() => { - videoUploadState.abortController.abort() + videoState.abortController.abort() dispatch({type: 'embed_remove_video'}) - }, [videoUploadState.abortController, dispatch]) + }, [videoState.abortController, dispatch]) const updateVideoDimensions = useCallback( (width: number, height: number) => { - videoDispatch({ - type: 'update_dimensions', - width, - height, - signal: videoUploadState.abortController.signal, + dispatch({ + type: 'embed_update_video', + videoAction: { + type: 'update_dimensions', + width, + height, + signal: videoState.abortController.signal, + }, }) }, - [videoUploadState.abortController, videoDispatch], + [videoState.abortController], ) - const hasVideo = Boolean(videoUploadState.asset || videoUploadState.video) + const hasVideo = Boolean(videoState.asset || videoState.video) const [publishOnUpload, setPublishOnUpload] = useState(false) @@ -288,7 +279,7 @@ export const ComposePost = ({ graphemeLength > 0 || images.length !== 0 || extGif || - videoUploadState.status !== 'idle' + videoState.status !== 'idle' ) { closeAllDialogs() Keyboard.dismiss() @@ -303,7 +294,7 @@ export const ComposePost = ({ closeAllDialogs, discardPromptControl, onClose, - videoUploadState.status, + videoState.status, ]) useImperativeHandle(cancelRef, () => ({onPressCancel})) @@ -400,8 +391,8 @@ export const ComposePost = ({ if ( !finishedUploading && - videoUploadState.asset && - videoUploadState.status !== 'done' + videoState.asset && + videoState.status !== 'done' ) { setPublishOnUpload(true) return @@ -414,7 +405,7 @@ export const ComposePost = ({ images.length === 0 && !extLink && !quote && - videoUploadState.status === 'idle' + videoState.status === 'idle' ) { setError(_(msg`Did you want to say anything?`)) return @@ -442,14 +433,14 @@ export const ComposePost = ({ onStateChange: setProcessingState, langs: toPostLanguages(langPrefs.postLanguage), video: - videoUploadState.status === 'done' + videoState.status === 'done' ? { - blobRef: videoUploadState.pendingPublish.blobRef, + blobRef: videoState.pendingPublish.blobRef, altText: videoAltText, captions: captions, aspectRatio: { - width: videoUploadState.asset.width, - height: videoUploadState.asset.height, + width: videoState.asset.width, + height: videoState.asset.height, }, } : undefined, @@ -550,20 +541,20 @@ export const ComposePost = ({ setLangPrefs, threadgateAllowUISettings, videoAltText, - videoUploadState.asset, - videoUploadState.pendingPublish, - videoUploadState.status, + videoState.asset, + videoState.pendingPublish, + videoState.status, ], ) React.useEffect(() => { - if (videoUploadState.pendingPublish && publishOnUpload) { - if (!videoUploadState.pendingPublish.mutableProcessed) { - videoUploadState.pendingPublish.mutableProcessed = true + if (videoState.pendingPublish && publishOnUpload) { + if (!videoState.pendingPublish.mutableProcessed) { + videoState.pendingPublish.mutableProcessed = true onPressPublish(true) } } - }, [onPressPublish, publishOnUpload, videoUploadState.pendingPublish]) + }, [onPressPublish, publishOnUpload, videoState.pendingPublish]) const canPost = useMemo( () => graphemeLength <= MAX_GRAPHEME_LENGTH && !isAltTextRequiredAndMissing, @@ -576,10 +567,10 @@ export const ComposePost = ({ const canSelectImages = images.length < MAX_IMAGES && !extLink && - videoUploadState.status === 'idle' && - !videoUploadState.video + videoState.status === 'idle' && + !videoState.video const hasMedia = - images.length > 0 || Boolean(extLink) || Boolean(videoUploadState.video) + images.length > 0 || Boolean(extLink) || Boolean(videoState.video) const onEmojiButtonPress = useCallback(() => { openEmojiPicker?.(textInput.current?.getCursorPosition()) @@ -694,9 +685,7 @@ export const ComposePost = ({ size="small" style={[a.rounded_full, a.py_sm]} onPress={() => onPressPublish()} - disabled={ - videoUploadState.status !== 'idle' && publishOnUpload - }> + disabled={videoState.status !== 'idle' && publishOnUpload}> <ButtonText style={[a.text_md]}> {replyTo ? ( <Trans context="action">Reply</Trans> @@ -732,7 +721,7 @@ export const ComposePost = ({ )} <ErrorBanner error={error} - videoUploadState={videoUploadState} + videoState={videoState} clearError={() => setError('')} clearVideo={clearVideo} /> @@ -798,17 +787,17 @@ export const ComposePost = ({ style={[a.w_full, a.mt_lg]} entering={native(ZoomIn)} exiting={native(ZoomOut)}> - {videoUploadState.asset && - (videoUploadState.status === 'compressing' ? ( + {videoState.asset && + (videoState.status === 'compressing' ? ( <VideoTranscodeProgress - asset={videoUploadState.asset} - progress={videoUploadState.progress} + asset={videoState.asset} + progress={videoState.progress} clear={clearVideo} /> - ) : videoUploadState.video ? ( + ) : videoState.video ? ( <VideoPreview - asset={videoUploadState.asset} - video={videoUploadState.video} + asset={videoState.asset} + video={videoState.video} setDimensions={updateVideoDimensions} clear={clearVideo} /> @@ -854,9 +843,8 @@ export const ComposePost = ({ t.atoms.border_contrast_medium, styles.bottomBar, ]}> - {videoUploadState.status !== 'idle' && - videoUploadState.status !== 'done' ? ( - <VideoUploadToolbar state={videoUploadState} /> + {videoState.status !== 'idle' && videoState.status !== 'done' ? ( + <VideoUploadToolbar state={videoState} /> ) : ( <ToolbarWrapper style={[a.flex_row, a.align_center, a.gap_xs]}> <SelectPhotoBtn @@ -1121,12 +1109,12 @@ const styles = StyleSheet.create({ function ErrorBanner({ error: standardError, - videoUploadState, + videoState, clearError, clearVideo, }: { error: string - videoUploadState: VideoUploadState | NoVideoState + videoState: VideoState | NoVideoState clearError: () => void clearVideo: () => void }) { @@ -1134,7 +1122,7 @@ function ErrorBanner({ const {_} = useLingui() const videoError = - videoUploadState.status === 'error' ? videoUploadState.error : undefined + videoState.status === 'error' ? videoState.error : undefined const error = standardError || videoError const onClearError = () => { @@ -1176,7 +1164,7 @@ function ErrorBanner({ <ButtonIcon icon={X} /> </Button> </View> - {videoError && videoUploadState.jobId && ( + {videoError && videoState.jobId && ( <NewText style={[ {paddingLeft: 28}, @@ -1185,7 +1173,7 @@ function ErrorBanner({ a.leading_snug, t.atoms.text_contrast_low, ]}> - <Trans>Job ID: {videoUploadState.jobId}</Trans> + <Trans>Job ID: {videoState.jobId}</Trans> </NewText> )} </View> @@ -1211,7 +1199,7 @@ function ToolbarWrapper({ ) } -function VideoUploadToolbar({state}: {state: VideoUploadState}) { +function VideoUploadToolbar({state}: {state: VideoState}) { const t = useTheme() const {_} = useLingui() const progress = state.progress diff --git a/src/view/com/composer/photos/Gallery.tsx b/src/view/com/composer/photos/Gallery.tsx index 5692f3d2c..5ff7042bc 100644 --- a/src/view/com/composer/photos/Gallery.tsx +++ b/src/view/com/composer/photos/Gallery.tsx @@ -21,7 +21,7 @@ import {ComposerImage, cropImage} from '#/state/gallery' import {Text} from '#/view/com/util/text/Text' import {useTheme} from '#/alf' import * as Dialog from '#/components/Dialog' -import {ComposerAction} from '../state' +import {ComposerAction} from '../state/composer' import {EditImageDialog} from './EditImageDialog' import {ImageAltTextDialog} from './ImageAltTextDialog' diff --git a/src/view/com/composer/state.ts b/src/view/com/composer/state/composer.ts index 8e974ad7a..a23a5d8c8 100644 --- a/src/view/com/composer/state.ts +++ b/src/view/com/composer/state/composer.ts @@ -1,13 +1,8 @@ import {ImagePickerAsset} from 'expo-image-picker' import {ComposerImage, createInitialImages} from '#/state/gallery' -import { - createVideoState, - VideoAction, - videoReducer, - VideoState, -} from '#/state/queries/video/video' import {ComposerOpts} from '#/state/shell/composer' +import {createVideoState, VideoAction, videoReducer, VideoState} from './video' type PostRecord = { uri: string diff --git a/src/state/queries/video/video.ts b/src/view/com/composer/state/video.ts index dbbb6c202..269505657 100644 --- a/src/state/queries/video/video.ts +++ b/src/view/com/composer/state/video.ts @@ -4,6 +4,8 @@ import {JobStatus} from '@atproto/api/dist/client/types/app/bsky/video/defs' import {I18n} from '@lingui/core' import {msg} from '@lingui/macro' +import {createVideoAgent} from '#/lib/media/video/util' +import {uploadVideo} from '#/lib/media/video/upload' import {AbortError} from '#/lib/async/cancelable' import {compressVideo} from '#/lib/media/video/compress' import { @@ -13,8 +15,6 @@ import { } from '#/lib/media/video/errors' import {CompressedVideo} from '#/lib/media/video/types' import {logger} from '#/logger' -import {createVideoAgent} from '#/state/queries/video/util' -import {uploadVideo} from '#/state/queries/video/video-upload' export type VideoAction = | { |