From eecaeb13e8e0dc552e48c22f3464762973942c56 Mon Sep 17 00:00:00 2001
From: Rafi Arrafif <rafiarrafif05@gmail.com>
Date: Sun, 15 Mar 2026 22:32:21 +0700
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=A8=20fix:=20resolve=20linting=20type?=
 =?UTF-8?q?=20error?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 eslint.config.mjs                                     | 7 +++++++
 features/home/sections/Recommendation/main.client.tsx | 1 -
 features/home/sections/Recommendation/skeleton.tsx    | 2 +-
 features/home/sections/Recommendation/wrapper.tsx     | 1 -
 4 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index 05e726d..e764709 100644
--- a/eslint.config.mjs
+++ b/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:
diff --git a/features/home/sections/Recommendation/main.client.tsx b/features/home/sections/Recommendation/main.client.tsx
index 5fe7faa..3fae04f 100644
--- a/features/home/sections/Recommendation/main.client.tsx
+++ b/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,
diff --git a/features/home/sections/Recommendation/skeleton.tsx b/features/home/sections/Recommendation/skeleton.tsx
index ed77a66..7b9ee76 100644
--- a/features/home/sections/Recommendation/skeleton.tsx
+++ b/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" />
diff --git a/features/home/sections/Recommendation/wrapper.tsx b/features/home/sections/Recommendation/wrapper.tsx
index 24baaed..e30071c 100644
--- a/features/home/sections/Recommendation/wrapper.tsx
+++ b/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 (