WJ-17 - New: Get favorite list;

WJ-17 - New: Get movie details;
WJ-17 - New: Merge favorite and details;

src/domains/Favorites/api/List/RawResponse.ts

@@ -1,7 +1,7 @@
 export default interface RawResponse {
   id: string;
   user_id: string;
-  movie_id: string;
+  movie_id: number;
   created_at: string;
   updated_at: string;
 }

src/domains/Favorites/api/List/Response.ts

@@ -1,5 +1,7 @@
-export default interface Response {
+import DetailsResponse from 'domains/Movie/api/Details/Response';
+
+export default interface Response extends Omit<DetailsResponse, 'id'> {
   id: string;
   userId: string;
-  movieId: string;
+  movieId: number;
 }

src/domains/Favorites/api/List/index.ts

@@ -2,6 +2,7 @@ import api from 'services/api';
 
 import RawResponse from 'domains/Favorites/api/List/RawResponse';
 import Response from 'domains/Favorites/api/List/Response';
+import { Details } from 'domains/Movie/api';
 
 const Favorites = async (): Promise<Response[]> => {
   const response = await rawFavorites();
@@ -15,20 +16,32 @@ export const rawFavorites = async (): Promise<RawResponse[]> => {
   return response.data;
 };
 
-const parseResponse = (rawResponse: RawResponse[]): Response[] => {
-  let response = [] as Response[];
+const parseResponse = async (
+  rawResponse: RawResponse[],
+): Promise<Response[]> => {
+  let response = [] as any[];
 
+  // Parse API user favorites
   rawResponse.forEach(favorite => {
     const parsedFavorite = {
       id: favorite.id,
       userId: favorite.user_id,
       movieId: favorite.movie_id,
-    } as Response;
+    };
 
     response = [...response, parsedFavorite];
   });
 
-  return response;
+  // Get favorites details from TMDB API and merge
+  const parsedResponse = response.map(async (favorite: Response) => {
+    const details = await Details(favorite.movieId);
+
+    return { ...details, ...favorite, id: favorite.id };
+  });
+
+  const resolvedResponse = await Promise.all(parsedResponse);
+
+  return resolvedResponse;
 };
 
 export default Favorites;

src/domains/Movie/api/Details/RawResponse.ts

@@ -0,0 +1,21 @@
+export default interface RawResponse {
+  poster_path?: string;
+  budget: number;
+  overview: string;
+  release_date: string;
+  genres: [
+    {
+      id: number;
+      name: string;
+    },
+  ];
+  id: number;
+  original_title: string;
+  original_language: string;
+  title: string;
+  backdrop_path?: string;
+  popularity: number;
+  vote_count: number;
+  video: boolean;
+  vote_average: number;
+}

src/domains/Movie/api/Details/Response.ts

@@ -0,0 +1,19 @@
+export default interface Response {
+  poster?: string;
+  backdrop?: string;
+  budget: number;
+  overview: string;
+  releaseDate: string;
+  genres: [
+    {
+      id: number;
+      name: string;
+    },
+  ];
+  id: number;
+  originalTitle: string;
+  title: string;
+  popularity: number;
+  voteCount: number;
+  voteAverage: number;
+}

src/domains/Movie/api/Details/index.ts

@@ -0,0 +1,40 @@
+import tmdb from 'services/api/tmdb';
+
+import RawResponse from 'domains/Movie/api/Details/RawResponse';
+import Response from 'domains/Movie/api/Details/Response';
+import formatDate from 'shared/utils/formatDate';
+import formatTmdbImage from 'shared/utils/formatTmdbImage';
+
+const Details = async (movieId: number): Promise<Response> => {
+  const response = await rawPopular(movieId);
+
+  return parseResponse(response);
+};
+
+export const rawPopular = async (movieId: number): Promise<RawResponse> => {
+  const response = await tmdb.get(`/movie/${movieId}`);
+
+  return response.data;
+};
+
+const parseResponse = (movie: RawResponse): Response => {
+  const parsedMovie = {
+    overview: movie.overview,
+    budget: movie.budget,
+    genres: movie.genres,
+    id: movie.id,
+    originalTitle: movie.original_title,
+    title: movie.title,
+    popularity: movie.popularity,
+    voteCount: movie.vote_count,
+    voteAverage: movie.vote_average,
+
+    releaseDate: formatDate({ value: movie.release_date }),
+    poster: formatTmdbImage({ value: movie.poster_path }),
+    backdrop: formatTmdbImage({ value: movie.backdrop_path }),
+  } as Response;
+
+  return parsedMovie;
+};
+
+export default Details;

src/domains/Movie/api/index.ts

@@ -1,2 +1,3 @@
+export { default as Details } from './Details';
 export { default as NowPlaying } from './NowPlaying';
 export { default as Popular } from './Popular';

src/screens/Home/index.tsx

@@ -30,6 +30,7 @@ const Home: React.FC = () => {
         <Highlights movies={popularList} />
         <MovieList theme="light" title="Populares" data={popularList} />
         <MovieList theme="light" title="Lançamentos" data={nowPlayingList} />
+        <MovieList theme="light" title="Favoritos" data={favoriteList} />
       </ContentContainer>
       <Footer />
       <HeaderBackground />