refactor(all): migrate from React to Next.js

src/components/Navbar.tsx

@@ -1,5 +1,7 @@
+"use client";
+
 import { useMemo, useState } from 'react';
-import { Link, NavLink, useNavigate } from 'react-router-dom';
+import { Link, NavLink, useNavigate } from '@/lib/router';
 import { Menu, ChevronDown } from 'lucide-react';
 import { useAuth } from '@/contexts/AuthContext';
 import { Button } from '@/components/ui/button';
@@ -63,7 +65,7 @@ export default function Navbar() {
           <ChevronDown className="h-4 w-4 text-muted-foreground" />
         </button>
       </DropdownMenuTrigger>
-      <DropdownMenuContent align="end" className="w-56" dir="rtl">
+      <DropdownMenuContent align="end" className="w-56 text-right">
         <DropdownMenuLabel className="text-xs text-muted-foreground">
           {user?.first_name || user?.last_name ? `${user?.first_name || ''} ${user?.last_name || ''}`.trim() : user?.username}
         </DropdownMenuLabel>