add-event-type
Add a new event type to the frontend feed system with corresponding React component. Use when user mentions "new event", "add event type", "event block", "new block type", or wants to display new agent output types.
Best use case
add-event-type is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Add a new event type to the frontend feed system with corresponding React component. Use when user mentions "new event", "add event type", "event block", "new block type", or wants to display new agent output types.
Teams using add-event-type should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/add-event-type/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How add-event-type Compares
| Feature / Agent | add-event-type | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Add a new event type to the frontend feed system with corresponding React component. Use when user mentions "new event", "add event type", "event block", "new block type", or wants to display new agent output types.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# Add Event Type
## Instructions
1. Read current event types in `frontend/src/App.tsx`:
- Find the `EventType` union type definition
- Review existing block components (UserMessageBlock, PlanBlock, TodoBlock, etc.)
2. Define the new event type interface:
```typescript
type NewEventType = {
type: 'new_type';
// Add required fields
};
```
3. Add to EventType union:
```typescript
type EventType = UserMessage | Plan | Todo | ... | NewEventType;
```
4. Create a new block component following existing patterns:
```typescript
function NewTypeBlock({ event }: { event: NewEventType }) {
return (
<div className="p-3 bg-zinc-800/50 rounded-lg border border-zinc-700/50">
{/* Render event data */}
</div>
);
}
```
5. Add case to the feed rendering switch/conditional in the main component
6. Update WebSocket message handler if backend sends this event type
## Examples
- "Add a new 'search_result' event type"
- "Create a block for displaying errors"
- "Add event type for progress updates"
## Guardrails
- Follow existing naming conventions (PascalCase components, snake_case event types)
- Use existing Tailwind classes for consistent styling
- Ensure TypeScript types are complete (no `any`)
- Test by sending mock event through WebSocketRelated Skills
adding-persistent-event
Adds a new type of event that gets persisted to the event log. Use this when adding new kinds of write operations to the system or when adding new events to existing code.
add_type
gwexpyに新しい配列型（Array/Series/Field）とコレクションを実装する
add-resource-events
Add real-time event emission to a resource service. Use when adding SSE/real-time capabilities to a resource. Triggers on "add events", "real-time events", "SSE events".
add-error-type
Add a new custom error type for domain-specific errors. Use when creating errors for specific business rules or HTTP status codes. Triggers on "add error", "custom error", "error type".
acc-event-sourcing-knowledge
Event Sourcing knowledge base. Provides patterns, antipatterns, and PHP-specific guidelines for Event Sourcing architecture audits.
acc-create-psr14-event-dispatcher
Generates PSR-14 Event Dispatcher implementation for PHP 8.5. Creates EventDispatcherInterface, ListenerProviderInterface, and StoppableEventInterface with event propagation. Includes unit tests.
acc-create-domain-event
Generates DDD Domain Events for PHP 8.5. Creates immutable event records with metadata, past-tense naming. Includes unit tests.
abuse-prevention
Abuse prevention - rate limiting, moderation, bad actors. Use when fighting abuse.
1k-adding-socket-events
Adds new WebSocket event subscriptions to OneKey. Use when implementing new socket events, handling server push messages, or adding real-time data subscriptions. Socket, WebSocket, event, subscription, push, real-time.
ux
This AI agent skill provides comprehensive guidance for creating professional and insightful User Experience (UX) designs, covering user research, information architecture, interaction design, visual guidance, and usability evaluation. It aims to produce actionable, user-centered solutions that avoid generic AI aesthetics.
vly-money
Generate crypto payment links for supported tokens and networks, manage access to X402 payment-protected content, and provide direct access to the vly.money wallet interface.
tech-blog
Generates comprehensive technical blog posts, offering detailed explanations of system internals, architecture, and implementation, either through source code analysis or document-driven research.