@smartsoft001-mobilems/claude-plugins 2.77.0 → 2.79.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/plugins/flow/.claude-plugin/plugin.json +1 -1
- package/plugins/flow/agents/angular-jest-test-writer.md +1 -1
- package/plugins/flow/agents/angular-signal-state-builder.md +1 -1
- package/plugins/flow/agents/angular-test-diagnostician.md +1 -1
- package/plugins/flow/agents/arch-scaffolder.md +1 -1
- package/plugins/flow/agents/shared-impl-orchestrator.md +1 -1
- package/plugins/flow/agents/shared-logic-implementer.md +1 -1
- package/plugins/flow/agents/shared-maia-api.md +1 -1
- package/plugins/flow/agents/shared-parallelization-analyzer.md +1 -1
- package/plugins/flow/agents/shared-security-scanner.md +1 -1
- package/plugins/flow/agents/shared-tdd-developer.md +1 -1
- package/plugins/flow/agents/shared-test-fixer.md +1 -1
- package/plugins/flow/agents/shared-test-runner.md +1 -1
- package/plugins/flow/agents/shared-verification-runner.md +1 -1
- package/plugins/flow-external/.claude-plugin/README.md +152 -0
- package/plugins/flow-external/.claude-plugin/merge-permissions.js +80 -0
- package/plugins/flow-external/.claude-plugin/plugin.json +5 -0
- package/plugins/flow-external/.claude-plugin/settings.template.json +75 -0
- package/plugins/flow-external/agents/angular-component-scaffolder.md +269 -0
- package/plugins/flow-external/agents/angular-directive-builder.md +130 -0
- package/plugins/flow-external/agents/angular-guard-builder.md +70 -0
- package/plugins/flow-external/agents/angular-pipe-builder.md +82 -0
- package/plugins/flow-external/agents/angular-resolver-builder.md +74 -0
- package/plugins/flow-external/agents/angular-service-builder.md +160 -0
- package/plugins/flow-external/agents/angular-state-builder.md +254 -0
- package/plugins/flow-external/agents/shared-build-verifier.md +67 -0
- package/plugins/flow-external/agents/shared-impl-orchestrator.md +88 -0
- package/plugins/flow-external/agents/shared-impl-reporter.md +107 -0
- package/plugins/flow-external/agents/shared-linear-subtask-iterator.md +70 -0
- package/plugins/flow-external/agents/shared-ui-classifier.md +38 -0
- package/plugins/flow-external/agents/ui-web-designer.md +179 -0
- package/plugins/flow-external/skills/a11y-audit/SKILL.md +96 -0
- package/plugins/flow-external/skills/angular-cli-conventions/SKILL.md +267 -0
- package/plugins/flow-external/skills/angular-patterns/SKILL.md +170 -0
- package/plugins/flow-external/skills/browser-capture/SKILL.md +68 -0
- package/plugins/flow-external/skills/commit/SKILL.md +113 -0
- package/plugins/flow-external/skills/debug-helper/SKILL.md +131 -0
- package/plugins/flow-external/skills/impl/SKILL.md +158 -0
- package/plugins/flow-external/skills/linear-suggestion/SKILL.md +62 -0
- package/plugins/flow-external/skills/maia-files-delete/SKILL.md +34 -0
- package/plugins/flow-external/skills/maia-files-upload/SKILL.md +41 -0
- package/plugins/flow-external/skills/plan/SKILL.md +163 -0
- package/plugins/flow-external/skills/push/SKILL.md +201 -0
- package/plugins/flow-legacy/.claude-plugin/merge-permissions.js +20 -6
- package/plugins/flow-legacy/.claude-plugin/plugin.json +1 -1
- package/plugins/flow-legacy/agents/angular-state-builder.md +54 -48
- package/plugins/flow-legacy/agents/shared-impl-orchestrator.md +44 -33
- package/plugins/flow-legacy/agents/shared-impl-reporter.md +12 -12
- package/plugins/flow-legacy/agents/shared-tdd-developer.md +19 -17
- package/plugins/flow-legacy/agents/shared-ui-classifier.md +10 -2
- package/plugins/flow-legacy/skills/a11y-audit/SKILL.md +1 -1
- package/plugins/flow-legacy/skills/angular-patterns/SKILL.md +28 -43
- package/plugins/flow-legacy/skills/browser-capture/SKILL.md +1 -1
- package/plugins/flow-legacy/skills/debug-helper/SKILL.md +17 -9
- package/plugins/flow-legacy/skills/maia-files-delete/SKILL.md +1 -1
- package/plugins/flow-legacy/skills/maia-files-upload/SKILL.md +1 -1
- package/plugins/flow-legacy/skills/nx-conventions/SKILL.md +14 -17
- package/plugins/flow-legacy/skills/test-unit/SKILL.md +14 -8
|
@@ -11,17 +11,17 @@ This skill provides guidance on Angular 14 patterns for legacy projects.
|
|
|
11
11
|
|
|
12
12
|
**DO NOT use modern Angular features (Angular 16+):**
|
|
13
13
|
|
|
14
|
-
| Feature
|
|
15
|
-
|
|
14
|
+
| Feature | CORRECT (Angular 14) | WRONG (Modern) |
|
|
15
|
+
| ------------ | ------------------------------- | ------------------------ |
|
|
16
16
|
| Control flow | `*ngIf`, `*ngFor`, `[ngSwitch]` | `@if`, `@for`, `@switch` |
|
|
17
|
-
| DI
|
|
18
|
-
| Inputs
|
|
19
|
-
| Outputs
|
|
20
|
-
| Two-way
|
|
21
|
-
| State
|
|
22
|
-
| Derived
|
|
23
|
-
| Side effects | `subscribe()`
|
|
24
|
-
| Components
|
|
17
|
+
| DI | Constructor injection | `inject()` |
|
|
18
|
+
| Inputs | `@Input()` decorator | `input()` function |
|
|
19
|
+
| Outputs | `@Output()` decorator | `output()` function |
|
|
20
|
+
| Two-way | `@Input()` + `@Output()` | `model()` |
|
|
21
|
+
| State | BehaviorSubject, Observable | signals, `signal()` |
|
|
22
|
+
| Derived | `pipe(map())` | `computed()` |
|
|
23
|
+
| Side effects | `subscribe()` | `effect()` |
|
|
24
|
+
| Components | NgModule-based | standalone |
|
|
25
25
|
|
|
26
26
|
## 1. Control Flow Syntax (`*ngIf`, `*ngFor`, `[ngSwitch]`)
|
|
27
27
|
|
|
@@ -77,12 +77,12 @@ trackById(index: number, item: Item): string {
|
|
|
77
77
|
|
|
78
78
|
### When to Use
|
|
79
79
|
|
|
80
|
-
| Pattern
|
|
81
|
-
|
|
82
|
-
| `BehaviorSubject`
|
|
83
|
-
| `ReplaySubject(1)` | State without initial value
|
|
84
|
-
| `pipe(map())`
|
|
85
|
-
| `combineLatest`
|
|
80
|
+
| Pattern | Use Case |
|
|
81
|
+
| ------------------ | --------------------------------------- |
|
|
82
|
+
| `BehaviorSubject` | Local, mutable state with initial value |
|
|
83
|
+
| `ReplaySubject(1)` | State without initial value |
|
|
84
|
+
| `pipe(map())` | Derived/computed values |
|
|
85
|
+
| `combineLatest` | Combine multiple observables |
|
|
86
86
|
|
|
87
87
|
### BehaviorSubject Examples
|
|
88
88
|
|
|
@@ -108,13 +108,11 @@ export class StateService {
|
|
|
108
108
|
readonly filtered$ = combineLatest([this._items, this._filter]).pipe(
|
|
109
109
|
map(([items, filter]) => {
|
|
110
110
|
const f = filter.toLowerCase();
|
|
111
|
-
return items.filter(i => i.name.toLowerCase().includes(f));
|
|
112
|
-
})
|
|
111
|
+
return items.filter((i) => i.name.toLowerCase().includes(f));
|
|
112
|
+
}),
|
|
113
113
|
);
|
|
114
114
|
|
|
115
|
-
readonly count$ = this._items.pipe(
|
|
116
|
-
map(items => items.length)
|
|
117
|
-
);
|
|
115
|
+
readonly count$ = this._items.pipe(map((items) => items.length));
|
|
118
116
|
|
|
119
117
|
// Methods to update state
|
|
120
118
|
setItems(items: Item[]): void {
|
|
@@ -158,15 +156,13 @@ export class MyComponent implements OnInit, OnDestroy {
|
|
|
158
156
|
private readonly http: HttpClient,
|
|
159
157
|
private readonly router: Router,
|
|
160
158
|
private readonly myService: MyService,
|
|
161
|
-
@Optional() private readonly optionalService: OptionalService
|
|
159
|
+
@Optional() private readonly optionalService: OptionalService,
|
|
162
160
|
) {}
|
|
163
161
|
|
|
164
162
|
ngOnInit(): void {
|
|
165
|
-
this.myService.items$
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
this.items = items;
|
|
169
|
-
});
|
|
163
|
+
this.myService.items$.pipe(takeUntil(this.destroy$)).subscribe((items) => {
|
|
164
|
+
this.items = items;
|
|
165
|
+
});
|
|
170
166
|
}
|
|
171
167
|
|
|
172
168
|
ngOnDestroy(): void {
|
|
@@ -194,7 +190,7 @@ import {
|
|
|
194
190
|
Output,
|
|
195
191
|
EventEmitter,
|
|
196
192
|
OnChanges,
|
|
197
|
-
SimpleChanges
|
|
193
|
+
SimpleChanges,
|
|
198
194
|
} from '@angular/core';
|
|
199
195
|
|
|
200
196
|
@Component({
|
|
@@ -267,20 +263,9 @@ import { FeatureItemComponent } from './feature-item/feature-item.component';
|
|
|
267
263
|
import { SharedModule } from '@shared/shared.module';
|
|
268
264
|
|
|
269
265
|
@NgModule({
|
|
270
|
-
declarations: [
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
FeatureItemComponent,
|
|
274
|
-
],
|
|
275
|
-
imports: [
|
|
276
|
-
CommonModule,
|
|
277
|
-
FormsModule,
|
|
278
|
-
ReactiveFormsModule,
|
|
279
|
-
SharedModule,
|
|
280
|
-
],
|
|
281
|
-
exports: [
|
|
282
|
-
FeatureComponent,
|
|
283
|
-
],
|
|
266
|
+
declarations: [FeatureComponent, FeatureListComponent, FeatureItemComponent],
|
|
267
|
+
imports: [CommonModule, FormsModule, ReactiveFormsModule, SharedModule],
|
|
268
|
+
exports: [FeatureComponent],
|
|
284
269
|
})
|
|
285
270
|
export class FeatureModule {}
|
|
286
271
|
```
|
|
@@ -358,4 +343,4 @@ export class OptimizedComponent {
|
|
|
358
343
|
- [ ] Using `pipe(map())` for derived state (NOT `computed()`)
|
|
359
344
|
- [ ] Component declared in NgModule (NOT standalone)
|
|
360
345
|
- [ ] Using `async` pipe in templates
|
|
361
|
-
- [ ] Implementing `OnDestroy` with `takeUntil` pattern
|
|
346
|
+
- [ ] Implementing `OnDestroy` with `takeUntil` pattern
|
|
@@ -24,7 +24,7 @@ This skill provides debugging workflows and techniques for Angular 14 legacy pro
|
|
|
24
24
|
```typescript
|
|
25
25
|
@NgModule({
|
|
26
26
|
declarations: [MyComponent], // Is it declared?
|
|
27
|
-
exports: [MyComponent],
|
|
27
|
+
exports: [MyComponent], // Is it exported (if used outside)?
|
|
28
28
|
})
|
|
29
29
|
export class FeatureModule {}
|
|
30
30
|
```
|
|
@@ -68,6 +68,7 @@ This skill provides debugging workflows and techniques for Angular 14 legacy pro
|
|
|
68
68
|
```
|
|
69
69
|
|
|
70
70
|
3. **Memory leak from subscriptions**
|
|
71
|
+
|
|
71
72
|
```typescript
|
|
72
73
|
// Always unsubscribe with takeUntil pattern
|
|
73
74
|
private readonly destroy$ = new Subject<void>();
|
|
@@ -103,7 +104,10 @@ this.cdr.markForCheck();
|
|
|
103
104
|
// HTTP interceptor for logging
|
|
104
105
|
@Injectable()
|
|
105
106
|
export class LoggingInterceptor implements HttpInterceptor {
|
|
106
|
-
intercept(
|
|
107
|
+
intercept(
|
|
108
|
+
req: HttpRequest<any>,
|
|
109
|
+
next: HttpHandler,
|
|
110
|
+
): Observable<HttpEvent<any>> {
|
|
107
111
|
console.log('Request:', req.method, req.url);
|
|
108
112
|
|
|
109
113
|
return next.handle(req).pipe(
|
|
@@ -114,7 +118,7 @@ export class LoggingInterceptor implements HttpInterceptor {
|
|
|
114
118
|
}
|
|
115
119
|
},
|
|
116
120
|
error: (error) => console.error('HTTP Error:', error),
|
|
117
|
-
})
|
|
121
|
+
}),
|
|
118
122
|
);
|
|
119
123
|
}
|
|
120
124
|
}
|
|
@@ -139,9 +143,7 @@ export class AppModule {}
|
|
|
139
143
|
<p>items.length: {{ items?.length }}</p>
|
|
140
144
|
|
|
141
145
|
<!-- Debug *ngFor -->
|
|
142
|
-
<div *ngFor="let item of items; let i = index">
|
|
143
|
-
{{ i }}: {{ item | json }}
|
|
144
|
-
</div>
|
|
146
|
+
<div *ngFor="let item of items; let i = index">{{ i }}: {{ item | json }}</div>
|
|
145
147
|
```
|
|
146
148
|
|
|
147
149
|
### Browser DevTools
|
|
@@ -234,7 +236,9 @@ export class FeatureService {
|
|
|
234
236
|
// Log connection events
|
|
235
237
|
mongoose.connection.on('connected', () => console.log('MongoDB connected'));
|
|
236
238
|
mongoose.connection.on('error', (err) => console.error('MongoDB error:', err));
|
|
237
|
-
mongoose.connection.on('disconnected', () =>
|
|
239
|
+
mongoose.connection.on('disconnected', () =>
|
|
240
|
+
console.log('MongoDB disconnected'),
|
|
241
|
+
);
|
|
238
242
|
```
|
|
239
243
|
|
|
240
244
|
### Query Debugging
|
|
@@ -342,7 +346,11 @@ const name = user?.profile?.name;
|
|
|
342
346
|
const name = user?.profile?.name ?? 'Unknown';
|
|
343
347
|
|
|
344
348
|
// In templates (Angular 14)
|
|
345
|
-
{
|
|
349
|
+
{
|
|
350
|
+
{
|
|
351
|
+
user?.profile?.name;
|
|
352
|
+
}
|
|
353
|
+
}
|
|
346
354
|
```
|
|
347
355
|
|
|
348
356
|
### "Expression has changed after it was checked"
|
|
@@ -384,4 +392,4 @@ export class AppModule {}
|
|
|
384
392
|
providedIn: 'root', // Or specific module
|
|
385
393
|
})
|
|
386
394
|
export class MyService {}
|
|
387
|
-
```
|
|
395
|
+
```
|
|
@@ -9,12 +9,12 @@ This skill provides guidance on Nx 14 monorepo patterns for legacy projects usin
|
|
|
9
9
|
|
|
10
10
|
## CRITICAL: Nx 14 vs Modern Nx
|
|
11
11
|
|
|
12
|
-
| Feature
|
|
13
|
-
|
|
14
|
-
| Packages | `@nrwl/*`
|
|
15
|
-
| Node.js
|
|
16
|
-
| Angular
|
|
17
|
-
| Config
|
|
12
|
+
| Feature | Nx 14 (Legacy) | Nx 21+ (Modern) |
|
|
13
|
+
| -------- | ---------------------------------- | --------------- |
|
|
14
|
+
| Packages | `@nrwl/*` | `@nx/*` |
|
|
15
|
+
| Node.js | 18.x | 20.x / 22.x |
|
|
16
|
+
| Angular | 14.x | 20.x |
|
|
17
|
+
| Config | `workspace.json` or `project.json` | `project.json` |
|
|
18
18
|
|
|
19
19
|
## 1. Workspace Structure
|
|
20
20
|
|
|
@@ -197,10 +197,7 @@ nx affected --target=test --base=main
|
|
|
197
197
|
"lint": {
|
|
198
198
|
"executor": "@nrwl/linter:eslint",
|
|
199
199
|
"options": {
|
|
200
|
-
"lintFilePatterns": [
|
|
201
|
-
"apps/web/src/**/*.ts",
|
|
202
|
-
"apps/web/src/**/*.html"
|
|
203
|
-
]
|
|
200
|
+
"lintFilePatterns": ["apps/web/src/**/*.ts", "apps/web/src/**/*.html"]
|
|
204
201
|
}
|
|
205
202
|
}
|
|
206
203
|
}
|
|
@@ -362,10 +359,10 @@ nx g @nrwl/angular:component my-component --dry-run
|
|
|
362
359
|
|
|
363
360
|
## 13. Package Differences
|
|
364
361
|
|
|
365
|
-
| Feature | @nrwl (Nx 14)
|
|
366
|
-
|
|
367
|
-
| Jest
|
|
368
|
-
| Linter
|
|
369
|
-
| Angular | `@nrwl/angular:*`
|
|
370
|
-
| Node
|
|
371
|
-
| Cypress | `@nrwl/cypress:*`
|
|
362
|
+
| Feature | @nrwl (Nx 14) | @nx (Modern) |
|
|
363
|
+
| ------- | --------------------- | ----------------- |
|
|
364
|
+
| Jest | `@nrwl/jest:jest` | `@nx/jest:jest` |
|
|
365
|
+
| Linter | `@nrwl/linter:eslint` | `@nx/eslint:lint` |
|
|
366
|
+
| Angular | `@nrwl/angular:*` | `@nx/angular:*` |
|
|
367
|
+
| Node | `@nrwl/node:*` | `@nx/node:*` |
|
|
368
|
+
| Cypress | `@nrwl/cypress:*` | `@nx/cypress:*` |
|
|
@@ -143,7 +143,12 @@ describe('@mms/shared-angular: FormFieldComponent', () => {
|
|
|
143
143
|
### Testing with BehaviorSubject State
|
|
144
144
|
|
|
145
145
|
```typescript
|
|
146
|
-
import {
|
|
146
|
+
import {
|
|
147
|
+
ComponentFixture,
|
|
148
|
+
TestBed,
|
|
149
|
+
fakeAsync,
|
|
150
|
+
tick,
|
|
151
|
+
} from '@angular/core/testing';
|
|
147
152
|
import { of, BehaviorSubject } from 'rxjs';
|
|
148
153
|
|
|
149
154
|
import { ListComponent } from './list.component';
|
|
@@ -165,9 +170,7 @@ describe('@mms/shared-angular: ListComponent', () => {
|
|
|
165
170
|
|
|
166
171
|
await TestBed.configureTestingModule({
|
|
167
172
|
declarations: [ListComponent],
|
|
168
|
-
providers: [
|
|
169
|
-
{ provide: StateService, useValue: mockStateService },
|
|
170
|
-
],
|
|
173
|
+
providers: [{ provide: StateService, useValue: mockStateService }],
|
|
171
174
|
}).compileComponents();
|
|
172
175
|
|
|
173
176
|
fixture = TestBed.createComponent(ListComponent);
|
|
@@ -258,7 +261,7 @@ describe('@mms/shared-angular: StateService', () => {
|
|
|
258
261
|
});
|
|
259
262
|
|
|
260
263
|
it('should emit initial state', (done) => {
|
|
261
|
-
service.items$.pipe(take(1)).subscribe(items => {
|
|
264
|
+
service.items$.pipe(take(1)).subscribe((items) => {
|
|
262
265
|
expect(items).toEqual([]);
|
|
263
266
|
done();
|
|
264
267
|
});
|
|
@@ -269,7 +272,7 @@ describe('@mms/shared-angular: StateService', () => {
|
|
|
269
272
|
|
|
270
273
|
service.setItems(newItems);
|
|
271
274
|
|
|
272
|
-
service.items$.pipe(take(1)).subscribe(items => {
|
|
275
|
+
service.items$.pipe(take(1)).subscribe((items) => {
|
|
273
276
|
expect(items).toEqual(newItems);
|
|
274
277
|
done();
|
|
275
278
|
});
|
|
@@ -288,7 +291,10 @@ describe('@mms/shared-angular: StateService', () => {
|
|
|
288
291
|
|
|
289
292
|
```typescript
|
|
290
293
|
import { TestBed } from '@angular/core/testing';
|
|
291
|
-
import {
|
|
294
|
+
import {
|
|
295
|
+
HttpClientTestingModule,
|
|
296
|
+
HttpTestingController,
|
|
297
|
+
} from '@angular/common/http/testing';
|
|
292
298
|
|
|
293
299
|
import { DataService } from './data.service';
|
|
294
300
|
|
|
@@ -491,4 +497,4 @@ nx test shared-angular --testFile=feature.service.spec.ts
|
|
|
491
497
|
6. **Keep tests fast** - avoid real HTTP calls or timers
|
|
492
498
|
7. **Clean up** - use afterEach for cleanup when needed
|
|
493
499
|
8. **Use declarations** - components are NOT standalone in Angular 14
|
|
494
|
-
9. **Mock BehaviorSubjects** - not signals (no signals in Angular 14)
|
|
500
|
+
9. **Mock BehaviorSubjects** - not signals (no signals in Angular 14)
|