lint: fix unused stuff

components/motion-primitives/magnetic.tsx

@@ -1,22 +1,17 @@
-'use client';
+'use client'
 
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState, useEffect, useRef } from 'react'
-import {
+import { motion, useMotionValue, useSpring, type SpringOptions } from 'motion/react'
-  motion,
-  useMotionValue,
-  useSpring,
-  type SpringOptions,
-} from 'motion/react';
 
-const SPRING_CONFIG = { stiffness: 26.7, damping: 4.1, mass: 0.2 };
+const SPRING_CONFIG = { stiffness: 26.7, damping: 4.1, mass: 0.2 }
 
 export type MagneticProps = {
-  children: React.ReactNode;
+  children: React.ReactNode
-  intensity?: number;
+  intensity?: number
-  range?: number;
+  range?: number
-  actionArea?: 'self' | 'parent' | 'global';
+  actionArea?: 'self' | 'parent' | 'global'
-  springOptions?: SpringOptions;
+  springOptions?: SpringOptions
-};
+}
 
 export function Magnetic({
   children,
@@ -25,76 +20,76 @@ export function Magnetic({
   actionArea = 'self',
   springOptions = SPRING_CONFIG,
 }: MagneticProps) {
-  const [isHovered, setIsHovered] = useState(false);
+  const [isHovered, setIsHovered] = useState(false)
-  const ref = useRef<HTMLDivElement>(null);
+  const ref = useRef<HTMLDivElement>(null)
 
-  const x = useMotionValue(0);
+  const x = useMotionValue(0)
-  const y = useMotionValue(0);
+  const y = useMotionValue(0)
 
-  const springX = useSpring(x, springOptions);
+  const springX = useSpring(x, springOptions)
-  const springY = useSpring(y, springOptions);
+  const springY = useSpring(y, springOptions)
 
   useEffect(() => {
     const calculateDistance = (e: MouseEvent) => {
       if (ref.current) {
-        const rect = ref.current.getBoundingClientRect();
+        const rect = ref.current.getBoundingClientRect()
-        const centerX = rect.left + rect.width / 2;
+        const centerX = rect.left + rect.width / 2
-        const centerY = rect.top + rect.height / 2;
+        const centerY = rect.top + rect.height / 2
-        const distanceX = e.clientX - centerX;
+        const distanceX = e.clientX - centerX
-        const distanceY = e.clientY - centerY;
+        const distanceY = e.clientY - centerY
 
-        const absoluteDistance = Math.sqrt(distanceX ** 2 + distanceY ** 2);
+        const absoluteDistance = Math.sqrt(distanceX ** 2 + distanceY ** 2)
 
         if (isHovered && absoluteDistance <= range) {
-          const scale = 1 - absoluteDistance / range;
+          const scale = 1 - absoluteDistance / range
-          x.set(distanceX * intensity * scale);
+          x.set(distanceX * intensity * scale)
-          y.set(distanceY * intensity * scale);
+          y.set(distanceY * intensity * scale)
         } else {
-          x.set(0);
+          x.set(0)
-          y.set(0);
+          y.set(0)
+        }
       }
     }
-    };
 
-    document.addEventListener('mousemove', calculateDistance);
+    document.addEventListener('mousemove', calculateDistance)
 
     return () => {
-      document.removeEventListener('mousemove', calculateDistance);
+      document.removeEventListener('mousemove', calculateDistance)
-    };
+    }
-  }, [ref, isHovered, intensity, range]);
+  }, [ref, isHovered, intensity, range, x, y])
 
   useEffect(() => {
     if (actionArea === 'parent' && ref.current?.parentElement) {
-      const parent = ref.current.parentElement;
+      const parent = ref.current.parentElement
 
-      const handleParentEnter = () => setIsHovered(true);
+      const handleParentEnter = () => setIsHovered(true)
-      const handleParentLeave = () => setIsHovered(false);
+      const handleParentLeave = () => setIsHovered(false)
 
-      parent.addEventListener('mouseenter', handleParentEnter);
+      parent.addEventListener('mouseenter', handleParentEnter)
-      parent.addEventListener('mouseleave', handleParentLeave);
+      parent.addEventListener('mouseleave', handleParentLeave)
 
       return () => {
-        parent.removeEventListener('mouseenter', handleParentEnter);
+        parent.removeEventListener('mouseenter', handleParentEnter)
-        parent.removeEventListener('mouseleave', handleParentLeave);
+        parent.removeEventListener('mouseleave', handleParentLeave)
-      };
-    } else if (actionArea === 'global') {
-      setIsHovered(true);
       }
-  }, [actionArea]);
+    } else if (actionArea === 'global') {
+      setIsHovered(true)
+    }
+  }, [actionArea])
 
   const handleMouseEnter = () => {
     if (actionArea === 'self') {
-      setIsHovered(true);
+      setIsHovered(true)
+    }
   }
