mirror of
https://github.com/KuekHaoYang/KVideo.git
synced 2026-08-17 01:33:43 +08:00
kuekhaoyang
ad9e75bc8c
- Added EpisodeList component for displaying a list of episodes with selection functionality. - Created PlayerError component to handle and display video playback errors. - Developed VideoMetadata component to show detailed information about the video. - Implemented VideoPlayer component for video playback with error handling and loading states. - Introduced EmptyState and NoResults components for search results handling. - Created ResultsHeader component to display search results summary. - Developed SearchForm component for user input and search initiation. - Implemented SourceBadges component to show available video sources. - Created VideoGrid component to display search results in a grid format. - Added useSearchCache and useSearchStream hooks for managing search state and caching results. - Implemented useVideoPlayer hook for fetching and managing video details. - Added utility function to map source IDs to their respective names.
50 lines
2.3 KiB
TypeScript
50 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
import { Card } from '@/components/ui/Card';
|
|
import { Icons } from '@/components/ui/Icon';
|
|
|
|
export function EmptyState() {
|
|
return (
|
|
<div className="text-center py-20 animate-fade-in">
|
|
<div className="mb-8">
|
|
<div
|
|
className="inline-flex items-center justify-center w-32 h-32 bg-[var(--glass-bg)] backdrop-blur-xl border border-[var(--glass-border)] mb-6"
|
|
style={{ borderRadius: 'var(--radius-full)' }}
|
|
>
|
|
<Icons.Film size={64} className="text-[var(--text-color-secondary)]" />
|
|
</div>
|
|
<h3 className="text-3xl font-bold text-[var(--text-color)] mb-4">
|
|
开始探索精彩内容
|
|
</h3>
|
|
<p className="text-lg text-[var(--text-color-secondary)] max-w-2xl mx-auto mb-8">
|
|
在上方搜索框输入关键词，从 16 个视频源聚合搜索海量影视资源
|
|
</p>
|
|
|
|
<div className="grid md:grid-cols-3 gap-6 max-w-4xl mx-auto mt-12">
|
|
<Card hover={false} className="text-center p-6">
|
|
<div className="flex items-center justify-center mb-4">
|
|
<Icons.Zap size={48} className="text-[var(--accent-color)]" />
|
|
</div>
|
|
<h4 className="font-semibold text-[var(--text-color)] mb-2">极速搜索</h4>
|
|
<p className="text-sm text-[var(--text-color-secondary)]">多源并行，秒级响应</p>
|
|
</Card>
|
|
<Card hover={false} className="text-center p-6">
|
|
<div className="flex items-center justify-center mb-4">
|
|
<Icons.Target size={48} className="text-[var(--accent-color)]" />
|
|
</div>
|
|
<h4 className="font-semibold text-[var(--text-color)] mb-2">精准匹配</h4>
|
|
<p className="text-sm text-[var(--text-color-secondary)]">智能算法，结果精准</p>
|
|
</Card>
|
|
<Card hover={false} className="text-center p-6">
|
|
<div className="flex items-center justify-center mb-4">
|
|
<Icons.Sparkles size={48} className="text-[var(--accent-color)]" />
|
|
</div>
|
|
<h4 className="font-semibold text-[var(--text-color)] mb-2">极致体验</h4>
|
|
<p className="text-sm text-[var(--text-color-secondary)]">流畅播放，完美适配</p>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|