Renders the full Help Center surface for the OpenFrame `/tickets` page, managing ticket listing, creation, optimistic updates, and drawer state via URL params. ## Key Components ### `HelpCenterList` (default export) Top-level component that gates rendering on auth state: - **Loading** → renders `DevSectionPage` with skeleton placeholders - **Anon** → renders a sign-in `EmptyState` - **Authed** → delegates to `HelpCenterListAuthed` with resolved session identity ### `HelpCenterListAuthed` (internal) Core authenticated view handling: - **`useTicketsList`** — fetches paginated tickets from URL params (`?search=`, `?status=`, `?page=`); live-polls while a drawer is open - **`useTicketActions`** — mutation handlers with optimistic prepend/remove callbacks - **Optimistic state** — local `useState` (not TanStack cache) so pending placeholders survive refetches triggered by filter changes - **Drawer state** — derived from `?ticket=` URL param; a single `setOpenTicket` callback reads/writes it via `router.replace` ### `HelpCenterListProps` | Prop | Type | Description | |---|---|---| | `toast` | `typeof defaultToast` | Test-friendly toast override | | `backButton` | `{label?, href?} \| false` | Forwarded to `DevSectionPage` chrome | | `title` | `string` | Override hero title (e.g. `"Support Tickets"`) | | `shell` | `boolean` | Pass `false` when host layout provides the page container | ## Usage Example ```typescript // Standard mount on the /tickets route import { HelpCenterList } from '@openframe/lib' export default function TicketsPage() { return } // Embedded in a custom host layout with overrides export default function SupportPage() { return ( ) } ``` > **Deep-linking:** Append `?ticket=` to auto-open a specific ticket drawer on load. All open/close/share flows route through this single URL param. **Source:** [`help-center-list.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/help-center-list.tsx)