auth-yes/tasks/wip/2026-0825.01.jul.story.arch.ui-decomposition-roadmap-2300.ph2.md
Tyler Gillispie 2d25e33515 wip(ui): preserve in-flight admin drawers and scripts extraction
- 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
2026-08-26 10:37:57 -07:00

53 lines
2.2 KiB
Markdown

# 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 under
`ui/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.
### 3. Proposed Implementation
1. **Extract Admin Drawers (`ui/components/admin/drawers/`):**
- `InviteDrawer.tsx`: Invite creation form and options from
`AdminInvitesPage.tsx`.
- `GrantDrawer.tsx`: Permission grant assignment form from
`AdminUserDetailsPage.tsx`.
- `RoleEditorDrawer.tsx`: Role creation/editing form and permission picker
from `AdminRolesPage.tsx`.
- `AppDrawer.tsx`: Connected application registration drawer from
`AdminAppsPage.tsx`.
2. **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.
3. **Quality Gates & Validation:**
- Run `deno fmt`, `deno task lint`, `deno task check`.
- Run `deno test --allow-all` (ensure `ui/ui_scripts.test.ts` passes).