eslint.config.mjs

@@ -5,6 +5,13 @@ import nextTs from "eslint-config-next/typescript";
 const eslintConfig = defineConfig([
   ...nextVitals,
   ...nextTs,
+  {
+    rules: {
+      // Disable the rule that enforces the use of `next/image` for image optimization.
+      "@next/next/no-img-element": "off",
+    },
+  },
+
   // Override default ignores of eslint-config-next.
   globalIgnores([
     // Default ignores of eslint-config-next:

features/home/sections/Recommendation/main.client.tsx

@@ -4,7 +4,6 @@ import { useRef } from "react";
 import { RecommendationAnime } from "../../actions/getRecommenationAnime";
 import AnimeRecommendationCard from "./components/Card";
 import ScrollingButton from "./components/ScrollingButton";
-import { Skeleton } from "@/shared/libs/shadcn/ui/skeleton";
 
 const RecommendationClient = ({
   result,

features/home/sections/Recommendation/skeleton.tsx

@@ -6,7 +6,7 @@ const RecommendationSkeleton = () => {
   return (
     <div className="flex gap-2 w-full overflow-hidden mt-4">
       {[...Array(skeletonLenght)].map((_, index) => (
-        <div tabIndex={index}>
+        <div key={index}>
           <Skeleton className="h-88 w-64" />
           <Skeleton className="mt-3 h-6 w-64 rounded-full" />
           <Skeleton className="mt-1 h-4 w-12 rounded-full" />

features/home/sections/Recommendation/wrapper.tsx

@@ -1,7 +1,6 @@
 import { Suspense } from "react";
 import RecommendationMain from "./main";
 import RecommendationSkeleton from "./skeleton";
-import ScrollingButton from "./components/ScrollingButton";
 
 const Recommendation = async () => {
   return (