67 lines
1.6 KiB
TypeScript
67 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import { useParams } from 'next/navigation';
|
|
import VideoForm from '@/components/Forms/VideoForm';
|
|
import { updateVideo } from '@/app/actions/video';
|
|
import { useFetch } from '@/hooks/useFetch';
|
|
|
|
interface Video {
|
|
id: string;
|
|
title: string;
|
|
description: string;
|
|
videoUrl: string;
|
|
videoType: 'YOUTUBE' | 'LOCAL';
|
|
isPublic: boolean;
|
|
menuId?: string;
|
|
}
|
|
|
|
interface Menu {
|
|
id: string;
|
|
title: string;
|
|
}
|
|
|
|
export default function EditVideoPage() {
|
|
const params = useParams();
|
|
const id = params?.id as string;
|
|
|
|
const { data: video, loading } = useFetch<Video>(`/api/videos/${id}`);
|
|
const { data: menusData } = useFetch<Menu[]>('/api/menus');
|
|
const handleSubmit = async (data: any) => {
|
|
try {
|
|
await updateVideo(id, data);
|
|
} catch (error) {
|
|
console.error('Error updating video:', error);
|
|
throw error;
|
|
}
|
|
};
|
|
|
|
if (loading || !video || !menusData) {
|
|
return <div className="text-center text-gray-400 py-12">Loading...</div>;
|
|
}
|
|
|
|
const initialData = {
|
|
title: video.title,
|
|
description: video.description || '',
|
|
videoUrl: video.videoUrl,
|
|
videoType: video.videoType,
|
|
isPublic: video.isPublic,
|
|
menuId: video.menuId || '',
|
|
};
|
|
|
|
return (
|
|
<div className="max-w-2xl mx-auto">
|
|
<div className="mb-6">
|
|
<h1 className="text-2xl font-bold text-white">Edit Video</h1>
|
|
<p className="text-gray-400">Perbarui informasi video pembelajaran</p>
|
|
</div>
|
|
|
|
<VideoForm
|
|
initialData={initialData}
|
|
onSubmit={handleSubmit}
|
|
isEditing={true}
|
|
menus={menusData}
|
|
/>
|
|
</div>
|
|
);
|
|
} |