package.json

@@ -9,17 +9,17 @@
     "astro": "astro"
   },
   "dependencies": {
-		"@astrojs/check": "^0.8.2",
+    "@astrojs/check": "^0.8.1",
     "@astrojs/node": "^8.3.2",
     "@astrojs/react": "^3.6.0",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-		"astro": "^4.12.2",
+    "astro": "^4.11.5",
     "bootstrap": "^5.3.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-icons": "^5.2.1",
-		"typescript": "^5.5.4"
+    "typescript": "^5.5.3"
   },
   "devDependencies": {
     "@biomejs/biome": "1.8.3"

src/components/MoviesSearchInput.tsx

@@ -16,7 +16,7 @@ export default function MoviesSearchInput({ searchUrl }: MoviesSearchInput) {
 
 	function handleOnKeyDown(e: React.KeyboardEvent<HTMLInputElement>) {
 		if (e.key === "Enter") {
-			window.location.href = `${searchUrl}?query=${value}`;
+			window.location.href = `${searchUrl}?q=${value}`;
 		}
 	}
 

src/components/lists/movies/CardMoviesList.tsx

@@ -1,14 +1,14 @@
-import type { MovieDetail } from "../../../types";
+import type { Movie } from "../../../types";
 import CardMoviesListItem from "./CardMoviesListItem";
 
 interface CardMoviesListProps {
-	movies: MovieDetail[];
+	movies: Movie[];
 }
 
 export default function CardMoviesList({ movies }: CardMoviesListProps) {
 	const items = movies.map((elt) => {
 		return (
-			<div key={elt.movie.id} className="col-2 mb-4">
+			<div key={elt.id} className="col-2 mb-4">
 				<CardMoviesListItem movie={elt} />
 			</div>
 		);

src/components/lists/movies/CardMoviesListItem.tsx

@@ -1,8 +1,8 @@
 import { FaEye } from "react-icons/fa";
-import type { Movie, MovieDetail } from "../../../types";
+import type { Movie } from "../../../types";
 
 interface CardMoviesListItemProps {
-	movie: MovieDetail;
+	movie: Movie;
 }
 
 export default function CardMoviesListItem({ movie }: CardMoviesListItemProps) {
@@ -10,7 +10,7 @@ export default function CardMoviesListItem({ movie }: CardMoviesListItemProps) {
 		<div
 			className="cardshadow"
 			style={{
-				backgroundImage: `url(${movie.movie.poster_path})`,
+				backgroundImage: `url(${movie.poster_path})`,
 				backgroundPosition: "center",
 				backgroundSize: "cover",
 				height: "320px",
@@ -23,7 +23,7 @@ export default function CardMoviesListItem({ movie }: CardMoviesListItemProps) {
 						<div style={{ height: "50%" }} className="row">
 							<div className="col align-self-end">
 								<h5 style={{ textAlign: "center", verticalAlign: "center" }}>
-									{movie.movie.title}
+									{movie.title}
 								</h5>
 							</div>
 						</div>
@@ -33,19 +33,8 @@ export default function CardMoviesListItem({ movie }: CardMoviesListItemProps) {
 						>
 							<div className="col-8 align-self-center">
 								<div className="d-grid">
-									{movie.stats ? (
-										<span className="badge text-bg-success mb-2">
-											Disponible
-										</span>
-									) : (
-										<span className="badge text-bg-warning mb-2">
-											Bientot dispo.
-										</span>
-									)}
-
-									<br />
 									<a
-										href={`/home/movies/${movie.movie.id}`}
+										href={`/home/movies/${movie.id}`}
 										className="btn btn-primary"
 									>
 										<FaEye />

src/pages/home/index.astro

@@ -2,20 +2,16 @@
 import MoviesSearchInput from "../../components/MoviesSearchInput";
 import CardMoviesList from "../../components/lists/movies/CardMoviesList";
 import HomeLayout from "../../layouts/HomeLayout.astro";
-import type { MovieDetail } from "../../types";
+import type { Movie } from "../../types";
 
 const jwt = Astro.cookies.get("jwt")?.value as string;
-
 const url = new URL(Astro.request.url);
-const query = url.searchParams.get("query");
-const limit = url.searchParams.get("limit") ?? "18";
 
-const queryParams = new URLSearchParams({
+const queryParams = new URLSearchParams();
-    limit: limit,
+const query = url.searchParams.get("q");
-});
 
 if (query) {
-    queryParams.append("query", query);
+    queryParams.append("q", query);
 }
 
 const res = await fetch(
@@ -29,7 +25,8 @@ const res = await fetch(
     },
 );
 
-const resBody = (await res.json()) as { movies: MovieDetail[] };
+const resBody = (await res.json()) as { movies: Movie[] };
+const account = Astro.locals.account;
 ---
 
 <HomeLayout title="Movies">

src/pages/home/movies/[id].astro

@@ -1,6 +1,7 @@
 ---
+import { FaEye } from "react-icons/fa";
 import HomeLayout from "../../../layouts/HomeLayout.astro";
-import type { Movie, MovieDetail } from "../../../types";
+import type { Movie } from "../../../types";
 
 const jwt = Astro.cookies.get("jwt")?.value as string;
 const { id } = Astro.params;
@@ -13,17 +14,17 @@ const res = await fetch(`${import.meta.env.API_URL}/movies/${id}`, {
 	},
 });
 
-const item = (await res.json()).movie as MovieDetail;
+const movie = (await res.json()).movie as Movie;
 ---
 
-<HomeLayout title={item.movie.title}>
+<HomeLayout title={movie.title}>
 	<>
-		<h1>{item.movie.title}</h1>
+		<h1>{movie.title}</h1>
 		<div class="card">
 			<div
 				class="card-body"
 				style={{
-					background: `linear-gradient(to left, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 1), rgba(0, 0, 0, 1)), url(${item.movie.backdrop_path})`,
+					background: `linear-gradient(to left, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 1), rgba(0, 0, 0, 1)), url(${movie.backdrop_path})`,
 					backgroundPosition: "center",
 					backgroundSize: "cover",
 					minHeight: "512px",
@@ -31,30 +32,22 @@ const item = (await res.json()).movie as MovieDetail;
 			>
 				<div class="row" style={{ height: "512px" }}>
 					<div class="col align-self-center">
-						<p>{item.movie.overview}</p>
+						<p>{movie.overview}</p>
 					</div>
 					<div class="col align-self-center">
 						<div class="d-grid">
-							{
-								item.stats ? (
 							<a
-										href={`/home/movies/${item.movie.id}`}
+								href={`/home/movies/${movie.id}`}
 								class="btn btn-primary"
 							>
 								Watch
 							</a>
-								) : (
-									<span class="badge text-bg-warning">
-										Bientot disponible
-									</span>
-								)
-							}
 						</div>
 						<hr />
 
 						<div class="d-grid">
 							<a
-								href={`/home/movies/${item.movie.id}`}
+								href={`/home/movies/${movie.id}`}
 								class="btn btn-secondary"
 							>
 								Share

src/types.ts

@@ -1,7 +1,3 @@
-export interface ObjectStats {
-	size: number;
-}
-
 export interface Movie {
 	id: number;
 	title: string;
@@ -11,15 +7,6 @@ export interface Movie {
 	release_date: string;
 }
 
-export interface MovieDetail {
-	movie: Movie;
-	stats?: ObjectStats;
-}
-
-export type SearchMovie = {
-	ready: boolean;
-} & Movie;
-
 export interface CreateMovie {
 	title: string;
 	overview: string;