feat: implement app directory routing, authentication flow, and dynamic reporting module

src/components/OrderCard.tsx

@@ -7,7 +7,7 @@ import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from
 import { Checkbox } from '@/components/ui/checkbox'
 import { Label } from '@/components/ui/label'
 import { Input } from '@/components/ui/input'
-import { submitOrder, getUserSubmission } from '@/app/actions'
+import { submitOrder, getUserSubmission, getSessionUser } from '@/app/actions'
 import { PlusCircle, MinusCircle, User, CheckCircle2, ShoppingBag, Sparkles, Users } from 'lucide-react'
 
 import { format } from 'date-fns'
@@ -113,11 +113,14 @@ function OrderFormModal({ order, onSuccess }: { order: any, onSuccess: () => voi
   const [error, setError] = useState('')
 
   useEffect(() => {
-    const id = localStorage.getItem('user_id')
-    if (id) {
-      setUserId(id)
-      loadExistingSubmission(id)
+    const init = async () => {
+      const user = await getSessionUser()
+      if (user?.id) {
+      setUserId(user.id)
+      loadExistingSubmission(user.id)
     }
+    }
+    init()
   }, [order.id])
 
   const loadExistingSubmission = async (uid: string) => {