From 1c73c999ac78d2e6d3a8c68b4e17058046326f55 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Sat, 12 Jul 2025 14:55:19 +0900
Subject: feat(frontend): create pages and components

---
 frontend/src/components/MenuItem.tsx | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)
 create mode 100644 frontend/src/components/MenuItem.tsx

(limited to 'frontend/src/components/MenuItem.tsx')

diff --git a/frontend/src/components/MenuItem.tsx b/frontend/src/components/MenuItem.tsx
new file mode 100644
index 0000000..45358c8
--- /dev/null
+++ b/frontend/src/components/MenuItem.tsx
@@ -0,0 +1,28 @@
+import type { IconDefinition } from "@fortawesome/fontawesome-svg-core";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Link, useLocation } from "wouter";
+
+interface Props {
+	path: string;
+	label: string;
+	icon: IconDefinition;
+}
+
+export function MenuItem({ path, label, icon }: Props) {
+	const [location] = useLocation();
+	const isActive = location === path;
+
+	return (
+		<Link
+			href={path}
+			className={`flex items-center space-x-2 px-3 py-2 rounded-md text-sm font-medium transition-colors ${
+				isActive
+					? "bg-blue-100 text-blue-700"
+					: "text-gray-600 hover:text-gray-900 hover:bg-gray-100"
+			}`}
+		>
+			<FontAwesomeIcon icon={icon} />
+			<span>{label}</span>
+		</Link>
+	);
+}
-- 
cgit v1.2.3-70-g09d2