mirror of
https://github.com/CherryHQ/cherry-studio.git
synced 2025-12-28 13:31:32 +08:00
feat(video): add setActiveVideoId prop to VideoPanel
Enable VideoPanel to update active video ID after processing and track processing state
This commit is contained in:
parent
3c6f32dbac
commit
a0abf7fe62
@ -144,7 +144,13 @@ export const VideoPage = () => {
|
||||
{provider.type === 'openai-response' && <OpenAIParamSettings params={params} updateParams={updateParams} />}
|
||||
</div>
|
||||
<Divider orientation="vertical" />
|
||||
<VideoPanel provider={provider} params={params} updateParams={updateParams} video={activeVideo} />
|
||||
<VideoPanel
|
||||
provider={provider}
|
||||
params={params}
|
||||
updateParams={updateParams}
|
||||
setActiveVideoId={setActiveVideoId}
|
||||
video={activeVideo}
|
||||
/>
|
||||
<Divider orientation="vertical" />
|
||||
{/* Video list */}
|
||||
<VideoList
|
||||
|
||||
@ -15,7 +15,7 @@ import dayjs from 'dayjs'
|
||||
import { isEmpty } from 'lodash'
|
||||
import { ArrowUp, CircleXIcon, ImageIcon } from 'lucide-react'
|
||||
import mime from 'mime-types'
|
||||
import { useCallback, useEffect, useMemo, useRef } from 'react'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
import { VideoViewer } from './VideoViewer'
|
||||
@ -25,16 +25,18 @@ export type VideoPanelProps = {
|
||||
video?: Video
|
||||
params: CreateVideoParams
|
||||
updateParams: (upadte: DeepPartial<Omit<CreateVideoParams, 'type'>>) => void
|
||||
setActiveVideoId: (id: string) => void
|
||||
}
|
||||
|
||||
const logger = loggerService.withContext('VideoPanel')
|
||||
|
||||
export const VideoPanel = ({ provider, video, params, updateParams }: VideoPanelProps) => {
|
||||
export const VideoPanel = ({ provider, video, params, updateParams, setActiveVideoId }: VideoPanelProps) => {
|
||||
const { t } = useTranslation()
|
||||
const addOpenAIVideo = useAddOpenAIVideo(provider.id)
|
||||
const { setVideo } = useProviderVideos(provider.id)
|
||||
|
||||
const { pendingMap, setPending: setPendingById } = usePending()
|
||||
const [isProcessing, setIsProcessing] = useState<boolean | undefined>()
|
||||
const fileInputRef = useRef<HTMLInputElement>(null)
|
||||
const inputReference = params.params.input_reference
|
||||
|
||||
@ -56,11 +58,13 @@ export const VideoPanel = ({ provider, video, params, updateParams }: VideoPanel
|
||||
}
|
||||
}, [updateParams, video])
|
||||
|
||||
const isPending = video ? pendingMap[video.id] : false
|
||||
const isPending = (video ? pendingMap[video.id] : false) || isProcessing
|
||||
const setPending = useCallback(
|
||||
(value: boolean) => {
|
||||
if (video) {
|
||||
setPendingById(video.id, value ? value : undefined)
|
||||
} else {
|
||||
setIsProcessing(value)
|
||||
}
|
||||
},
|
||||
[setPendingById, video]
|
||||
@ -80,6 +84,7 @@ export const VideoPanel = ({ provider, video, params, updateParams }: VideoPanel
|
||||
default:
|
||||
logger.error(`Invalid video type ${result.type}.`)
|
||||
}
|
||||
setActiveVideoId(result.video.id)
|
||||
} else {
|
||||
// TODO: remix video
|
||||
window.toast.info('Remix video is not implemented.')
|
||||
|
||||
Loading…
Reference in New Issue
Block a user