-  };
 
   const handleMouseLeave = () => {
     if (actionArea === 'self') {
-      setIsHovered(false);
+      setIsHovered(false)
-      x.set(0);
+      x.set(0)
-      y.set(0);
+      y.set(0)
+    }
   }
-  };
 
   return (
     <motion.div
@@ -108,5 +103,5 @@ export function Magnetic({
     >
       {children}
     </motion.div>
-  );
+  )
 }

src/app/(frontend)/page.tsx

@@ -6,13 +6,9 @@ import React from 'react'
 import UserFeed from '@/components/Feed/UserFeed'
 import { Book, Checkout, Repository } from '@/payload-types'
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
-import { TextShimmer } from '@/components/ui/text-shimmer'
 import { LoginForm } from '@/components/login-form'
 import SearchBooks from '@/components/Search/SearchBooks'
 import Manage from '@/components/Manage/Manage'
-import { Magnetic } from 'components/motion-primitives/magnetic'
-import { Button } from '@/components/ui/button'
-import Image from 'next/image'
 import HomeHero from '@/components/HomeHero'
 
 export default async function HomePage() {

src/components/Feed/UserFeed.tsx

@@ -3,17 +3,10 @@ import { getPayload, PaginatedDocs } from 'payload'
 import config from '@/payload.config'
 import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '../ui/card'
 import Image from 'next/image'
-import { BorderTrail } from 'components/motion-primitives/border-trail'
 import clsx from 'clsx'
 import Link from 'next/link'
 import { LoginForm } from '../login-form'
 
-const stats = [
-  { name: 'Outbound Loans', stat: '13' },
-  { name: 'Active Holds', stat: '6' },
-  { name: 'Hold Requests', stat: '3', shouldHighlight: true },
-]
-
 type Props = {
   user?: User
   repos: PaginatedDocs<Repository> | null
@@ -140,8 +133,9 @@ const UserFeed = async (props: Props) => {
           {stats.map((s) => {
             return (
               <div
+                key={s.name}
                 className={clsx(
-                  'relative overflow-hidden rounded-lg rounded-lg shadow-sm border border-accent px-4 pt-5 pb-12 shadow-sm sm:px-6 sm:pt-6',
+                  'relative overflow-hidden rounded-lg shadow-sm border border-accent px-4 pt-5 pb-12 sm:px-6 sm:pt-6',
                   s.shouldAnimate && 'animate-pulse',
                 )}
               >

src/components/Manage/CheckedOutBooks.tsx

@@ -31,12 +31,9 @@ const CheckedOutBooksList = (props: ListProps) => {
 
   const isReturningBook = useCallback((id: number) => id === returningBookId, [returningBookId])
 
-  const handleReturnClick = useCallback(
+  const handleReturnClick = useCallback((id: number) => {
-    (id: number) => {
     setReturningBookId(id)
-    },
+  }, [])
-    [returningBookId],
-  )
 
   return (
     <ul role="list" className="divide-y divide-gray-100">