Remove an unused library (#1471)

* chore: Remove an unused library

* feat: Change the loading icon

* feat: add divider class

package.json

@@ -57,7 +57,6 @@
 		"class-variance-authority": "0.7.0",
 		"clsx": "2.1.1",
 		"ky": "1.3.0",
-		"lucide-react": "0.396.0",
 		"next": "14.2.4",
 		"react": "18.3.1",
 		"react-dom": "18.3.1",

src/components/templates/Hobbies/index.tsx

@@ -8,9 +8,9 @@ export default function Hobbies() {
 	return (
 		<main>
 			<PageTitleWrapper>Hobbies</PageTitleWrapper>
-			<section className="flex flex-col items-center m-0 md:m-auto">
+			<section className="flex flex-col items-center h-full m-0 md:m-auto">
 				<h4>Steam ライブラリ</h4>
-				<ul className="flex flex-col gap-1 bg-gray-100 w-full h-full overflow-x-hidden overflow-y-auto">
+				<ul className="grow flex flex-col gap-1 divide-y w-full h-full overflow-x-hidden overflow-y-auto">
 					{isLoading ? (
 						<LoadingSpinner />
 					) : (

src/components/ui/LoadingSpinner.tsx

@@ -1,9 +1,9 @@
-import { Loader2 } from 'lucide-react'
+import { AiOutlineLoading } from 'react-icons/ai'
 
 const LoadingSpinner = () => (
 	<div className="flex justify-center items-center text-sm text-muted-foreground h-full">
-		<Loader2 className="mr-2 h-4 w-4 animate-spin" />
-		Loading...
+		<AiOutlineLoading className="mr-2 h-4 w-4 animate-spin" />
+		<p>Loading...</p>
 	</div>
 )