Untitled
unknown
plain_text
5 months ago
2.6 kB
4
Indexable
import React, { useEffect, useState } from 'react'; import { useParams } from 'react-router-dom'; import './SeeVideos.css'; import useVideoStore from '../stores/uploadedVideosStore'; const SeeVideos = () => { const { id } = useParams(); // URL'den gelen id const { videos, fetchVideos, error } = useVideoStore(); const [loading, setLoading] = useState(false); useEffect(() => { const loadVideos = async () => { if (!id) { console.error('No ID found in URL'); return; } console.log('Fetching videos for ID:', id); setLoading(true); // Yeni bir mülakat yüklenmeden önce mevcut videoları geçici olarak sıfırla useVideoStore.setState({ videos: [] }); try { await fetchVideos(id); // Backend'den videoları çek } catch (err) { if (err.response && err.response.status === 404) { console.warn('No videos found for this interview.'); } else { console.error('Error fetching videos:', err); } } finally { setLoading(false); } }; loadVideos(); }, [id, fetchVideos]); if (!Array.isArray(videos)) { console.error('Videos is not an array:', videos); return <p>Videolar yüklenirken bir hata oluştu.</p>; } return ( <div className="see-videos-page"> <h1>Videolar</h1> {loading && <p>Videolar yükleniyor...</p>} {error && <p className="see-videos-error">{error}</p>} {!loading && videos.length > 0 ? ( <div className="see-videos-list"> {videos.map((video, index) => ( <div key={video._id} className="see-videos-item"> <h3>Video {index + 1}</h3> <video controls> <source src={video.videoUrl} type="video/webm" /> Tarayıcınız video etiketini desteklemiyor. </video> {video.candidate && ( <div className="see-videos-candidate-info"> <p> <strong>Ad:</strong> {video.candidate.firstName}{" "} {video.candidate.lastName} </p> <p> <strong>Email:</strong> {video.candidate.email} </p> <p> <strong>Telefon:</strong> {video.candidate.phone} </p> </div> )} </div> ))} </div> ) : ( !loading && <p className="see-videos-no-videos">Kayıtlı video bulunamadı.</p> )} </div> ); }; export default SeeVideos;
Editor is loading...
Leave a Comment