60 lines
2.0 KiB
JavaScript
60 lines
2.0 KiB
JavaScript
import React, { useState, useEffect } from 'react';
|
||
import MovieList from '../components/Movie/MovieList';
|
||
import MovieService from '../services/MovieService';
|
||
|
||
function HomePage() {
|
||
const [movies, setMovies] = useState([]);
|
||
const [loading, setLoading] = useState(true);
|
||
const [error, setError] = useState(null);
|
||
|
||
useEffect(() => {
|
||
const fetchMovies = async () => {
|
||
try {
|
||
const data = await MovieService.getMovies();
|
||
// Sort by year (newest first) for featured movies
|
||
const sortedMovies = [...data].sort((a, b) => b.year - a.year);
|
||
setMovies(sortedMovies);
|
||
setLoading(false);
|
||
} catch (error) {
|
||
console.error('Error fetching movies:', error);
|
||
setError('Не удалось загрузить фильмы. Пожалуйста, попробуйте позже.');
|
||
setLoading(false);
|
||
}
|
||
};
|
||
|
||
fetchMovies();
|
||
}, []);
|
||
|
||
const handleDeleteMovie = async (id) => {
|
||
try {
|
||
await MovieService.deleteMovie(id);
|
||
setMovies(movies.filter(movie => movie.id !== id));
|
||
} catch (error) {
|
||
console.error('Error deleting movie:', error);
|
||
alert('Произошла ошибка при удалении фильма.');
|
||
}
|
||
};
|
||
|
||
if (loading) {
|
||
return <div className="text-center py-5"><div className="spinner-border" role="status"></div></div>;
|
||
}
|
||
|
||
if (error) {
|
||
return <div className="alert alert-danger">{error}</div>;
|
||
}
|
||
|
||
return (
|
||
<div>
|
||
<div className="jumbotron bg-dark text-white p-5 mb-4 rounded">
|
||
<h1 className="display-4">Добро пожаловать в наш кинотеатр!</h1>
|
||
<p className="lead">Лучшие фильмы и сериалы в одном месте</p>
|
||
<hr className="my-4" />
|
||
<p>Смотрите новинки кино и классику в отличном качестве</p>
|
||
</div>
|
||
|
||
<MovieList movies={movies} onDeleteMovie={handleDeleteMovie} isHomepage={true} />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export default HomePage; |