Trace application behavior and explain data structures using compact text tree diagrams. The diagrams connect user actions to real functions, data types, state changes, and the components that render again as a result.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Analyze and design control flows and data structures. Produces compact ASCII tree diagrams showing triggers, call chains, payload shapes, state mutations, and re-render effects. Use when user asks to diagram, trace, visualize, or design a flow or data structure.
설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
Read the relevant source code and produce ASCII tree diagrams inside ```txt blocks.
Example:
User taps "Archive"
│
├─ handleActionPress(action: SessionActionItem)
│ └─ onClose() → setActionsAnchor(null)
│
├─ sessionKill(sessionId: string)
│ ├─ POST /api/sessions/:id/kill
│ └─ → { success: boolean, message?: string }
│
└─ deleteSession(sessionId)
├─ mutates: sessions, sessionMessages, gitStatus, fileCache
├─ rebuilds: sessionListViewData
└─ re-renders: SessionsListWrapper (data ref changed)
For data structures, show the shape and what depends on it:
SessionRowData (flat primitives, cheap deep-equal)
├─ id, name, subtitle, avatarId ← identity + display
├─ state: SessionState ← collapsed from presence + agentState + thinking
├─ hasDraft: boolean ← collapsed from draft string
├─ activeAt?: number ← only inactive sessions (avoids heartbeat diffs)
├─ machineId, path, homeDir ← grouping in ActiveSessionsGroup
└─ completedTodosCount, totalTodosCount
│
consumed by:
├─ SessionItem → renders purely from props, no store hooks
├─ ActiveSessionsGroup → groups by machineId + path
└─ useDeepEqual → 12 primitive comparisons vs full Session tree
아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
Automate real browser tasks to test websites, complete forms, and collect page information. The skill guides agents through identifying clickable elements, interacting with pages, comparing page states, and saving screenshots or PDFs.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Set up and run Happy components locally, including its CLI, server, mobile app, and desktop app. The guide covers building, testing, checking logs, and separating development data using pnpm, the project's package management tool.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Organize Happy's GitHub issues, find duplicates, and check whether reported bugs are fixed on main, the primary development branch. Prepare replies and proposed actions for maintainer review, with explicit approval required before changes affecting contributors.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Query Prometheus metrics through Grafana and manage dashboards as JSON files. Use it to investigate current values and trends, add or adjust panels, and preview dashboard updates before applying them.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Develop a product or side-project idea through guided questions and premise checks. Startup discussions examine evidence of demand, while builder discussions explore possibilities and scope, producing a design document before implementation begins.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.
Guide releases of Happy's CLI, mobile app, web app, and server. Choose versions and release channels, follow build and test checks, publish through the designated services, and verify the resulting packages or app updates.
한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.