@cometchat/skills 4.1.0 → 4.2.0

package/skills/cometchat-angular-calls/references/recording-screen-share.md

@@ -0,0 +1,267 @@
+# Recording + screen-share on Angular
+
+Angular wraps the same JS Calls SDK as React; SDK semantics are identical. For SDK-level details (recording flag, lifecycle events, screen-share via `getDisplayMedia`, browser support) read `cometchat-react-calls/references/recording-screen-share.md` first. This reference is the Angular-specific wiring.
+
+---
+
+## Recording — opt-in per session
+
+Same `CallSettingsBuilder` flag as web:
+
+```ts
+// services/call.service.ts
+import { CometChatCalls } from "@cometchat/calls-sdk-javascript";
+
+@Injectable({ providedIn: "root" })
+export class CallService {
+  buildSettings(sessionId: string, opts: { recording?: boolean; isAudioOnly?: boolean }) {
+    return new CometChatCalls.CallSettingsBuilder()
+      .setSessionID(sessionId)
+      .setIsAudioOnly(opts.isAudioOnly ?? false)
+      .enableRecording(opts.recording ?? false)
+      .setShowRecordingButton(opts.recording ?? false)
+      .build();
+  }
+}
+```
+
+Toggle the recording prompt for the user via a settings input passed into your call screen component.
+
+---
+
+## REC indicator (compliance)
+
+Wrap the lifecycle listener via NgZone — same rule as everywhere else in Angular calls:
+
+```ts
+@Component({
+  selector: "app-rec-badge",
+  template: `
+    <div class="rec-badge" *ngIf="recording">
+      <span class="rec-dot">●</span>
+      <span class="rec-label">REC</span>
+    </div>
+  `,
+  styles: [`
+    .rec-badge { position: absolute; top: 16px; left: 16px; display: flex; align-items: center; gap: 4px;
+                 background: rgba(0,0,0,0.6); color: white; padding: 4px 8px; border-radius: 4px; }
+    .rec-dot { color: #ff3b30; animation: blink 1s infinite; }
+    @keyframes blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0.4; } }
+  `],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class RecBadgeComponent {
+  @Input() recording = false;
+}
+```
+
+In the parent component:
+
+```ts
+ngOnInit() {
+  const listener = new CometChatCalls.OngoingCallListener({
+    onRecordingStarted: () => {
+      this.zone.run(() => { this.recording = true; this.cd.markForCheck(); });
+    },
+    onRecordingStopped: () => {
+      this.zone.run(() => { this.recording = false; this.cd.markForCheck(); });
+    },
+    onRecordingFailed: (error: { message: string }) => {
+      this.zone.run(() => {
+        this.snackBar.open(`Recording failed: ${error.message}`, "Dismiss", { duration: 5000 });
+      });
+    },
+  });
+  // ... build settings, startSession ...
+}
+```
+
+Compliance reminder: in two-party-consent jurisdictions (parts of the US, much of the EU under GDPR Art. 6/7), the REC indicator is legally required for active recording. Don't omit it.
+
+---
+
+## Screen sharing — Angular composition
+
+Browser `getDisplayMedia` — same as web. Angular wraps the user-gesture-required call in a click handler:
+
+```ts
+@Component({
+  selector: "app-screen-share-button",
+  template: `
+    <button (click)="onClick()" [disabled]="!supported" [class.active]="sharing">
+      {{ sharing ? "Stop sharing" : "Share screen" }}
+    </button>
+    <div class="hint" *ngIf="!supported">
+      Screen sharing not supported in this browser.
+    </div>
+  `,
+})
+export class ScreenShareButtonComponent {
+  @Output() shareStarted = new EventEmitter<void>();
+  @Output() shareEnded = new EventEmitter<void>();
+  sharing = false;
+  supported = typeof navigator !== "undefined" && "mediaDevices" in navigator && "getDisplayMedia" in navigator.mediaDevices;
+
+  async onClick() {
+    if (!this.supported) return;
+    if (this.sharing) {
+      await CometChatCalls.endScreenShare();
+      this.sharing = false;
+      this.shareEnded.emit();
+    } else {
+      try {
+        await CometChatCalls.startScreenShare();
+        this.sharing = true;
+        this.shareStarted.emit();
+      } catch (err) {
+        if ((err as Error).name === "NotAllowedError") return;     // user canceled
+        console.warn("Screen share failed:", err);
+      }
+    }
+  }
+}
+```
+
+The `(click)` handler is in response to a real user gesture — browsers accept the `getDisplayMedia` permission request.
+
+---
+
+## Screen-share viewer composition
+
+When another participant shares, render their screen track in a dedicated tile:
+
+```ts
+@Component({
+  selector: "app-screen-share-view",
+  template: `
+    <div class="screen-share-tile">
+      <video #screenVideo autoplay playsinline></video>
+      <div class="presenter-badge">{{ presenterName }} is sharing their screen</div>
+    </div>
+  `,
+})
+export class ScreenShareViewComponent implements AfterViewInit {
+  @Input() stream!: MediaStream;
+  @Input() presenterName = "Someone";
+  @ViewChild("screenVideo") videoRef!: ElementRef<HTMLVideoElement>;
+
+  ngAfterViewInit() {
+    if (this.videoRef?.nativeElement && this.stream) {
+      this.videoRef.nativeElement.srcObject = this.stream;
+    }
+  }
+}
+```
+
+Listen for screen-share events at the parent component level and pass the stream down:
+
+```ts
+ngOnInit() {
+  const listener = new CometChatCalls.OngoingCallListener({
+    onScreenShareStarted: (presenterUid: string, stream: MediaStream) => {
+      this.zone.run(() => {
+        this.screenSharePresenterUid = presenterUid;
+        this.screenShareStream = stream;
+        this.cd.markForCheck();
+      });
+    },
+    onScreenShareEnded: () => {
+      this.zone.run(() => {
+        this.screenSharePresenterUid = null;
+        this.screenShareStream = null;
+        this.cd.markForCheck();
+      });
+    },
+  });
+}
+```
+
+---
+
+## Layout switch — main view vs screen share
+
+When someone shares, the main view should switch from "participant grid" to "screen share + thumbnails":
+
+```html
+<ng-container *ngIf="screenShareStream; else gridView">
+  <app-screen-share-view [stream]="screenShareStream" [presenterName]="presenterName"></app-screen-share-view>
+  <div class="thumbnail-strip">
+    <app-participant-tile *ngFor="let p of participants; trackBy: trackByUid" [participant]="p" size="small"></app-participant-tile>
+  </div>
+</ng-container>
+
+<ng-template #gridView>
+  <div class="participant-grid">
+    <app-participant-tile *ngFor="let p of participants; trackBy: trackByUid" [participant]="p" size="medium"></app-participant-tile>
+  </div>
+</ng-template>
+```
+
+Cleanly transitions via Angular's structural directive. No animation by default — add `@angular/animations` if you want a smooth swap.
+
+---
+
+## Recording download — server-side only
+
+Same as web/RN — recordings live on CometChat's servers. To list/retrieve programmatically, use the dashboard REST API from your own backend (NEVER from Angular client code; the dashboard bearer token must not ship to clients).
+
+Server-side proxy pattern:
+
+```ts
+// Your backend (Node + Express)
+app.get("/api/recordings", requireAuth, async (req, res) => {
+  const recordings = await fetch(
+    `https://${region}.api-management.cometchat.io/v3/apps/${appId}/recordings`,
+    { headers: { Authorization: `Bearer ${process.env.DASHBOARD_BEARER}` } },
+  ).then(r => r.json());
+  res.json(recordings);
+});
+```
+
+Then the Angular service hits your own backend:
+
+```ts
+@Injectable({ providedIn: "root" })
+export class RecordingsService {
+  constructor(private http: HttpClient) {}
+  list() {
+    return this.http.get<Recording[]>("/api/recordings");
+  }
+}
+```
+
+The skill scaffolds this proxy layer for projects with a backend; for serverless-only projects, points users at the dashboard UI for recording retrieval.
+
+---
+
+## Anti-patterns
+
+1. **Calling `startScreenShare()` from a non-click handler.** Browsers reject — must be in a user-gesture stack. `(click)` works; `ngOnInit` doesn't.
+2. **No NgZone wrap on `onRecordingStarted` / `onScreenShareStarted`.** UI doesn't update.
+3. **Hardcoding the dashboard bearer token in `environment.ts`** to fetch recordings. Wrong — bearer is server-only. Always proxy.
+4. **No "REC" indicator.** Compliance violation.
+5. **Re-render thumbnails on every roster update** without `trackBy`. Tiles flicker; tracks die.
+6. **`getDisplayMedia` polyfilled with screen-recording-extension stubs** in old browsers. Don't — feature detect and disable the button instead.
+
+---
+
+## Verification checklist
+
+- [ ] `enableRecording(true)` opt-in via parent input (not always-on)
+- [ ] REC indicator visible to all participants when active
+- [ ] Recording lifecycle handlers wrapped in `NgZone.run` + `cd.markForCheck()`
+- [ ] Screen-share button feature-detects `getDisplayMedia`
+- [ ] Screen-share button triggered from `(click)`, not `ngOnInit`
+- [ ] `onScreenShareStarted` / `onScreenShareEnded` wrapped in NgZone
+- [ ] Layout swap renders screen-share view + thumbnail strip
+- [ ] `trackBy` on `*ngFor` for participant tiles
+- [ ] Recordings retrieved via server-side proxy, NOT direct dashboard API call from Angular
+
+---
+
+## Pointers
+
+- `cometchat-react-calls/references/recording-screen-share.md` — sister reference (SDK details + browser semantics)
+- `references/ngzone-and-async-callbacks.md` — NgZone wrapping rules
+- `references/group-calls.md` — group calls + screen share interplay
+- `cometchat-angular-calls` SKILL.md — base hard rules

package/skills/cometchat-angular-calls/references/ringing-integration.md

@@ -0,0 +1,131 @@
+# Ringing — call signaling with custom UI (Angular)
+
+Same SDK API as web. Angular-specific deltas: NgZone-wrapped listener callbacks, BehaviorSubject-driven incoming/outgoing call state, root-level CallSignalingService.
+
+**Read first:** `cometchat-react-calls/references/ringing-integration.md` — full architecture, hard rules, anti-patterns.
+
+---
+
+## CallSignalingService
+
+```ts
+import { Injectable, NgZone } from "@angular/core";
+import { BehaviorSubject } from "rxjs";
+import { CometChat } from "@cometchat/chat-sdk-javascript";
+import { CometChatCalls } from "@cometchat/calls-sdk-javascript";
+
+@Injectable({ providedIn: "root" })
+export class CallSignalingService {
+  readonly incoming$ = new BehaviorSubject<CometChat.Call | null>(null);
+  readonly outgoing$ = new BehaviorSubject<CometChat.Call | null>(null);
+  readonly active$ = new BehaviorSubject<string | null>(null);  // sessionId
+
+  private readonly listenerId = "app-call-signaling";
+
+  constructor(private zone: NgZone) {
+    CometChat.addCallListener(
+      this.listenerId,
+      new CometChat.CallListener({
+        onIncomingCallReceived: (call) => this.zone.run(() => this.incoming$.next(call)),
+        onOutgoingCallAccepted: (call) => this.zone.run(() => {
+          this.outgoing$.next(null);
+          this.active$.next(call.getSessionId());
+        }),
+        onOutgoingCallRejected: () => this.zone.run(() => this.outgoing$.next(null)),
+        onIncomingCallCancelled: () => this.zone.run(() => this.incoming$.next(null)),
+        onCallEndedMessageReceived: () => this.zone.run(() => {
+          this.incoming$.next(null);
+          this.outgoing$.next(null);
+          this.active$.next(null);
+        }),
+      }),
+    );
+  }
+
+  ngOnDestroy(): void {
+    CometChat.removeCallListener(this.listenerId);
+  }
+
+  async initiate(receiverUid: string, type: "audio" | "video" = "video"): Promise<void> {
+    const call = new CometChat.Call(
+      receiverUid,
+      type === "video" ? CometChat.CALL_TYPE.VIDEO : CometChat.CALL_TYPE.AUDIO,
+      CometChat.RECEIVER_TYPE.USER,
+    );
+    const outgoing = await CometChat.initiateCall(call, 60);
+    this.outgoing$.next(outgoing);
+  }
+
+  async accept(call: CometChat.Call): Promise<void> {
+    const accepted = await CometChat.acceptCall(call.getSessionId());
+    this.incoming$.next(null);
+    this.active$.next(accepted.getSessionId());
+  }
+
+  async reject(call: CometChat.Call): Promise<void> {
+    await CometChat.rejectCall(call.getSessionId(), CometChat.CALL_STATUS.REJECTED);
+    this.incoming$.next(null);
+  }
+
+  async cancel(call: CometChat.Call): Promise<void> {
+    await CometChat.rejectCall(call.getSessionId(), CometChat.CALL_STATUS.CANCELLED);
+    this.outgoing$.next(null);
+  }
+}
+```
+
+---
+
+## Incoming-call component
+
+```ts
+@Component({
+  selector: "app-incoming-call",
+  template: `
+    <ng-container *ngIf="incoming$ | async as call">
+      <div role="alertdialog" aria-labelledby="incoming-title" class="incoming-call-overlay">
+        <h3 id="incoming-title">{{ call.getCallInitiator().getName() }}</h3>
+        <p>Incoming {{ call.getType() }} call</p>
+        <button (click)="svc.reject(call)" class="reject" aria-label="Decline call">Decline</button>
+        <button (click)="svc.accept(call)" class="accept" aria-label="Accept call">Accept</button>
+        <audio src="/assets/ringtone.mp3" autoplay loop></audio>
+      </div>
+    </ng-container>
+  `,
+})
+export class IncomingCallComponent {
+  incoming$ = this.svc.incoming$;
+  constructor(public svc: CallSignalingService) {}
+}
+```
+
+Mount in `app.component.html` (root) so it survives router changes.
+
+---
+
+## Anti-patterns
+
+Web sister rules apply, plus Angular-specific:
+
+1. **Not `providedIn: "root"`.** Service registered per-module → multiple instances → duplicate listeners.
+2. **Skipping `NgZone.run`.** OnPush components don't update; UI feels stuck.
+3. **`(click)` handlers calling SDK methods directly.** Bypass the service → state desyncs.
+
+---
+
+## Verification checklist
+
+- [ ] `CallSignalingService` is `providedIn: "root"`
+- [ ] All callbacks wrapped in `NgZone.run`
+- [ ] `IncomingCallComponent` mounted in `app.component.html`, not a route
+- [ ] `removeCallListener` in `ngOnDestroy`
+- [ ] Smoke: 2 tabs, caller initiates, recipient sees alertdialog, accept opens session
+
+---
+
+## Pointers
+
+- `cometchat-react-calls/references/ringing-integration.md` — canonical
+- `cometchat-angular-calls/SKILL.md`
+- `references/ngzone-and-async-callbacks.md`
+- Canonical docs: https://www.cometchat.com/docs/calls/javascript/ringing

package/skills/cometchat-angular-calls/references/server-web-push-vapid.md

@@ -0,0 +1,100 @@
+# Server-side Web Push VAPID for Angular
+
+The Web Push server template, VAPID setup, and Service Worker code from the React canonical reference apply identically to Angular — the server doesn't care which client framework rendered the page.
+
+**Canonical docs:** https://datatracker.ietf.org/doc/html/rfc8030
+**Read first:** `cometchat-react-calls/references/server-web-push-vapid.md` — full Node + Python templates, hard rules, sw.js receiver.
+
+---
+
+## Angular-specific delta: Service Worker registration
+
+Angular has its own SW story (`@angular/service-worker` for the Angular SW + `ngsw-config.json`). For Web Push receiving a CometChat call, you typically want a **separate** SW (`/public/sw.js`) for push events — using the Angular SW for both routing your app's offline cache AND CometChat call pushes mixes concerns.
+
+```ts
+// app.config.ts or app.module.ts
+import { provideServiceWorker } from "@angular/service-worker";
+
+bootstrapApplication(AppComponent, {
+  providers: [
+    provideServiceWorker("ngsw-worker.js", { enabled: environment.production }),
+    // ...
+  ],
+});
+
+// In a CallPushService:
+@Injectable({ providedIn: "root" })
+export class CallPushService {
+  async register(currentUserUid: string): Promise<void> {
+    if (!("serviceWorker" in navigator)) return;
+    // Register the call-specific worker
+    const reg = await navigator.serviceWorker.register("/sw-call.js", { scope: "/" });
+    const sub = await reg.pushManager.subscribe({
+      userVisibleOnly: true,
+      applicationServerKey: this.urlBase64ToUint8Array(environment.vapidPublicKey),
+    });
+    await this.api.registerWebPushSubscription(currentUserUid, sub.toJSON());
+  }
+
+  private urlBase64ToUint8Array(b64: string): Uint8Array {
+    const padding = "=".repeat((4 - (b64.length % 4)) % 4);
+    const base64 = (b64 + padding).replace(/-/g, "+").replace(/_/g, "/");
+    const raw = atob(base64);
+    const out = new Uint8Array(raw.length);
+    for (let i = 0; i < raw.length; ++i) out[i] = raw.charCodeAt(i);
+    return out;
+  }
+}
+```
+
+`/public/sw-call.js` is identical to the React canonical reference — the call-specific worker doesn't depend on Angular.
+
+---
+
+## NgZone re-entry for in-app ringer
+
+When the Service Worker `postMessage`s the open client (so an in-app ringer can fire alongside the OS notification), Angular's change detection won't pick up state updates from outside the zone. Wrap:
+
+```ts
+@Injectable({ providedIn: "root" })
+export class IncomingCallService {
+  readonly incoming$ = new BehaviorSubject<IncomingCallPayload | null>(null);
+
+  constructor(private zone: NgZone) {
+    if (!("serviceWorker" in navigator)) return;
+    navigator.serviceWorker.addEventListener("message", (event) => {
+      if (event.data?.type === "incoming_call") {
+        this.zone.run(() => this.incoming$.next(event.data));
+      }
+    });
+  }
+}
+```
+
+---
+
+## Anti-patterns
+
+React sister rules apply, plus Angular-specific:
+
+1. **Mixing Angular SW (`ngsw-worker.js`) + push handlers.** Angular SW's update mechanism can disable push subscriptions on update. Use a separate SW for call pushes.
+2. **No `NgZone.run` on `serviceWorker.message` listeners.** OnPush components don't update.
+3. **Importing VAPID public key from a non-public env var.** Use `environment.ts` (compile-time inlined for browser).
+
+---
+
+## Verification checklist
+
+- [ ] Server template: see canonical react reference
+- [ ] Separate `sw-call.js` registered alongside Angular SW
+- [ ] `NgZone.run` wraps the `message` handler
+- [ ] VAPID public key in `environment.ts`
+- [ ] Browser smoke: 2 tabs (one minimized), caller dials, recipient minimized tab gets notification
+
+---
+
+## Pointers
+
+- `cometchat-react-calls/references/server-web-push-vapid.md` — canonical (full server + sw.js)
+- `cometchat-angular-calls` SKILL.md
+- `references/ngzone-and-async-callbacks.md`

package/skills/cometchat-angular-calls/references/share-invite.md

@@ -0,0 +1,116 @@
+# Share invite on Angular
+
+Same SDK API as web. Angular-specific: wrap the share logic in a service so multiple call surfaces (full-screen, mini, post-call) can reuse it.
+
+**Canonical docs:** https://www.cometchat.com/docs/calls/javascript/share-invite
+**Read first:** `cometchat-react-calls/references/share-invite.md` — deep-link rule, share dialog UX.
+
+---
+
+## ShareInviteService
+
+```ts
+import { Injectable, NgZone, Inject } from "@angular/core";
+import { MatSnackBar } from "@angular/material/snack-bar";
+import { CometChatCalls } from "@cometchat/calls-sdk-javascript";
+import { APP_CONFIG, AppConfig } from "../config";
+
+@Injectable({ providedIn: "root" })
+export class ShareInviteService {
+  constructor(
+    private snack: MatSnackBar,
+    private zone: NgZone,
+    @Inject(APP_CONFIG) private config: AppConfig,
+  ) {}
+
+  bind(sessionId: string): () => void {
+    const handler = () => this.zone.run(() => this.share(sessionId));
+    CometChatCalls.addEventListener("onShareInviteButtonClicked", handler);
+    return () => CometChatCalls.removeEventListener("onShareInviteButtonClicked", handler);
+  }
+
+  async share(sessionId: string): Promise<void> {
+    const url = `${this.config.appUrl}/call/${sessionId}`;
+    const data = { title: "Join my call", text: "I'm on a call — tap to join.", url };
+
+    if (navigator.share && navigator.canShare?.(data)) {
+      try {
+        await navigator.share(data);
+        return;
+      } catch (err) {
+        if ((err as Error).name === "AbortError") return;
+      }
+    }
+
+    try {
+      await navigator.clipboard.writeText(url);
+      this.snack.open("Link copied to clipboard", undefined, { duration: 2000 });
+    } catch {
+      this.snack.open(`Copy this link: ${url}`, "OK", { duration: 8000 });
+    }
+  }
+}
+```
+
+Inject `APP_CONFIG` (your standard token for env vars) so the URL isn't hard-coded.
+
+---
+
+## Use in a call component
+
+```ts
+@Component({ /* ... */ })
+export class CallComponent implements OnInit, OnDestroy {
+  @Input() sessionId!: string;
+  private unbind?: () => void;
+
+  constructor(private shareSvc: ShareInviteService) {}
+
+  ngOnInit() {
+    this.unbind = this.shareSvc.bind(this.sessionId);
+  }
+
+  ngOnDestroy() {
+    this.unbind?.();
+  }
+}
+```
+
+---
+
+## Pass the kit setting
+
+```ts
+const callSettings = new CallSettingsBuilder()
+  .setHideShareInviteButton(false)
+  .build();
+```
+
+---
+
+## Anti-patterns
+
+Web sister rules apply, plus Angular-specific:
+
+1. **No `NgZone.run` wrap on the SDK callback.** `MatSnackBar.open` doesn't show in OnPush components.
+2. **Service in feature module, not root.** Provider lifecycle desyncs with router.
+3. **Hard-coded `https://yourapp.com`.** Use `APP_CONFIG` injection token.
+
+---
+
+## Verification checklist
+
+- [ ] `ShareInviteService` provided in root
+- [ ] App URL via `APP_CONFIG` (not hard-coded)
+- [ ] `NgZone.run` wraps the callback
+- [ ] Listener cleaned up in `ngOnDestroy`
+- [ ] Browser smoke: copy link → paste in incognito → join call
+
+---
+
+## Pointers
+
+- `cometchat-react-calls/references/share-invite.md` — sister
+- `cometchat-angular-calls` SKILL.md
+- `references/ngzone-and-async-callbacks.md`
+- Canonical docs: https://www.cometchat.com/docs/calls/javascript/share-invite

