feat: Add NoteForm, ProjectForm, and ProjectTaskForm components

- Implemented NoteForm for adding notes to projects.
- Created ProjectForm for managing project details with contract selection.
- Developed ProjectTaskForm for adding tasks to projects, supporting both templates and custom tasks.

feat: Add ProjectTasksSection component

- Introduced ProjectTasksSection to display and manage tasks for a specific project.
- Includes functionality for adding, updating, and deleting tasks.

feat: Create TaskTemplateForm for managing task templates

- Added TaskTemplateForm for creating new task templates with required wait days.

feat: Implement UI components

- Created reusable UI components: Badge, Button, Card, Input, Loading, Navigation.
- Enhanced user experience with consistent styling and functionality.

feat: Set up database and queries

- Initialized SQLite database with tables for contracts, projects, tasks, project tasks, and notes.
- Implemented queries for managing contracts, projects, tasks, and notes.

chore: Add error handling and loading states

- Improved error handling in forms and data fetching.
- Added loading states for better user feedback during data operations.

src/components/ui/Navigation.js

@@ -0,0 +1,52 @@
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+
+const Navigation = () => {
+	const pathname = usePathname();
+
+	const isActive = (path) => {
+		if (path === "/") return pathname === "/";
+		return pathname.startsWith(path);
+	};
+
+	const navItems = [
+		{ href: "/", label: "Dashboard" },
+		{ href: "/projects", label: "Projects" },
+		{ href: "/tasks/templates", label: "Task Templates" },
+		{ href: "/contracts", label: "Contracts" },
+	];
+
+	return (
+		<nav className="bg-white border-b border-gray-200">
+			<div className="max-w-6xl mx-auto px-6">
+				<div className="flex items-center justify-between h-16">
+					<div className="flex items-center">
+						<Link href="/" className="text-xl font-bold text-gray-900">
+							Project Panel
+						</Link>
+					</div>
+
+					<div className="flex space-x-8">
+						{navItems.map((item) => (
+							<Link
+								key={item.href}
+								href={item.href}
+								className={`px-3 py-2 rounded-md text-sm font-medium transition-colors ${
+									isActive(item.href)
+										? "bg-blue-100 text-blue-700"
+										: "text-gray-600 hover:text-gray-900 hover:bg-gray-50"
+								}`}
+							>
+								{item.label}
+							</Link>
+						))}
+					</div>
+				</div>
+			</div>
+		</nav>
+	);
+};
+
+export default Navigation;