Skip to content

Commit e94b09b

Browse files
Copilotk3nsei
Copilot
and
k3nsei
authored
chore: add mcp's configuration and agents.md
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: k3nsei <190422+k3nsei@users.noreply.github.com>
1 parent 94210fd commit e94b09b

File tree

5 files changed

+253
-1
lines changed

5 files changed

+253
-1
lines changed

‎.mcprc.json

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
{
2+
"$schema": "https://schemas.modelcontextprotocol.org/v1/mcp-config.schema.json",
3+
"description": "MCP configuration for ng-in-viewport Angular library project",
4+
"servers": {
5+
"angular-cli": {
6+
"command": "npx",
7+
"args": ["-y", "@angular/cli", "mcp"],
8+
"description": "Angular CLI MCP for Angular development assistance, project management, and code generation"
9+
},
10+
"github-mcp-server": {
11+
"command": "npx",
12+
"args": ["-y", "@modelcontextprotocol/server-github"],
13+
"description": "GitHub MCP for repository management, issues, PRs, and code review",
14+
"env": {
15+
"GITHUB_PERSONAL_ACCESS_TOKEN": ""
16+
}
17+
},
18+
"playwright-mcp": {
19+
"command": "npx",
20+
"args": ["-y", "@modelcontextprotocol/server-playwright"],
21+
"description": "Playwright MCP for browser automation, E2E testing, and web page interaction"
22+
},
23+
"filesystem": {
24+
"command": "npx",
25+
"args": [
26+
"-y",
27+
"@modelcontextprotocol/server-filesystem",
28+
"/home/runner/work/ng-in-viewport/ng-in-viewport"
29+
],
30+
"description": "File system access for reading and writing project files"
31+
},
32+
"brave-search": {
33+
"command": "npx",
34+
"args": ["-y", "@modelcontextprotocol/server-brave-search"],
35+
"description": "Web search capabilities for documentation and troubleshooting",
36+
"env": {
37+
"BRAVE_API_KEY": ""
38+
}
39+
},
40+
"git": {
41+
"command": "npx",
42+
"args": [
43+
"-y",
44+
"@modelcontextprotocol/server-git",
45+
"/home/runner/work/ng-in-viewport/ng-in-viewport"
46+
],
47+
"description": "Git operations and repository management"
48+
}
49+
},
50+
"globalSettings": {
51+
"logLevel": "info",
52+
"timeout": 30000,
53+
"retries": 3
54+
}
55+
}

‎.vscode/extensions.json

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,11 @@
11
{
22
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
3-
"recommendations": ["angular.ng-template"]
3+
"recommendations": [
4+
"angular.ng-template",
5+
"ms-playwright.playwright",
6+
"github.vscode-github-actions",
7+
"esbenp.prettier-vscode",
8+
"dbaeumer.vscode-eslint",
9+
"ms-vscode.vscode-typescript-next"
10+
]
411
}

‎.vscode/settings.json

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"mcp.configFile": ".mcprc.json",
3+
"typescript.preferences.includePackageJsonAutoImports": "on",
4+
"typescript.suggest.autoImports": true,
5+
"angular.experimental-ivy": true,
6+
"files.associations": {
7+
"*.json": "jsonc"
8+
},
9+
"search.exclude": {
10+
"**/node_modules": true,
11+
"**/dist": true,
12+
"**/coverage": true,
13+
"**/.angular": true
14+
},
15+
"files.exclude": {
16+
"**/.git": true,
17+
"**/.DS_Store": true,
18+
"**/node_modules": true,
19+
"**/dist": true,
20+
"**/coverage": true,
21+
"**/.angular": true
22+
}
23+
}

