The admin project editor runs seven forms on one page

When I open a project in the admin panel, I land on a page with five tabs — Session Notes, Milestones, Deliverables, Action Items, and Comments. Each tab has its own form. A sixth form for adding goals sits permanently at the bottom. The page initialises seven useActionState hooks simultaneously — one for each server action. Each hook returns a state object, an action function, and a pending boolean. The forms are independent. I can add a milestone, switch to the session tab, write notes, switch to deliverables, add a file, and come back to milestones — each form maintains its own state and its own success or error message. The session notes tab has a duration field defaulting to forty-five minutes, a textarea for the notes, and a FileDropZone component for attaching recordings or documents. The milestones tab has a quick-add form and a status update form where I paste a milestone ID and select a new status from a dropdown. The deliverables tab collects a title, optional description, and optional due date. The action items tab has an assignment selector — James or Client — that controls who sees the task and who gets the notification email. The comments tab lets me post as James on any session, milestone, or goal by pasting its entity ID. Every form has a forty-eight pixel minimum height on inputs and buttons. Every form disables its submit button while pending and shows a text indicator — Saving, three dots, or the action name. Every form clears its feedback message when you switch tabs because the tab switch re-renders only the active panel. One client component, seven hooks, five tabs, zero page navigations between admin operations.