105 lines
4.1 KiB
TypeScript
105 lines
4.1 KiB
TypeScript
import { getDracinStream, getDracinDetail } from '@/lib/dramabox';
|
|
import Link from 'next/link';
|
|
import { Button } from '@/components/ui/button';
|
|
import { List, ArrowRight, ArrowLeft } from 'lucide-react';
|
|
import { createClient } from '@/lib/supabase/server';
|
|
import { redirect } from 'next/navigation';
|
|
import VideoPlayer from '@/components/VideoPlayer';
|
|
import { DracinPlayer } from '@/components/DracinPlayer';
|
|
|
|
interface DracinWatchPageProps {
|
|
params: Promise<{ id: string; episode: string }>;
|
|
}
|
|
|
|
|
|
export default async function DracinWatchPage({ params }: DracinWatchPageProps) {
|
|
const { id, episode } = await params;
|
|
const episodeNum = parseInt(episode);
|
|
|
|
// Auth Check
|
|
const supabase = await createClient();
|
|
const { data: { user } } = await supabase.auth.getUser();
|
|
|
|
if (!user) {
|
|
redirect('/login');
|
|
}
|
|
|
|
// Fetch stream URL
|
|
const streamUrl = await getDracinStream(id, episodeNum);
|
|
|
|
// Fetch detail for title and navigation context
|
|
const { drama } = await getDracinDetail(id);
|
|
|
|
if (!streamUrl) {
|
|
return (
|
|
<div className="pt-24 px-4 text-center text-white">
|
|
<h1 className="text-2xl font-bold mb-4">Error</h1>
|
|
<p className="mb-8">Could not load stream for Episode {episode}. It might be a premium/VIP episode or API error.</p>
|
|
<Link href={`/dracin/${id}`}>
|
|
<Button variant="outline">Back to Detail</Button>
|
|
</Link>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="pt-20 min-h-screen bg-black flex flex-col items-center">
|
|
{/* Player Container */}
|
|
<div className="w-full max-w-5xl aspect-video bg-black relative shadow-2xl">
|
|
<DracinPlayer
|
|
id={id}
|
|
episode={episodeNum}
|
|
title={drama?.name || 'Unknown Drama'}
|
|
poster={drama?.cover || ''}
|
|
streamUrl={streamUrl}
|
|
/>
|
|
</div>
|
|
|
|
{/* Info & Navigation */}
|
|
<div className="w-full max-w-5xl px-4 py-6 text-white">
|
|
<div className="mb-6">
|
|
<h1 className="text-xl md:text-2xl font-bold mb-6 text-center">
|
|
{drama?.name || 'Unknown Drama'} - Episode {episodeNum + 1}
|
|
</h1>
|
|
|
|
<div className="grid grid-cols-3 items-center">
|
|
{/* Left: Previous */}
|
|
<div className="flex justify-start">
|
|
{episodeNum > 0 ? (
|
|
<Link href={`/dracin/watch/${id}/${episodeNum - 1}`}>
|
|
<Button variant="outline" className="border-gray-700">
|
|
<ArrowLeft className="w-4 h-4 mr-2" />
|
|
Previous
|
|
</Button>
|
|
</Link>
|
|
) : (
|
|
<div />
|
|
)}
|
|
</div>
|
|
|
|
{/* Center: Back */}
|
|
<div className="flex justify-center">
|
|
<Link href={`/dracin/${id}`}>
|
|
<Button variant="ghost" className="bg-[#141414] hover:bg-[#b00710] text-white">
|
|
<List className="w-4 h-4 mr-2" />
|
|
List
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
{/* Right: Next */}
|
|
<div className="flex justify-end">
|
|
<Link href={`/dracin/watch/${id}/${episodeNum + 1}`}>
|
|
<Button className="bg-[#E50914] hover:bg-[#b00710] text-white">
|
|
Next
|
|
<ArrowRight className="w-4 h-4 ml-2" />
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|