package/skills/cometchat-angular-components/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-components
 description: "Component catalog for the CometChat Angular UI Kit v4 — HTML selector names, Angular Input bindings, Output events, slot templates, request builders, style objects, and composite components. Always loaded before writing <cometchat-*> HTML."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"

package/skills/cometchat-angular-core/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-core
 description: "Foundational rules for CometChat Angular UI Kit v4 integration — UIKitSettingsBuilder init pattern, login order, CometChatThemeService, environment config via src/environments/environment.ts, and anti-patterns that break real Angular apps."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"

package/skills/cometchat-angular-customization/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-customization
 description: "Customize the CometChat Angular UI Kit without forking — four-tier model: Angular inputs → request builders → text formatters + message templates → DataSource decorators + event bus."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"

package/skills/cometchat-angular-features/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-features
 description: "Feature catalog for Angular — calls (separate SDK), extensions (polls / stickers / translation / link preview / collaborative doc / whiteboard), AI features (smart replies / conversation summary / conversation starter), AI agent. Six-bucket taxonomy: default / extension / ai-feature / dashboard-only / package-install / component-swap."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"

package/skills/cometchat-angular-patterns/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-patterns
 description: "Angular-specific integration patterns for CometChat UI Kit v4 — lazy loading, route guards, Angular Router integration, APP_INITIALIZER setup, standalone vs NgModule, and SSR/Universal considerations."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"

package/skills/cometchat-angular-placement/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-placement
 description: "Where to put chat in an Angular app — Route-based, Sidebar, Modal/Dialog, Tab-based, and Embedded placements. Maps each to CometChat component composition with Angular Router wiring and layout patterns."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"

package/skills/cometchat-angular-production/SKILL.md

@@ -3,7 +3,7 @@ name: cometchat-angular-production
 description: "Production-readiness for Angular — server-minted auth tokens, user management CRUD, external-backend recipes (Express / Hono / Firebase Functions / Vercel). Angular has no API routes, so the backend is always external."
 license: "MIT"
 compatibility: "Angular >=12 <=15; @cometchat/chat-uikit-angular ^4; @cometchat/chat-sdk-javascript ^4"
-allowed-tools: "executeBash, readFile, fileSearch, listDirectory, AskUserQuestion"
+allowed-tools: "shell, file-read, file-search, file-list, ask-user"
 metadata:
   author: "CometChat"
   version: "3.0.0"