Agent skill
momentum-api
Work with Momentum API for data operations in Angular components
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/other/momentum-api-donaldmurillo-momentum-cms
SKILL.md
Momentum API Usage
Guide for using injectMomentumAPI() in Angular components.
Arguments
$ARGUMENTS- Operation type: "query", "crud", "typed", or collection name
Quick Reference
Inject the API
import { injectMomentumAPI } from '@momentumcms/admin';
@Component({...})
export class MyComponent {
private readonly api = injectMomentumAPI();
}
Query Data (Observables)
// In constructor or with toSignal()
this.api
.collection<Post>('posts')
.find$({ limit: 10 })
.subscribe((result) => {
this.posts.set(result.docs);
});
Query Data (Promises)
async loadData(): Promise<void> {
const result = await this.api.collection<Post>('posts').find({ limit: 10 });
this.posts.set(result.docs);
}
CRUD Operations
// Create
const post = await this.api.collection<Post>('posts').create({ title: 'New Post' });
// Read
const post = await this.api.collection<Post>('posts').findById('123');
// Update
const updated = await this.api.collection<Post>('posts').update('123', { title: 'Updated' });
// Delete
const result = await this.api.collection<Post>('posts').delete('123');
Find Options
interface FindOptions {
where?: Record<string, unknown>; // Filter conditions
sort?: string; // Sort field (prefix with - for desc)
limit?: number; // Max results (default: 10)
page?: number; // Page number (default: 1)
}
Full Component Example
import { Component, signal, ChangeDetectionStrategy } from '@angular/core';
import { injectMomentumAPI } from '@momentumcms/admin';
@Component({
selector: 'app-posts',
template: `
@if (loading()) {
<p>Loading...</p>
} @else {
@for (post of posts(); track post.id) {
<article>
<h2>{{ post.title }}</h2>
<button (click)="deletePost(post.id)">Delete</button>
</article>
}
}
`,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class PostsComponent {
private readonly api = injectMomentumAPI();
readonly posts = signal<any[]>([]);
readonly loading = signal(true);
constructor() {
this.loadPosts();
}
async loadPosts(): Promise<void> {
this.loading.set(true);
try {
const result = await this.api.collection('posts').find({
limit: 20,
sort: '-createdAt',
});
this.posts.set(result.docs);
} finally {
this.loading.set(false);
}
}
async deletePost(id: string): Promise<void> {
await this.api.collection('posts').delete(id);
this.posts.update((posts) => posts.filter((p) => p.id !== id));
}
}
Platform Behavior
- SSR: Direct database access (no HTTP overhead)
- Browser: HTTP calls to
/api/* - Same interface - code works identically on both platforms
TransferState (SSR Hydration)
TransferState is enabled by default for read operations. Data fetched during SSR is cached and reused on browser hydration.
// Default: TransferState enabled (no duplicate fetch on hydration)
const posts = await this.api.collection<Post>('posts').find({ limit: 10 });
// Opt-out: always fetch fresh data
const posts = await this.api.collection<Post>('posts').find({ limit: 10, transfer: false });
Requires provideClientHydration() in app config.
Error Handling
try {
await this.api.collection('posts').create({ title: '' });
} catch (error) {
if (error instanceof ValidationError) {
console.error('Validation failed:', error.errors);
}
}
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?