Dev

app/api/anime-infov1/route.ts

@@ -16,9 +16,9 @@ export async function GET(request: NextRequest) {
     const { data } = await AnimeServiceV1.getAnimeInfoV1Gogo(query);
     return NextResponse.json(data);
   } catch (error) {
-    console.error("Error searching anime:", error);
+    console.error("Error to give animev1 info:", error);
     return NextResponse.json(
-      { error: "Failed to search anime" },
+      { error: "Failed to give animev1 info" },
       { status: 500 }
     );
   }

app/api/anime-infov2/route.ts

@@ -16,9 +16,9 @@ export async function GET(request: NextRequest) {
     const { data } = await AnimeServiceV2.getAnimeInfoV2(query);
     return NextResponse.json(data);
   } catch (error) {
-    console.error("Error searching anime:", error);
+    console.error("Failed to give animev2 info", error);
     return NextResponse.json(
-      { error: "Failed to search anime" },
+      { error: "Failed to give animev2 info" },
       { status: 500 }
     );
   }

app/api/anime-search/route.ts

@@ -1,19 +1,25 @@
-import { NextRequest, NextResponse } from 'next/server'
-import { AnimeServiceV2 } from '@/services'
+import { NextRequest, NextResponse } from "next/server";
+import { AnimeServiceV2 } from "@/services";
 
 export async function GET(request: NextRequest) {
-  const searchParams = request.nextUrl.searchParams
-  const query = searchParams.get('query')
+  const searchParams = request.nextUrl.searchParams;
+  const query = searchParams.get("query");
 
   if (!query) {
-    return NextResponse.json({ error: 'Query parameter is required' }, { status: 400 })
+    return NextResponse.json(
+      { error: "Query parameter is required" },
+      { status: 400 }
+    );
   }
 
   try {
-    const { data } = await AnimeServiceV2.searchAnimeV2(query)
-    return NextResponse.json(data)
+    const { data } = await AnimeServiceV2.searchAnimeV2(query);
+    return NextResponse.json(data);
   } catch (error) {
-    console.error('Error searching anime:', error)
-    return NextResponse.json({ error: 'Failed to search anime' }, { status: 500 })
+    console.error("Error searching animev2:", error);
+    return NextResponse.json(
+      { error: "Failed to search animev2" },
+      { status: 500 }
+    );
   }
 }

app/api/animestream/route.ts

@@ -16,11 +16,10 @@ export async function GET(request: NextRequest) {
     const { data } = await AnimeServiceV1.getAnimeStreamGogo(query);
     return NextResponse.json(data);
   } catch (error) {
-    console.error("Error searching anime:", error);
+    console.error("Failed to give animev1 stream", error);
     return NextResponse.json(
-      { error: "Failed to search anime" },
+      { error: "Failed to give animev1 stream" },
       { status: 500 }
     );
   }
 }
-

app/api/movie-search/route.ts

@@ -1,20 +1,25 @@
-import { NextRequest, NextResponse } from 'next/server'
-import { MovieService } from '@/services'
+import { NextRequest, NextResponse } from "next/server";
+import { MovieService } from "@/services";
 
 export async function GET(request: NextRequest) {
-  const searchParams = request.nextUrl.searchParams
-  const query = searchParams.get('query')
+  const searchParams = request.nextUrl.searchParams;
+  const query = searchParams.get("query");
 
   if (!query) {
-    return NextResponse.json({ error: 'Query parameter is required' }, { status: 400 })
+    return NextResponse.json(
+      { error: "Query parameter is required" },
+      { status: 400 }
+    );
   }
 
   try {
-    const { data } = await MovieService.searchMovie(query)
-    return NextResponse.json(data)
+    const { data } = await MovieService.searchMovie(query);
+    return NextResponse.json(data);
   } catch (error) {
-    console.error('Error searching anime:', error)
-    return NextResponse.json({ error: 'Failed to search anime' }, { status: 500 })
+    console.error("Failed to search movie", error);
+    return NextResponse.json(
+      { error: "Failed to search movie" },
+      { status: 500 }
+    );
   }
 }
-

app/components/card/animecard/AnimeCard.tsx

@@ -62,7 +62,7 @@ const AnimeCard = ({ anime }: AnimeCardProps) => {
 
           {isPopularAnime(anime) && (
             <SmallInfo
-              year={String(anime?.seasonYear)}
+              year={String(anime?.seasonYear || anime.format)}
               genre={anime?.genres?.[0]}
               rating={String(anime?.averageScore / 10)}
             />

app/components/detail/cardbanner/CardBanner.tsx

@@ -1,5 +1,5 @@
 "use client";
-import { useState, useMemo } from "react";
+import { useState, useMemo, useEffect } from "react";
 import Image from "next/image";
 import { AnimeInfo } from "@/types/anime.type";
 import { MovieInfo, TVInfo } from "@/types/movies.type";
@@ -13,6 +13,14 @@ function CardBanner({ item }: CardBannerProps) {
   const pathName = usePathname();
   const fallbackCard = "/fallback-card.webp";
   const [isImageLoading, setImageLoading] = useState(true);
+  const [isMobile, setIsMobile] = useState(false);
+
+  useEffect(() => {
+    const handleResize = () => setIsMobile(window.innerWidth < 640); // Tailwind's mobile breakpoint (sm: 640px)
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
 
   const isAnime = useMemo(() => pathName.split("/")[1] === "anime", [pathName]);
 
@@ -69,6 +77,8 @@ function CardBanner({ item }: CardBannerProps) {
     return [];
   }, [item]);
 
+  const genreSlice = isMobile ? genres.slice(0, 2) : genres.slice(0, 3);
+
   return (
     <div
       className={`${
@@ -99,7 +109,7 @@ function CardBanner({ item }: CardBannerProps) {
           {title}
         </p>
         <div className="flex flex-wrap gap-1 text-xs text-white sm:gap-2 sm:text-base">
-          {genres.slice(0, 3).map((genre: string, i: number) => (
+          {genreSlice.map((genre: string, i: number) => (
             <div
               key={i}
               className="flex items-center truncate rounded bg-gray-400 p-1 text-center font-semibold text-black sm:max-w-full"

app/types/anime.type.ts

@@ -98,6 +98,7 @@ export type Anime = {
   coverImage?: CoverImage;
   episodes: number | null;
   meanScore?: number;
+  format?: string;
   duration: number;
   season: string;
   seasonYear?: number;