Menu
Implement Context Pack sheet UI and Dashboard/Session Detail entry integrations with polished interactions.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
| name | context-pack-ui-worker |
| description | Implement Context Pack sheet UI and Dashboard/Session Detail entry integrations with polished interactions. |
NOTE: Startup and cleanup are handled by worker-base. This skill defines the WORK PROCEDURE.
Use for Context Pack UI/integration work:
ContextPackSheet UI and state managementfrontend-design: Invoke before final UI implementation pass to ensure polish, spacing, and visual consistency with existing design system.fulfills.-only-testing selectors.SessionDetailView and assert visibility/order/presentation state through the rendered view path.sessionIds equality and normalized shared-body equality.ContextPackService.assemble or DataStore helpers without view-surface assertions does not satisfy CTXDETAIL/CTXCROSS contract coverage.GlassCard, design tokens, existing copy-confirm patterns); avoid introducing unrelated design systems.frontend-design skill and apply improvements that align with mission scope and current app style.ContextPackDashboardSurfaceTests, ContextPackSessionDetailSurfaceTests, ContextPackCrossFlowTests) until green..factory/services.yaml.{
"salientSummary": "Implemented ContextPackSheet and integrated Dashboard + Session Detail entry points with polished interactions. Added/updated UI tests for entry behavior, copy state, budget warnings, and cross-entrypoint consistency; validators passed.",
"whatWasImplemented": "Added ContextPackSheet with target pills, copy action, confirmation lifecycle, char-budget indicator, and empty state. Wired Dashboard overview card and Session Detail contextual action to present sheet with correct launch context. Ensured selection/default policies and anchored-vs-unanchored behavior align with contract assertions.",
"whatWasLeftUndone": "",
"verification": {
"commandsRun": [
{
"command": "xcodebuild test -project OpenBurnBar.xcodeproj -scheme OpenBurnBar -destination \"platform=macOS,arch=arm64\" -only-testing:\"OpenBurnBarTests/ContextPackDashboardSurfaceTests\" CODE_SIGNING_ALLOWED=NO CODE_SIGNING_REQUIRED=NO",
"exitCode": 0,
"observation": "Dashboard surface tests passed."
},
{
"command": "xcodebuild test -project OpenBurnBar.xcodeproj -scheme OpenBurnBar -destination \"platform=macOS,arch=arm64\" -only-testing:\"OpenBurnBarTests/ContextPackSessionDetailSurfaceTests\" CODE_SIGNING_ALLOWED=NO CODE_SIGNING_REQUIRED=NO",
"exitCode": 0,
"observation": "Session detail surface tests passed."
},
{
"command": "xcodebuild test -project OpenBurnBar.xcodeproj -scheme OpenBurnBar -destination \"platform=macOS,arch=arm64\" -only-testing:\"OpenBurnBarTests/ContextPackCrossFlowTests\" CODE_SIGNING_ALLOWED=NO CODE_SIGNING_REQUIRED=NO",
"exitCode": 0,
"observation": "Cross-flow tests passed."
}
],
"interactiveChecks": []
},
"tests": {
"added": [
{
"file": "AgentLensTests/Active/ContextPackDashboardSurfaceTests.swift",
"cases": [
{
"name": "test_dashboardContextPackCTA_presentsContextPackSheet",
"verifies": "dashboard entry point opens Context Pack sheet"
},
{
"name": "test_charBudgetIndicator_warningAboveThreshold",
"verifies": "warning state appears above 16k UI threshold"
}
]
}
]
},
"discoveredIssues": []
}
Implement a bounded OpenBurnBar Windows parity milestone from reviewed VAL contracts with main-app composition, focused tests, baseline discipline, and Windows-host evidence preparation.
Runs a long-running mission using the Zenith continuous-improvement harness to dynamically orchestrate workers, testing, and stopping discipline.
Design consultation: understands your product, researches the landscape, proposes a complete design system (aesthetic, typography, color, layout, spacing, motion), and generates font+color preview pages. Creates DESIGN.md as your project's design source of truth. For existing sites, use /plan-design-review to infer the system instead. Use when asked to "design system", "brand guidelines", or "create DESIGN.md".
Use when asked about AI-agent spend, token usage, session history, workflow patterns, or cost investigations. Grounds all answers in OpenBurnBar/BurnBar local data via prompt context and MCP tools.
Run OpenBurnBar functional QA and write qa-results/report.md plus supporting artifacts.
Design finalization: generates production-quality Pretext-native HTML/CSS. Works with approved mockups from /design-shotgun, CEO plans from /plan-ceo-review, design review context from /plan-design-review, or from scratch with a user description. Text actually reflows, heights are computed, layouts are dynamic. 30KB overhead, zero deps. Smart API routing: picks the right Pretext patterns for each design type. Use when: "finalize this design", "turn this into HTML", "build me a page", "implement this design", or after any planning skill. Proactively suggest when user has approved a design or has a plan ready. (gstack) Voice triggers (speech-to-text aliases): "build the design", "code the mockup", "make it real".