Newer
Older
import {
Card,
Col,
Divider,
Row,
Space,
} from "antd";
import Meta from "antd/lib/card/Meta";

Lukáš Kratochvíl
committed
import React, { useEffect, useState } from "react";
Tomáš Havlíček
committed
import { Link } from "react-router-dom";
import axiosConfig from "../axios-config";
import { MovieDTO } from "../dto";
import { ErrorPage } from "./ErrorPage";
Tomáš Havlíček
committed
//example - TODO replace this with API preview call - get RECENT movies (probably 6-7 is enough)
export const cardsDataExample2: MovieDTO[] = [
{
id: "1",
originalName: "Cars",
name: "Auta",
intro: "auta ve filmu",
publishedAt: "7.8.2005",
runTimeMinutes: 125,
director: {
id: "xd123",
name: "Kenny",
surname: "Omega",
},
picture: "https://upload.wikimedia.org/wikipedia/en/3/34/Cars_2006.jpg",
},
{
id: "2",
originalName: "Monster House",
name: "V tom domě straší",
intro: "jo ten dum je docela spooky",
publishedAt: "4.4.1994",
runTimeMinutes: 80,
picture:
"https://images-na.ssl-images-amazon.com/images/S/pv-target-images/9a996123e0b01f618ab2291b479f9d5034de354b2d1bb58979ddc6937588dfa8._RI_V_TTW_.jpg",
director: {
id: "xp234",
name: "Bray",
surname: "Wyatt",
},
},
{
id: "3",
originalName: "Pokemon",
name: "Pokémon",
intro: "Gotta catch them all.",
publishedAt: "9.9.1970",
runTimeMinutes: 600,
picture:
"https://www.obchod.crew.cz/im/coc/1280/0/content/629080/cover_image.1607432614.jpg",
director: {
id: "xc456",
name: "Kazuchika",
surname: "Okada",
},
},
{
id: "4",
originalName: "Gympl",
name: "Gympl",
intro: "VO SEDUMNÁCT METRŮ?",
publishedAt: "2.2.2005",
runTimeMinutes: 96,
picture:
"https://img.csfd.cz/files/images/user/profile/162/847/162847510_91e839.jpg",
director: {
id: "xs789",
name: "Tomáš",
surname: "Vorel",
birthDate: "někdy minulé století",
},
},
{
id: "5",
originalName: "Toy Story",
name: "Příběh hraček",
intro: "Hmm the floor here is made of floor",
publishedAt: "4.5.1999",
runTimeMinutes: 90,
picture:
"https://m.media-amazon.com/images/M/MV5BMDU2ZWJlMjktMTRhMy00ZTA5LWEzNDgtYmNmZTEwZTViZWJkXkEyXkFqcGdeQXVyNDQ2OTk4MzI@._V1_.jpg",
director: {
id: "xl753",
name: "Tomohiro",
surname: "Ishii",
},
},
{
id: "6",
name: "Smoke",
originalName: "Kouř",
intro:
"Jedu dál stále s tebou víme kam cesty vedou je to fajn fajn fajn je to fajn fajnový",
publishedAt: "17.11.1989",
runTimeMinutes: 50,
picture:
"https://img.csfd.cz/files/images/user/profile/164/556/164556101_d8e43b.jpg",
director: {
id: "xx787",
name: "Zdenda",
surname: "Pohlreich",
export const Preview: React.FC = () => {
const [movies, setMovies] = useState<MovieDTO[]>([]);
const [isError, setIsError] = useState<boolean>(false);
useEffect(() => {
const fetchCategories = async () => {
try {
const response = await axiosConfig.get("movies?mostRecentCnt=6");
setMovies(response.data);
} catch (err) {
setIsError(true);
}
}
void fetchCategories();
}, [])
if (isError) {

Lukáš Kratochvíl
committed
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
<Space
className="preview"
direction="vertical"
style={{ display: "flex", paddingTop: "2%" }}
>
<Card title="Editor's picks">
<Row justify="space-evenly" gutter={50}>
{movies.map((movie) => {
return (
<Col flex={1}>
<Link to={`/movie/${movie.id}`}>
<Card
hoverable
style={{
width: "240px",
}}
cover={<img alt={movie.name} src={movie.picture} />}
>
<Meta title={movie.name} description={movie.originalName} />
</Card>
</Link>
</Col>
);
})}
</Row>
</Card>
<Divider/>
<Card title="Recent movies" >
<Row justify="space-evenly" gutter={50}>
{cardsDataExample2.map((movie) => {
return (
<Col flex={1}>
<Link to={`/movie/${movie.id}`}>
<Card
hoverable
style={{
width: "240px",
}}
cover={<img alt={movie.name} src={movie.picture} />}
>
<Meta title={movie.name} description={movie.originalName} />
</Card>
</Link>
</Col>
);
})}
</Row>

Lukáš Kratochvíl
committed
</Card>