Cometchat React Native Calls

What it does

When your agent uses it

• Tasks that involve Cross-platform mobile apps
• Tasks that involve Design systems

Example prompts

• “/cometchat-react-native-calls”

Requirements

• Node.js
• Compatibility (from SKILL.md): React Native >=0.77; @cometchat/chat-uikit-react-native ^5.4.0; @cometchat/calls-sdk-react-native ^5.0.4; Android minSdk 24; iOS 13.0

Workflow steps

6 steps, taken from the first numbered list in SKILL.md.

1. 1Installing the web calls SDK — wrong package.
2. 2Emitting setCallingEnabled(true) — does not exist; installation is the switch.
3. 3CometChatIncomingCall inside a screen — calls only ring there.
4. 4Skipping pod install / rebuild — crash on first call, not at startup.
5. 5Below the version floors — build failure, not a runtime message.
6. 6Signing off from a simulator — no media capture.

What it can do on your machine

Read from SKILL.md and the folder at commit 911b108. It shows what the files ask for, not the result of running them.

• Tool permissions

  Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

  From allowed-tools in the SKILL.md frontmatter.

• Runs code

  Shell commands in SKILL.md call:

  • npm

  From the folder's file list and the shell code blocks in SKILL.md.

• Network

  No URLs in SKILL.md. Its commands use npm, which can reach the network depending on how they are called.

  From URLs in SKILL.md, links to its own repository left out.

• Credentials

  Names no API keys, tokens, secrets or passwords.

  From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

• Compatibility

  React Native >=0.77; @cometchat/chat-uikit-react-native ^5.4.0; @cometchat/calls-sdk-react-native ^5.0.4; Android minSdk 24; iOS 13.0

  From compatibility in the SKILL.md frontmatter.

Context cost

Cometchat React Native Calls loads about 2.6k tokens when it runs. Until then it costs about 92 tokens; SKILL.md has 660 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it

~92

When it runs · the whole SKILL.md, loaded when a task matches

~2.6k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from cometchat/cometchat-skills at commit 911b108, republished under its MIT licence (© cometchat). 660 words, ~2,557 tokens.

name

cometchat-react-native-calls

description

Voice and video calling in the CometChat React Native UI Kit v5 — the RN calls SDK, the native permissions and version floors it needs, and why installing the package is itself the enable switch. Triggers: add video calling React Native, CometChat voice call RN, incoming call screen RN, calls not ringing React Native, webrtc CometChat.

compatibility

React Native >=0.77; @cometchat/chat-uikit-react-native ^5.4.0; @cometchat/calls-sdk-react-native ^5.0.4; Android minSdk 24; iOS 13.0

license

MIT

metadata.author

CometChat

metadata.version

1.0.0

metadata.tags

chat cometchat react-native calls voice video webrtc permissions

npm install @cometchat/calls-sdk-react-native@5
# 6 REQUIRED peer deps — the SDK's declared peerDependencies. Versions are pinned; do NOT float them.
npm install @react-native-async-storage/async-storage@^2.1.2 react-native-background-timer@^2.4.1 \
  react-native-performance@^5.1.2 react-native-svg@^15.12.0 react-native-url-polyfill@2.0.0 \
  react-native-webrtc@124.0.7
# ⚠️ react-native-performance MUST stay 5.x — 6.x is published, and a floated `^6` makes every later
#    `npm install` in the app fail with ERESOLVE. react-native-url-polyfill + react-native-performance
#    are BUNDLE-critical: the UIKit does a module-scope require() of the calls SDK, so Metro resolves
#    them even for a chat-only build — omit either and the bundle fails with "Unable to resolve module".
#    (NOT react-native-community/netinfo or react-native-callstats — those are not declared peers.)
cd ios && pod install && cd ..     # bare RN;  Expo: npx expo run:ios

<key>NSCameraUsageDescription</key><string>Camera access for video calls</string>
<key>NSMicrophoneUsageDescription</key><string>Microphone access for voice/video calls</string>

// App.tsx — IncomingCall sits ABOVE the navigator so a call rings on any screen.
function App() {
  const incomingCall = useRef<CometChat.Call | null>(null);
  const [callReceived, setCallReceived] = useState(false);

  useEffect(() => {
    const listenerId = "APP_CALL_LISTENER";
    CometChat.addCallListener(
      listenerId,
      new CometChat.CallListener({
        onIncomingCallReceived: (call) => {
          incomingCall.current = call;
          setCallReceived(true);
        },
        onOutgoingCallRejected: () => setCallReceived(false),
        onIncomingCallCancelled: () => setCallReceived(false),
      }),
    );
    return () => CometChat.removeCallListener(listenerId);   // or it fires after unmount
  }, []);

  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <NavigationContainer>{/* … */}</NavigationContainer>
      {callReceived && incomingCall.current ? (
        <CometChatIncomingCall
          call={incomingCall.current}
          onDecline={() => { incomingCall.current = null; setCallReceived(false); }}
        />
      ) : null}
    </GestureHandlerRootView>
  );
}

// Call triggers — the message header renders these by default; mount them yourself only
// when you build a custom header. onError is the ONLY callback: success is an event
// (ccOutgoingCall), not a promise.
<CometChatCallButtons user={user} group={group} onError={(e) => console.error(e)} />

// Dialling screen — driven by the Call object you created.
{call && <CometChatOutgoingCall call={call} />}

// Call history list. Detail screens do NOT ship (see below).
<CometChatCallLogs onItemPress={(log) => openCallDetail(log)} />

// The in-call surface. sessionID comes from the accepted Call; callSettingsBuilder is a
// CometChatCalls builder, NOT a chat-SDK one.
<CometChatOngoingCall
  sessionID={sessionId}
  callSettingsBuilder={callSettings}
  onError={(e) => console.error(e)}
/>

// Call history — CometChatCalls.CallLogRequestBuilder from the CALLS SDK.
// There is NO CallLogRequestBuilder on the Chat SDK (@cometchat/chat-sdk-react-native).
import { CometChat } from "@cometchat/chat-sdk-react-native";
import { CometChatCalls } from "@cometchat/calls-sdk-react-native";
// fetchNext() REJECTS without an auth token ("`Auth Token` is required") — no fallback. Pass the
// logged-in user's token, exactly as the kit's own CometChatCallLogs does.
const authToken = (await CometChat.getLoggedinUser())?.getAuthToken() ?? "";
const req = new CometChatCalls.CallLogRequestBuilder().setLimit(30).setAuthToken(authToken).build();
const logs = await req.fetchNext();

// Transcript opt-in — same builder + token. setHasTranscriptions(true) filters to transcribed calls
// AND makes the server attach each call's transcripts to the log.
const treq = new CometChatCalls.CallLogRequestBuilder().setLimit(30).setAuthToken(authToken).setHasTranscriptions(true).build();

© cometchat, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in skills/cometchat-react-native-calls of cometchat/cometchat-skills.

Open the folder on GitHubat commit 911b108