‎agents.md

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
# AI Agent Instructions for ng-in-viewport
2+
3+
## Project Overview
4+
5+
This is an Angular library for viewport detection using modern Angular v20+ patterns and signals. The library provides efficient viewport intersection detection using the Intersection Observer API.
6+
7+
### Repository Structure
8+
9+
- `projects/ng-in-viewport/` - Core library source code
10+
- `projects/demo/` - Demo application for documentation
11+
- `projects/example/` - Example application showing real-world usage
12+
- `e2e/` - End-to-end tests
13+
- `docs/` - Documentation files
14+
15+
## Development Guidelines
16+
17+
### Angular Standards
18+
19+
- Use Angular v20+ features exclusively (signals, modern control flow)
20+
- All components must be standalone with OnPush change detection
21+
- Use signal-based APIs and computed values
22+
- Prefer `inject()` over constructor dependency injection
23+
- Use modern template syntax (`@if`, `@for`, `@switch`)
24+
25+
### Code Quality
26+
27+
- TypeScript strict mode enabled
28+
- ESLint and Prettier configured
29+
- Jest for unit testing
30+
- Playwright for E2E testing
31+
- 100% code coverage expected for library code
32+
33+
### Key Commands
34+
35+
```bash
36+
# Development
37+
npm run build:lib # Build library
38+
npm run test:lib # Test library
39+
npm run lint # Lint all projects
40+
npm run format # Check formatting
41+
npm run serve:demo # Run demo app (port 4200)
42+
npm run serve:example # Run example app (port 4300)
43+
44+
# Testing
45+
npm run test # All tests with coverage
46+
npm run e2e:run # E2E tests headless
47+
npm run e2e:open # E2E tests with UI
48+
```
49+
50+
## Library Architecture
51+
52+
### Core Components
53+
54+
- `InViewportDirective` - Main directive for viewport detection
55+
- `InViewportService` - Service managing intersection observers
56+
- Signal-based state management throughout
57+
58+
### Key Features
59+
60+
- Intersection Observer API integration
61+
- Signal-based reactivity
62+
- SSR-compatible (graceful degradation)
63+
- TypeScript first with strict typing
64+
- Angular standalone components
65+
66+
## Testing Strategy
67+
68+
### Unit Tests
69+
70+
- Test all public APIs
71+
- Mock Intersection Observer for browser compatibility
72+
- Test signal reactivity and computed values
73+
- Verify SSR compatibility
74+
75+
### E2E Tests
76+
77+
- Test real viewport interactions
78+
- Verify performance with many elements
79+
- Test responsive behavior
80+
- Validate accessibility
81+
82+
## Performance Requirements
83+
84+
- Library bundle size < 10KB gzipped
85+
- Zero runtime dependencies
86+
- Efficient memory usage with proper cleanup
87+
- 60fps performance during scroll operations
88+
89+
## Compatibility
90+
91+
- Angular 16+ (with standalone component support)
92+
- Modern browsers with Intersection Observer
93+
- Server-side rendering support
94+
- TypeScript 5.0+
95+
96+
## Contributing Guidelines
97+
98+
- Follow conventional commits
99+
- Ensure all tests pass
100+
- Maintain code coverage
101+
- Update documentation for API changes
102+
- Use Angular best practices from latest version
103+
104+
## AI Assistant Context
105+
106+
When helping with this project:
107+
108+
1. Always use modern Angular patterns (v20+ features)
109+
2. Prioritize performance and bundle size
110+
3. Maintain TypeScript strict compliance
111+
4. Ensure cross-browser compatibility
112+
5. Test thoroughly with provided test suites
113+
6. Follow the existing code patterns and architecture
114+
115+
## Common Tasks
116+
117+
- Adding new directive features
118+
- Optimizing intersection observer performance
119+
- Updating for new Angular versions
120+
- Enhancing TypeScript definitions
121+
- Improving test coverage
122+
- Updating documentation examples

‎mcp.json

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
{
2+
"mcpServers": {
3+
"angular-cli": {
4+
"command": "npx",
5+
"args": ["-y", "@angular/cli", "mcp"],
6+
"description": "Angular CLI MCP for Angular development assistance"
7+
},
8+
"github": {
9+
"command": "npx",
10+
"args": ["-y", "@modelcontextprotocol/server-github"],
11+
"description": "GitHub repository management and operations",
12+
"env": {
13+
"GITHUB_PERSONAL_ACCESS_TOKEN": ""
14+
}
15+
},
16+
"playwright": {
17+
"command": "npx",
18+
"args": ["-y", "@modelcontextprotocol/server-playwright"],
19+
"description": "Browser automation and E2E testing with Playwright"
20+
},
21+
"filesystem": {
22+
"command": "npx",
23+
"args": ["-y", "@modelcontextprotocol/server-filesystem", "."],
24+
"description": "File system operations for project files"
25+
},
26+
"git": {
27+
"command": "npx",
28+
"args": ["-y", "@modelcontextprotocol/server-git", "."],
29+
"description": "Git version control operations"
30+
},
31+
"typescript": {
32+
"command": "npx",
33+
"args": ["-y", "@modelcontextprotocol/server-typescript"],
34+
"description": "TypeScript language server for code analysis"
35+
},
36+
"brave-search": {
37+
"command": "npx",
38+
"args": ["-y", "@modelcontextprotocol/server-brave-search"],
39+
"description": "Web search for documentation and troubleshooting",
40+
"env": {
41+
"BRAVE_API_KEY": ""
42+
}
43+
}
44+
}
45+
}

0 commit comments

Comments
 (0)