5fb9975913
CI/CD Pipeline / Check if frontend-only change (push) Has been skipped
CI/CD Pipeline / Dedup Check - skip PR tests when covered by push pipeline (push) Successful in 1s
CI/CD Pipeline / Frontend Lint (push) Has been skipped
CI/CD Pipeline / PR Build Worker Image (push) Has been skipped
CI/CD Pipeline / PR Build API Image (push) Has been skipped
CI/CD Pipeline / PR Build Web Image (push) Has been skipped
CI/CD Pipeline / Check push changed paths (push) Successful in 4s
CI/CD Pipeline / Build Staging API Image (push) Successful in 4m34s
CI/CD Pipeline / Build Staging Web Image (push) Successful in 4m43s
CI/CD Pipeline / Build Staging Worker Image (push) Successful in 4m48s
CI/CD Pipeline / Retag skipped Staging API Image (push) Has been skipped
CI/CD Pipeline / Retag skipped Staging Web Image (push) Has been skipped
CI/CD Pipeline / Retag skipped Staging Worker Image (push) Has been skipped
CI/CD Pipeline / Validate - Style (push) Successful in 5m37s
CI/CD Pipeline / Validate - Python (mypy + alembic) (push) Successful in 6m13s
CI/CD Pipeline / Integration Tests (push) Successful in 6m30s
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (push) Successful in 1m38s
CI/CD Pipeline / Staging API Integration Tests (push) Failing after 2m3s
CI/CD Pipeline / Staging E2E Tests (push) Failing after 2m20s
CI/CD Pipeline / Frontend Unit Tests (push) Successful in 9m26s
CI/CD Pipeline / ACR Image Cleanup (push) Successful in 3m28s
CI/CD Pipeline / Validate - Security (push) Successful in 10m29s
CI/CD Pipeline / Unit Tests (push) Successful in 17m0s
CI/CD Pipeline / Build Production API Image (push) Has been skipped
CI/CD Pipeline / Build Production Web Image (push) Has been skipped
CI/CD Pipeline / Build Production Worker Image (push) Has been skipped
CI/CD Pipeline / CI Gate (push) Has been skipped
CI/CD Pipeline / Deploy Production (push) Has been skipped
CI/CD Pipeline / Canary Release to Production (push) Has been skipped
CI/CD Pipeline / Production Browser E2E (push) Has been skipped
Co-authored-by: xiaoxia <dev@xiaoxiajianji.com> Co-committed-by: xiaoxia <dev@xiaoxiajianji.com>
142 lines
4.4 KiB
TypeScript
142 lines
4.4 KiB
TypeScript
import { useState, useMemo } from "react"
|
|
import { useQuery } from "@tanstack/react-query"
|
|
import {
|
|
getAssetLibraries,
|
|
getAssets,
|
|
ensureDefaultLibrary,
|
|
type AssetLibraryItem,
|
|
type AssetItem as ApiAssetItem,
|
|
} from "@/api/assets"
|
|
import { getOrCreateDefaultProject } from "@/api/projects"
|
|
import { mapLibrary, mapAsset, type AssetItem, type LibraryItem } from "../types"
|
|
|
|
/**
|
|
* 素材库数据 Hook
|
|
* 封装视频库列表、素材列表的数据查询,以及筛选、搜索状态管理
|
|
*/
|
|
export function useAssetsData() {
|
|
/* ── 视频库列表查询 ── */
|
|
const { data: apiLibraries = [], isLoading: libLoading } = useQuery<AssetLibraryItem[], Error>({
|
|
queryKey: ["asset-libraries"],
|
|
queryFn: async () => {
|
|
const libs = await getAssetLibraries()
|
|
// 如果没有 video 类型的库,自动创建默认视频素材库(与 useVoiceMaterials 保持一致)
|
|
const hasVideoLib = libs.some((lib) => lib.kind === "video")
|
|
if (!hasVideoLib) {
|
|
const project = await getOrCreateDefaultProject()
|
|
await ensureDefaultLibrary({ project_id: project.id, kind: "video" })
|
|
// 创建后重新拉取最新列表
|
|
return getAssetLibraries()
|
|
}
|
|
return libs
|
|
},
|
|
staleTime: 60_000,
|
|
})
|
|
|
|
const libraries: LibraryItem[] = useMemo(
|
|
() =>
|
|
(Array.isArray(apiLibraries) ? apiLibraries : [])
|
|
.map(mapLibrary)
|
|
.filter((lib) => lib.kind === "video"),
|
|
[apiLibraries],
|
|
)
|
|
|
|
/* ── 当前选中的视频库 ── */
|
|
const [activeLibId, setActiveLibId] = useState<string>("")
|
|
|
|
// 当库列表加载完成后,自动选中第一个
|
|
const effectiveLibId = activeLibId || libraries[0]?.id || ""
|
|
|
|
/* ── 当前库的素材列表查询 ── */
|
|
const {
|
|
data: apiAssets = { items: [], total: 0 },
|
|
isLoading: assetsLoading,
|
|
isError: assetsError,
|
|
error: assetsErrorObj,
|
|
refetch: refetchAssets,
|
|
} = useQuery<{ items: ApiAssetItem[]; total: number }, Error>({
|
|
queryKey: ["assets", effectiveLibId],
|
|
queryFn: () =>
|
|
getAssets(effectiveLibId, {
|
|
// 拉取所有非删除状态的素材,让用户上传后立刻能看到"上传中/处理中"的素材
|
|
status: "ready,uploading,ingesting,processing,pending,error,failed",
|
|
}),
|
|
enabled: !!effectiveLibId,
|
|
staleTime: 30_000,
|
|
// 列表中存在上传中/转码中素材时每 3s 轮询;全部就绪后自动停止
|
|
refetchInterval: (query) => {
|
|
const data = query.state.data as { items: ApiAssetItem[] } | undefined
|
|
const items = data?.items ?? []
|
|
const processing = items.some((a) => {
|
|
const st = a.status ?? ""
|
|
return st === "uploading" || st === "ingesting" || st === "processing" || st === "pending"
|
|
})
|
|
return processing ? 3000 : false
|
|
},
|
|
})
|
|
|
|
const assets: AssetItem[] = useMemo(
|
|
() => (Array.isArray(apiAssets?.items) ? apiAssets.items : []).map(mapAsset),
|
|
[apiAssets],
|
|
)
|
|
|
|
/* ── 筛选状态 ── */
|
|
const [searchText, setSearchText] = useState("")
|
|
const [filterType, setFilterType] = useState<string>("all")
|
|
const [filterTime, setFilterTime] = useState<string>("all")
|
|
|
|
/* ── 筛选后的素材列表 ── */
|
|
const filteredAssets = useMemo(() => {
|
|
let list = assets
|
|
|
|
/* 按素材类型过滤 */
|
|
if (filterType !== "all") {
|
|
list = list.filter((a) => a.kind === filterType)
|
|
}
|
|
|
|
/* 按时间筛选 */
|
|
if (filterTime !== "all") {
|
|
const now = new Date()
|
|
list = list.filter((a) => {
|
|
const d = new Date(a.createdAt)
|
|
const diffDays = (now.getTime() - d.getTime()) / (1000 * 60 * 60 * 24)
|
|
if (filterTime === "today") return diffDays < 1
|
|
if (filterTime === "week") return diffDays < 7
|
|
if (filterTime === "month") return diffDays < 30
|
|
return true
|
|
})
|
|
}
|
|
|
|
/* 搜索 */
|
|
if (searchText.trim()) {
|
|
const q = searchText.trim().toLowerCase()
|
|
list = list.filter((a) => a.name.toLowerCase().includes(q))
|
|
}
|
|
|
|
return list
|
|
}, [assets, filterType, filterTime, searchText])
|
|
|
|
return {
|
|
// 视频库
|
|
libraries,
|
|
libLoading,
|
|
activeLibId,
|
|
setActiveLibId,
|
|
effectiveLibId,
|
|
// 素材列表
|
|
assets,
|
|
assetsLoading,
|
|
assetsError,
|
|
assetsErrorObj,
|
|
refetchAssets,
|
|
// 筛选
|
|
searchText,
|
|
setSearchText,
|
|
filterType,
|
|
setFilterType,
|
|
filterTime,
|
|
setFilterTime,
|
|
filteredAssets,
|
|
}
|
|
}
|