- Preserves extracted components: AppDrawer, InviteDrawer, RoleEditorDrawer - Preserves extracted SSR JSX scripts: AdminAppsScript, AdminInvitesScript, AdminRolesScript - Parks Phase 2 task spec in tasks/wip/ - Checkpoint preserved AS IS from session 3615485303186036917
2.2 KiB
2.2 KiB
TASK METADATA
- Target Files:
ui/components/AdminInvitesPage.tsx,ui/components/AdminUserDetailsPage.tsx,ui/components/AdminRolesPage.tsx,ui/components/AdminAppsPage.tsx,ui/components/admin/drawers/*.tsx,ui/components/admin/*.tsx,ui/ui_scripts.test.ts - Core Objective: Phase 2 (Admin Drawers & Scripts): Decompose large admin
pages by extracting form drawers under
ui/components/admin/drawers/and client script blocks into dedicated SSR JSX script components underui/components/admin/. - Dependencies:
tasks/new/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.md - Additional Important Notes: Strictly 100% pure Hono SSR JSX. Preserve all
form submit handlers, action endpoints, and pass
ui/ui_scripts.test.ts.
2. Architectural Considerations & Risks
- Risks:
- Breaking admin drawer open/close functions or invite generation triggers if script functions are missing or mismatched.
- Mitigation:
- Encapsulate scripts into dedicated SSR JSX script components
(
AdminInvitesScript.tsx,AdminAppsScript.tsx, etc.) and ensure all client IDs match.
- Encapsulate scripts into dedicated SSR JSX script components
(
3. Proposed Implementation
-
Extract Admin Drawers (
ui/components/admin/drawers/):InviteDrawer.tsx: Invite creation form and options fromAdminInvitesPage.tsx.GrantDrawer.tsx: Permission grant assignment form fromAdminUserDetailsPage.tsx.RoleEditorDrawer.tsx: Role creation/editing form and permission picker fromAdminRolesPage.tsx.AppDrawer.tsx: Connected application registration drawer fromAdminAppsPage.tsx.
-
Extract Admin Script Components (
ui/components/admin/):AdminInvitesScript.tsx: Client-side handlers for invite generation, clipboard copy, and redemption modal.AdminAppsScript.tsx: Client-side handlers for app registration, edit prefill, and delete.AdminRolesScript.tsx: Client-side handlers for role save and permission checkboxes.AdminUserDetailsScript.tsx: Client-side handlers for grant revoke and session kill.
-
Quality Gates & Validation:
- Run
deno fmt,deno task lint,deno task check. - Run
deno test --allow-all(ensureui/ui_scripts.test.tspasses).
- Run